"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Toggle = Toggle;

var _react = require("@headlessui/react");

var _jsxRuntime = require("react/jsx-runtime");

/* This example requires Tailwind CSS v2.0+ */
function classNames() {
  for (var _len = arguments.length, classes = new Array(_len), _key = 0; _key < _len; _key++) {
    classes[_key] = arguments[_key];
  }

  return classes.filter(Boolean).join(" ");
}

function Toggle(_ref) {
  var _ref$value = _ref.value,
      value = _ref$value === void 0 ? false : _ref$value,
      className = _ref.className,
      label = _ref.label,
      help = _ref.help,
      onChange = _ref.onChange;
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Switch.Group, {
    as: "div",
    className: "flex items-center break-all ".concat(className),
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Switch, {
      checked: value,
      onChange: onChange,
      className: classNames(value ? "bg-indigo-600" : "bg-gray-200", "relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"),
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
        "aria-hidden": "true",
        className: classNames(value ? "translate-x-5" : "translate-x-0", "pointer-events-none inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200")
      })
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.Switch.Label, {
      as: "span",
      className: "ml-3",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
        className: "text-sm font-medium text-gray-700 ",
        children: label
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
        className: "text-sm text-gray-500",
        children: help
      })]
    }), help != null && /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Switch.Description, {
      as: "span",
      className: "text-sm text-gray-500",
      children: help
    })]
  });
}