@konstructio/ui 0.1.2-alpha.77 → 0.1.2-alpha.78

package/dist/components/Stepper/components/VerticalStepItem/VerticalStepItem.js

@@ -1,96 +1,114 @@
-import { jsx as u, jsxs as $ } from "react/jsx-runtime";
-import { c as F } from "../../../../compiler-runtime-DA41awpA.js";
-import { memo as G } from "react";
-import { cn as k } from "../../../../utils/index.js";
-import { stepVariants as H, stepIndicatorVariants as J, stepContentVariants as M, stepLabelVariants as O, stepDescriptionVariants as P } from "../../Stepper.variants.js";
-import { getStepAriaLabel as Q } from "../../utils/index.js";
-import { StepConnector as T } from "../StepConnector/StepConnector.js";
-import { StepIndicatorContent as U } from "../StepIndicatorContent/StepIndicatorContent.js";
-import { useStepItemLogic as X } from "../../hooks/useStepItemLogic.js";
-const Y = (q) => {
-  const e = F.c(69), {
-    classNames: t,
-    clickable: S,
-    icons: L,
-    index: o,
-    isLast: w,
-    showConnector: D,
-    size: s,
-    step: a,
-    variant: l,
-    onClick: W
-  } = q;
-  let V;
-  e[0] !== S || e[1] !== W || e[2] !== a ? (V = {
-    clickable: S,
-    step: a,
-    onClick: W
-  }, e[0] = S, e[1] = W, e[2] = a, e[3] = V) : V = e[3];
+import { jsxs as c, jsx as n } from "react/jsx-runtime";
+import { memo as V } from "react";
+import { cn as a } from "../../../../utils/index.js";
+import { stepIndicatorVariants as I, stepLabelVariants as S, stepDescriptionVariants as k, stepContentVariants as v, stepVariants as w } from "../../Stepper.variants.js";
+import { getStepAriaLabel as D } from "../../utils/index.js";
+import { StepConnector as L } from "../StepConnector/StepConnector.js";
+import { StepIndicatorContent as g } from "../StepIndicatorContent/StepIndicatorContent.js";
+import { useStepItemLogic as j } from "../../hooks/useStepItemLogic.js";
+const y = ({
+  classNames: e,
+  clickable: d,
+  icons: s,
+  index: p,
+  isLast: m,
+  showConnector: b,
+  size: i,
+  step: r,
+  variant: o,
+  onClick: f
+}) => {
   const {
-    isClickable: N,
-    isDisabled: g,
-    LabelComponent: j,
-    status: i,
-    handleClick: y,
-    handleKeyDown: K
-  } = X(V), z = l === "stacked" ? "flex flex-col items-center" : "flex flex-col";
-  let n;
-  e[4] !== t?.stepWrapper || e[5] !== N || e[6] !== l ? (n = k(H({
-    orientation: "vertical",
-    variant: l,
-    clickable: N
-  }), t?.stepWrapper), e[4] = t?.stepWrapper, e[5] = N, e[6] = l, e[7] = n) : n = e[7];
-  const A = N ? "button" : void 0, B = N ? 0 : void 0, E = i === "active" ? "step" : void 0;
-  let r;
-  e[8] !== g ? (r = g && {
-    "aria-disabled": !0
-  }, e[8] = g, e[9] = r) : r = e[9];
-  let c;
-  e[10] !== o || e[11] !== i || e[12] !== a.label ? (c = Q(o, a.label, i), e[10] = o, e[11] = i, e[12] = a.label, e[13] = c) : c = e[13];
-  let p;
-  e[14] !== t?.indicator || e[15] !== s || e[16] !== i ? (p = k(J({
-    status: i,
-    size: s
-  }), t?.indicator), e[14] = t?.indicator, e[15] = s, e[16] = i, e[17] = p) : p = e[17];
-  const R = t?.indicatorContent;
-  let d;
-  e[18] !== L || e[19] !== o || e[20] !== s || e[21] !== i || e[22] !== R ? (d = /* @__PURE__ */ u(U, { status: i, index: o, size: s, icons: L, className: R }), e[18] = L, e[19] = o, e[20] = s, e[21] = i, e[22] = R, e[23] = d) : d = e[23];
-  let m;
-  e[24] !== d || e[25] !== p ? (m = /* @__PURE__ */ u("div", { className: p, "aria-hidden": "true", children: d }), e[24] = d, e[25] = p, e[26] = m) : m = e[26];
-  let f;
-  e[27] !== t?.content || e[28] !== l ? (f = k(M({
-    variant: l
-  }), t?.content), e[27] = t?.content, e[28] = l, e[29] = f) : f = e[29];
-  let b;
-  e[30] !== j || e[31] !== t?.label || e[32] !== s || e[33] !== i || e[34] !== a.label || e[35] !== l ? (b = a.label && /* @__PURE__ */ u(j, { className: k(O({
-    status: i,
-    size: s,
-    variant: l
-  }), t?.label), children: a.label }), e[30] = j, e[31] = t?.label, e[32] = s, e[33] = i, e[34] = a.label, e[35] = l, e[36] = b) : b = e[36];
-  let v;
-  e[37] !== t?.description || e[38] !== s || e[39] !== i || e[40] !== a.description || e[41] !== l ? (v = a.description && /* @__PURE__ */ u("span", { className: k(P({
-    status: i,
-    size: s,
-    variant: l
-  }), t?.description), children: a.description }), e[37] = t?.description, e[38] = s, e[39] = i, e[40] = a.description, e[41] = l, e[42] = v) : v = e[42];
-  let C;
-  e[43] !== f || e[44] !== b || e[45] !== v ? (C = /* @__PURE__ */ $("div", { className: f, children: [
-    b,
-    v
-  ] }), e[43] = f, e[44] = b, e[45] = v, e[46] = C) : C = e[46];
-  let h;
-  e[47] !== y || e[48] !== K || e[49] !== m || e[50] !== C || e[51] !== n || e[52] !== A || e[53] !== B || e[54] !== E || e[55] !== r || e[56] !== c ? (h = /* @__PURE__ */ $("div", { className: n, role: A, tabIndex: B, onClick: y, onKeyDown: K, "aria-current": E, ...r, "aria-label": c, children: [
-    m,
-    C
-  ] }), e[47] = y, e[48] = K, e[49] = m, e[50] = C, e[51] = n, e[52] = A, e[53] = B, e[54] = E, e[55] = r, e[56] = c, e[57] = h) : h = e[57];
-  let x;
-  e[58] !== t?.connector || e[59] !== w || e[60] !== D || e[61] !== s || e[62] !== i || e[63] !== l ? (x = !w && D && /* @__PURE__ */ u(T, { orientation: "vertical", status: i, size: s, variant: l, className: t?.connector }), e[58] = t?.connector, e[59] = w, e[60] = D, e[61] = s, e[62] = i, e[63] = l, e[64] = x) : x = e[64];
-  let I;
-  return e[65] !== h || e[66] !== x || e[67] !== z ? (I = /* @__PURE__ */ $("div", { className: z, children: [
-    h,
-    x
-  ] }), e[65] = h, e[66] = x, e[67] = z, e[68] = I) : I = e[68], I;
-}, ne = G(Y);
+    isClickable: l,
+    isDisabled: C,
+    LabelComponent: h,
+    status: t,
+    handleClick: u,
+    handleKeyDown: x
+  } = j({ clickable: d, step: r, onClick: f });
+  return /* @__PURE__ */ c("div", { className: o === "stacked" ? "flex flex-col items-center" : "flex flex-col", children: [
+    /* @__PURE__ */ c(
+      "div",
+      {
+        className: a(
+          w({
+            orientation: "vertical",
+            variant: o,
+            clickable: l
+          }),
+          e?.stepWrapper
+        ),
+        role: l ? "button" : void 0,
+        tabIndex: l ? 0 : void 0,
+        onClick: u,
+        onKeyDown: x,
+        "aria-current": t === "active" ? "step" : void 0,
+        ...C && { "aria-disabled": !0 },
+        "aria-label": D(p, r.label, t),
+        children: [
+          /* @__PURE__ */ n(
+            "div",
+            {
+              className: a(
+                I({ status: t, size: i }),
+                e?.indicator
+              ),
+              "aria-hidden": "true",
+              children: /* @__PURE__ */ n(
+                g,
+                {
+                  status: t,
+                  index: p,
+                  size: i,
+                  icons: s,
+                  className: e?.indicatorContent
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ c(
+            "div",
+            {
+              className: a(v({ variant: o }), e?.content),
+              children: [
+                r.label && /* @__PURE__ */ n(
+                  h,
+                  {
+                    className: a(
+                      S({ status: t, size: i, variant: o }),
+                      e?.label
+                    ),
+                    children: r.label
+                  }
+                ),
+                r.description && /* @__PURE__ */ n(
+                  "span",
+                  {
+                    className: a(
+                      k({ status: t, size: i, variant: o }),
+                      e?.description
+                    ),
+                    children: r.description
+                  }
+                )
+              ]
+            }
+          )
+        ]
+      }
+    ),
+    !m && b && /* @__PURE__ */ n(
+      L,
+      {
+        orientation: "vertical",
+        status: t,
+        size: i,
+        variant: o,
+        className: e?.connector
+      }
+    )
+  ] });
+}, H = V(y);
 export {
-  ne as VerticalStepItem
+  H as VerticalStepItem
 };

package/dist/components/Stepper/hooks/useStepItemLogic.js

@@ -7,9 +7,12 @@ function m({
 }) {
   const i = n.status ?? "pending", l = n.disabled || i === "active", r = !!(n.onClick || t), o = c && !l && r, f = typeof n.label == "string" ? "span" : b, e = s(() => {
     o && (n.onClick ? n.onClick() : t && t());
-  }, [o, n.onClick, t]), u = s((a) => {
-    o && (a.key === "Enter" || a.key === " ") && (a.preventDefault(), e());
-  }, [o, e]);
+  }, [o, n.onClick, t]), u = s(
+    (a) => {
+      o && (a.key === "Enter" || a.key === " ") && (a.preventDefault(), e());
+    },
+    [o, e]
+  );
   return {
     isClickable: o,
     isDisabled: l,

package/dist/components/Switch/Switch.js

@@ -1,106 +1,105 @@
-import { jsx as p, jsxs as q } from "react/jsx-runtime";
-import { c as K } from "../../compiler-runtime-DA41awpA.js";
-import * as w from "react";
-import { forwardRef as Q, useRef as Y, useId as Z, useImperativeHandle as ee, useEffect as te } from "react";
-import { P as L, a as oe, c as se, b as ae } from "../../index--l0zux8V.js";
-import { u as O } from "../../index-DLcqcWxM.js";
-import { u as re } from "../../index-BZPx6jYI.js";
-import { u as ne } from "../../index-BRXMsxSL.js";
-import { Typography as F } from "../Typography/Typography.js";
-import { cn as z } from "../../utils/index.js";
-import { switchVariants as le, thumbVariants as ce } from "./Switch.variants.js";
-var A = "Switch", [ie] = ae(A), [de, ue] = ie(A), V = w.forwardRef(
-  (c, f) => {
+import { jsxs as R, jsx as l } from "react/jsx-runtime";
+import * as m from "react";
+import { forwardRef as M, useRef as $, useId as j, useImperativeHandle as z, useEffect as A } from "react";
+import { a as U, P, c as q, b as F } from "../../index--l0zux8V.js";
+import { u as g } from "../../index-DLcqcWxM.js";
+import { u as L } from "../../index-BZPx6jYI.js";
+import { u as O } from "../../index-BRXMsxSL.js";
+import { Typography as N } from "../Typography/Typography.js";
+import { cn as C } from "../../utils/index.js";
+import { thumbVariants as V, switchVariants as D } from "./Switch.variants.js";
+var k = "Switch", [W] = F(k), [X, G] = W(k), E = m.forwardRef(
+  (o, d) => {
     const {
       __scopeSwitch: e,
-      name: i,
+      name: a,
       checked: t,
-      defaultChecked: h,
-      required: u,
-      disabled: o,
-      value: d = "on",
-      onCheckedChange: s,
-      form: r,
-      ...b
-    } = c, [n, m] = w.useState(null), v = O(f, (l) => m(l)), a = w.useRef(!1), C = n ? r || !!n.closest("form") : !0, [x, T] = oe({
+      defaultChecked: w,
+      required: r,
+      disabled: n,
+      value: u = "on",
+      onCheckedChange: p,
+      form: c,
+      ...v
+    } = o, [i, h] = m.useState(null), b = g(d, (x) => h(x)), s = m.useRef(!1), S = i ? c || !!i.closest("form") : !0, [f, y] = U({
       prop: t,
-      defaultProp: h ?? !1,
-      onChange: s,
-      caller: A
+      defaultProp: w ?? !1,
+      onChange: p,
+      caller: k
     });
-    return /* @__PURE__ */ q(de, { scope: e, checked: x, disabled: o, children: [
-      /* @__PURE__ */ p(
-        L.button,
+    return /* @__PURE__ */ R(X, { scope: e, checked: f, disabled: n, children: [
+      /* @__PURE__ */ l(
+        P.button,
         {
           type: "button",
           role: "switch",
-          "aria-checked": x,
-          "aria-required": u,
-          "data-state": G(x),
-          "data-disabled": o ? "" : void 0,
-          disabled: o,
-          value: d,
-          ...b,
-          ref: v,
-          onClick: se(c.onClick, (l) => {
-            T((I) => !I), C && (a.current = l.isPropagationStopped(), a.current || l.stopPropagation());
+          "aria-checked": f,
+          "aria-required": r,
+          "data-state": T(f),
+          "data-disabled": n ? "" : void 0,
+          disabled: n,
+          value: u,
+          ...v,
+          ref: b,
+          onClick: q(o.onClick, (x) => {
+            y((H) => !H), S && (s.current = x.isPropagationStopped(), s.current || x.stopPropagation());
           })
         }
       ),
-      C && /* @__PURE__ */ p(
-        X,
+      S && /* @__PURE__ */ l(
+        B,
         {
-          control: n,
-          bubbles: !a.current,
-          name: i,
-          value: d,
-          checked: x,
-          required: u,
-          disabled: o,
-          form: r,
+          control: i,
+          bubbles: !s.current,
+          name: a,
+          value: u,
+          checked: f,
+          required: r,
+          disabled: n,
+          form: c,
           style: { transform: "translateX(-100%)" }
         }
       )
     ] });
   }
 );
-V.displayName = A;
-var W = "SwitchThumb", D = w.forwardRef(
-  (c, f) => {
-    const { __scopeSwitch: e, ...i } = c, t = ue(W, e);
-    return /* @__PURE__ */ p(
-      L.span,
+E.displayName = k;
+var _ = "SwitchThumb", I = m.forwardRef(
+  (o, d) => {
+    const { __scopeSwitch: e, ...a } = o, t = G(_, e);
+    return /* @__PURE__ */ l(
+      P.span,
       {
-        "data-state": G(t.checked),
+        "data-state": T(t.checked),
         "data-disabled": t.disabled ? "" : void 0,
-        ...i,
-        ref: f
+        ...a,
+        ref: d
       }
     );
   }
 );
-D.displayName = W;
-var me = "SwitchBubbleInput", X = w.forwardRef(
+I.displayName = _;
+var J = "SwitchBubbleInput", B = m.forwardRef(
   ({
-    __scopeSwitch: c,
-    control: f,
+    __scopeSwitch: o,
+    control: d,
     checked: e,
-    bubbles: i = !0,
+    bubbles: a = !0,
     ...t
-  }, h) => {
-    const u = w.useRef(null), o = O(u, h), d = re(e), s = ne(f);
-    return w.useEffect(() => {
-      const r = u.current;
-      if (!r) return;
-      const b = window.HTMLInputElement.prototype, m = Object.getOwnPropertyDescriptor(
-        b,
+  }, w) => {
+    const r = m.useRef(null), n = g(r, w), u = L(e), p = O(d);
+    return m.useEffect(() => {
+      const c = r.current;
+      if (!c) return;
+      const v = window.HTMLInputElement.prototype, h = Object.getOwnPropertyDescriptor(
+        v,
         "checked"
       ).set;
-      if (d !== e && m) {
-        const v = new Event("click", { bubbles: i });
-        m.call(r, e), r.dispatchEvent(v);
+      if (u !== e && h) {
+        const b = new Event("click", { bubbles: a });
+        h.call(c, e), c.dispatchEvent(b);
       }
-    }, [d, e, i]), /* @__PURE__ */ p(
+    }, [u, e, a]), /* @__PURE__ */ l(
       "input",
       {
         type: "checkbox",
@@ -108,10 +107,10 @@ var me = "SwitchBubbleInput", X = w.forwardRef(
         defaultChecked: e,
         ...t,
         tabIndex: -1,
-        ref: o,
+        ref: n,
         style: {
           ...t.style,
-          ...s,
+          ...p,
           position: "absolute",
           pointerEvents: "none",
           opacity: 0,
@@ -121,67 +120,111 @@ var me = "SwitchBubbleInput", X = w.forwardRef(
     );
   }
 );
-X.displayName = me;
-function G(c) {
-  return c ? "checked" : "unchecked";
+B.displayName = J;
+function T(o) {
+  return o ? "checked" : "unchecked";
 }
-var pe = V, fe = D;
-const ye = Q((c, f) => {
-  const e = K.c(39), {
-    alignment: i,
-    className: t,
-    defaultChecked: h,
-    disabled: u,
-    helperText: o,
-    helperTextClassName: d,
-    label: s,
-    labelClassName: r,
-    labelWrapperClassName: b,
-    name: n,
-    theme: m,
+var K = E, Q = I;
+const ce = M(
+  ({
+    alignment: o = "horizontal",
+    className: d,
+    defaultChecked: e,
+    disabled: a = !1,
+    helperText: t,
+    helperTextClassName: w,
+    label: r,
+    labelClassName: n,
+    labelWrapperClassName: u,
+    name: p,
+    theme: c,
     thumbClassName: v,
-    value: a,
-    onChange: C
-  } = c, x = i === void 0 ? "horizontal" : i, T = u === void 0 ? !1 : u, l = Y(null), I = Z(), S = n ? `${I}-${n}` : I;
-  let B, H;
-  e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (B = () => l.current, H = [l], e[0] = B, e[1] = H) : (B = e[0], H = e[1]), ee(f, B, H);
-  let M, $;
-  e[2] !== a ? (M = () => {
-    l.current && (l.current.value = `${a}`);
-  }, $ = [a], e[2] = a, e[3] = M, e[4] = $) : (M = e[3], $ = e[4]), te(M, $);
-  const U = x === "vertical" ? "flex-col" : "flex-row";
-  let k;
-  e[5] !== b || e[6] !== U ? (k = z("w-full", "flex", "gap-3", U, b), e[5] = b, e[6] = U, e[7] = k) : k = e[7];
-  let N;
-  e[8] !== C ? (N = (J) => C?.(J), e[8] = C, e[9] = N) : N = e[9];
-  let g;
-  e[10] !== t ? (g = z(le({
-    className: t
-  })), e[10] = t, e[11] = g) : g = e[11];
-  let y;
-  e[12] !== v ? (y = ce({
-    className: v
-  }), e[12] = v, e[13] = y) : y = e[13];
-  let R;
-  e[14] !== y ? (R = /* @__PURE__ */ p(fe, { className: y }), e[14] = y, e[15] = R) : R = e[15];
-  let P;
-  e[16] !== S || e[17] !== h || e[18] !== T || e[19] !== s || e[20] !== g || e[21] !== R || e[22] !== N || e[23] !== a ? (P = /* @__PURE__ */ p(pe, { id: S, defaultChecked: h, checked: a, onCheckedChange: N, className: g, "aria-label": s, disabled: T, children: R }), e[16] = S, e[17] = h, e[18] = T, e[19] = s, e[20] = g, e[21] = R, e[22] = N, e[23] = a, e[24] = P) : P = e[24];
-  let E;
-  e[25] !== S || e[26] !== o || e[27] !== d || e[28] !== s || e[29] !== r ? (E = s ? /* @__PURE__ */ q(F, { component: "label", className: z("flex", "flex-col", "text-sm", "dark:text-white", "select-none", r), htmlFor: S, style: {
-    paddingRight: 15
-  }, children: [
-    s,
-    o ? /* @__PURE__ */ p(F, { component: "span", className: z("text-xs", "select-none", "text-slate-600", "dark:text-metal-400", d), children: o }) : null
-  ] }) : null, e[25] = S, e[26] = o, e[27] = d, e[28] = s, e[29] = r, e[30] = E) : E = e[30];
-  let _;
-  e[31] !== n ? (_ = /* @__PURE__ */ p("input", { ref: l, name: n, type: "text", className: "hidden", "aria-hidden": "true" }), e[31] = n, e[32] = _) : _ = e[32];
-  let j;
-  return e[33] !== P || e[34] !== E || e[35] !== _ || e[36] !== k || e[37] !== m ? (j = /* @__PURE__ */ q("div", { className: k, "data-theme": m, children: [
-    P,
-    E,
-    _
-  ] }), e[33] = P, e[34] = E, e[35] = _, e[36] = k, e[37] = m, e[38] = j) : j = e[38], j;
-});
+    value: i,
+    onChange: h
+  }, b) => {
+    const s = $(null), S = j(), f = p ? `${S}-${p}` : S;
+    return z(b, () => s.current, [s]), A(() => {
+      s.current && (s.current.value = `${i}`);
+    }, [i]), /* @__PURE__ */ R(
+      "div",
+      {
+        className: C(
+          "w-full",
+          "flex",
+          "gap-3",
+          o === "vertical" ? "flex-col" : "flex-row",
+          u
+        ),
+        "data-theme": c,
+        children: [
+          /* @__PURE__ */ l(
+            K,
+            {
+              id: f,
+              defaultChecked: e,
+              checked: i,
+              onCheckedChange: (y) => h?.(y),
+              className: C(D({ className: d })),
+              "aria-label": r,
+              disabled: a,
+              children: /* @__PURE__ */ l(
+                Q,
+                {
+                  className: V({
+                    className: v
+                  })
+                }
+              )
+            }
+          ),
+          r ? /* @__PURE__ */ R(
+            N,
+            {
+              component: "label",
+              className: C(
+                "flex",
+                "flex-col",
+                "text-sm",
+                "dark:text-white",
+                "select-none",
+                n
+              ),
+              htmlFor: f,
+              style: { paddingRight: 15 },
+              children: [
+                r,
+                t ? /* @__PURE__ */ l(
+                  N,
+                  {
+                    component: "span",
+                    className: C(
+                      "text-xs",
+                      "select-none",
+                      "text-slate-600",
+                      "dark:text-metal-400",
+                      w
+                    ),
+                    children: t
+                  }
+                ) : null
+              ]
+            }
+          ) : null,
+          /* @__PURE__ */ l(
+            "input",
+            {
+              ref: s,
+              name: p,
+              type: "text",
+              className: "hidden",
+              "aria-hidden": "true"
+            }
+          )
+        ]
+      }
+    );
+  }
+);
 export {
-  ye as Switch
+  ce as Switch
 };

package/dist/components/Switch/Switch.variants.js

@@ -1,5 +1,44 @@
 import { c as a } from "../../index-D29mdTf5.js";
-const t = a(["w-10", "h-5", "flex", "items-center", "rounded-full", "shadow", "focus:shadow-md", "data-[state=unchecked]:bg-gray-300", "dark:data-[state=unchecked]:bg-metal-600", "transition-all", "delay-10", "duration-250", "cursor-pointer", "bg-aurora-500", "kubefirst:bg-kubefirst-primary", "[&+label,&+span]:cursor-pointer", "disabled:[&+label,&+span,&]:cursor-not-allowed", "disabled:bg-gray-200", "disabled:data-[state=unchecked]:[&>span]:bg-white", "disabled:data-[state=unchecked]:bg-gray-200", "dark:disabled:bg-metal-700", "dark:disabled:data-[state=unchecked]:[&>span]:bg-metal-600", "dark:disabled:data-[state=unchecked]:bg-metal-700", "dark:disabled:[&>span]:bg-metal-600"]), d = a(["block", "w-4", "h-4", "bg-white", "dark:bg-gray-400", "dark:data-[state=checked]:bg-white", "rounded-full", "shadow-md", "transition-all", "translate-x-1", "data-[state=checked]:translate-x-5", "delay-10", "duration-300"]);
+const t = a([
+  "w-10",
+  "h-5",
+  "flex",
+  "items-center",
+  "rounded-full",
+  "shadow",
+  "focus:shadow-md",
+  "data-[state=unchecked]:bg-gray-300",
+  "dark:data-[state=unchecked]:bg-metal-600",
+  "transition-all",
+  "delay-10",
+  "duration-250",
+  "cursor-pointer",
+  "bg-aurora-500",
+  "kubefirst:bg-kubefirst-primary",
+  "[&+label,&+span]:cursor-pointer",
+  "disabled:[&+label,&+span,&]:cursor-not-allowed",
+  "disabled:bg-gray-200",
+  "disabled:data-[state=unchecked]:[&>span]:bg-white",
+  "disabled:data-[state=unchecked]:bg-gray-200",
+  "dark:disabled:bg-metal-700",
+  "dark:disabled:data-[state=unchecked]:[&>span]:bg-metal-600",
+  "dark:disabled:data-[state=unchecked]:bg-metal-700",
+  "dark:disabled:[&>span]:bg-metal-600"
+]), d = a([
+  "block",
+  "w-4",
+  "h-4",
+  "bg-white",
+  "dark:bg-gray-400",
+  "dark:data-[state=checked]:bg-white",
+  "rounded-full",
+  "shadow-md",
+  "transition-all",
+  "translate-x-1",
+  "data-[state=checked]:translate-x-5",
+  "delay-10",
+  "duration-300"
+]);
 export {
   t as switchVariants,
   d as thumbVariants