@altimateai/ui-components 0.0.77-beta.3 → 0.0.77-beta.5

package/dist/Switch.js

@@ -1,128 +1,169 @@
-import { j as o } from "./index2.js";
+import { j as l } from "./index2.js";
 import * as s from "react";
-import { a as _, u as H, b as I, P as g, d as M, e as B, f as q, g as S } from "./Stack.js";
-var v = "Switch", [z, X] = _(v), [A, O] = z(v), x = s.forwardRef(
-  (e, a) => {
+import { u as A, b as T, d as y, e as H, P as C, f as I, a as x } from "./Stack.js";
+function M(e) {
+  const t = s.useRef({ value: e, previous: e });
+  return s.useMemo(() => (t.current.value !== e && (t.current.previous = t.current.value, t.current.value = e), t.current.previous), [e]);
+}
+function O(e) {
+  const [t, r] = s.useState(void 0);
+  return A(() => {
+    if (e) {
+      r({ width: e.offsetWidth, height: e.offsetHeight });
+      const n = new ResizeObserver((o) => {
+        if (!Array.isArray(o) || !o.length)
+          return;
+        const u = o[0];
+        let i, a;
+        if ("borderBoxSize" in u) {
+          const c = u.borderBoxSize, d = Array.isArray(c) ? c[0] : c;
+          i = d.inlineSize, a = d.blockSize;
+        } else
+          i = e.offsetWidth, a = e.offsetHeight;
+        r({ width: i, height: a });
+      });
+      return n.observe(e, { box: "border-box" }), () => n.unobserve(e);
+    } else
+      r(void 0);
+  }, [e]), t;
+}
+var S = "Switch", [L, G] = T(S), [U, W] = L(S), R = s.forwardRef(
+  (e, t) => {
     const {
-      __scopeSwitch: t,
-      name: r,
-      checked: n,
+      __scopeSwitch: r,
+      name: n,
+      checked: o,
       defaultChecked: u,
       required: i,
-      disabled: c,
-      value: l = "on",
-      onCheckedChange: b,
-      form: m,
-      ...p
-    } = e, [d, j] = s.useState(null), E = H(a, (f) => j(f)), k = s.useRef(!1), w = d ? m || !!d.closest("form") : !0, [h = !1, N] = I({
-      prop: n,
-      defaultProp: u,
-      onChange: b
+      disabled: a,
+      value: c = "on",
+      onCheckedChange: d,
+      form: f,
+      ...w
+    } = e, [p, h] = s.useState(null), m = y(t, (v) => h(v)), g = s.useRef(!1), k = p ? f || !!p.closest("form") : !0, [b, _] = H({
+      prop: o,
+      defaultProp: u ?? !1,
+      onChange: d,
+      caller: S
     });
-    return /* @__PURE__ */ o.jsxs(A, { scope: t, checked: h, disabled: c, children: [
-      /* @__PURE__ */ o.jsx(
-        g.button,
+    return /* @__PURE__ */ l.jsxs(U, { scope: r, checked: b, disabled: a, children: [
+      /* @__PURE__ */ l.jsx(
+        C.button,
         {
           type: "button",
           role: "switch",
-          "aria-checked": h,
+          "aria-checked": b,
           "aria-required": i,
-          "data-state": P(h),
-          "data-disabled": c ? "" : void 0,
-          disabled: c,
-          value: l,
-          ...p,
-          ref: E,
-          onClick: M(e.onClick, (f) => {
-            N((T) => !T), w && (k.current = f.isPropagationStopped(), k.current || f.stopPropagation());
+          "data-state": N(b),
+          "data-disabled": a ? "" : void 0,
+          disabled: a,
+          value: c,
+          ...w,
+          ref: m,
+          onClick: I(e.onClick, (v) => {
+            _((B) => !B), k && (g.current = v.isPropagationStopped(), g.current || v.stopPropagation());
           })
         }
       ),
-      w && /* @__PURE__ */ o.jsx(
-        D,
+      k && /* @__PURE__ */ l.jsx(
+        z,
         {
-          control: d,
-          bubbles: !k.current,
-          name: r,
-          value: l,
-          checked: h,
+          control: p,
+          bubbles: !g.current,
+          name: n,
+          value: c,
+          checked: b,
           required: i,
-          disabled: c,
-          form: m,
+          disabled: a,
+          form: f,
           style: { transform: "translateX(-100%)" }
         }
       )
     ] });
   }
 );
-x.displayName = v;
-var C = "SwitchThumb", y = s.forwardRef(
-  (e, a) => {
-    const { __scopeSwitch: t, ...r } = e, n = O(C, t);
-    return /* @__PURE__ */ o.jsx(
-      g.span,
+R.displayName = S;
+var P = "SwitchThumb", E = s.forwardRef(
+  (e, t) => {
+    const { __scopeSwitch: r, ...n } = e, o = W(P, r);
+    return /* @__PURE__ */ l.jsx(
+      C.span,
       {
-        "data-state": P(n.checked),
-        "data-disabled": n.disabled ? "" : void 0,
-        ...r,
-        ref: a
+        "data-state": N(o.checked),
+        "data-disabled": o.disabled ? "" : void 0,
+        ...n,
+        ref: t
       }
     );
   }
 );
-y.displayName = C;
-var D = (e) => {
-  const { control: a, checked: t, bubbles: r = !0, ...n } = e, u = s.useRef(null), i = B(t), c = q(a);
-  return s.useEffect(() => {
-    const l = u.current, b = window.HTMLInputElement.prototype, p = Object.getOwnPropertyDescriptor(b, "checked").set;
-    if (i !== t && p) {
-      const d = new Event("click", { bubbles: r });
-      p.call(l, t), l.dispatchEvent(d);
-    }
-  }, [i, t, r]), /* @__PURE__ */ o.jsx(
-    "input",
-    {
-      type: "checkbox",
-      "aria-hidden": !0,
-      defaultChecked: t,
-      ...n,
-      tabIndex: -1,
-      ref: u,
-      style: {
-        ...e.style,
-        ...c,
-        position: "absolute",
-        pointerEvents: "none",
-        opacity: 0,
-        margin: 0
+E.displayName = P;
+var q = "SwitchBubbleInput", z = s.forwardRef(
+  ({
+    __scopeSwitch: e,
+    control: t,
+    checked: r,
+    bubbles: n = !0,
+    ...o
+  }, u) => {
+    const i = s.useRef(null), a = y(i, u), c = M(r), d = O(t);
+    return s.useEffect(() => {
+      const f = i.current;
+      if (!f) return;
+      const w = window.HTMLInputElement.prototype, h = Object.getOwnPropertyDescriptor(
+        w,
+        "checked"
+      ).set;
+      if (c !== r && h) {
+        const m = new Event("click", { bubbles: n });
+        h.call(f, r), f.dispatchEvent(m);
       }
-    }
-  );
-};
-function P(e) {
+    }, [c, r, n]), /* @__PURE__ */ l.jsx(
+      "input",
+      {
+        type: "checkbox",
+        "aria-hidden": !0,
+        defaultChecked: r,
+        ...o,
+        tabIndex: -1,
+        ref: a,
+        style: {
+          ...o.style,
+          ...d,
+          position: "absolute",
+          pointerEvents: "none",
+          opacity: 0,
+          margin: 0
+        }
+      }
+    );
+  }
+);
+z.displayName = q;
+function N(e) {
   return e ? "checked" : "unchecked";
 }
-var R = x, F = y;
-const L = s.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ o.jsx(
-  R,
+var j = R, D = E;
+const F = s.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ l.jsx(
+  j,
   {
-    className: S(
+    className: x(
       "al-peer al-inline-flex al-h-6 al-w-11 al-shrink-0 al-cursor-pointer al-items-center al-rounded-full al-border-2 al-border-transparent al-transition-colors focus-visible:al-outline-none focus-visible:al-ring-2 focus-visible:al-ring-ring focus-visible:al-ring-offset-2 focus-visible:al-ring-offset-background disabled:al-cursor-not-allowed disabled:al-opacity-50 data-[state=checked]:al-bg-primary data-[state=unchecked]:al-bg-input",
       e
     ),
-    ...a,
-    ref: t,
-    children: /* @__PURE__ */ o.jsx(
-      F,
+    ...t,
+    ref: r,
+    children: /* @__PURE__ */ l.jsx(
+      D,
       {
-        className: S(
+        className: x(
           "al-pointer-events-none al-block al-h-5 al-w-5 al-rounded-full al-bg-background al-shadow-lg al-ring-0 al-transition-transform data-[state=checked]:al-translate-x-5 data-[state=unchecked]:al-translate-x-0"
         )
       }
     )
   }
 ));
-L.displayName = R.displayName;
+F.displayName = j.displayName;
 export {
-  L as S
+  F as S
 };