@purpurds/checkbox 6.12.4 → 7.0.0

package/dist/checkbox.es.js

@@ -1,4 +1,4 @@
-import { jsxs as P, jsx as p, Fragment as te } from "react/jsx-runtime";
+import { jsxs as k, jsx as p, Fragment as te } from "react/jsx-runtime";
 import * as s from "react";
 import { forwardRef as _e } from "react";
 import "react-dom";
@@ -45,7 +45,7 @@ function ye() {
   }(W)), W.exports;
 }
 var xe = ye();
-const we = /* @__PURE__ */ be(xe), $e = {
+const we = /* @__PURE__ */ be(xe), Ce = {
   "purpur-icon": "_purpur-icon_8u1lq_1",
   "purpur-icon--xxs": "_purpur-icon--xxs_8u1lq_4",
   "purpur-icon--xs": "_purpur-icon--xs_8u1lq_8",
@@ -53,7 +53,7 @@ const we = /* @__PURE__ */ be(xe), $e = {
   "purpur-icon--md": "_purpur-icon--md_8u1lq_16",
   "purpur-icon--lg": "_purpur-icon--lg_8u1lq_20",
   "purpur-icon--xl": "_purpur-icon--xl_8u1lq_24"
-}, Ce = we.bind($e), I = "purpur-icon", Se = "md", Ne = (e) => e.filter((n) => Object.keys(n).length >= 1).map((n) => `${n.name}="${n.value}"`).join(" "), ke = ({ content: e = "", title: n } = {}) => {
+}, Se = we.bind(Ce), I = "purpur-icon", $e = "md", Ne = (e) => e.filter((n) => Object.keys(n).length >= 1).map((n) => `${n.name}="${n.value}"`).join(" "), ke = ({ content: e = "", title: n } = {}) => {
   const t = [
     { name: "xmlns", value: "http://www.w3.org/2000/svg" },
     { name: "fill", value: "currentColor" },
@@ -66,17 +66,16 @@ const we = /* @__PURE__ */ be(xe), $e = {
   svg: n,
   allyTitle: t,
   className: i,
-  size: a = Se,
+  size: a = $e,
   ...r
 }) => {
   const o = ke({
     content: Pe(n.svg),
     title: t
-  }), u = Ce(i, I, `${I}--${a}`);
+  }), u = Se(i, I, `${I}--${a}`);
   return /* @__PURE__ */ p(
     "span",
     {
-      "aria-label": t,
       className: u,
       "data-testid": e,
       dangerouslySetInnerHTML: { __html: o },
@@ -134,23 +133,23 @@ function Re() {
   }(L)), L.exports;
 }
 var Ee = Re();
-const Me = /* @__PURE__ */ Ae(Ee), F = {
+const Me = /* @__PURE__ */ Ae(Ee), U = {
   "purpur-field-error-text": "_purpur-field-error-text_1lj7e_1",
   "purpur-field-error-text__icon": "_purpur-field-error-text__icon_1lj7e_11"
-}, U = "purpur-field-error-text", je = ({
+}, V = "purpur-field-error-text", je = ({
   children: e,
   className: n,
-  relevant: t = "additions text",
+  ["aria-relevant"]: t = "additions text",
   ...i
-}) => /* @__PURE__ */ P(
+}) => /* @__PURE__ */ k(
   "div",
   {
-    className: Me([n, F[U]]),
+    className: Me([n, U[V]]),
     "aria-live": "assertive",
     "aria-relevant": t,
     ...i,
     children: [
-      /* @__PURE__ */ p(ne, { svg: Oe, size: "xs", className: F[`${U}__icon`] }),
+      /* @__PURE__ */ p(ne, { svg: Oe, size: "xs", className: U[`${V}__icon`] }),
       e
     ]
   }
@@ -158,7 +157,7 @@ const Me = /* @__PURE__ */ Ae(Ee), F = {
 function De(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-var V = { exports: {} };
+var F = { exports: {} };
 /*!
 	Copyright (c) 2018 Jed Watson.
 	Licensed under the MIT License (MIT), see
@@ -195,7 +194,7 @@ function qe() {
       }
       e.exports ? (t.default = t, e.exports = t) : window.classNames = t;
     })();
-  }(V)), V.exports;
+  }(F)), F.exports;
 }
 var ze = qe();
 const We = /* @__PURE__ */ De(ze), Be = {
@@ -206,7 +205,7 @@ const We = /* @__PURE__ */ De(ze), Be = {
   "purpur-icon--md": "_purpur-icon--md_8u1lq_16",
   "purpur-icon--lg": "_purpur-icon--lg_8u1lq_20",
   "purpur-icon--xl": "_purpur-icon--xl_8u1lq_24"
-}, Ie = We.bind(Be), H = "purpur-icon", Le = "md", Te = (e) => e.filter((n) => Object.keys(n).length >= 1).map((n) => `${n.name}="${n.value}"`).join(" "), Fe = ({ content: e = "", title: n } = {}) => {
+}, Ie = We.bind(Be), H = "purpur-icon", Le = "md", Te = (e) => e.filter((n) => Object.keys(n).length >= 1).map((n) => `${n.name}="${n.value}"`).join(" "), Ue = ({ content: e = "", title: n } = {}) => {
   const t = [
     { name: "xmlns", value: "http://www.w3.org/2000/svg" },
     { name: "fill", value: "currentColor" },
@@ -214,7 +213,7 @@ const We = /* @__PURE__ */ De(ze), Be = {
     n ? { name: "role", value: "img" } : { name: "aria-hidden", value: "true" }
   ], i = n ? `<title>${n}</title>` : "";
   return `<svg ${Te(t)}>${i}${e}</svg>`;
-}, Ue = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), M = ({
+}, Ve = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), M = ({
   ["data-testid"]: e,
   svg: n,
   allyTitle: t,
@@ -222,14 +221,13 @@ const We = /* @__PURE__ */ De(ze), Be = {
   size: a = Le,
   ...r
 }) => {
-  const o = Fe({
-    content: Ue(n.svg),
+  const o = Ue({
+    content: Ve(n.svg),
     title: t
   }), u = Ie(i, H, `${H}--${a}`);
   return /* @__PURE__ */ p(
     "span",
     {
-      "aria-label": t,
       className: u,
       "data-testid": e,
       dangerouslySetInnerHTML: { __html: o },
@@ -238,7 +236,7 @@ const We = /* @__PURE__ */ De(ze), Be = {
   );
 };
 M.displayName = "Icon";
-const Ve = {
+const Fe = {
   name: "checkmark-bold",
   svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M21.243 4.176a2 2 0 0 1 .324 2.81l-10.45 13.176a2.092 2.092 0 0 1-3.118.18l-5.413-5.413A2 2 0 1 1 5.414 12.1l3.9 3.9 9.118-11.5a2 2 0 0 1 2.81-.324Z" clip-rule="evenodd"/></svg>',
   keywords: ["checkmark-bold"],
@@ -393,20 +391,19 @@ const ir = /* @__PURE__ */ tr(or), A = {
 }, R = "purpur-label", ar = ({
   children: e,
   className: n,
-  htmlFor: t,
-  disabled: i,
-  negative: a = !1,
-  ...r
+  disabled: t,
+  negative: i = !1,
+  ...a
 }) => {
-  const o = ir([
+  const r = ir([
     n,
     A[R],
     {
-      [A[`${R}--disabled`]]: i,
-      [A[`${R}--negative`]]: a
+      [A[`${R}--disabled`]]: t,
+      [A[`${R}--negative`]]: i
     }
   ]);
-  return /* @__PURE__ */ p(rr, { className: o, htmlFor: t, ...r, children: e });
+  return /* @__PURE__ */ p(rr, { className: r, ...a, children: e });
 };
 function ur(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
@@ -451,7 +448,7 @@ function sr() {
   }(J)), J.exports;
 }
 var cr = sr();
-const lr = /* @__PURE__ */ ur(cr), S = {
+const lr = /* @__PURE__ */ ur(cr), $ = {
   "purpur-paragraph": "_purpur-paragraph_1rh57_1",
   "purpur-paragraph--disabled": "_purpur-paragraph--disabled_1rh57_7",
   "purpur-paragraph--hyphens": "_purpur-paragraph--hyphens_1rh57_10",
@@ -480,12 +477,12 @@ const lr = /* @__PURE__ */ ur(cr), S = {
 }) => {
   const c = lr([
     t,
-    S[N],
-    S[`${N}--${o}`],
+    $[N],
+    $[`${N}--${o}`],
     {
-      [S[`${N}--hyphens`]]: a,
-      [S[`${N}--disabled`]]: i,
-      [S[`${N}--negative`]]: r
+      [$[`${N}--hyphens`]]: a,
+      [$[`${N}--disabled`]]: i,
+      [$[`${N}--negative`]]: r
     }
   ]);
   return /* @__PURE__ */ p("p", { ...u, className: c, "data-testid": e, children: n });
@@ -522,14 +519,14 @@ function dr(e, n = []) {
     t = [...t, o];
     const l = (h) => {
       var b;
-      const { scope: d, children: m, ...g } = h, _ = ((b = d == null ? void 0 : d[e]) == null ? void 0 : b[c]) || u, w = s.useMemo(() => g, Object.values(g));
+      const { scope: d, children: m, ...v } = h, _ = ((b = d == null ? void 0 : d[e]) == null ? void 0 : b[c]) || u, w = s.useMemo(() => v, Object.values(v));
       return /* @__PURE__ */ p(_.Provider, { value: w, children: m });
     };
     l.displayName = r + "Provider";
     function f(h, d) {
       var _;
-      const m = ((_ = d == null ? void 0 : d[e]) == null ? void 0 : _[c]) || u, g = s.useContext(m);
-      if (g) return g;
+      const m = ((_ = d == null ? void 0 : d[e]) == null ? void 0 : _[c]) || u, v = s.useContext(m);
+      if (v) return v;
       if (o !== void 0) return o;
       throw new Error(`\`${h}\` must be used within \`${r}\``);
     }
@@ -607,13 +604,13 @@ function mr({
     a.current !== i && (r(i), a.current = i);
   }, [i, a, r]), t;
 }
-function gr(e) {
+function vr(e) {
   const n = s.useRef({ value: e, previous: e });
   return s.useMemo(() => (n.current.value !== e && (n.current.previous = n.current.value, n.current.value = e), n.current.previous), [e]);
 }
 var D = globalThis != null && globalThis.document ? s.useLayoutEffect : () => {
 };
-function vr(e) {
+function gr(e) {
   const [n, t] = s.useState(void 0);
   return D(() => {
     if (e) {
@@ -658,19 +655,19 @@ function br(e) {
     }
   });
   return s.useEffect(() => {
-    const l = k(i.current);
+    const l = P(i.current);
     r.current = u === "mounted" ? l : "none";
   }, [u]), D(() => {
     const l = i.current, f = a.current;
     if (f !== e) {
-      const d = r.current, m = k(l);
+      const d = r.current, m = P(l);
       e ? c("MOUNT") : m === "none" || (l == null ? void 0 : l.display) === "none" ? c("UNMOUNT") : c(f && d !== m ? "ANIMATION_OUT" : "UNMOUNT"), a.current = e;
     }
   }, [e, c]), D(() => {
     if (n) {
       let l;
       const f = n.ownerDocument.defaultView ?? window, h = (m) => {
-        const _ = k(i.current).includes(m.animationName);
+        const _ = P(i.current).includes(m.animationName);
         if (m.target === n && _ && (c("ANIMATION_END"), !a.current)) {
           const w = n.style.animationFillMode;
           n.style.animationFillMode = "forwards", l = f.setTimeout(() => {
@@ -678,7 +675,7 @@ function br(e) {
           });
         }
       }, d = (m) => {
-        m.target === n && (r.current = k(i.current));
+        m.target === n && (r.current = P(i.current));
       };
       return n.addEventListener("animationstart", d), n.addEventListener("animationcancel", h), n.addEventListener("animationend", h), () => {
         f.clearTimeout(l), n.removeEventListener("animationstart", d), n.removeEventListener("animationcancel", h), n.removeEventListener("animationend", h);
@@ -692,7 +689,7 @@ function br(e) {
     }, [])
   };
 }
-function k(e) {
+function P(e) {
   return (e == null ? void 0 : e.animationName) || "none";
 }
 function yr(e) {
@@ -712,7 +709,7 @@ pe.displayName = "Slot";
 var q = s.forwardRef((e, n) => {
   const { children: t, ...i } = e;
   if (s.isValidElement(t)) {
-    const a = Cr(t), r = $r(i, t.props);
+    const a = Sr(t), r = Cr(i, t.props);
     return t.type !== s.Fragment && (r.ref = n ? ue(n, a) : a), s.cloneElement(t, r);
   }
   return s.Children.count(t) > 1 ? s.Children.only(null) : null;
@@ -722,7 +719,7 @@ var xr = ({ children: e }) => /* @__PURE__ */ p(te, { children: e });
 function wr(e) {
   return s.isValidElement(e) && e.type === xr;
 }
-function $r(e, n) {
+function Cr(e, n) {
   const t = { ...n };
   for (const i in n) {
     const a = e[i], r = n[i];
@@ -732,12 +729,12 @@ function $r(e, n) {
   }
   return { ...e, ...t };
 }
-function Cr(e) {
+function Sr(e) {
   var i, a;
   let n = (i = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : i.get, t = n && "isReactWarning" in n && n.isReactWarning;
   return t ? e.ref : (n = (a = Object.getOwnPropertyDescriptor(e, "ref")) == null ? void 0 : a.get, t = n && "isReactWarning" in n && n.isReactWarning, t ? e.props.ref : e.props.ref || e.ref);
 }
-var Sr = [
+var $r = [
   "a",
   "button",
   "div",
@@ -754,7 +751,7 @@ var Sr = [
   "span",
   "svg",
   "ul"
-], de = Sr.reduce((e, n) => {
+], de = $r.reduce((e, n) => {
   const t = s.forwardRef((i, a) => {
     const { asChild: r, ...o } = i, u = r ? pe : n;
     return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ p(u, { ...o, ref: a });
@@ -773,18 +770,18 @@ var Sr = [
       onCheckedChange: l,
       form: f,
       ...h
-    } = e, [d, m] = s.useState(null), g = se(n, (v) => m(v)), _ = s.useRef(!1), w = d ? f || !!d.closest("form") : !0, [b = !1, O] = hr({
+    } = e, [d, m] = s.useState(null), v = se(n, (g) => m(g)), _ = s.useRef(!1), w = d ? f || !!d.closest("form") : !0, [b = !1, O] = hr({
       prop: a,
       defaultProp: r,
       onChange: l
-    }), ve = s.useRef(b);
+    }), ge = s.useRef(b);
     return s.useEffect(() => {
-      const v = d == null ? void 0 : d.form;
-      if (v) {
-        const C = () => O(ve.current);
-        return v.addEventListener("reset", C), () => v.removeEventListener("reset", C);
+      const g = d == null ? void 0 : d.form;
+      if (g) {
+        const S = () => O(ge.current);
+        return g.addEventListener("reset", S), () => g.removeEventListener("reset", S);
       }
-    }, [d, O]), /* @__PURE__ */ P(kr, { scope: t, state: b, disabled: u, children: [
+    }, [d, O]), /* @__PURE__ */ k(kr, { scope: t, state: b, disabled: u, children: [
       /* @__PURE__ */ p(
         de.button,
         {
@@ -792,17 +789,17 @@ var Sr = [
           role: "checkbox",
           "aria-checked": x(b) ? "mixed" : b,
           "aria-required": o,
-          "data-state": ge(b),
+          "data-state": ve(b),
           "data-disabled": u ? "" : void 0,
           disabled: u,
           value: c,
           ...h,
-          ref: g,
-          onKeyDown: ee(e.onKeyDown, (v) => {
-            v.key === "Enter" && v.preventDefault();
+          ref: v,
+          onKeyDown: ee(e.onKeyDown, (g) => {
+            g.key === "Enter" && g.preventDefault();
           }),
-          onClick: ee(e.onClick, (v) => {
-            O((C) => x(C) ? !0 : !C), w && (_.current = v.isPropagationStopped(), _.current || v.stopPropagation());
+          onClick: ee(e.onClick, (g) => {
+            O((S) => x(S) ? !0 : !S), w && (_.current = g.isPropagationStopped(), _.current || g.stopPropagation());
           })
         }
       ),
@@ -831,7 +828,7 @@ var he = "CheckboxIndicator", me = s.forwardRef(
     return /* @__PURE__ */ p(le, { present: i || x(r.state) || r.state === !0, children: /* @__PURE__ */ p(
       de.span,
       {
-        "data-state": ge(r.state),
+        "data-state": ve(r.state),
         "data-disabled": r.disabled ? "" : void 0,
         ...a,
         ref: n,
@@ -842,12 +839,12 @@ var he = "CheckboxIndicator", me = s.forwardRef(
 );
 me.displayName = he;
 var Or = (e) => {
-  const { control: n, checked: t, bubbles: i = !0, defaultChecked: a, ...r } = e, o = s.useRef(null), u = gr(t), c = vr(n);
+  const { control: n, checked: t, bubbles: i = !0, defaultChecked: a, ...r } = e, o = s.useRef(null), u = vr(t), c = gr(n);
   s.useEffect(() => {
     const f = o.current, h = window.HTMLInputElement.prototype, m = Object.getOwnPropertyDescriptor(h, "checked").set;
     if (u !== t && m) {
-      const g = new Event("click", { bubbles: i });
-      f.indeterminate = x(t), m.call(f, x(t) ? !1 : t), f.dispatchEvent(g);
+      const v = new Event("click", { bubbles: i });
+      f.indeterminate = x(t), m.call(f, x(t) ? !1 : t), f.dispatchEvent(v);
     }
   }, [u, t, i]);
   const l = s.useRef(x(t) ? !1 : t);
@@ -874,7 +871,7 @@ var Or = (e) => {
 function x(e) {
   return e === "indeterminate";
 }
-function ge(e) {
+function ve(e) {
   return x(e) ? "indeterminate" : e ? "checked" : "unchecked";
 }
 var Ar = fe, Rr = me;
@@ -930,7 +927,7 @@ const Dr = /* @__PURE__ */ Er(jr), qr = {
   "purpur-checkbox__label": "_purpur-checkbox__label_m4999_70",
   "purpur-checkbox__wrapper": "_purpur-checkbox__wrapper_m4999_73",
   "purpur-checkbox__container": "_purpur-checkbox__container_m4999_79"
-}, $ = Dr.bind(qr), Fr = ["indeterminate", !0, !1], y = "purpur-checkbox", zr = ({
+}, C = Dr.bind(qr), Ur = ["indeterminate", !0, !1], y = "purpur-checkbox", zr = ({
   ["data-testid"]: e,
   checked: n,
   className: t,
@@ -941,14 +938,14 @@ const Dr = /* @__PURE__ */ Er(jr), qr = {
   ...u
 }, c) => {
   const l = a && !n, f = i && !n;
-  return /* @__PURE__ */ P("div", { className: $([t, `${y}__wrapper`]), children: [
-    /* @__PURE__ */ P("div", { className: $([t, `${y}__container`]), children: [
+  return /* @__PURE__ */ k("div", { className: C([t, `${y}__wrapper`]), children: [
+    /* @__PURE__ */ k("div", { className: C([t, `${y}__container`]), children: [
       /* @__PURE__ */ p(
         Ar,
         {
           ...u,
           checked: n,
-          className: $([
+          className: C([
             y,
             {
               [`${y}--error`]: l,
@@ -958,7 +955,7 @@ const Dr = /* @__PURE__ */ Er(jr), qr = {
           "data-testid": e,
           onCheckedChange: o,
           ref: c,
-          children: /* @__PURE__ */ p("span", { className: $(`${y}__box`), children: /* @__PURE__ */ p(Rr, { className: $(`${y}__indicator`), children: n === "indeterminate" ? /* @__PURE__ */ p(
+          children: /* @__PURE__ */ p("span", { className: C(`${y}__box`), children: /* @__PURE__ */ p(Rr, { className: C(`${y}__indicator`), children: n === "indeterminate" ? /* @__PURE__ */ p(
             M,
             {
               "data-testid": e && `${e}-checked-icon`,
@@ -970,7 +967,7 @@ const Dr = /* @__PURE__ */ Er(jr), qr = {
             {
               "data-testid": e && `${e}-indeterminate-icon`,
               size: "xs",
-              svg: Ve
+              svg: Fe
             }
           ) }) })
         }
@@ -981,8 +978,11 @@ const Dr = /* @__PURE__ */ Er(jr), qr = {
           htmlFor: u.id,
           "data-testid": e && `${e}-label`,
           disabled: u.disabled,
-          className: $(`${y}__label`),
-          children: /* @__PURE__ */ p(ae, { variant: "paragraph-100", disabled: u.disabled, children: `${u.required ? "* " : ""}${r}` })
+          className: C(`${y}__label`),
+          children: /* @__PURE__ */ k(ae, { variant: "paragraph-100", disabled: u.disabled, children: [
+            u.required && /* @__PURE__ */ p("span", { "aria-hidden": !0, children: "* " }),
+            r
+          ] })
         }
       )
     ] }),
@@ -992,6 +992,6 @@ const Dr = /* @__PURE__ */ Er(jr), qr = {
 Wr.displayName = "Checkbox";
 export {
   Wr as Checkbox,
-  Fr as checkedState
+  Ur as checkedState
 };
 //# sourceMappingURL=checkbox.es.js.map