@kiwicom/orbit-components/lib/SegmentedSwitch/SwitchSegment/index.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com's products.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
exports.__esModule = true;
exports.default = void 0;
var React = _interopRequireWildcard(require("react"));
var _clsx = _interopRequireDefault(require("clsx"));
var _useClickOutside = _interopRequireDefault(require("../../hooks/useClickOutside"));
const SwitchSegment = ({
  value,
  label,
  disabled,
  onChange,
  setTooltipShown,
  onFocus,
  defaultChecked,
  name
}) => {
  const ref = React.useRef(null);
  (0, _useClickOutside.default)(ref, () => setTooltipShown(false));
  return /*#__PURE__*/React.createElement("label", {
    className: "orbit-switch-segment-label relative flex w-full"
  }, /*#__PURE__*/React.createElement("input", {
    className: (0, _clsx.default)("sr-only absolute -m-px size-px overflow-hidden whitespace-nowrap border-0 p-0 focus:outline-none", "peer"),
    name: name || "switch-segment",
    defaultChecked: defaultChecked,
    type: "radio",
    ref: ref,
    onChange: onChange,
    onFocus: onFocus,
    disabled: disabled,
    value: value
  }), /*#__PURE__*/React.createElement("div", {
    className: (0, _clsx.default)("orbit-switch-segment-text", "peer-checked:text-blue-normal peer-checked:outline-blue-normal peer-checked:!rounded-300 peer-checked:z-10 peer-checked:outline peer-checked:outline-2 ", "peer-focus:peer-[:not(:checked)]:text-form-element-label-filled-foreground peer-focus:outline-blue-normal peer-focus:!rounded-300 peer-focus:z-10 peer-focus:outline peer-focus:outline-2 ", "p-300 font-base text-normal duration-fast box-border flex w-full max-w-full cursor-pointer items-center justify-center border-0 text-center font-medium leading-normal transition-colors ease-in-out", "bg-form-element-background text-form-element-foreground hover:text-form-element-label-filled-foreground")
  }, label));
};
var _default = exports.default = SwitchSegment;