import { jsxs, jsx } from "react/jsx-runtime";
import { $ as $64fa3d84918910a7$export$29f1550f4b0d4415, k as $df56164dff5785e2$export$4338b53315abf666, l as $5dc95899b306f630$export$c9058316764c140e, f as $64fa3d84918910a7$export$ef03459518577ad4, g as $64fa3d84918910a7$export$4d86445c2cf5e3, a as $3ef42575df84b30b$export$9d1611c77c2fe928 } from "../../utils-DGpXyJOJ.js";
import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-D2C6R0DK.js";
import $dbSRa$react__default, { forwardRef, createContext } from "react";
import { $ as $3017fa7ffdddec74$export$8042c6c013fd5226 } from "../../useToggleState-VkXJjsru.js";
import { $ as $d2c8e2b0480f3f34$export$cbe85ee05b554577 } from "../../useToggle-BZhaYwZl.js";
import { a as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-D3b7Kh4P.js";
import { w as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-Bycb7BsD.js";
import { $ as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../../VisuallyHidden-DTUuKFiI.js";
import { c as cva } from "../../index-BHpUy2Ix.js";
function $b418ec0c85c52f27$export$d853f7095ae95f88(props, state, ref) {
  let { labelProps, inputProps, isSelected, isPressed, isDisabled, isReadOnly } = $d2c8e2b0480f3f34$export$cbe85ee05b554577(props, state, ref);
  return {
    labelProps,
    inputProps: {
      ...inputProps,
      role: "switch",
      checked: isSelected
    },
    isSelected,
    isPressed,
    isDisabled,
    isReadOnly
  };
}
const $8e59e948500a8fe1$export$8699e3b644d5a28a = /* @__PURE__ */ createContext(null);
const $8e59e948500a8fe1$export$b5d5cf8927ab7262 = /* @__PURE__ */ forwardRef(function Switch(props, ref) {
  let { inputRef: userProvidedInputRef = null, ...otherProps } = props;
  [props, ref] = $64fa3d84918910a7$export$29f1550f4b0d4415(otherProps, ref, $8e59e948500a8fe1$export$8699e3b644d5a28a);
  let inputRef = $df56164dff5785e2$export$4338b53315abf666($5dc95899b306f630$export$c9058316764c140e(userProvidedInputRef, props.inputRef !== void 0 ? props.inputRef : null));
  let state = $3017fa7ffdddec74$export$8042c6c013fd5226(props);
  let { labelProps, inputProps, isSelected, isDisabled, isReadOnly, isPressed } = $b418ec0c85c52f27$export$d853f7095ae95f88({
    ...$64fa3d84918910a7$export$ef03459518577ad4(props),
    // ReactNode type doesn't allow function children.
    children: typeof props.children === "function" ? true : props.children
  }, state, inputRef);
  let { isFocused, isFocusVisible, focusProps } = $f7dceffc5ad7768b$export$4e328f61c538687f();
  let isInteractionDisabled = props.isDisabled || props.isReadOnly;
  let { hoverProps, isHovered } = $6179b936705e76d3$export$ae780daf29e6d456({
    ...props,
    isDisabled: isInteractionDisabled
  });
  let renderProps = $64fa3d84918910a7$export$4d86445c2cf5e3({
    ...props,
    defaultClassName: "react-aria-Switch",
    values: {
      isSelected,
      isPressed,
      isHovered,
      isFocused,
      isFocusVisible,
      isDisabled,
      isReadOnly,
      state
    }
  });
  let DOMProps = $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
    global: true
  });
  delete DOMProps.id;
  delete DOMProps.onClick;
  return /* @__PURE__ */ $dbSRa$react__default.createElement("label", {
    ...$3ef42575df84b30b$export$9d1611c77c2fe928(DOMProps, labelProps, hoverProps, renderProps),
    ref,
    slot: props.slot || void 0,
    "data-selected": isSelected || void 0,
    "data-pressed": isPressed || void 0,
    "data-hovered": isHovered || void 0,
    "data-focused": isFocused || void 0,
    "data-focus-visible": isFocusVisible || void 0,
    "data-disabled": isDisabled || void 0,
    "data-readonly": isReadOnly || void 0
  }, /* @__PURE__ */ $dbSRa$react__default.createElement($5c3e21d68f1c4674$export$439d29a4e110a164, {
    elementType: "span"
  }, /* @__PURE__ */ $dbSRa$react__default.createElement("input", {
    ...$3ef42575df84b30b$export$9d1611c77c2fe928(inputProps, focusProps),
    ref: inputRef
  })), renderProps.children);
});
/**
 * A toggle switch.
 *
 * @component
 * @param {Object} props - Component props.
 * @param {boolean} props.checked - Whether the switch is checked.
 * @param {Function} props.onChange - Function to call when the switch is toggled.
 * @param {boolean} [props.disabled] - Whether the switch is disabled.
 * @param {string} [props.id] - The ID of the switch.
 * @param {string} [props.className] - Classes to pass to the switch.
 * @param {boolean} [props.isIndeterminate] - If `true`, the switch will render in an indeterminate state.
 * @param {boolean} [props.flat] - If `true`, component will look more flat. Useful for nested layer of controls.
 * @param {SwitchSize} [props.size='default'] - The size of the switch.
 * @param {boolean} [props.hidden] - If `true`, the component is not rendered.
 *
 * @typedef {'default' | 'medium' | 'small'} SwitchSize
 *
 * @returns {JSX.Element} The Switch component.
 *
 * @example
 * const [checked, setChecked] = useState(false);
 *
 * <Switch
 * 	checked={checked}
 * 	onChange={() => setChecked(!checked)}
 * />
 *
 * @preserve
 */
const Switch2 = (props) => {
  const { checked, onChange, disabled, id, children, className, isIndeterminate, flat, hidden, size = "default", ...rest } = props;
  const outsideClasses = cva(
    [
      "es:flex es:shrink-0 es:items-center",
      "es:rounded-full",
      "es:transition es:duration-300",
      "es:group-focus-visible:ring-2 es:group-focus-visible:ring-accent-500/30 es:group-focus-visible:inset-ring-accent-500",
      "es:inset-ring",
      className
    ],
    {
      variants: {
        size: {
          small: "es:h-3 es:w-5 es:p-0.5",
          medium: "es:h-4.5 es:w-7.5 es:p-0.75",
          default: "es:h-6 es:w-10 es:p-1"
        },
        disabled: {
          false: [!flat && "es:shadow-xs es:shadow-black/5", "es:cursor-pointer"]
        }
      },
      compoundVariants: [
        {
          checked: false,
          disabled: false,
          class: [
            "es:inset-ring-secondary-400 es:bg-white es:bg-linear-to-r es:from-secondary-800/1 es:to-secondary-800/3",
            "es:hover:bg-surface-100",
            "es:group-hover:inset-ring-surface-400"
          ]
        },
        {
          checked: true,
          disabled: false,
          class: [
            "es:bg-accent-500",
            "es:bg-linear-to-r es:from-accent-800/0 es:to-accent-800/25",
            "es:inset-ring-accent-800/30",
            "es:inset-shadow-xs es:inset-shadow-accent-50/25",
            "es:group-focus-visible:inset-ring-accent-800"
          ]
        },
        {
          checked: false,
          disabled: true,
          class: ["es:inset-ring-secondary-300 es:bg-white"]
        },
        {
          checked: true,
          disabled: true,
          class: ["es:inset-ring-secondary-300 es:bg-secondary-300"]
        }
      ],
      defaultVariants: {
        disabled: false,
        checked: false,
        size: "default"
      }
    }
  );
  const thumbClasses = cva(["es:block es:rounded-full es:will-change-transform", "es:shrink-0", "es:no-webkit-highlight", "es:transition es:ease-spring-bouncy es:duration-400"], {
    variants: {
      disabled: {
        false: [!flat && "es:shadow-xs es:shadow-black/5"]
      },
      checked: {
        false: "es:not-pressed:scale-90",
        true: "es:scale-110"
      },
      size: {
        small: "es:size-2",
        medium: "es:size-3",
        default: "es:size-4"
      }
    },
    compoundVariants: [
      {
        checked: true,
        indeterminate: false,
        size: "small",
        class: "es:translate-x-2"
      },
      {
        checked: true,
        indeterminate: false,
        size: "medium",
        class: "es:translate-x-3"
      },
      {
        checked: true,
        indeterminate: false,
        size: "default",
        class: "es:translate-x-4"
      },
      {
        checked: false,
        indeterminate: true,
        size: "small",
        class: "es:translate-x-1"
      },
      {
        checked: false,
        indeterminate: true,
        size: "medium",
        class: "es:translate-x-1.5"
      },
      {
        checked: false,
        indeterminate: true,
        size: "default",
        class: "es:translate-x-2"
      },
      {
        checked: false,
        indeterminate: true,
        class: "es:scale-100"
      },
      {
        checked: false,
        disabled: false,
        class: ["es:bg-secondary-500", "es:group-hover:bg-surface-500"]
      },
      {
        checked: true,
        disabled: false,
        class: ["es:bg-accent-50", "es:bg-linear-to-br es:from-white/10 es:to-white/20", "es:shadow-xs es:shadow-accent-950/20"]
      },
      {
        checked: false,
        disabled: true,
        class: ["es:bg-secondary-400"]
      },
      {
        checked: true,
        disabled: true,
        class: ["es:bg-white"]
      }
    ],
    defaultVariants: {
      disabled: false,
      checked: false,
      size: "default"
    }
  });
  if (hidden) {
    return null;
  }
  return /* @__PURE__ */ jsxs(
    $8e59e948500a8fe1$export$b5d5cf8927ab7262,
    {
      id,
      isDisabled: disabled,
      isSelected: checked ?? false,
      onChange,
      className: "es:group es:flex es:items-center es:justify-between es:gap-2.5 es:any-focus:outline-hidden",
      ...rest,
      children: [
        children,
        /* @__PURE__ */ jsx(
          "div",
          {
            className: outsideClasses({
              checked: checked ?? false,
              disabled: Boolean(disabled),
              size
            }),
            children: /* @__PURE__ */ jsx(
              "div",
              {
                className: thumbClasses({
                  checked: checked ?? false,
                  disabled: Boolean(disabled),
                  indeterminate: Boolean(isIndeterminate),
                  size
                })
              }
            )
          }
        )
      ]
    }
  );
};
export {
  Switch2 as Switch
};
