"use client";
import { jsx as e, jsxs as I } from "react/jsx-runtime";
import { forwardRef as P, createContext as K, useContext as M } from "react";
import { c as i } from "./cn-ct4n7r74mh8y0f48.js";
import { F as O } from "./field-csje72m7j9403fj5.js";
import { P as H, Q as V, b3 as z } from "./vendor-base-ui-ccr5l0ynrievzzv3.js";
const $ = {
  size: {
    sm: {
      classes: "h-5.5 w-8.5",
      description: "Small switch for compact UIs"
    },
    base: {
      classes: "h-6.5 w-10.5",
      description: "Default switch size"
    },
    lg: {
      classes: "h-7.5 w-12.5",
      description: "Large switch for prominent toggles"
    }
  },
  variant: {
    default: {
      classes: "",
      description: "Default switch with squircle shape and brand blue color"
    },
    neutral: {
      classes: "",
      description: "Monochrome switch with squircle shape for subtle toggles"
    }
  }
}, ee = {
  size: "base",
  variant: "default"
}, A = K({
  controlFirst: !0
}), T = P(
  ({
    className: l,
    checked: c,
    disabled: s,
    size: n = "base",
    variant: u = "default",
    label: t,
    labelTooltip: d,
    required: f,
    controlFirst: w = !0,
    onCheckedChange: x,
    transitioning: N,
    ...r
  }, v) => {
    const S = typeof t == "string" ? t : "Switch", b = /* @__PURE__ */ e(
      z,
      {
        ref: v,
        checked: c,
        disabled: s,
        onCheckedChange: x,
        nativeButton: !0,
        render: (_, a) => {
          const {
            ref: y,
            className: m,
            role: g,
            "aria-checked": L,
            "aria-pressed": h,
            ...C
          } = _, k = u === "neutral", p = "rounded-[5px] supports-[corner-shape:squircle]:rounded-[10px] [corner-shape:squircle]", o = {
            sm: { track: "h-4 w-8", thumb: "w-4", slide: "left-4" },
            base: { track: "h-4.5 w-9", thumb: "w-4.5", slide: "left-4.5" },
            lg: { track: "h-5 w-10", thumb: "w-5", slide: "left-5" }
          }[n], R = k ? a.checked ? "bg-neutral-500 dark:bg-kumo-base ring-neutral-600 dark:ring-neutral-700" : "bg-neutral-150 dark:bg-kumo-base ring-kumo-line" : a.checked ? "bg-blue-500 dark:bg-blue-600 ring-blue-600 dark:ring-blue-500" : "bg-neutral-200 dark:bg-neutral-700 ring-neutral-300 dark:ring-neutral-600", U = k ? a.checked ? "ring-neutral-600 dark:ring-neutral-200 bg-kumo-base dark:bg-neutral-400" : "bg-kumo-base dark:bg-neutral-850 ring-neutral-300 dark:ring-neutral-700" : a.checked ? "ring-blue-600 dark:ring-blue-100 bg-kumo-base dark:bg-blue-300" : "bg-kumo-base dark:bg-neutral-850 ring-neutral-300 dark:ring-neutral-700", B = i(
            "relative inline-flex items-center ring cursor-pointer border-none p-0",
            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500",
            "transition-colors duration-150 ease-out motion-reduce:transition-none",
            "disabled:cursor-not-allowed disabled:opacity-50",
            o.track,
            p,
            R,
            l,
            m
          ), D = i(
            "absolute top-0 bottom-0 shadow-sm ring-1",
            o.thumb,
            p,
            U,
            "transition-all duration-150 ease-out motion-reduce:transition-none",
            a.checked ? o.slide : "left-0"
          ), F = r.role ?? g ?? "switch", G = F === "switch" ? { "aria-checked": a.checked } : { "aria-pressed": a.checked };
          return /* @__PURE__ */ e(
            "button",
            {
              ...C,
              ...r,
              ref: y,
              type: "button",
              role: F,
              ...G,
              "aria-busy": N || void 0,
              "aria-label": r["aria-label"] ?? S,
              className: B,
              children: /* @__PURE__ */ e("div", { className: D })
            }
          );
        }
      }
    );
    return t ? /* @__PURE__ */ e(
      O,
      {
        label: t,
        required: f,
        labelTooltip: d,
        controlFirst: w,
        children: b
      }
    ) : b;
  }
);
T.displayName = "Switch";
const j = P(
  ({
    className: l,
    checked: c,
    disabled: s,
    size: n = "base",
    variant: u = "default",
    label: t,
    onCheckedChange: d,
    transitioning: f
  }, w) => {
    const { controlFirst: x } = M(A);
    return /* @__PURE__ */ I(
      "label",
      {
        className: i(
          "m-0 relative inline-flex items-center gap-2",
          // Control first (default): switch before label
          // Label first: label before switch using flex-row-reverse
          !x && "flex-row-reverse justify-end",
          s ? "cursor-not-allowed opacity-50" : "cursor-pointer",
          l
        ),
        children: [
          /* @__PURE__ */ e(
            z,
            {
              ref: w,
              checked: c,
              disabled: s,
              onCheckedChange: d,
              nativeButton: !0,
              render: (N, r) => {
                const {
                  ref: v,
                  className: S,
                  role: b,
                  "aria-checked": _,
                  "aria-pressed": a,
                  ...y
                } = N, m = u === "neutral", g = "rounded-[5px] supports-[corner-shape:squircle]:rounded-[10px] [corner-shape:squircle]", h = {
                  sm: { track: "h-4 w-8", thumb: "w-4", slide: "left-4" },
                  base: { track: "h-4.5 w-9", thumb: "w-4.5", slide: "left-4.5" },
                  lg: { track: "h-5 w-10", thumb: "w-5", slide: "left-5" }
                }[n], C = m ? r.checked ? "bg-neutral-500 dark:bg-kumo-base ring-neutral-600 dark:ring-neutral-700" : "bg-neutral-150 dark:bg-kumo-base ring-kumo-line" : r.checked ? "bg-blue-500 dark:bg-blue-600 ring-blue-600 dark:ring-blue-500" : "bg-neutral-200 dark:bg-neutral-700 ring-neutral-300 dark:ring-neutral-600", k = m ? r.checked ? "ring-neutral-600 dark:ring-neutral-200 bg-kumo-base dark:bg-neutral-400" : "bg-kumo-base dark:bg-neutral-850 ring-neutral-300 dark:ring-neutral-700" : r.checked ? "ring-blue-600 dark:ring-blue-100 bg-kumo-base dark:bg-blue-300" : "bg-kumo-base dark:bg-neutral-850 ring-neutral-300 dark:ring-neutral-700", p = i(
                  "relative inline-flex items-center ring cursor-pointer border-none p-0",
                  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500",
                  "transition-colors duration-150 ease-out motion-reduce:transition-none",
                  "disabled:cursor-not-allowed disabled:opacity-50",
                  h.track,
                  g,
                  C,
                  S
                ), q = i(
                  "absolute top-0 bottom-0 shadow-sm ring-1",
                  h.thumb,
                  g,
                  k,
                  "transition-all duration-150 ease-out motion-reduce:transition-none",
                  r.checked ? h.slide : "left-0"
                ), o = b ?? "switch", R = o === "switch" ? { "aria-checked": r.checked } : { "aria-pressed": r.checked };
                return /* @__PURE__ */ e(
                  "button",
                  {
                    ...y,
                    ref: v,
                    type: "button",
                    role: o,
                    ...R,
                    "aria-busy": f || void 0,
                    className: p,
                    children: /* @__PURE__ */ e("div", { className: q })
                  }
                );
              }
            }
          ),
          /* @__PURE__ */ e("span", { className: "text-base font-medium text-kumo-default", children: t })
        ]
      }
    );
  }
);
j.displayName = "Switch.Item";
function W({
  legend: l,
  children: c,
  error: s,
  description: n,
  disabled: u,
  controlFirst: t = !0,
  className: d
}) {
  return /* @__PURE__ */ e(A.Provider, { value: { controlFirst: t }, children: /* @__PURE__ */ I(
    H,
    {
      className: i(
        "flex flex-col gap-4 rounded-lg border border-kumo-line p-4",
        d
      ),
      disabled: u,
      children: [
        /* @__PURE__ */ e(V, { className: "text-lg font-medium text-kumo-default", children: l }),
        /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: c }),
        s && /* @__PURE__ */ e("p", { className: "text-sm text-kumo-danger", children: s }),
        n && /* @__PURE__ */ e("p", { className: "text-sm text-kumo-subtle", children: n })
      ]
    }
  ) });
}
const E = Object.assign(T, {
  Item: j,
  Group: W
});
E.displayName = "Switch";
export {
  $ as K,
  E as S,
  ee as a
};
//# sourceMappingURL=switch-fukrbip86khvqjn7.js.map
