@purpurds/toggle 8.11.0 → 8.12.0

package/dist/toggle.es.js

@@ -1,6 +1,6 @@
 import { jsx as g, jsxs as O } from "react/jsx-runtime";
 import * as s from "react";
-import { useState as C, useCallback as A, useEffect as P, cloneElement as ue, isValidElement as se, useRef as E, forwardRef as ce } from "react";
+import { useState as C, useCallback as A, useEffect as E, cloneElement as ue, isValidElement as se, useRef as z, forwardRef as ce } from "react";
 import "react-dom";
 function le(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
@@ -47,16 +47,16 @@ const fe = /* @__PURE__ */ le(de), he = {
   "purpur-icon--md": "_purpur-icon--md_8u1lq_16",
   "purpur-icon--lg": "_purpur-icon--lg_8u1lq_20",
   "purpur-icon--xl": "_purpur-icon--xl_8u1lq_24"
-}, ge = fe.bind(he), B = "purpur-icon", _e = "md", me = (e) => e.filter((n) => Object.keys(n).length >= 1).map((n) => `${n.name}="${n.value}"`).join(" "), ve = ({ content: e = "", title: n } = {}) => {
+}, ge = fe.bind(he), B = "purpur-icon", ve = "md", _e = (e) => e.filter((n) => Object.keys(n).length >= 1).map((n) => `${n.name}="${n.value}"`).join(" "), me = ({ content: e = "", title: n } = {}) => {
   const t = [
     { name: "xmlns", value: "http://www.w3.org/2000/svg" },
     { name: "fill", value: "currentColor" },
     { name: "viewBox", value: "0 0 24 24" },
     n ? { name: "role", value: "img" } : { name: "aria-hidden", value: "true" }
   ], a = n ? `<title>${n}</title>` : "";
-  return `<svg ${me(t)}>${a}${e}</svg>`;
-}, be = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), J = ({ svg: e, allyTitle: n, className: t, size: a = _e, ...o }) => {
-  const r = ve({
+  return `<svg ${_e(t)}>${a}${e}</svg>`;
+}, be = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), J = ({ svg: e, allyTitle: n, className: t, size: a = ve, ...o }) => {
+  const r = me({
     content: be(e.svg),
     title: n
   }), i = ge(B, `${B}--${a}`, t);
@@ -90,7 +90,7 @@ function we(...e) {
       };
   };
 }
-var Se = Symbol.for("react.lazy"), k = s[" use ".trim().toString()];
+var Se = Symbol.for("react.lazy"), P = s[" use ".trim().toString()];
 function xe(e) {
   return typeof e == "object" && e !== null && "then" in e;
 }
