@beaubrain/web-design-system 0.1.9 → 0.1.10

package/dist/index.js

@@ -17,28 +17,28 @@ function Wt() {
     (function() {
       var t = {}.hasOwnProperty;
       function o() {
-        for (var r = "", a = 0; a < arguments.length; a++) {
+        for (var s = "", a = 0; a < arguments.length; a++) {
           var c = arguments[a];
-          c && (r = n(r, s(c)));
+          c && (s = n(s, r(c)));
         }
-        return r;
+        return s;
       }
-      function s(r) {
-        if (typeof r == "string" || typeof r == "number")
-          return r;
-        if (typeof r != "object")
+      function r(s) {
+        if (typeof s == "string" || typeof s == "number")
+          return s;
+        if (typeof s != "object")
           return "";
-        if (Array.isArray(r))
-          return o.apply(null, r);
-        if (r.toString !== Object.prototype.toString && !r.toString.toString().includes("[native code]"))
-          return r.toString();
+        if (Array.isArray(s))
+          return o.apply(null, s);
+        if (s.toString !== Object.prototype.toString && !s.toString.toString().includes("[native code]"))
+          return s.toString();
         var a = "";
-        for (var c in r)
-          t.call(r, c) && r[c] && (a = n(a, c));
+        for (var c in s)
+          t.call(s, c) && s[c] && (a = n(a, c));
         return a;
       }
-      function n(r, a) {
-        return a ? r ? r + " " + a : r + a : r;
+      function n(s, a) {
+        return a ? s ? s + " " + a : s + a : s;
       }
       e.exports ? (o.default = o, e.exports = o) : window.classNames = o;
     })();
@@ -47,12 +47,12 @@ function Wt() {
 var Xt = Wt();
 const x = /* @__PURE__ */ Kt(Xt), Yt = (e, t) => {
   const o = { ...t };
-  for (const s in t) {
-    const n = e[s], r = t[s];
-    /^on[A-Z]/.test(s) ? n && r ? o[s] = (...c) => {
-      const l = r(...c);
+  for (const r in t) {
+    const n = e[r], s = t[r];
+    /^on[A-Z]/.test(r) ? n && s ? o[r] = (...c) => {
+      const l = s(...c);
       return n(...c), l;
-    } : n && (o[s] = n) : s === "style" ? o[s] = { ...n, ...r } : s === "className" && (o[s] = [n, r].filter(Boolean).join(" "));
+    } : n && (o[r] = n) : r === "style" ? o[r] = { ...n, ...s } : r === "className" && (o[r] = [n, s].filter(Boolean).join(" "));
   }
   return { ...e, ...o };
 }, Ae = (e, t) => {
@@ -61,14 +61,14 @@ const x = /* @__PURE__ */ Kt(Xt), Yt = (e, t) => {
   e != null && (e.current = t);
 }, fe = (...e) => (t) => {
   let o = !1;
-  const s = e.map((n) => {
-    const r = Ae(n, t);
-    return !o && typeof r == "function" && (o = !0), { ref: n, cleanup: r };
+  const r = e.map((n) => {
+    const s = Ae(n, t);
+    return !o && typeof s == "function" && (o = !0), { ref: n, cleanup: s };
   });
   if (o)
     return () => {
-      for (const { ref: n, cleanup: r } of s)
-        typeof r == "function" ? r() : Ae(n, null);
+      for (const { ref: n, cleanup: s } of r)
+        typeof s == "function" ? s() : Ae(n, null);
     };
 }, De = (e) => {
   const t = Object.getOwnPropertyDescriptor(e.props, "ref")?.get;
@@ -83,7 +83,7 @@ const Be = (...e) => {
     o && (t = { ...t, ...o });
   return Object.keys(t).length ? t : void 0;
 }, Zt = ({ className: e, customProperties: t, ...o }) => {
-  const s = Ge({
+  const r = Ge({
     allowCustomValues: !0,
     className: e,
     ...o
@@ -91,19 +91,19 @@ const Be = (...e) => {
     customProperties: t,
     ...o
   });
-  return [s, n];
+  return [r, n];
 }, Jt = (e, t, o) => {
-  const s = e ? "-" : "", n = o(t), r = n?.startsWith("-"), a = r ? "-" : "", c = r ? n?.substring(1) : n;
-  return `${a}${e}${s}${c}`;
+  const r = e ? "-" : "", n = o(t), s = n?.startsWith("-"), a = s ? "-" : "", c = s ? n?.substring(1) : n;
+  return `${a}${e}${r}${c}`;
 }, Ge = ({
   allowCustomValues: e = !1,
   className: t,
   value: o,
-  propValues: s,
-  parseValue: n = (r) => r
+  propValues: r,
+  parseValue: n = (s) => s
 }) => {
   if (o) {
-    if (typeof o == "string" && s.includes(o))
+    if (typeof o == "string" && r.includes(o))
       return Jt(t, o, n);
     if (e)
       return t;
@@ -112,23 +112,23 @@ const Be = (...e) => {
   customProperties: e,
   value: t,
   propValues: o,
-  parseValue: s = (n) => n
+  parseValue: r = (n) => n
 }) => {
   let n = {};
   if (!(!t || typeof t == "string" && o.includes(t))) {
-    typeof t == "string" && (n = Object.fromEntries(e.map((r) => [r, t])));
-    for (const r in n) {
-      const a = n[r];
-      a !== void 0 && (n[r] = s(a));
+    typeof t == "string" && (n = Object.fromEntries(e.map((s) => [s, t])));
+    for (const s in n) {
+      const a = n[s];
+      a !== void 0 && (n[s] = r(a));
     }
     return n;
   }
 }, eo = (...e) => Object.assign({}, ...e), I = (e, ...t) => {
-  let o, s;
-  const n = { ...e }, r = eo(...t);
-  for (const a in r) {
+  let o, r;
+  const n = { ...e }, s = eo(...t);
+  for (const a in s) {
     let c = n[a];
-    const l = r[a];
+    const l = s[a];
     if (l.default !== void 0 && c === void 0 && (c = l.default), l.type === "enum" && ([l.default, ...l.values].includes(c) || (c = l.default)), n[a] = c, "className" in l && l.className) {
       if (delete n[a], !c)
         continue;
@@ -149,56 +149,56 @@ const Be = (...e) => {
           propValues: d,
           value: c
         });
-        s = Be(s, f), o = x(o, p);
+        r = Be(r, f), o = x(o, p);
         continue;
       }
     }
   }
-  return n.className = x(o, e.className), n.style = Be(s, e.style), n;
+  return n.className = x(o, e.className), n.style = Be(r, e.style), n;
 }, to = (e) => {
   if (!P.isValidElement(e))
     throw new Error(`Expected a single valid React element, but got: ${e}`);
   return e;
 }, T = (e, t = []) => {
   let o = [];
-  function s(r, a) {
+  function r(s, a) {
     const c = i.createContext(a), l = o.length;
     o = [...o, a];
     const d = (f) => {
       const { scope: b, children: m, ...v } = f, g = b?.[e]?.[l] || c, h = i.useMemo(() => v, Object.values(v));
       return /* @__PURE__ */ u(g.Provider, { value: h, children: m });
     };
-    d.displayName = `${r}Provider`;
+    d.displayName = `${s}Provider`;
     function p(f, b) {
       const m = b?.[e]?.[l] || c, v = i.useContext(m);
       if (v) return v;
       if (a !== void 0) return a;
-      throw new Error(`\`${f}\` must be used within \`${r}\``);
+      throw new Error(`\`${f}\` must be used within \`${s}\``);
     }
     return [d, p];
   }
   const n = () => {
-    const r = o.map((a) => i.createContext(a));
+    const s = o.map((a) => i.createContext(a));
     return function(c) {
-      const l = c?.[e] || r;
+      const l = c?.[e] || s;
       return i.useMemo(
         () => ({ [`__scope${e}`]: { ...c, [e]: l } }),
         [c, l]
       );
     };
   };
-  return n.scopeName = e, [s, oo(n, ...t)];
+  return n.scopeName = e, [r, oo(n, ...t)];
 }, oo = (...e) => {
   const t = e[0];
   if (e.length === 1) return t;
   const o = () => {
-    const s = e.map((n) => ({
+    const r = e.map((n) => ({
       useScope: n(),
       scopeName: n.scopeName
     }));
-    return function(r) {
-      const a = s.reduce((c, { useScope: l, scopeName: d }) => {
-        const f = l(r)[`__scope${d}`];
+    return function(s) {
+      const a = r.reduce((c, { useScope: l, scopeName: d }) => {
+        const f = l(s)[`__scope${d}`];
         return { ...c, ...f };
       }, {});
       return i.useMemo(() => ({ [`__scope${t.scopeName}`]: a }), [a]);
@@ -212,7 +212,7 @@ let so = 0;
 function Me(e) {
   const [t, o] = i.useState(no());
   return V(() => {
-    o((s) => s ?? String(so++));
+    o((r) => r ?? String(so++));
   }, [e]), t ? `bd-${t}` : "";
 }
 function ro(e) {
@@ -226,9 +226,9 @@ function A({
   defaultProp: t,
   onChange: o = () => {
   },
-  caller: s
+  caller: r
 }) {
-  const [n, r, a] = co({
+  const [n, s, a] = co({
     defaultProp: t,
     onChange: o
   }), c = e !== void 0, l = c ? e : n;
@@ -237,9 +237,9 @@ function A({
     i.useEffect(() => {
       const f = p.current;
       f !== c && console.warn(
-        `${s} is changing from ${f ? "controlled" : "uncontrolled"} to ${c ? "controlled" : "uncontrolled"}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled value for the lifetime of the component.`
+        `${r} is changing from ${f ? "controlled" : "uncontrolled"} to ${c ? "controlled" : "uncontrolled"}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled value for the lifetime of the component.`
       ), p.current = c;
-    }, [c, s]);
+    }, [c, r]);
   }
   const d = i.useCallback(
     (p) => {
@@ -247,9 +247,9 @@ function A({
         const f = ao(p) ? p(e) : p;
         f !== e && a.current?.(f);
       } else
-        r(p);
+        s(p);
     },
-    [c, e, r, a]
+    [c, e, s, a]
   );
   return [l, d];
 }
@@ -257,12 +257,12 @@ function co({
   defaultProp: e,
   onChange: t
 }) {
-  const [o, s] = i.useState(e), n = i.useRef(o), r = i.useRef(t);
+  const [o, r] = i.useState(e), n = i.useRef(o), s = i.useRef(t);
   return V(() => {
-    r.current = t;
+    s.current = t;
   }, [t]), i.useEffect(() => {
-    n.current !== o && (r.current?.(o), n.current = o);
-  }, [o, n]), [o, s, r];
+    n.current !== o && (s.current?.(o), n.current = o);
+  }, [o, n]), [o, r, s];
 }
 function ao(e) {
   return typeof e == "function";
@@ -276,29 +276,29 @@ function he(e) {
   return V(() => {
     if (e) {
       o({ width: e.offsetWidth, height: e.offsetHeight });
-      const s = new ResizeObserver((n) => {
+      const r = new ResizeObserver((n) => {
         if (!Array.isArray(n) || !n.length)
           return;
-        const r = n[0];
+        const s = n[0];
         let a, c;
-        if ("borderBoxSize" in r) {
-          const l = r.borderBoxSize, d = Array.isArray(l) ? l[0] : l;
+        if ("borderBoxSize" in s) {
+          const l = s.borderBoxSize, d = Array.isArray(l) ? l[0] : l;
           a = d.inlineSize, c = d.blockSize;
         } else
           a = e.offsetWidth, c = e.offsetHeight;
         o({ width: a, height: c });
       });
-      return s.observe(e, { box: "border-box" }), () => s.unobserve(e);
+      return r.observe(e, { box: "border-box" }), () => r.unobserve(e);
     } else
       o(void 0);
   }, [e]), t;
 }
 function io(e, t) {
-  const [o, s] = i.useReducer((n, r) => t[n][r] ?? n, e);
-  return [o, s];
+  const [o, r] = i.useReducer((n, s) => t[n][s] ?? n, e);
+  return [o, r];
 }
-function lo(e, t, o, s = 0) {
-  const [n, r] = P.useState({
+function lo(e, t, o, r = 0) {
+  const [n, s] = P.useState({
     position: "absolute",
     top: 0,
     left: 0,
@@ -307,7 +307,7 @@ function lo(e, t, o, s = 0) {
   }), [a, c] = P.useState(!1);
   return V(() => {
     if (!o) {
-      c(!1), r({
+      c(!1), s({
         position: "absolute",
         top: 0,
         left: 0,
@@ -325,8 +325,8 @@ function lo(e, t, o, s = 0) {
         return;
       }
       const b = window.innerHeight, m = window.innerWidth;
-      let v = window.scrollY + p.bottom + s, g = window.scrollX + p.left;
-      p.bottom + f.height + s > b && (v = window.scrollY + p.top - f.height - s), p.left + f.width > m && (g = window.scrollX + m - f.width - 16), r({
+      let v = window.scrollY + p.bottom + r, g = window.scrollX + p.left;
+      p.bottom + f.height + r > b && (v = window.scrollY + p.top - f.height - r), p.left + f.width > m && (g = window.scrollX + m - f.width - 16), s({
         position: "absolute",
         top: `${v}px`,
         left: `${g}px`,
@@ -339,13 +339,13 @@ function lo(e, t, o, s = 0) {
     return l = requestAnimationFrame(d), window.addEventListener("scroll", d, { passive: !0 }), window.addEventListener("resize", d), () => {
       cancelAnimationFrame(l), window.removeEventListener("scroll", d), window.removeEventListener("resize", d);
     };
-  }, [o, e, t, s]), { styles: n, isPositioned: a };
+  }, [o, e, t, r]), { styles: n, isPositioned: a };
 }
 function uo(e, t) {
   i.useEffect(() => {
-    const o = (s) => {
+    const o = (r) => {
       const n = e?.current;
-      !n || n.contains(s.target) || t(s);
+      !n || n.contains(r.target) || t(r);
     };
     return document.addEventListener("mousedown", o), document.addEventListener("touchstart", o), () => {
       document.removeEventListener("mousedown", o), document.removeEventListener("touchstart", o);
@@ -353,11 +353,11 @@ function uo(e, t) {
   }, [e, t]);
 }
 const po = (e) => {
-  const t = P.forwardRef((o, s) => {
-    const { children: n, ...r } = o;
+  const t = P.forwardRef((o, r) => {
+    const { children: n, ...s } = o;
     if (P.isValidElement(n)) {
-      const a = De(n), c = Yt(r, n.props);
-      return c.ref = s ? fe(s, a) : a, P.cloneElement(n, c);
+      const a = De(n), c = Yt(s, n.props);
+      return c.ref = r ? fe(r, a) : a, P.cloneElement(n, c);
     }
     throw new Error(
       `[${e}.OutletClone] Invalid children passed, expected a single valid React element.`
@@ -365,8 +365,8 @@ const po = (e) => {
   });
   return t.displayName = `${e}.OutletClone`, t;
 }, X = (e) => {
-  const t = po(e), o = P.forwardRef((s, n) => {
-    const { children: r, ...a } = s, c = P.Children.toArray(r), l = c.find(mo);
+  const t = po(e), o = P.forwardRef((r, n) => {
+    const { children: s, ...a } = r, c = P.Children.toArray(s), l = c.find(mo);
     if (l) {
       const d = l.props.children, p = c.map((f) => {
         if (f === l) {
@@ -382,18 +382,18 @@ const po = (e) => {
         throw new Error(`[${e}.Outlet] Invalid children passed.`);
       return /* @__PURE__ */ u(t, { ...a, ref: n, children: P.cloneElement(d, void 0, p) });
     }
-    return /* @__PURE__ */ u(t, { ...a, ref: n, children: r });
+    return /* @__PURE__ */ u(t, { ...a, ref: n, children: s });
   });
   return o.displayName = `${e}.Outlet`, o;
 }, J = X("Outlet"), fo = Symbol("bds.outlettable"), mo = (e) => P.isValidElement(e) && typeof e.type == "function" && "__bdsId" in e.type && e.type.__bdsId === fo, ho = ["a", "button", "div", "input", "label", "span"], S = ho.reduce((e, t) => {
-  const o = X(`Base.${t}`), s = i.forwardRef((n, r) => {
+  const o = X(`Base.${t}`), r = i.forwardRef((n, s) => {
     const { asChild: a, ...c } = n;
-    return /* @__PURE__ */ u(a ? o : t, { ...c, ref: r });
+    return /* @__PURE__ */ u(a ? o : t, { ...c, ref: s });
   });
-  return s.displayName = `Base.${t}`, { ...e, [t]: s };
+  return r.displayName = `Base.${t}`, { ...e, [t]: r };
 }, {});
 function bo(e) {
-  const t = `${e}CollectionProvider`, [o, s] = T(t), [n, r] = o(
+  const t = `${e}CollectionProvider`, [o, r] = T(t), [n, s] = o(
     t,
     { collectionRef: { current: null }, itemMap: /* @__PURE__ */ new Map() }
   ), a = (g) => {
@@ -403,20 +403,20 @@ function bo(e) {
   a.displayName = t;
   const c = `${e}CollectionOutlet`, l = X(c), d = i.forwardRef(
     (g, h) => {
-      const { scope: y, children: C } = g, R = r(c, y), N = k(h, R.collectionRef);
+      const { scope: y, children: C } = g, R = s(c, y), N = k(h, R.collectionRef);
       return /* @__PURE__ */ u(l, { ref: N, children: C });
     }
   );
   d.displayName = c;
   const p = `${e}CollectionItemOutlet`, f = "data-bd-collection-item", b = X(p), m = i.forwardRef(
     (g, h) => {
-      const { scope: y, children: C, ...R } = g, N = i.useRef(null), B = k(h, N), w = r(p, y);
+      const { scope: y, children: C, ...R } = g, N = i.useRef(null), B = k(h, N), w = s(p, y);
       return i.useEffect(() => (w.itemMap.set(N, { ref: N, ...R }), () => void w.itemMap.delete(N))), /* @__PURE__ */ u(b, { [f]: "", ref: B, children: C });
     }
   );
   m.displayName = p;
   function v(g) {
-    const h = r(`${e}CollectionConsumer`, g);
+    const h = s(`${e}CollectionConsumer`, g);
     return i.useCallback(() => {
       const C = h.collectionRef.current;
       if (!C) return [];
@@ -429,16 +429,16 @@ function bo(e) {
   return [
     { Provider: a, Outlet: d, ItemOutlet: m },
     v,
-    s
+    r
   ];
 }
 function Fe(e) {
-  const { remain: t, children: o } = e, s = vo(t), n = typeof o == "function" ? o({ remain: s.isRemain }) : i.Children.only(o), r = k(s.ref, De(n));
-  return typeof o == "function" || s.isRemain ? i.cloneElement(n, { ref: r }) : null;
+  const { remain: t, children: o } = e, r = vo(t), n = typeof o == "function" ? o({ remain: r.isRemain }) : i.Children.only(o), s = k(r.ref, De(n));
+  return typeof o == "function" || r.isRemain ? i.cloneElement(n, { ref: s }) : null;
 }
 const go = ["mounted", "unmountSuspended"];
 function vo(e) {
-  const [t, o] = i.useState(), s = i.useRef(null), n = i.useRef(e), r = i.useRef("none"), a = e ? "mounted" : "unmounted", [c, l] = io(a, {
+  const [t, o] = i.useState(), r = i.useRef(null), n = i.useRef(e), s = i.useRef("none"), a = e ? "mounted" : "unmounted", [c, l] = io(a, {
     mounted: {
       UNMOUNT: "unmounted",
       ANIMATION_OUT: "unmountSuspended"
@@ -452,19 +452,19 @@ function vo(e) {
     }
   });
   return i.useEffect(() => {
-    const d = q(s.current);
-    r.current = c === "mounted" ? d : "none";
+    const d = q(r.current);
+    s.current = c === "mounted" ? d : "none";
   }, [c]), V(() => {
-    const d = s.current, p = n.current;
+    const d = r.current, p = n.current;
     if (p !== e) {
-      const b = r.current, m = q(d);
+      const b = s.current, m = q(d);
       e ? l("MOUNT") : m === "none" || d?.display === "none" ? l("UNMOUNT") : l(p && b !== m ? "ANIMATION_OUT" : "UNMOUNT"), n.current = e;
     }
   }, [e, l]), V(() => {
     if (t) {
       let d;
       const p = t.ownerDocument.defaultView ?? window, f = (m) => {
-        const g = q(s.current).includes(CSS.escape(m.animationName));
+        const g = q(r.current).includes(CSS.escape(m.animationName));
         if (m.target === t && g && (l("ANIMATION_END"), !n.current)) {
           const h = t.style.animationFillMode;
           t.style.animationFillMode = "forwards", d = p.setTimeout(() => {
@@ -472,7 +472,7 @@ function vo(e) {
           });
         }
       }, b = (m) => {
-        m.target === t && (r.current = q(s.current));
+        m.target === t && (s.current = q(r.current));
       };
       return t.addEventListener("animationstart", b), t.addEventListener("animationcancel", f), t.addEventListener("animationend", f), () => {
         p.clearTimeout(d), t.removeEventListener("animationstart", b), t.removeEventListener("animationcancel", f), t.removeEventListener("animationend", f);
@@ -482,7 +482,7 @@ function vo(e) {
   }, [t, l]), {
     isRemain: go.includes(c),
     ref: i.useCallback((d) => {
-      s.current = d ? getComputedStyle(d) : null, o(d);
+      r.current = d ? getComputedStyle(d) : null, o(d);
     }, [])
   };
 }
@@ -512,8 +512,8 @@ const yo = Object.freeze({
 );
 $e.displayName = "VisuallyHidden";
 const Co = i.forwardRef((e, t) => {
-  const { children: o, className: s, ...n } = e;
-  return /* @__PURE__ */ u(J, { ...n, ref: t, className: x("bd-reset", s), children: to(o) });
+  const { children: o, className: r, ...n } = e;
+  return /* @__PURE__ */ u(J, { ...n, ref: t, className: x("bd-reset", r), children: to(o) });
 });
 Co.displayName = "Reset";
 const E = (e, t, { checkForDefaultPrevented: o = !0 } = {}) => function(n) {
@@ -527,16 +527,16 @@ const E = (e, t, { checkForDefaultPrevented: o = !0 } = {}) => function(n) {
 ), Po = i.forwardRef((e, t) => {
   const {
     __scopeRovingFocusGroup: o,
-    orientation: s,
+    orientation: r,
     loop: n = !1,
-    currentTabStopId: r,
+    currentTabStopId: s,
     defaultCurrentTabStopId: a,
     onCurrentTabStopIdChange: c,
     onEntryFocus: l,
     preventScrollOnEntryFocus: d = !1,
     ...p
   } = e, f = i.useRef(null), b = k(t, f), [m, v] = A({
-    prop: r,
+    prop: s,
     defaultProp: a ?? null,
     onChange: c,
     caller: Q
@@ -549,7 +549,7 @@ const E = (e, t, { checkForDefaultPrevented: o = !0 } = {}) => function(n) {
     xo,
     {
       scope: o,
-      orientation: s,
+      orientation: r,
       loop: n,
       currentTabStopId: m,
       onItemFocus: i.useCallback(
@@ -569,7 +569,7 @@ const E = (e, t, { checkForDefaultPrevented: o = !0 } = {}) => function(n) {
         S.div,
         {
           tabIndex: g || N === 0 ? -1 : 0,
-          "data-orientation": s,
+          "data-orientation": r,
           ...p,
           ref: b,
           style: { outline: "none", ...e.style },
@@ -598,21 +598,21 @@ const E = (e, t, { checkForDefaultPrevented: o = !0 } = {}) => function(n) {
   (e, t) => {
     const {
       __scopeRovingFocusGroup: o,
-      focusable: s = !0,
+      focusable: r = !0,
       active: n = !1,
-      tabStopId: r,
+      tabStopId: s,
       children: a,
       ...c
-    } = e, l = Me(), d = r || l, p = So(ko, o), f = p.currentTabStopId === d, b = Ve(o), { onFocusableItemAdd: m, onFocusableItemRemove: v, currentTabStopId: g } = p;
+    } = e, l = Me(), d = s || l, p = So(ko, o), f = p.currentTabStopId === d, b = Ve(o), { onFocusableItemAdd: m, onFocusableItemRemove: v, currentTabStopId: g } = p;
     return i.useEffect(() => {
-      if (s)
+      if (r)
         return m(), () => v();
-    }, [s, m, v]), /* @__PURE__ */ u(
+    }, [r, m, v]), /* @__PURE__ */ u(
       ue.ItemOutlet,
       {
         scope: o,
         id: d,
-        focusable: s,
+        focusable: r,
         active: n,
         children: /* @__PURE__ */ u(
           S.span,
@@ -622,7 +622,7 @@ const E = (e, t, { checkForDefaultPrevented: o = !0 } = {}) => function(n) {
             ...c,
             ref: t,
             onMouseDown: E(e.onMouseDown, (h) => {
-              s ? p.onItemFocus(d) : h.preventDefault();
+              r ? p.onItemFocus(d) : h.preventDefault();
             }),
             onFocus: E(e.onFocus, () => p.onItemFocus(d)),
             onKeyDown: E(e.onKeyDown, (h) => {
@@ -667,11 +667,11 @@ function Eo(e, t) {
 }
 function Ue(e, t = !1) {
   const o = document.activeElement;
-  for (const s of e)
-    if (s === o || (s.focus({ preventScroll: t }), document.activeElement !== o)) return;
+  for (const r of e)
+    if (r === o || (r.focus({ preventScroll: t }), document.activeElement !== o)) return;
 }
 function _o(e, t) {
-  return e.map((o, s) => e[(t + s) % e.length]);
+  return e.map((o, r) => e[(t + r) % e.length]);
 }
 const L = {
   asChild: {
@@ -1012,12 +1012,12 @@ const L = {
 }, ge = i.forwardRef((e, t) => {
   const {
     children: o,
-    className: s,
+    className: r,
     asChild: n,
-    as: r = "span",
+    as: s = "span",
     ...a
   } = I(e, Qo);
-  return /* @__PURE__ */ u(J, { ...a, ref: t, className: x("bd-Text", s), children: n ? o : /* @__PURE__ */ u(r, { children: o }) });
+  return /* @__PURE__ */ u(J, { ...a, ref: t, className: x("bd-Text", r), children: n ? o : /* @__PURE__ */ u(s, { children: o }) });
 });
 ge.displayName = "Text";
 const en = (e) => e === "between" ? "space-between" : e, tn = ["div", "span"], on = ["none", "inline-flex", "flex"], nn = ["row", "column", "row-reverse", "column-reverse"], sn = ["start", "center", "end", "baseline", "stretch"], rn = ["start", "center", "end", "between"], cn = ["nowrap", "wrap", "wrap-reverse"], ve = {
@@ -1053,8 +1053,8 @@ const en = (e) => e === "between" ? "space-between" : e, tn = ["div", "span"], o
   ...Vo,
   ...D
 }, Y = i.forwardRef((e, t) => {
-  const { className: o, asChild: s, as: n = "div", ...r } = I(e, ve);
-  return /* @__PURE__ */ u(s ? J : n, { ...r, ref: t, className: x("bd-Flex", o) });
+  const { className: o, asChild: r, as: n = "div", ...s } = I(e, ve);
+  return /* @__PURE__ */ u(r ? J : n, { ...s, ref: t, className: x("bd-Flex", o) });
 });
 Y.displayName = "Flex";
 const an = ["1", "2", "3"], ln = {
@@ -1063,15 +1063,15 @@ const an = ["1", "2", "3"], ln = {
   color: { type: "enum", className: "bd-color", values: ee },
   ...D
 }, Ke = i.forwardRef((e, t) => {
-  const { className: o, children: s, loading: n, ...r } = I(
+  const { className: o, children: r, loading: n, ...s } = I(
     e,
     ln,
     Ao
   );
-  if (!n) return s;
-  const a = /* @__PURE__ */ u("span", { ...r, ref: t, className: x("bd-Spinner", o) });
-  return s === void 0 ? a : /* @__PURE__ */ _(Y, { asChild: !0, position: "relative", align: "center", justify: "center", children: [
-    /* @__PURE__ */ u("span", { children: /* @__PURE__ */ u("span", { "aria-hidden": !0, style: { display: "contents", visibility: "hidden" }, inert: void 0, children: s }) }),
+  if (!n) return r;
+  const a = /* @__PURE__ */ u("span", { ...s, ref: t, className: x("bd-Spinner", o) });
+  return r === void 0 ? a : /* @__PURE__ */ _(Y, { asChild: !0, position: "relative", align: "center", justify: "center", children: [
+    /* @__PURE__ */ u("span", { children: /* @__PURE__ */ u("span", { "aria-hidden": !0, style: { display: "contents", visibility: "hidden" }, inert: void 0, children: r }) }),
     /* @__PURE__ */ u(Y, { asChild: !0, align: "center", justify: "center", position: "absolute", inset: "0", children: /* @__PURE__ */ u("span", { children: a }) })
   ] });
 });
@@ -1125,9 +1125,9 @@ const un = ["1", "2", "3", "4", "5"], dn = [
       return;
   }
 }, mn = i.forwardRef((e, t) => {
-  const { variant: o = le.variant.default, size: s = le.size.default } = e, {
+  const { variant: o = le.variant.default, size: r = le.size.default } = e, {
     className: n,
-    children: r,
+    children: s,
     asChild: a,
     disabled: c = e.loading,
     ...l
@@ -1142,22 +1142,22 @@ const un = ["1", "2", "3", "4", "5"], dn = [
       ref: t,
       className: x("bd-Button", n),
       children: e.loading ? /* @__PURE__ */ _(Oe, { children: [
-        /* @__PURE__ */ u("span", { style: { display: "contents", visibility: "hidden" }, "aria-hidden": !0, children: r }),
-        /* @__PURE__ */ u($e, { children: r }),
+        /* @__PURE__ */ u("span", { style: { display: "contents", visibility: "hidden" }, "aria-hidden": !0, children: s }),
+        /* @__PURE__ */ u($e, { children: s }),
         /* @__PURE__ */ u(Y, { asChild: !0, align: "center", justify: "center", position: "absolute", inset: "0", children: /* @__PURE__ */ u("span", { children: /* @__PURE__ */ u(
           Ke,
           {
-            size: pn(s),
+            size: pn(r),
             color: fn(o)
           }
         ) }) })
-      ] }) : r
+      ] }) : s
     }
   );
 });
 mn.displayName = "Button";
 const We = i.forwardRef((e, t) => {
-  const { color: o = "currentColor", ...s } = e;
+  const { color: o = "currentColor", ...r } = e;
   return /* @__PURE__ */ u(
     "svg",
     {
@@ -1166,7 +1166,7 @@ const We = i.forwardRef((e, t) => {
       height: "7",
       viewBox: "0 0 10 7",
       fill: "none",
-      ...s,
+      ...r,
       ref: t,
       children: /* @__PURE__ */ u(
         "path",
@@ -1181,7 +1181,7 @@ const We = i.forwardRef((e, t) => {
     }
   );
 }), hn = i.forwardRef((e, t) => {
-  const { color: o = "currentColor", ...s } = e;
+  const { color: o = "currentColor", ...r } = e;
   return /* @__PURE__ */ u(
     "svg",
     {
@@ -1190,7 +1190,7 @@ const We = i.forwardRef((e, t) => {
       height: "9",
       viewBox: "0 0 9 9",
       fill: o,
-      ...s,
+      ...r,
       ref: t,
       children: /* @__PURE__ */ u(
         "path",
@@ -1210,9 +1210,9 @@ function Cn(e) {
   const {
     __scopeCheckbox: t,
     checked: o,
-    defaultChecked: s,
+    defaultChecked: r,
     required: n,
-    name: r,
+    name: s,
     form: a,
     disabled: c,
     value: l = "on",
@@ -1222,7 +1222,7 @@ function Cn(e) {
     __internal: f
   } = e, [b, m] = A({
     prop: o,
-    defaultProp: s ?? !1,
+    defaultProp: r ?? !1,
     onChange: p,
     caller: ye
   }), [v, g] = i.useState(null), [h, y] = i.useState(null), C = i.useRef(!1), R = v ? !!a || !!v.closest("form") : !0, N = {
@@ -1231,12 +1231,12 @@ function Cn(e) {
     setChecked: m,
     control: v,
     setControl: g,
-    name: r,
+    name: s,
     form: a,
     value: l,
     hasConsumerStoppedPropagationRef: C,
     required: n,
-    defaultChecked: O(s) ? !1 : s,
+    defaultChecked: O(r) ? !1 : r,
     isFormControl: R,
     bubbleInput: h,
     setBubbleInput: y
@@ -1255,10 +1255,10 @@ const Ze = "CheckboxTrigger", Je = i.forwardRef(
     __scopeCheckbox: e,
     onKeyDown: t,
     onClick: o,
-    ...s
+    ...r
   }, n) => {
     const {
-      control: r,
+      control: s,
       value: a,
       disabled: c,
       checked: l,
@@ -1270,12 +1270,12 @@ const Ze = "CheckboxTrigger", Je = i.forwardRef(
       bubbleInput: v
     } = Ce(Ze, e), g = k(n, p), h = i.useRef(l);
     return i.useEffect(() => {
-      const y = r?.form;
+      const y = s?.form;
       if (y) {
         const C = () => f(h.current);
         return y.addEventListener("reset", C), () => y.removeEventListener("reset", C);
       }
-    }, [r, f]), /* @__PURE__ */ u(
+    }, [s, f]), /* @__PURE__ */ u(
       S.button,
       {
         type: "button",
@@ -1286,7 +1286,7 @@ const Ze = "CheckboxTrigger", Je = i.forwardRef(
         "data-disabled": c ? "" : void 0,
         disabled: c,
         value: a,
-        ...s,
+        ...r,
         ref: g,
         onKeyDown: E(t, (y) => {
           y.key === "Enter" && y.preventDefault();
@@ -1303,9 +1303,9 @@ const Qe = i.forwardRef(
   (e, t) => {
     const {
       __scopeCheckbox: o,
-      name: s,
+      name: r,
       checked: n,
-      defaultChecked: r,
+      defaultChecked: s,
       required: a,
       disabled: c,
       value: l,
@@ -1318,9 +1318,9 @@ const Qe = i.forwardRef(
       {
         __scopeCheckbox: o,
         checked: n,
-        defaultChecked: r,
+        defaultChecked: s,
         required: a,
-        name: s,
+        name: r,
         form: p,
         disabled: c,
         value: l,
@@ -1347,9 +1347,9 @@ const Qe = i.forwardRef(
 ), et = "CheckboxBubbleInput", tt = i.forwardRef(
   ({ __scopeCheckbox: e, ...t }, o) => {
     const {
-      control: s,
+      control: r,
       checked: n,
-      defaultChecked: r,
+      defaultChecked: s,
       required: a,
       disabled: c,
       name: l,
@@ -1358,7 +1358,7 @@ const Qe = i.forwardRef(
       bubbleInput: f,
       setBubbleInput: b,
       hasConsumerStoppedPropagationRef: m
-    } = Ce(et, e), v = k(o, b), g = me(n), h = he(s);
+    } = Ce(et, e), v = k(o, b), g = me(n), h = he(r);
     i.useEffect(() => {
       const C = f;
       if (!C) return;
@@ -1377,7 +1377,7 @@ const Qe = i.forwardRef(
       {
         type: "checkbox",
         "aria-hidden": !0,
-        defaultChecked: r ?? y.current,
+        defaultChecked: s ?? y.current,
         required: a,
         disabled: c,
         name: l,
@@ -1401,12 +1401,12 @@ const Qe = i.forwardRef(
 );
 tt.displayName = et;
 const ot = "CheckboxIndicator", Re = i.forwardRef((e, t) => {
-  const { __scopeCheckbox: o, forceMount: s, ...n } = e, r = Ce(ot, o);
-  return /* @__PURE__ */ u(Fe, { remain: s || O(r.checked) || r.checked === !0, children: /* @__PURE__ */ u(
+  const { __scopeCheckbox: o, forceMount: r, ...n } = e, s = Ce(ot, o);
+  return /* @__PURE__ */ u(Fe, { remain: r || O(s.checked) || s.checked === !0, children: /* @__PURE__ */ u(
     S.span,
     {
-      "data-state": nt(r.checked),
-      "data-disabled": r.disabled ? "" : void 0,
+      "data-state": nt(s.checked),
+      "data-disabled": s.disabled ? "" : void 0,
       ...n,
       ref: t,
       style: { pointerEvents: "none", ...e.style }
@@ -1426,14 +1426,14 @@ function nt(e) {
 const Nn = i.forwardRef((e, t) => {
   const {
     className: o,
-    checked: s,
+    checked: r,
     defaultChecked: n = !1,
-    onCheckedChange: r,
+    onCheckedChange: s,
     ...a
   } = I(e, Xe), [c, l] = A({
-    prop: s,
+    prop: r,
     defaultProp: n,
-    onChange: r
+    onChange: s
   });
   return /* @__PURE__ */ u(
     Qe,
@@ -1460,9 +1460,9 @@ const K = {
   (e, t) => {
     const {
       __scopeCheckboxGroup: o,
-      name: s,
+      name: r,
       defaultValue: n,
-      value: r,
+      value: s,
       required: a = !1,
       disabled: c = !1,
       loop: l = !0,
@@ -1470,7 +1470,7 @@ const K = {
       onValueChange: p,
       ...f
     } = e, b = rt(o), [m = [], v] = A({
-      prop: r,
+      prop: s,
       defaultProp: n || [],
       onChange: p
     }), g = i.useCallback(
@@ -1484,7 +1484,7 @@ const K = {
       xn,
       {
         scope: o,
-        name: s,
+        name: r,
         required: a,
         disabled: c,
         value: m,
@@ -1505,7 +1505,7 @@ const K = {
 );
 at.displayName = Ne;
 const it = "CheckboxGroupItem", lt = i.forwardRef((e, t) => {
-  const { __scopeCheckboxGroup: o, disabled: s, ...n } = e, r = Sn(it, o), a = r.disabled || s, c = rt(o), l = ct(o), d = i.useRef(null), p = k(t, d), f = r.value?.includes(n.value);
+  const { __scopeCheckboxGroup: o, disabled: r, ...n } = e, s = Sn(it, o), a = s.disabled || r, c = rt(o), l = ct(o), d = i.useRef(null), p = k(t, d), f = s.value?.includes(n.value);
   return /* @__PURE__ */ u(
     ze,
     {
@@ -1516,15 +1516,15 @@ const it = "CheckboxGroupItem", lt = i.forwardRef((e, t) => {
       children: /* @__PURE__ */ u(
         Qe,
         {
-          name: r.name,
+          name: s.name,
           disabled: a,
-          required: r.required,
+          required: s.required,
           checked: f,
           ...l,
           ...n,
           ref: p,
           onCheckedChange: (b) => {
-            b ? r.onItemCheck(e.value) : r.onItemUnCheck(e.value);
+            b ? s.onItemCheck(e.value) : s.onItemUnCheck(e.value);
           }
         }
       )
@@ -1533,8 +1533,8 @@ const it = "CheckboxGroupItem", lt = i.forwardRef((e, t) => {
 });
 lt.displayName = it;
 const Pn = "CheckboxGroupIndicator", ut = i.forwardRef((e, t) => {
-  const { __scopeCheckboxGroup: o, ...s } = e, n = ct(o);
-  return /* @__PURE__ */ u(Re, { ...n, ...s, ref: t });
+  const { __scopeCheckboxGroup: o, ...r } = e, n = ct(o);
+  return /* @__PURE__ */ u(Re, { ...n, ...r, ref: t });
 });
 ut.displayName = Pn;
 const j = "CheckboxGroup", [kn] = T(j, [
@@ -1543,13 +1543,13 @@ const j = "CheckboxGroup", [kn] = T(j, [
   (e, t) => {
     const {
       size: o = K.size.default,
-      variant: s = K.variant.default,
+      variant: r = K.variant.default,
       ...n
-    } = e, { __scopeCheckboxGroup: r, className: a, ...c } = I(
+    } = e, { __scopeCheckboxGroup: s, className: a, ...c } = I(
       n,
       K
-    ), l = dt(r);
-    return /* @__PURE__ */ u(In, { scope: r, size: o, variant: s, children: /* @__PURE__ */ u(
+    ), l = dt(s);
+    return /* @__PURE__ */ u(In, { scope: s, size: o, variant: r, children: /* @__PURE__ */ u(
       at,
       {
         ...l,
@@ -1563,14 +1563,14 @@ const j = "CheckboxGroup", [kn] = T(j, [
 ft.displayName = j;
 const mt = i.forwardRef(
   (e, t) => {
-    const { __scopeCheckboxGroup: o, children: s, className: n, style: r, ...a } = e, { size: c } = pt("CheckboxGroupItem", o);
-    return s ? /* @__PURE__ */ _(
+    const { __scopeCheckboxGroup: o, children: r, className: n, style: s, ...a } = e, { size: c } = pt("CheckboxGroupItem", o);
+    return r ? /* @__PURE__ */ _(
       ge,
       {
         as: "label",
         size: c,
         className: x("bd-CheckboxGroupItem", n),
-        style: r,
+        style: s,
         children: [
           /* @__PURE__ */ u(
             de,
@@ -1580,7 +1580,7 @@ const mt = i.forwardRef(
               ref: t
             }
           ),
-          s && /* @__PURE__ */ u("span", { className: "bd-CheckboxGroupItemInner", children: s })
+          r && /* @__PURE__ */ u("span", { className: "bd-CheckboxGroupItemInner", children: r })
         ]
       }
     ) : /* @__PURE__ */ u(
@@ -1590,14 +1590,14 @@ const mt = i.forwardRef(
         ...a,
         ref: t,
         className: n,
-        style: r
+        style: s
       }
     );
   }
 );
 mt.displayName = `${j}.Item`;
 const de = i.forwardRef(({ __scopeCheckboxGroup: e, ...t }, o) => {
-  const s = pt("CheckboxGroupItemCheckbox", e), n = dt(e), { className: r } = I({ ...t, ...s }, K);
+  const r = pt("CheckboxGroupItemCheckbox", e), n = dt(e), { className: s } = I({ ...t, ...r }, K);
   return /* @__PURE__ */ u(
     lt,
     {
@@ -1608,7 +1608,7 @@ const de = i.forwardRef(({ __scopeCheckboxGroup: e, ...t }, o) => {
         "bd-reset",
         "bd-CheckboxRoot",
         "bd-CheckboxGroupItemCheckbox",
-        r
+        s
       ),
       children: /* @__PURE__ */ u(ut, { ...n, asChild: !0, className: "bd-CheckboxIndicator", children: /* @__PURE__ */ u(We, {}) })
     }
@@ -1625,9 +1625,9 @@ const Cs = {
   (e, t) => {
     const {
       __scopeRadio: o,
-      name: s,
+      name: r,
       checked: n = !1,
-      required: r,
+      required: s,
       disabled: a,
       value: c = "on",
       onCheck: l,
@@ -1657,10 +1657,10 @@ const Cs = {
         {
           control: f,
           bubbles: !v.current,
-          name: s,
+          name: r,
           value: c,
           checked: n,
-          required: r,
+          required: s,
           disabled: a,
           form: d,
           style: { transform: "translateX(-100%)" }
@@ -1672,12 +1672,12 @@ const Cs = {
 xe.displayName = we;
 const bt = "RadioIndicator", gt = i.forwardRef(
   (e, t) => {
-    const { __scopeRadio: o, forceMount: s, ...n } = e, r = On(bt, o);
-    return /* @__PURE__ */ u(Fe, { remain: s || r.checked, children: /* @__PURE__ */ u(
+    const { __scopeRadio: o, forceMount: r, ...n } = e, s = On(bt, o);
+    return /* @__PURE__ */ u(Fe, { remain: r || s.checked, children: /* @__PURE__ */ u(
       S.span,
       {
-        "data-state": yt(r.checked),
-        "data-disabled": r.disabled ? "" : void 0,
+        "data-state": yt(s.checked),
+        "data-disabled": s.disabled ? "" : void 0,
         ...n,
         ref: t
       }
@@ -1686,10 +1686,10 @@ const bt = "RadioIndicator", gt = i.forwardRef(
 );
 gt.displayName = bt;
 const Dn = "RadioBubbleInput", vt = i.forwardRef(
-  ({ control: e, checked: t, bubbles: o = !0, ...s }, n) => {
-    const r = i.useRef(null), a = k(r, n), c = me(t), l = he(e);
+  ({ control: e, checked: t, bubbles: o = !0, ...r }, n) => {
+    const s = i.useRef(null), a = k(s, n), c = me(t), l = he(e);
     return i.useEffect(() => {
-      const d = r.current;
+      const d = s.current;
       if (!d) return;
       const p = window.HTMLInputElement.prototype, b = Object.getOwnPropertyDescriptor(
         p,
@@ -1705,11 +1705,11 @@ const Dn = "RadioBubbleInput", vt = i.forwardRef(
         type: "radio",
         "aria-hidden": !0,
         defaultChecked: t,
-        ...s,
+        ...r,
         tabIndex: -1,
         ref: a,
         style: {
-          ...s.style,
+          ...r.style,
           ...l,
           position: "absolute",
           pointerEvents: "none",
@@ -1727,14 +1727,14 @@ function yt(e) {
 const Gn = i.forwardRef((e, t) => {
   const {
     className: o,
-    checked: s,
+    checked: r,
     defaultChecked: n = !1,
-    onCheck: r,
+    onCheck: s,
     ...a
   } = I(e, Tn), [c, l] = A({
-    prop: s,
+    prop: r,
     defaultProp: n,
-    onChange: r
+    onChange: s
   });
   return /* @__PURE__ */ u(
     xe,
@@ -1756,9 +1756,9 @@ const Mn = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"], te = "RadioGroup
   (e, t) => {
     const {
       __scopeRadioGroup: o,
-      name: s,
+      name: r,
       defaultValue: n,
-      value: r,
+      value: s,
       required: a = !1,
       disabled: c = !1,
       orientation: l,
@@ -1766,7 +1766,7 @@ const Mn = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"], te = "RadioGroup
       onValueChange: p,
       ...f
     } = e, b = Rt(o), [m, v] = A({
-      prop: r,
+      prop: s,
       defaultProp: n ?? null,
       onChange: p,
       caller: te
@@ -1775,7 +1775,7 @@ const Mn = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"], te = "RadioGroup
       $n,
       {
         scope: o,
-        name: s,
+        name: r,
         required: a,
         disabled: c,
         value: m,
@@ -1798,7 +1798,7 @@ const Mn = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"], te = "RadioGroup
 wt.displayName = te;
 const xt = "RadioGroupItem", St = i.forwardRef(
   (e, t) => {
-    const { __scopeRadioGroup: o, disabled: s, ...n } = e, r = Vn(xt, o), a = r.disabled || s, c = Rt(o), l = Nt(o), d = i.useRef(null), p = k(t, d), f = r.value === n.value, b = i.useRef(!1);
+    const { __scopeRadioGroup: o, disabled: r, ...n } = e, s = Vn(xt, o), a = s.disabled || r, c = Rt(o), l = Nt(o), d = i.useRef(null), p = k(t, d), f = s.value === n.value, b = i.useRef(!1);
     return i.useEffect(() => {
       const m = (g) => {
         Mn.includes(g.key) && (b.current = !0);
@@ -1816,14 +1816,14 @@ const xt = "RadioGroupItem", St = i.forwardRef(
         children: /* @__PURE__ */ u(
           xe,
           {
-            name: r.name,
+            name: s.name,
             disabled: a,
-            required: r.required,
+            required: s.required,
             checked: f,
             ...l,
             ...n,
             ref: p,
-            onCheck: () => r.onValueChange(n.value),
+            onCheck: () => s.onValueChange(n.value),
             onKeyDown: E((m) => {
               m.key === "Enter" && m.preventDefault();
             }),
@@ -1838,8 +1838,8 @@ const xt = "RadioGroupItem", St = i.forwardRef(
 );
 St.displayName = xt;
 const Ln = "RadioGroupBaseIndicator", zn = i.forwardRef((e, t) => {
-  const { __scopeRadioGroup: o, ...s } = e, n = Nt(o);
-  return /* @__PURE__ */ u(gt, { ...n, ...s, ref: t });
+  const { __scopeRadioGroup: o, ...r } = e, n = Nt(o);
+  return /* @__PURE__ */ u(gt, { ...n, ...r, ref: t });
 });
 zn.displayName = Ln;
 const Un = ["1", "2", "3"], jn = ["classic", "outline"], W = {
@@ -1852,8 +1852,8 @@ const Un = ["1", "2", "3"], jn = ["classic", "outline"], W = {
     size: e = W.size.default,
     variant: t = W.variant.default,
     ...o
-  }, s) => {
-    const { __scopeRadioGroup: n, className: r, ...a } = I(
+  }, r) => {
+    const { __scopeRadioGroup: n, className: s, ...a } = I(
       o,
       W
     ), c = Pt(n);
@@ -1862,8 +1862,8 @@ const Un = ["1", "2", "3"], jn = ["classic", "outline"], W = {
       {
         ...c,
         ...a,
-        ref: s,
-        className: x("bd-RadioGroupRoot", r)
+        ref: r,
+        className: x("bd-RadioGroupRoot", s)
       }
     ) });
   }
@@ -1871,14 +1871,14 @@ const Un = ["1", "2", "3"], jn = ["classic", "outline"], W = {
 It.displayName = H;
 const Et = i.forwardRef(
   (e, t) => {
-    const { __scopeRadioGroup: o, children: s, className: n, style: r, ...a } = e, { size: c } = kt("RadioGroupItem", o);
-    return s ? /* @__PURE__ */ _(
+    const { __scopeRadioGroup: o, children: r, className: n, style: s, ...a } = e, { size: c } = kt("RadioGroupItem", o);
+    return r ? /* @__PURE__ */ _(
       ge,
       {
         as: "label",
         size: c,
         className: x("bd-RadioGroupItem", n),
-        style: r,
+        style: s,
         children: [
           /* @__PURE__ */ u(
             pe,
@@ -1888,7 +1888,7 @@ const Et = i.forwardRef(
               ref: t
             }
           ),
-          s && /* @__PURE__ */ u("span", { className: "bd-RadioGroupItemInner", children: s })
+          r && /* @__PURE__ */ u("span", { className: "bd-RadioGroupItemInner", children: r })
         ]
       }
     ) : /* @__PURE__ */ u(
@@ -1898,14 +1898,14 @@ const Et = i.forwardRef(
         ...a,
         ref: t,
         className: n,
-        style: r
+        style: s
       }
     );
   }
 );
 Et.displayName = `${H}.Item`;
 const pe = i.forwardRef(({ __scopeRadioGroup: e, ...t }, o) => {
-  const s = kt("RadioGroupItemRadio", e), n = Pt(e), { className: r } = I({ ...t, ...s }, W);
+  const r = kt("RadioGroupItemRadio", e), n = Pt(e), { className: s } = I({ ...t, ...r }, W);
   return /* @__PURE__ */ u(
     St,
     {
@@ -1913,7 +1913,7 @@ const pe = i.forwardRef(({ __scopeRadioGroup: e, ...t }, o) => {
       ...t,
       asChild: !1,
       ref: o,
-      className: x("bd-reset", "bd-BaseRadioRoot", "bd-RadioRoot", r)
+      className: x("bd-reset", "bd-BaseRadioRoot", "bd-RadioRoot", s)
     }
   );
 });
@@ -1922,18 +1922,18 @@ const Rs = {
   Root: It,
   Item: Et
 }, _t = i.forwardRef(
-  ({ children: e, maxHeight: t, className: o, style: s, onScroll: n, onScrollBottom: r, ...a }, c) => /* @__PURE__ */ u(
+  ({ children: e, maxHeight: t, className: o, style: r, onScroll: n, onScrollBottom: s, ...a }, c) => /* @__PURE__ */ u(
     "div",
     {
       ref: c,
       onScroll: (d) => {
-        if (n && n(d), r) {
+        if (n && n(d), s) {
           const { scrollTop: p, scrollHeight: f, clientHeight: b } = d.currentTarget;
-          f - p <= b + 10 && r();
+          f - p <= b + 10 && s();
         }
       },
       className: `bd-ScrollArea ${o || ""}`,
-      style: { ...s, maxHeight: t },
+      style: { ...r, maxHeight: t },
       ...a,
       children: e
     }
@@ -1959,11 +1959,13 @@ const Kn = ["1", "2", "3", "4", "5"], Wn = ["classic", "underlined", "rounded"],
   /* @__PURE__ */ u("div", { className: "bd-theme bd-reset", style: { display: "contents" }, children: e }),
   t
 ), Qn = i.forwardRef((e, t) => {
-  const { color: o = "currentColor", ...s } = e;
+  const { color: o = "currentColor", width: r = 20, height: n = 20, ...s } = e;
   return /* @__PURE__ */ u(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
+      width: r,
+      height: n,
       viewBox: "4 2 16 16",
       fill: "none",
       ...s,
@@ -1981,9 +1983,9 @@ const Kn = ["1", "2", "3", "4", "5"], Wn = ["classic", "underlined", "rounded"],
   __scopeSelect: e,
   value: t,
   defaultValue: o,
-  onValueChange: s,
+  onValueChange: r,
   open: n,
-  defaultOpen: r,
+  defaultOpen: s,
   onOpenChange: a,
   variant: c = "classic",
   children: l
@@ -1991,11 +1993,11 @@ const Kn = ["1", "2", "3", "4", "5"], Wn = ["classic", "underlined", "rounded"],
   const [d, p] = A({
     prop: t,
     defaultProp: o ?? "",
-    onChange: s,
+    onChange: r,
     caller: Z
   }), [f, b] = A({
     prop: n,
-    defaultProp: r ?? !1,
+    defaultProp: s ?? !1,
     onChange: a,
     caller: `${Z}.Open`
   }), m = i.useRef(null), v = Me();
@@ -2015,7 +2017,7 @@ const Kn = ["1", "2", "3", "4", "5"], Wn = ["classic", "underlined", "rounded"],
   );
 }, At = "SelectBoxTrigger", Se = i.forwardRef(
   (e, t) => {
-    const { __scopeSelect: o, children: s, onClick: n, onKeyDown: r, ...a } = e, c = oe(At, o), l = k(t, c.triggerRef), { className: d, style: p, ...f } = I(a, Zn), b = !c.value || c.value === "";
+    const { __scopeSelect: o, children: r, onClick: n, onKeyDown: s, ...a } = e, c = oe(At, o), l = k(t, c.triggerRef), { className: d, style: p, ...f } = I(a, Zn), b = !c.value || c.value === "";
     return /* @__PURE__ */ u(
       S.button,
       {
@@ -2031,15 +2033,15 @@ const Kn = ["1", "2", "3", "4", "5"], Wn = ["classic", "underlined", "rounded"],
           c.onOpenChange(!c.open), n?.(m);
         },
         onKeyDown: (m) => {
-          !c.open && (m.key === "ArrowDown" || m.key === "Enter" || m.key === " ") && (m.preventDefault(), c.onOpenChange(!0)), r?.(m);
+          !c.open && (m.key === "ArrowDown" || m.key === "Enter" || m.key === " ") && (m.preventDefault(), c.onOpenChange(!0)), s?.(m);
         },
-        children: s
+        children: r
       }
     );
   }
 );
 Se.displayName = At;
-const Bt = "SelectBoxContent", Pe = i.forwardRef(({ __scopeSelect: e, children: t, className: o, style: s, onKeyDown: n, ...r }, a) => {
+const Bt = "SelectBoxContent", Pe = i.forwardRef(({ __scopeSelect: e, children: t, className: o, style: r, onKeyDown: n, ...s }, a) => {
   const c = oe(Bt, e), l = i.useRef(null), d = k(a, l);
   uo(l, (g) => {
     c.triggerRef.current?.contains(g.target) || c.open && c.onOpenChange(!1);
@@ -2098,11 +2100,11 @@ const Bt = "SelectBoxContent", Pe = i.forwardRef(({ __scopeSelect: e, children:
       tabIndex: -1,
       onKeyDown: m,
       className: `bd-SelectBoxContent bd-variant-${c.variant} ${o || ""}`,
-      ...r,
+      ...s,
       ref: d,
       style: {
         ...f,
-        ...s,
+        ...r,
         transition: b ? "opacity 0.2s ease, transform 0.2s ease" : "none",
         overflow: "hidden"
       },
@@ -2113,7 +2115,7 @@ const Bt = "SelectBoxContent", Pe = i.forwardRef(({ __scopeSelect: e, children:
 });
 Pe.displayName = Bt;
 const Ot = "SelectBoxItem", ke = i.forwardRef(
-  ({ __scopeSelect: e, value: t, onClick: o, className: s, children: n, ...r }, a) => {
+  ({ __scopeSelect: e, value: t, onClick: o, className: r, children: n, ...s }, a) => {
     const c = oe(Ot, e), l = c.value === t;
     return /* @__PURE__ */ u(
       S.div,
@@ -2122,8 +2124,8 @@ const Ot = "SelectBoxItem", ke = i.forwardRef(
         tabIndex: -1,
         "aria-selected": l,
         "data-state": l ? "checked" : "unchecked",
-        className: `bd-SelectBoxItem bd-variant-${c.variant} ${s || ""}`,
-        ...r,
+        className: `bd-SelectBoxItem bd-variant-${c.variant} ${r || ""}`,
+        ...s,
         ref: a,
         onClick: (d) => {
           const p = typeof n == "string" ? n : t;
@@ -2136,21 +2138,21 @@ const Ot = "SelectBoxItem", ke = i.forwardRef(
 );
 ke.displayName = Ot;
 const Dt = "SelectBoxValue", Ie = i.forwardRef(
-  ({ __scopeSelect: e, className: t, children: o, placeholder: s, ...n }, r) => {
-    const a = oe(Dt, e), c = a.value ? a.value : o || s;
-    return /* @__PURE__ */ u(S.span, { className: `bd-SelectBoxValue ${t || ""}`, ...n, ref: r, children: c });
+  ({ __scopeSelect: e, className: t, children: o, placeholder: r, ...n }, s) => {
+    const a = oe(Dt, e), c = a.value ? a.value : o || r;
+    return /* @__PURE__ */ u(S.span, { className: `bd-SelectBoxValue ${t || ""}`, ...n, ref: s, children: c });
   }
 );
 Ie.displayName = Dt;
 const os = "SelectBoxSlot", Ee = i.forwardRef(
-  ({ __scopeSelect: e, className: t, side: o = "right", "data-chevron": s, children: n, ...r }, a) => /* @__PURE__ */ u(
+  ({ __scopeSelect: e, className: t, side: o = "right", "data-chevron": r, children: n, ...s }, a) => /* @__PURE__ */ u(
     S.div,
     {
       "aria-hidden": "true",
       "data-side": o,
-      "data-chevron": s ? "true" : void 0,
+      "data-chevron": r ? "true" : void 0,
       className: `bd-SelectBoxSlot ${t || ""}`,
-      ...r,
+      ...s,
       ref: a,
       children: n || /* @__PURE__ */ u(Qn, {})
     }
@@ -2161,17 +2163,17 @@ const ns = ({
   options: e,
   placeholder: t = "선택하세요",
   size: o = "2",
-  variant: s = "classic",
+  variant: r = "classic",
   disabled: n = !1,
-  maxHeight: r,
+  maxHeight: s,
   onScrollBottom: a,
   ...c
-}) => /* @__PURE__ */ _(Tt, { ...c, variant: s, children: [
-  /* @__PURE__ */ _(Se, { size: o, variant: s, disabled: n, children: [
+}) => /* @__PURE__ */ _(Tt, { ...c, variant: r, children: [
+  /* @__PURE__ */ _(Se, { size: o, variant: r, disabled: n, children: [
     /* @__PURE__ */ u(Ie, { placeholder: t }),
     /* @__PURE__ */ u(Ee, { "data-chevron": !0 })
   ] }),
-  /* @__PURE__ */ u(Pe, { children: /* @__PURE__ */ u(_t, { maxHeight: r, onScrollBottom: a, children: e.map((l) => /* @__PURE__ */ u(ke, { value: l.value, children: l.label }, l.value)) }) })
+  /* @__PURE__ */ u(Pe, { children: /* @__PURE__ */ u(_t, { maxHeight: s, onScrollBottom: a, children: e.map((l) => /* @__PURE__ */ u(ke, { value: l.value, children: l.label }, l.value)) }) })
 ] }), Ns = Object.assign(ns, {
   Root: Tt,
   Trigger: Se,
@@ -2183,9 +2185,9 @@ const ns = ({
   (e, t) => {
     const {
       __scopeSwitch: o,
-      name: s,
+      name: r,
       checked: n,
-      defaultChecked: r,
+      defaultChecked: s,
       required: a,
       disabled: c,
       value: l = "on",
@@ -2194,7 +2196,7 @@ const ns = ({
       ...f
     } = e, [b, m] = i.useState(null), v = k(t, (R) => m(R)), g = i.useRef(!1), h = b ? p || !!b.closest("form") : !0, [y, C] = A({
       prop: n,
-      defaultProp: r ?? !1,
+      defaultProp: s ?? !1,
       onChange: d,
       caller: ne
     });
@@ -2222,7 +2224,7 @@ const ns = ({
         {
           control: b,
           bubbles: !g.current,
-          name: s,
+          name: r,
           value: l,
           checked: y,
           required: a,
@@ -2237,13 +2239,13 @@ const ns = ({
 Gt.displayName = ne;
 const Mt = "SwitchThumb", Ft = i.forwardRef(
   (e, t) => {
-    const { __scopeSwitch: o, ...s } = e, n = cs(Mt, o);
+    const { __scopeSwitch: o, ...r } = e, n = cs(Mt, o);
     return /* @__PURE__ */ u(
       S.span,
       {
         "data-state": Vt(n.checked),
         "data-disabled": n.disabled ? "" : void 0,
-        ...s,
+        ...r,
         ref: t
       }
     );
@@ -2252,7 +2254,7 @@ const Mt = "SwitchThumb", Ft = i.forwardRef(
 Ft.displayName = Mt;
 const as = "SwitchBubbleInput", $t = i.forwardRef(
   (e, t) => {
-    const { checked: o, control: s, bubbles: n = !0, ...r } = e, a = i.useRef(null), c = k(a, t), l = me(o), d = he(s);
+    const { checked: o, control: r, bubbles: n = !0, ...s } = e, a = i.useRef(null), c = k(a, t), l = me(o), d = he(r);
     return i.useEffect(() => {
       const p = a.current;
       if (!p) return;
@@ -2270,11 +2272,11 @@ const as = "SwitchBubbleInput", $t = i.forwardRef(
         type: "checkbox",
         "aria-hidden": !0,
         defaultChecked: o,
-        ...r,
+        ...s,
         tabIndex: -1,
         ref: c,
         style: {
-          ...r.style,
+          ...s.style,
           ...d,
           position: "absolute",
           pointerEvents: "none",
@@ -2293,11 +2295,11 @@ const is = ["1", "2", "3"], ls = {
   size: { type: "enum", className: "bd-size", values: is, default: "2" },
   ...D
 }, us = i.forwardRef((e, t) => {
-  const { className: o, ...s } = I(e, ls);
+  const { className: o, ...r } = I(e, ls);
   return /* @__PURE__ */ u(
     Gt,
     {
-      ...s,
+      ...r,
       asChild: !1,
       ref: t,
       className: x("bd-reset", "bd-SwitchRoot", o),
@@ -2319,14 +2321,14 @@ const ds = ["1", "2", "3", "4", "5"], ps = ["classic", "underlined", "rounded"],
   pr: $.pr
 }, Lt = i.forwardRef(
   (e, t) => {
-    const o = i.useRef(null), { children: s, className: n, style: r, ...a } = I(
+    const o = i.useRef(null), { children: r, className: n, style: s, ...a } = I(
       e,
       fs
     );
     return /* @__PURE__ */ _(
       "div",
       {
-        style: r,
+        style: s,
         className: x("bd-TextFieldRoot", n),
         onPointerDown: (c) => {
           const l = c.target;
@@ -2355,7 +2357,7 @@ const ds = ["1", "2", "3", "4", "5"], ps = ["classic", "underlined", "rounded"],
               className: "bd-reset bd-TextFieldInput"
             }
           ),
-          s
+          r
         ]
       }
     );
@@ -2364,11 +2366,11 @@ const ds = ["1", "2", "3", "4", "5"], ps = ["classic", "underlined", "rounded"],
 Lt.displayName = "TextFieldRoot";
 const zt = i.forwardRef(
   (e, t) => {
-    const { className: o, side: s, ...n } = I(e, hs);
+    const { className: o, side: r, ...n } = I(e, hs);
     return /* @__PURE__ */ u(
       "div",
       {
-        "data-side": s,
+        "data-side": r,
         ...n,
         ref: t,
         className: x("bd-TextFieldSlot", o)