@@ -101,8 +101,8 @@ function K(e) {
 function Ce(e) {
   const n = /* @__PURE__ */ $e(e), t = s.forwardRef((a, o) => {
     let { children: r, ...i } = a;
-    K(r) && typeof k == "function" && (r = k(r._payload));
-    const u = s.Children.toArray(r), c = u.find(Ee);
+    K(r) && typeof P == "function" && (r = P(r._payload));
+    const u = s.Children.toArray(r), c = u.find(ze);
     if (c) {
       const l = c.props.children, d = u.map((p) => p === c ? s.Children.count(l) > 1 ? s.Children.only(null) : s.isValidElement(l) ? l.props.children : null : p);
       return /* @__PURE__ */ g(n, { ...i, ref: o, children: s.isValidElement(l) ? s.cloneElement(l, void 0, d) : null });
@@ -115,8 +115,8 @@ function Ce(e) {
 function $e(e) {
   const n = s.forwardRef((t, a) => {
     let { children: o, ...r } = t;
-    if (K(o) && typeof k == "function" && (o = k(o._payload)), s.isValidElement(o)) {
-      const i = ke(o), u = Pe(r, o.props);
+    if (K(o) && typeof P == "function" && (o = P(o._payload)), s.isValidElement(o)) {
+      const i = Pe(o), u = Ee(r, o.props);
       return o.type !== s.Fragment && (u.ref = a ? we(a, i) : i), s.cloneElement(o, u);
     }
     return s.Children.count(o) > 1 ? s.Children.only(null) : null;
@@ -124,10 +124,10 @@ function $e(e) {
   return n.displayName = `${e}.SlotClone`, n;
 }
 var Re = Symbol("radix.slottable");
-function Ee(e) {
+function ze(e) {
   return s.isValidElement(e) && typeof e.type == "function" && "__radixId" in e.type && e.type.__radixId === Re;
 }
-function Pe(e, n) {
+function Ee(e, n) {
   const t = { ...n };
   for (const a in n) {
     const o = e[a], r = n[a];
@@ -138,11 +138,11 @@ function Pe(e, n) {
   }
   return { ...e, ...t };
 }
-function ke(e) {
+function Pe(e) {
   let n = Object.getOwnPropertyDescriptor(e.props, "ref")?.get, t = n && "isReactWarning" in n && n.isReactWarning;
   return t ? e.ref : (n = Object.getOwnPropertyDescriptor(e, "ref")?.get, t = n && "isReactWarning" in n && n.isReactWarning, t ? e.props.ref : e.props.ref || e.ref);
 }
-var De = [
+var ke = [
   "a",
   "button",
   "div",
@@ -160,14 +160,14 @@ var De = [
   "span",
   "svg",
   "ul"
-], Ne = De.reduce((e, n) => {
+], De = ke.reduce((e, n) => {
   const t = /* @__PURE__ */ Ce(`Primitive.${n}`), a = s.forwardRef((o, r) => {
     const { asChild: i, ...u } = o, c = i ? t : n;
     return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ g(c, { ...u, ref: r });
   });
   return a.displayName = `Primitive.${n}`, { ...e, [n]: a };
-}, {}), ze = "Label", Q = s.forwardRef((e, n) => /* @__PURE__ */ g(
-  Ne.label,
+}, {}), Ne = "Label", Q = s.forwardRef((e, n) => /* @__PURE__ */ g(
+  De.label,
   {
     ...e,
     ref: n,
@@ -176,7 +176,7 @@ var De = [
     }
   }
 ));
-Q.displayName = ze;
+Q.displayName = Ne;
 var Oe = Q;
 function Ae(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
@@ -219,16 +219,16 @@ const qe = /* @__PURE__ */ Ae(je), Be = {
   "purpur-label": "_purpur-label_1x80u_1",
   "purpur-label--negative": "_purpur-label--negative_1x80u_8",
   "purpur-label--disabled": "_purpur-label--disabled_1x80u_11"
-}, Xe = qe.bind(Be), N = "purpur-label", He = ({
+}, Xe = qe.bind(Be), D = "purpur-label", He = ({
   children: e,
   className: n,
   disabled: t,
   negative: a = !1,
   ...o
 }) => {
-  const r = Xe(n, N, {
-    [`${N}--disabled`]: t,
-    [`${N}--negative`]: a
+  const r = Xe(n, D, {
+    [`${D}--disabled`]: t,
+    [`${D}--negative`]: a
   });
   return /* @__PURE__ */ g(Oe, { className: r, ...o, children: e });
 };
@@ -270,20 +270,21 @@ function We() {
 }
 var Ie = We();
 const Te = /* @__PURE__ */ Le(Ie), Ve = {
-  "purpur-paragraph": "_purpur-paragraph_1rh57_1",
-  "purpur-paragraph--disabled": "_purpur-paragraph--disabled_1rh57_7",
-  "purpur-paragraph--hyphens": "_purpur-paragraph--hyphens_1rh57_10",
-  "purpur-paragraph--negative": "_purpur-paragraph--negative_1rh57_13",
-  "purpur-paragraph--paragraph-100": "_purpur-paragraph--paragraph-100_1rh57_16",
-  "purpur-paragraph--paragraph-100-medium": "_purpur-paragraph--paragraph-100-medium_1rh57_22",
-  "purpur-paragraph--paragraph-100-bold": "_purpur-paragraph--paragraph-100-bold_1rh57_29",
-  "purpur-paragraph--paragraph-200": "_purpur-paragraph--paragraph-200_1rh57_36",
-  "purpur-paragraph--preamble-100": "_purpur-paragraph--preamble-100_1rh57_42",
-  "purpur-paragraph--preamble-200": "_purpur-paragraph--preamble-200_1rh57_48",
-  "purpur-paragraph--additional-100": "_purpur-paragraph--additional-100_1rh57_54",
-  "purpur-paragraph--additional-100-medium": "_purpur-paragraph--additional-100-medium_1rh57_60",
-  "purpur-paragraph--overline-100": "_purpur-paragraph--overline-100_1rh57_67",
-  "purpur-paragraph--overline-200": "_purpur-paragraph--overline-200_1rh57_75"
+  "purpur-paragraph": "_purpur-paragraph_1vz75_1",
+  "purpur-paragraph--disabled": "_purpur-paragraph--disabled_1vz75_7",
+  "purpur-paragraph--hyphens": "_purpur-paragraph--hyphens_1vz75_10",
+  "purpur-paragraph--negative": "_purpur-paragraph--negative_1vz75_13",
+  "purpur-paragraph--paragraph-100": "_purpur-paragraph--paragraph-100_1vz75_16",
+  "purpur-paragraph--paragraph-100-medium": "_purpur-paragraph--paragraph-100-medium_1vz75_22",
+  "purpur-paragraph--paragraph-100-bold": "_purpur-paragraph--paragraph-100-bold_1vz75_29",
+  "purpur-paragraph--paragraph-200": "_purpur-paragraph--paragraph-200_1vz75_36",
+  "purpur-paragraph--preamble-100": "_purpur-paragraph--preamble-100_1vz75_42",
+  "purpur-paragraph--preamble-200": "_purpur-paragraph--preamble-200_1vz75_48",
+  "purpur-paragraph--additional-100": "_purpur-paragraph--additional-100_1vz75_54",
+  "purpur-paragraph--additional-100-medium": "_purpur-paragraph--additional-100-medium_1vz75_60",
+  "purpur-paragraph--additional-100-bold": "_purpur-paragraph--additional-100-bold_1vz75_67",
+  "purpur-paragraph--overline-100": "_purpur-paragraph--overline-100_1vz75_74",
+  "purpur-paragraph--overline-200": "_purpur-paragraph--overline-200_1vz75_82"
 }, Fe = Te.bind(Ve), Ue = {
   PARAGRAPH100: "paragraph-100"
 }, R = "purpur-paragraph", Y = ({
@@ -339,12 +340,12 @@ function Je(e, n = []) {
     const u = s.createContext(i), c = t.length;
     t = [...t, i];
     const l = (p) => {
-      const { scope: f, children: _, ...h } = p, m = f?.[e]?.[c] || u, v = s.useMemo(() => h, Object.values(h));
-      return /* @__PURE__ */ g(m.Provider, { value: v, children: _ });
+      const { scope: f, children: v, ...h } = p, _ = f?.[e]?.[c] || u, m = s.useMemo(() => h, Object.values(h));
+      return /* @__PURE__ */ g(_.Provider, { value: m, children: v });
     };
     l.displayName = r + "Provider";
     function d(p, f) {
-      const _ = f?.[e]?.[c] || u, h = s.useContext(_);
+      const v = f?.[e]?.[c] || u, h = s.useContext(v);
       if (h) return h;
       if (i !== void 0) return i;
       throw new Error(`\`${p}\` must be used within \`${r}\``);
@@ -520,7 +521,7 @@ var cr = [
       onCheckedChange: l,
       form: d,
       ...p
-    } = e, [f, _] = s.useState(null), h = Ge(n, (y) => _(y)), m = s.useRef(!1), v = f ? d || !!f.closest("form") : !0, [b = !1, x] = Qe({
+    } = e, [f, v] = s.useState(null), h = Ge(n, (y) => v(y)), _ = s.useRef(!1), m = f ? d || !!f.closest("form") : !0, [b = !1, x] = Qe({
       prop: o,
       defaultProp: r,
       onChange: l
@@ -540,15 +541,15 @@ var cr = [
           ...p,
           ref: h,
           onClick: Ze(e.onClick, (y) => {
-            x((w) => !w), v && (m.current = y.isPropagationStopped(), m.current || y.stopPropagation());
+            x((w) => !w), m && (_.current = y.isPropagationStopped(), _.current || y.stopPropagation());
           })
         }
       ),
-      v && /* @__PURE__ */ g(
+      m && /* @__PURE__ */ g(
         fr,
         {
           control: f,
-          bubbles: !m.current,
+          bubbles: !_.current,
           name: a,
           value: c,
           checked: b,
@@ -609,12 +610,12 @@ function ae(e) {
   return e ? "checked" : "unchecked";
 }
 var hr = ne, gr = ie;
-function _r(e) {
+function vr(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-var z = { exports: {} };
+var N = { exports: {} };
 var V;
-function mr() {
+function _r() {
   return V || (V = 1, (function(e) {
     (function() {
       var n = {}.hasOwnProperty;
@@ -644,10 +645,10 @@ function mr() {
       }
       e.exports ? (t.default = t, e.exports = t) : window.classNames = t;
     })();
-  })(z)), z.exports;
+  })(N)), N.exports;
 }
-var vr = mr();
-const br = /* @__PURE__ */ _r(vr), F = (e) => e && "touches" in e, yr = ({
+var mr = _r();
+const br = /* @__PURE__ */ vr(mr), F = (e) => e && "touches" in e, yr = ({
   children: e,
   disabled: n,
   onStart: t,
@@ -657,13 +658,13 @@ const br = /* @__PURE__ */ _r(vr), F = (e) => e && "touches" in e, yr = ({
   position: i,
   style: u
 }) => {
-  const [c, l] = C(void 0), [d, p] = C(void 0), [f, _] = C(!1), h = (b) => {
+  const [c, l] = C(void 0), [d, p] = C(void 0), [f, v] = C(!1), h = (b) => {
     if (!n) {
       b.preventDefault();
       const x = F(b.nativeEvent) ? b.nativeEvent.touches[0].clientX : b.nativeEvent.clientX;
       p(x), t?.();
     }
-  }, m = A(
+  }, _ = A(
     (b) => {
       if (typeof d != "number")
         return;
@@ -671,20 +672,20 @@ const br = /* @__PURE__ */ _r(vr), F = (e) => e && "touches" in e, yr = ({
       if (!y)
         return;
       const w = i + y;
-      !f && Math.abs(w) && _(!0);
-      const D = w > r.right ? r.right : w < r.left ? r.left : w;
-      l(D), a?.({ x: D });
+      !f && Math.abs(w) && v(!0);
+      const k = w > r.right ? r.right : w < r.left ? r.left : w;
+      l(k), a?.({ x: k });
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [a, l, f, d]
-  ), v = A(() => {
-    p(void 0), l(void 0), _(!1), o?.();
+  ), m = A(() => {
+    p(void 0), l(void 0), v(!1), o?.();
   }, [o, p]);
-  return P(() => (window.addEventListener("mousemove", m), window.addEventListener("touchmove", m), () => {
-    window.removeEventListener("mousemove", m), window.removeEventListener("touchmove", m);
-  }), [m]), P(() => (window.addEventListener("mouseup", v), window.addEventListener("touchend", v), () => {
-    window.removeEventListener("mouseup", v), window.removeEventListener("touchend", v);
-  }), [v]), se(e) ? ue(e, {
+  return E(() => (window.addEventListener("mousemove", _), window.addEventListener("touchmove", _), () => {
+    window.removeEventListener("mousemove", _), window.removeEventListener("touchmove", _);
+  }), [_]), E(() => (window.addEventListener("mouseup", m), window.addEventListener("touchend", m), () => {
+    window.removeEventListener("mouseup", m), window.removeEventListener("touchend", m);
+  }), [m]), se(e) ? ue(e, {
     onMouseDown: h,
     onTouchStart: h,
     style: { ...u, transform: `translateX(${f ? c : i}px)` }
@@ -694,18 +695,18 @@ const br = /* @__PURE__ */ _r(vr), F = (e) => e && "touches" in e, yr = ({
   height: void 0
 };
 function Z(e) {
-  const { ref: n, box: t = "content-box", round: a } = e, [{ width: o, height: r }, i] = C(U), u = wr(), c = E({ ...U }), l = E(void 0);
-  return l.current = e.onResize, P(() => {
+  const { ref: n, box: t = "content-box", round: a } = e, [{ width: o, height: r }, i] = C(U), u = wr(), c = z({ ...U }), l = z(void 0);
+  return l.current = e.onResize, E(() => {
     if (!n.current || typeof window > "u" || !("ResizeObserver" in window))
       return;
     const d = new ResizeObserver(([p]) => {
-      const f = t === "border-box" ? "borderBoxSize" : t === "device-pixel-content-box" ? "devicePixelContentBoxSize" : "contentBoxSize", _ = G(p, f, "inlineSize"), h = G(p, f, "blockSize");
-      if (c.current.width !== _ || c.current.height !== h) {
-        const v = {
-          width: _ && a ? Math.round(_) : _,
+      const f = t === "border-box" ? "borderBoxSize" : t === "device-pixel-content-box" ? "devicePixelContentBoxSize" : "contentBoxSize", v = G(p, f, "inlineSize"), h = G(p, f, "blockSize");
+      if (c.current.width !== v || c.current.height !== h) {
+        const m = {
+          width: v && a ? Math.round(v) : v,
           height: h && a ? Math.round(h) : h
         };
-        c.current.width = _, c.current.height = h, l.current ? l.current(v) : u() && i(v);
+        c.current.width = v, c.current.height = h, l.current ? l.current(m) : u() && i(m);
       }
     });
     return d.observe(n.current, { box: t }), () => {
@@ -721,24 +722,24 @@ function G(e, n, t) {
   ) : n === "contentBoxSize" ? e.contentRect[t === "inlineSize" ? "width" : "height"] : void 0;
 }
 function wr() {
-  const e = E(!1);
-  return P(() => (e.current = !0, () => {
+  const e = z(!1);
+  return E(() => (e.current = !0, () => {
     e.current = !1;
   }), []), A(() => e.current, []);
 }
 const Sr = ({ checked: e, onChange: n }) => {
-  const t = E(null), a = E(null), [o, r] = C(void 0), [i, u] = C(!1), [c, l] = C(0), { height: d = 0 } = Z({ ref: a, round: !0 }), { height: p = 0 } = Z({ ref: t, round: !0 }), f = (p || 0) - d, _ = d + f, h = f / 2, m = _ / 2, v = typeof o == "number" && (e ? o < m : o > m);
+  const t = z(null), a = z(null), [o, r] = C(void 0), [i, u] = C(!1), [c, l] = C(0), { height: d = 0 } = Z({ ref: a, round: !0 }), { height: p = 0 } = Z({ ref: t, round: !0 }), f = (p || 0) - d, v = d + f, h = f / 2, _ = v / 2, m = typeof o == "number" && (e ? o < _ : o > _);
   return {
     trackRef: t,
     thumbRef: a,
     isDragging: i,
-    bounds: { left: h, right: _ },
-    position: e ? _ : h,
+    bounds: { left: h, right: v },
+    position: e ? v : h,
     onDrag: ({ x: w }) => {
-      r(w), Math.abs((e ? _ : h) - w) > 2 && u(!0);
+      r(w), Math.abs((e ? v : h) - w) > 2 && u(!0);
     },
     onStop: () => {
-      u(!1), i && l(Date.now()), v && n?.(!e);
+      u(!1), i && l(Date.now()), m && n?.(!e);
     },
     onChangeWithDrag: () => {
       Date.now() - c > 50 && n?.(!e), r(void 0);
@@ -768,7 +769,7 @@ const Sr = ({ checked: e, onChange: n }) => {
   }, l) => {
     const [d, p] = C(
       typeof r == "boolean" ? r : !!u
-    ), f = !!(typeof r == "boolean" ? r : d), { thumbRef: _, trackRef: h, isDragging: m, onChangeWithDrag: v, ...b } = Sr({
+    ), f = !!(typeof r == "boolean" ? r : d), { thumbRef: v, trackRef: h, isDragging: _, onChangeWithDrag: m, ...b } = Sr({
       checked: f,
       onChange: (y) => {
         c.disabled || (a?.(y), p(y));
@@ -793,17 +794,17 @@ const Sr = ({ checked: e, onChange: n }) => {
           id: c.id,
           "data-testid": e,
           className: $(S),
-          onCheckedChange: v,
+          onCheckedChange: m,
           checked: f,
           children: /* @__PURE__ */ O("span", { ref: h, className: $(`${S}__track`), children: [
             /* @__PURE__ */ g("span", { className: $(`${S}__checkmark-container`), children: /* @__PURE__ */ g(J, { className: $(`${S}__checkmark`), svg: ye, size: "xxs" }) }),
             /* @__PURE__ */ g(yr, { disabled: i, ...b, children: /* @__PURE__ */ g(
               gr,
               {
-                ref: _,
+                ref: v,
                 "data-testid": e && `${e}-thumb`,
                 className: $(`${S}__thumb`, {
-                  [`${S}__thumb--dragging`]: m
+                  [`${S}__thumb--dragging`]: _
                 })
               }
             ) })