@brycks/core-front 0.2.6 → 0.2.7

package/dist/index.js

@@ -1,8 +1,8 @@
 import { a as Ga, c as qa, e as Ua, i as Za, n as Qa, p as Ja, s as es, w as ts } from "./colors-B_8a3coi.js";
-import { spacing as L, durations as te, easings as Q, fontSizes as oe, fontWeights as de, lineHeights as Ne, fontFamilies as se, containers as yt, textStyles as ce } from "./tokens.js";
+import { spacing as L, durations as te, easings as J, fontSizes as oe, fontWeights as de, lineHeights as Ne, fontFamilies as se, containers as yt, textStyles as ce } from "./tokens.js";
 import { animations as os, borderStyles as ns, borderWidths as as, breakpoints as ss, focusRings as is, glows as ls, letterSpacings as cs, mediaQueries as ds, radii as us, semanticSpacing as ys, shadows as fs, transitions as ms, zIndex as bs } from "./tokens.js";
 import { T as ps, c as hs, d as ks, l as vs, u as xs, a as Ss } from "./cssVariables-D9uw0uKO.js";
-import { forwardRef as z, useState as B, useCallback as R, useEffect as K, useRef as J, useImperativeHandle as ft, useId as Te, createContext as ge, useContext as pe, cloneElement as De, useMemo as mt, Children as bt, isValidElement as gt } from "react";
+import { forwardRef as z, useState as A, useCallback as E, useEffect as Y, useRef as Z, useImperativeHandle as ft, useId as Te, createContext as ge, useContext as pe, cloneElement as De, useMemo as mt, Children as bt, isValidElement as gt } from "react";
 import { jsx as s, jsxs as w, Fragment as ne } from "react/jsx-runtime";
 import { createPortal as ve } from "react-dom";
 const fe = {
@@ -148,27 +148,27 @@ const fe = {
   /** No transition */
   none: "none",
   /** Ultra-fast - for micro-interactions (50ms) */
-  instant: `all ${te.faster}ms ${Q.easeOut}`,
+  instant: `all ${te.faster}ms ${J.easeOut}`,
   /** Fast - for hover states, toggles (100ms) */
-  fast: `all ${te.fast}ms ${Q.easeOut}`,
+  fast: `all ${te.fast}ms ${J.easeOut}`,
   /** Quick - standard interactive feedback (150ms) */
-  quick: `all ${te.quick}ms ${Q.easeOut}`,
+  quick: `all ${te.quick}ms ${J.easeOut}`,
   /** Default - most state changes (200ms) */
-  default: `all ${te.normal}ms ${Q.easeOut}`,
+  default: `all ${te.normal}ms ${J.easeOut}`,
   /** Smooth - focus states, form elements (300ms) */
-  smooth: `all ${te.relaxed}ms ${Q.smooth}`,
+  smooth: `all ${te.relaxed}ms ${J.smooth}`,
   /** Slow - reveals, modals (400ms) */
-  slow: `all ${te.slow}ms ${Q.easeOut}`,
+  slow: `all ${te.slow}ms ${J.easeOut}`,
   /** Spring - bouncy, tactile feel (300ms) */
-  spring: `all ${te.relaxed}ms ${Q.softSpring}`,
+  spring: `all ${te.relaxed}ms ${J.softSpring}`,
   /** Colors only - optimized for color transitions */
-  colors: `color ${te.fast}ms ${Q.easeOut}, background-color ${te.fast}ms ${Q.easeOut}, border-color ${te.fast}ms ${Q.easeOut}`,
+  colors: `color ${te.fast}ms ${J.easeOut}, background-color ${te.fast}ms ${J.easeOut}, border-color ${te.fast}ms ${J.easeOut}`,
   /** Transform only - for scale, translate */
-  transform: `transform ${te.normal}ms ${Q.easeOut}`,
+  transform: `transform ${te.normal}ms ${J.easeOut}`,
   /** Opacity only - for fade effects */
-  opacity: `opacity ${te.normal}ms ${Q.easeOut}`,
+  opacity: `opacity ${te.normal}ms ${J.easeOut}`,
   /** Shadow only - for elevation changes */
-  shadow: `box-shadow ${te.normal}ms ${Q.easeOut}`
+  shadow: `box-shadow ${te.normal}ms ${J.easeOut}`
 }, ga = {
   all: "all",
   colors: "color, background-color, border-color, fill, stroke",
@@ -185,15 +185,15 @@ const fe = {
   slow: te.slow,
   slower: te.slower
 }, ha = {
-  linear: Q.linear,
-  ease: Q.ease,
-  easeIn: Q.easeIn,
-  easeOut: Q.easeOut,
-  easeInOut: Q.easeInOut,
-  spring: Q.spring,
-  softSpring: Q.softSpring,
-  smooth: Q.smooth,
-  snappy: Q.snappy
+  linear: J.linear,
+  ease: J.ease,
+  easeIn: J.easeIn,
+  easeOut: J.easeOut,
+  easeInOut: J.easeInOut,
+  spring: J.spring,
+  softSpring: J.softSpring,
+  smooth: J.smooth,
+  snappy: J.snappy
 }, ka = {
   fadeIn: `
     @keyframes brycks-fade-in {
@@ -994,7 +994,7 @@ const Ee = {
   }, C = {
     display: "flex",
     flexDirection: "column"
-  }, T = e || t || l;
+  }, I = e || t || l;
   return /* @__PURE__ */ w(
     "section",
     {
@@ -1004,7 +1004,7 @@ const Ee = {
       "data-testid": y,
       ...m,
       children: [
-        T && /* @__PURE__ */ w("div", { className: "brycks-section-header", style: p, children: [
+        I && /* @__PURE__ */ w("div", { className: "brycks-section-header", style: p, children: [
           /* @__PURE__ */ w("div", { style: b, children: [
             e && /* @__PURE__ */ s(u, { style: v, children: e }),
             t && /* @__PURE__ */ s("p", { style: x, children: t })
@@ -1078,15 +1078,16 @@ const er = {
   testId: p,
   ...b
 }, v) {
-  const x = {
+  const x = a ? { gap: L[a] } : {
+    ...l ? { rowGap: L[l] } : {},
+    ...i ? { columnGap: L[i] } : {}
+  }, k = {
     display: d ? "inline-flex" : "flex",
     flexDirection: e,
     flexWrap: t,
     justifyContent: er[o],
     alignItems: Ve[n],
-    gap: a ? L[a] : void 0,
-    rowGap: l ? L[l] : void 0,
-    columnGap: i ? L[i] : void 0,
+    ...x,
     flexGrow: c,
     flexShrink: y,
     flexBasis: m,
@@ -1097,7 +1098,7 @@ const er = {
     {
       ref: v,
       className: S("brycks-flex", u),
-      style: x,
+      style: k,
       "data-testid": p,
       ...b,
       children: g
@@ -1218,30 +1219,30 @@ const ir = z(function({
   testId: f,
   ...p
 }, b) {
-  const [v, x] = B("loading"), k = R(
+  const [v, x] = A("loading"), k = E(
     ($) => {
       x("loaded"), y == null || y($);
     },
     [y]
-  ), C = R(
+  ), C = E(
     ($) => {
       x("error"), m == null || m($);
     },
     [m]
-  ), T = sr(o), h = Ae[d] ?? Ae.none, D = {
+  ), I = sr(o), h = Ae[d] ?? Ae.none, D = {
     position: "relative",
     overflow: "hidden",
     borderRadius: h,
     backgroundColor: c && v === "loading" ? "var(--brycks-background-muted)" : void 0,
-    ...T ? {
+    ...I ? {
       width: "100%",
-      paddingBottom: `${1 / T * 100}%`
+      paddingBottom: `${1 / I * 100}%`
     } : {}
   }, M = {
     display: "block",
     objectFit: n,
     borderRadius: h,
-    ...T ? {
+    ...I ? {
       position: "absolute",
       top: 0,
       left: 0,
@@ -1296,7 +1297,7 @@ const ir = z(function({
       role: "img",
       "aria-label": t,
       children: [
-        T && /* @__PURE__ */ s("div", { style: { paddingBottom: `${1 / T * 100}%` } }),
+        I && /* @__PURE__ */ s("div", { style: { paddingBottom: `${1 / I * 100}%` } }),
         l && /* @__PURE__ */ s("div", { style: N, children: l })
       ]
     }
@@ -1309,7 +1310,7 @@ const ir = z(function({
         v === "loaded" && "brycks-image--loaded",
         g
       ),
-      style: T ? D : { position: "relative", borderRadius: h },
+      style: I ? D : { position: "relative", borderRadius: h },
       "data-testid": f,
       children: [
         v === "loading" && i && /* @__PURE__ */ s("div", { style: N, children: typeof i == "string" ? /* @__PURE__ */ s(
@@ -1346,8 +1347,8 @@ const ir = z(function({
 });
 ir.displayName = "Image";
 function Me(r) {
-  const [e, t] = B(() => typeof window > "u" ? !1 : window.matchMedia(r).matches);
-  return K(() => {
+  const [e, t] = A(() => typeof window > "u" ? !1 : window.matchMedia(r).matches);
+  return Y(() => {
     if (typeof window > "u") return;
     const o = window.matchMedia(r), n = (a) => t(a.matches);
     return t(o.matches), o.addEventListener("change", n), () => o.removeEventListener("change", n);
@@ -1409,10 +1410,10 @@ const cr = z(function({
   style: x,
   testId: k,
   ...C
-}, T) {
-  const h = J(null), [D, M] = B(!1), [N, $] = B(!1), H = We(), F = !(H || l === !1), I = c ?? (F || l === "muted");
+}, I) {
+  const h = Z(null), [D, M] = A(!1), [N, $] = A(!1), R = We(), H = !(R || l === !1), T = c ?? (H || l === "muted");
   ft(
-    T,
+    I,
     () => ({
       play: async () => {
         h.current && await h.current.play();
@@ -1442,31 +1443,31 @@ const cr = z(function({
       getElement: () => h.current
     }),
     []
-  ), K(() => {
-    F && h.current && (async () => {
-      var Y;
+  ), Y(() => {
+    H && h.current && (async () => {
+      var K;
       try {
-        await ((Y = h.current) == null ? void 0 : Y.play());
+        await ((K = h.current) == null ? void 0 : K.play());
       } catch {
       }
     })();
-  }, [F]);
-  const E = R(
+  }, [H]);
+  const F = E(
     (_) => {
       M(!0), g == null || g(_);
     },
     [g]
-  ), V = R(
+  ), V = E(
     (_) => {
       M(!1), u == null || u(_);
     },
     [u]
-  ), W = R(
+  ), W = E(
     (_) => {
       M(!1), f == null || f(_);
     },
     [f]
-  ), A = R(
+  ), B = E(
     (_) => {
       $(!0), b == null || b(_);
     },
@@ -1541,13 +1542,13 @@ const cr = z(function({
           preload: a,
           loop: i,
           controls: d,
-          muted: I,
+          muted: T,
           playsInline: y,
-          onPlay: E,
+          onPlay: F,
           onPause: V,
           onEnded: W,
           onCanPlay: p,
-          onError: A,
+          onError: B,
           style: j,
           ...C
         }
@@ -2143,28 +2144,28 @@ const Mr = ({
   onMouseUp: v,
   ...x
 }, k) => {
-  const C = r || "button", [T, h] = B(!1), [D, M] = B(!1), N = l || a, $ = zr({
+  const C = r || "button", [I, h] = A(!1), [D, M] = A(!1), N = l || a, $ = zr({
     variant: e,
     intent: t,
     size: o,
     fullWidth: n,
     isIconOnly: c
-  }), H = {
+  }), R = {
     ...$.base,
-    ...T && !N ? $.hover : {},
+    ...I && !N ? $.hover : {},
     ...D && !N ? $.active : {},
     ...N ? $.disabled : {},
     ...a ? $.loading : {},
     ...m
-  }, F = _e[o], I = (P) => {
+  }, H = _e[o], T = (P) => {
     h(!0), f == null || f(P);
-  }, E = (P) => {
+  }, F = (P) => {
     h(!1), M(!1), p == null || p(P);
   }, V = (P) => {
     M(!0), b == null || b(P);
   }, W = (P) => {
     M(!1), v == null || v(P);
-  }, A = S(
+  }, B = S(
     "brycks-button",
     `brycks-button--${e}`,
     `brycks-button--${t}`,
@@ -2186,11 +2187,11 @@ const Mr = ({
     C,
     {
       ref: k,
-      className: A,
-      style: H,
+      className: B,
+      style: R,
       "data-testid": u,
-      onMouseEnter: I,
-      onMouseLeave: E,
+      onMouseEnter: T,
+      onMouseLeave: F,
       onMouseDown: V,
       onMouseUp: W,
       ...q,
@@ -2203,7 +2204,7 @@ const Mr = ({
               display: "inline-flex",
               position: c ? "absolute" : "relative"
             },
-            children: /* @__PURE__ */ s(Cr, { size: F.iconSize })
+            children: /* @__PURE__ */ s(Cr, { size: H.iconSize })
           }
         ),
         !a && i && /* @__PURE__ */ s(
@@ -2211,8 +2212,8 @@ const Mr = ({
           {
             style: {
               display: "inline-flex",
-              width: F.iconSize,
-              height: F.iconSize
+              width: H.iconSize,
+              height: H.iconSize
             },
             children: i
           }
@@ -2231,8 +2232,8 @@ const Mr = ({
           {
             style: {
               display: "inline-flex",
-              width: F.iconSize,
-              height: F.iconSize
+              width: H.iconSize,
+              height: H.iconSize
             },
             children: d
           }
@@ -2387,7 +2388,7 @@ const Ea = {
   onBlur: m,
   ...g
 }, u) {
-  const [f, p] = B(!1), b = $r[e], v = () => {
+  const [f, p] = A(!1), b = $r[e], v = () => {
     const h = {
       display: "flex",
       alignItems: "center",
@@ -2442,7 +2443,7 @@ const Ea = {
     p(!0), y == null || y(h);
   }, C = (h) => {
     p(!1), m == null || m(h);
-  }, T = {
+  }, I = {
     display: "flex",
     alignItems: "center",
     justifyContent: "center",
@@ -2466,7 +2467,7 @@ const Ea = {
           "span",
           {
             className: "brycks-input-left-element",
-            style: { ...T, paddingLeft: b.paddingX },
+            style: { ...I, paddingLeft: b.paddingX },
             children: n
           }
         ),
@@ -2488,7 +2489,7 @@ const Ea = {
           "span",
           {
             className: "brycks-input-right-element",
-            style: { ...T, paddingRight: b.paddingX },
+            style: { ...I, paddingRight: b.paddingX },
             children: a
           }
         )
@@ -2610,7 +2611,7 @@ const Rr = z(function({
   value: g,
   ...u
 }, f) {
-  const [p, b] = B(!1), v = Hr[e], x = g !== void 0 && g !== "", k = {
+  const [p, b] = A(!1), v = Hr[e], x = g !== void 0 && g !== "", k = {
     position: "relative",
     display: "inline-flex",
     width: "100%"
@@ -2634,7 +2635,7 @@ const Rr = z(function({
       boxShadow: p ? o ? "0 0 0 3px rgba(239, 68, 68, 0.15)" : "0 0 0 3px rgba(85, 120, 244, 0.15)" : "none"
     };
     return d && (M.opacity = 0.5), M;
-  }, T = {
+  }, I = {
     position: "absolute",
     right: v.padding,
     top: "50%",
@@ -2679,7 +2680,7 @@ const Rr = z(function({
             ]
           }
         ),
-        /* @__PURE__ */ s("span", { style: T, children: /* @__PURE__ */ s(Wr, {}) })
+        /* @__PURE__ */ s("span", { style: I, children: /* @__PURE__ */ s(Wr, {}) })
       ]
     }
   );
@@ -2722,7 +2723,7 @@ const Er = z(function({
   onChange: m,
   ...g
 }, u) {
-  const [f, p] = B(!1), [b, v] = B(!1), [x, k] = B(!1), C = pt[e], T = U[e], h = y || a, D = {
+  const [f, p] = A(!1), [b, v] = A(!1), [x, k] = A(!1), C = pt[e], I = U[e], h = y || a, D = {
     display: "inline-flex",
     alignItems: "flex-start",
     gap: le.lg,
@@ -2754,18 +2755,18 @@ const Er = z(function({
     opacity: 0,
     cursor: c ? "not-allowed" : "pointer",
     margin: 0
-  }, H = {
+  }, R = {
     display: "flex",
     flexDirection: "column",
     gap: le.xs,
-    paddingTop: (C.box - T) / 2
-  }, F = {
-    fontSize: T,
+    paddingTop: (C.box - I) / 2
+  }, H = {
+    fontSize: I,
     lineHeight: ee.snug,
     color: "var(--brycks-foreground-default)",
     userSelect: "none"
-  }, I = {
-    fontSize: T - 1,
+  }, T = {
+    fontSize: I - 1,
     lineHeight: ee.snug,
     color: "var(--brycks-foreground-muted)",
     userSelect: "none"
@@ -2808,9 +2809,9 @@ const Er = z(function({
           ),
           /* @__PURE__ */ s("span", { style: N, children: a ? /* @__PURE__ */ s(Fr, { size: C.icon }) : /* @__PURE__ */ s(Br, { size: C.icon }) })
         ] }),
-        (t || o) && /* @__PURE__ */ w("span", { style: H, children: [
-          t && /* @__PURE__ */ s("span", { style: F, children: t }),
-          o && /* @__PURE__ */ s("span", { style: I, children: o })
+        (t || o) && /* @__PURE__ */ w("span", { style: R, children: [
+          t && /* @__PURE__ */ s("span", { style: H, children: t }),
+          o && /* @__PURE__ */ s("span", { style: T, children: o })
         ] })
       ]
     }
@@ -2829,13 +2830,13 @@ const Ar = z(function({
   onChange: c,
   ...y
 }, m) {
-  const [g, u] = B(!1), [f, p] = B(!1), b = ht[e], v = U[e], x = (b.height - b.thumb) / 2, k = b.width - b.thumb - x * 2, C = {
+  const [g, u] = A(!1), [f, p] = A(!1), b = ht[e], v = U[e], x = (b.height - b.thumb) / 2, k = b.width - b.thumb - x * 2, C = {
     display: "inline-flex",
     alignItems: "flex-start",
     gap: le.xl,
     cursor: i ? "not-allowed" : "pointer",
     opacity: i ? Le.disabled : 1
-  }, T = {
+  }, I = {
     position: "relative",
     width: b.width,
     height: b.height,
@@ -2895,7 +2896,7 @@ const Ar = z(function({
       onMouseUp: () => p(!1),
       onMouseLeave: () => p(!1),
       children: [
-        /* @__PURE__ */ w("span", { style: T, children: [
+        /* @__PURE__ */ w("span", { style: I, children: [
           /* @__PURE__ */ s(
             "input",
             {
@@ -2947,24 +2948,24 @@ const jr = {
   onBlur: v,
   ...x
 }, k) {
-  const [C, T] = B(!1), [h, D] = B(0), M = J(null), N = k || M, $ = jr[e], H = $.fontSize * $.lineHeight, F = H * a + $.padding * 2, I = H * l + $.padding * 2, E = R(() => {
+  const [C, I] = A(!1), [h, D] = A(0), M = Z(null), N = k || M, $ = jr[e], R = $.fontSize * $.lineHeight, H = R * a + $.padding * 2, T = R * l + $.padding * 2, F = E(() => {
     const j = N.current;
     if (!j || !n) return;
     j.style.height = "auto";
-    const re = j.scrollHeight, _ = Math.min(Math.max(re, F), I);
+    const re = j.scrollHeight, _ = Math.min(Math.max(re, H), T);
     j.style.height = `${_}px`;
-  }, [n, F, I, N]);
-  K(() => {
-    E();
-  }, [u, E]), K(() => {
+  }, [n, H, T, N]);
+  Y(() => {
+    F();
+  }, [u, F]), Y(() => {
     const j = String(u ?? f ?? "");
     D(j.length);
   }, [u, f]);
   const V = () => {
     const j = {
       width: "100%",
-      minHeight: F,
-      maxHeight: n ? I : void 0,
+      minHeight: H,
+      maxHeight: n ? T : void 0,
       padding: $.padding,
       fontSize: $.fontSize,
       lineHeight: $.lineHeight,
@@ -2982,7 +2983,7 @@ const jr = {
   }, W = {
     position: "relative",
     width: "100%"
-  }, A = {
+  }, B = {
     position: "absolute",
     bottom: 8,
     right: 12,
@@ -2993,9 +2994,9 @@ const jr = {
   }, O = (j) => {
     D(j.target.value.length), p == null || p(j);
   }, q = (j) => {
-    T(!0), b == null || b(j);
+    I(!0), b == null || b(j);
   }, P = (j) => {
-    T(!1), v == null || v(j);
+    I(!1), v == null || v(j);
   };
   return /* @__PURE__ */ w(
     "div",
@@ -3028,7 +3029,7 @@ const jr = {
             ...x
           }
         ),
-        i && /* @__PURE__ */ w("span", { style: A, children: [
+        i && /* @__PURE__ */ w("span", { style: B, children: [
           h,
           d ? `/${d}` : ""
         ] })
@@ -3053,7 +3054,7 @@ const Or = {
   checked: c,
   ...y
 }, m) {
-  const [g, u] = B(!1), [f, p] = B(!1), b = Or[e], v = {
+  const [g, u] = A(!1), [f, p] = A(!1), b = Or[e], v = {
     display: "inline-flex",
     alignItems: "flex-start",
     gap: b.gap,
@@ -3086,7 +3087,7 @@ const Or = {
     backgroundColor: "white",
     transform: c ? "scale(1)" : "scale(0)",
     transition: "transform 150ms ease-out"
-  }, T = {
+  }, I = {
     position: "absolute",
     width: b.radio,
     height: b.radio,
@@ -3124,7 +3125,7 @@ const Or = {
               type: "radio",
               disabled: a,
               checked: c,
-              style: T,
+              style: I,
               onFocus: () => p(!0),
               onBlur: () => p(!1),
               "data-testid": d,
@@ -3154,7 +3155,7 @@ function _r({
   className: c,
   style: y
 }) {
-  const [m, g] = B(t ?? ""), u = e ?? m, f = (v) => {
+  const [m, g] = A(t ?? ""), u = e ?? m, f = (v) => {
     e === void 0 && g(v), o == null || o(v);
   }, p = {
     display: "flex",
@@ -3212,34 +3213,34 @@ const Xr = {
   testId: f,
   ...p
 }, b) {
-  const [v, x] = B(l), [k, C] = B(!1), [T, h] = B(!1), D = J(null), M = a ?? v, N = Xr[e], $ = (M - t) / (o - t) * 100, H = R(
+  const [v, x] = A(l), [k, C] = A(!1), [I, h] = A(!1), D = Z(null), M = a ?? v, N = Xr[e], $ = (M - t) / (o - t) * 100, R = E(
     (j) => {
       const re = Math.max(t, Math.min(o, j));
       a === void 0 && x(re), i == null || i(re);
     },
     [a, t, o, i]
   );
-  K(() => {
+  Y(() => {
     const j = D.current;
     if (!j) return;
     const re = (_) => {
-      const Y = _.target;
-      H(parseFloat(Y.value));
+      const K = _.target;
+      R(parseFloat(K.value));
     };
     return j.addEventListener("input", re), () => j.removeEventListener("input", re);
-  }, [H]);
-  const F = {
+  }, [R]);
+  const H = {
     display: "flex",
     flexDirection: "column",
     gap: 8,
     opacity: m ? 0.5 : 1,
     ...u
-  }, I = {
+  }, T = {
     display: "flex",
     alignItems: "center",
     justifyContent: "space-between",
     gap: 12
-  }, E = {
+  }, F = {
     fontSize: N.fontSize,
     fontWeight: 500,
     color: "var(--brycks-foreground-default)"
@@ -3254,7 +3255,7 @@ const Xr = {
     alignItems: "center",
     height: N.thumb,
     cursor: m ? "not-allowed" : "pointer"
-  }, A = {
+  }, B = {
     position: "absolute",
     width: "100%",
     height: N.track,
@@ -3276,7 +3277,7 @@ const Xr = {
     borderRadius: "50%",
     backgroundColor: "white",
     border: `2px solid ${m ? "var(--brycks-foreground-muted)" : "var(--brycks-primary-default)"}`,
-    boxShadow: k || T ? "var(--brycks-shadow-md)" : "var(--brycks-shadow-sm)",
+    boxShadow: k || I ? "var(--brycks-shadow-md)" : "var(--brycks-shadow-sm)",
     transform: k ? "scale(1.1)" : "scale(1)",
     transition: k ? "transform 100ms ease-out, box-shadow 100ms ease-out" : "all 100ms ease-out",
     pointerEvents: "none"
@@ -3289,9 +3290,9 @@ const Xr = {
     opacity: 0,
     cursor: m ? "not-allowed" : "pointer"
   };
-  return /* @__PURE__ */ w("div", { className: S("brycks-slider", `brycks-slider--${e}`, g), style: F, children: [
-    (y || d) && /* @__PURE__ */ w("div", { style: I, children: [
-      y && /* @__PURE__ */ s("span", { style: E, children: y }),
+  return /* @__PURE__ */ w("div", { className: S("brycks-slider", `brycks-slider--${e}`, g), style: H, children: [
+    (y || d) && /* @__PURE__ */ w("div", { style: T, children: [
+      y && /* @__PURE__ */ s("span", { style: F, children: y }),
       d && /* @__PURE__ */ s("span", { style: V, children: c(M) })
     ] }),
     /* @__PURE__ */ w(
@@ -3301,7 +3302,7 @@ const Xr = {
         onMouseEnter: () => h(!0),
         onMouseLeave: () => h(!1),
         children: [
-          /* @__PURE__ */ s("div", { style: A }),
+          /* @__PURE__ */ s("div", { style: B }),
           /* @__PURE__ */ s("div", { style: O }),
           /* @__PURE__ */ s("div", { style: q }),
           /* @__PURE__ */ s(
@@ -3350,7 +3351,7 @@ const Kr = {
   testId: g,
   ...u
 }, f) {
-  const [p, b] = B(!1), [v, x] = B(!1), k = Kr[e], C = i || !!l, T = {
+  const [p, b] = A(!1), [v, x] = A(!1), k = Kr[e], C = i || !!l, I = {
     display: "flex",
     flexDirection: "column",
     gap: 6,
@@ -3364,7 +3365,7 @@ const Kr = {
     display: "flex",
     alignItems: "center"
   }, M = () => {
-    const H = {
+    const R = {
       width: "100%",
       height: k.height,
       fontSize: k.fontSize,
@@ -3379,7 +3380,7 @@ const Kr = {
       cursor: c ? "not-allowed" : "pointer"
     };
     return t === "flushed" ? {
-      ...H,
+      ...R,
       border: "none",
       borderBottom: `2px solid ${C ? "var(--brycks-error-default)" : p ? "var(--brycks-primary-default)" : "var(--brycks-border-default)"}`,
       borderRadius: 0,
@@ -3387,7 +3388,7 @@ const Kr = {
       paddingRight: 0,
       backgroundColor: "transparent"
     } : {
-      ...H,
+      ...R,
       border: `1px solid ${C ? "var(--brycks-error-default)" : p ? "var(--brycks-primary-default)" : v ? "var(--brycks-border-strong)" : "var(--brycks-border-default)"}`,
       borderRadius: "var(--brycks-radius-md)",
       boxShadow: p && !C ? "0 0 0 3px var(--brycks-primary-100)" : p && C ? "0 0 0 3px var(--brycks-error-100)" : void 0
@@ -3410,7 +3411,7 @@ const Kr = {
     "div",
     {
       className: S("brycks-date-input", `brycks-date-input--${e}`, `brycks-date-input--${t}`, y),
-      style: T,
+      style: I,
       children: [
         n && /* @__PURE__ */ s("label", { style: h, children: n }),
         /* @__PURE__ */ w(
@@ -3469,34 +3470,34 @@ const Zr = z(function({
   testId: p,
   ...b
 }, v) {
-  const [x, k] = B(!1), [C, T] = B(!1), h = J(null), D = qr[e], M = c || !!d, N = R(
+  const [x, k] = A(!1), [C, I] = A(!1), h = Z(null), D = qr[e], M = c || !!d, N = E(
     (X) => {
       if (!X || X.length === 0) return;
-      let Z = Array.from(X);
-      a && (Z = Z.filter((ue) => ue.size <= a)), !n && Z.length > 1 && (Z = [Z[0]]), y == null || y(Z);
+      let Q = Array.from(X);
+      a && (Q = Q.filter((ue) => ue.size <= a)), !n && Q.length > 1 && (Q = [Q[0]]), y == null || y(Q);
     },
     [a, n, y]
-  ), $ = R((X) => {
+  ), $ = E((X) => {
     X.preventDefault(), X.stopPropagation(), g || k(!0);
-  }, [g]), H = R((X) => {
+  }, [g]), R = E((X) => {
     X.preventDefault(), X.stopPropagation(), k(!1);
-  }, []), F = R(
+  }, []), H = E(
     (X) => {
       X.preventDefault(), X.stopPropagation(), k(!1), g || N(X.dataTransfer.files);
     },
     [g, N]
-  ), I = R(
+  ), T = E(
     (X) => {
       N(X.target.files), h.current && (h.current.value = "");
     },
     [N]
-  ), E = R(() => {
+  ), F = E(() => {
     var X;
     g || (X = h.current) == null || X.click();
-  }, [g]), V = R(
+  }, [g]), V = E(
     (X) => {
-      var Z;
-      (X.key === "Enter" || X.key === " ") && !g && (X.preventDefault(), (Z = h.current) == null || Z.click());
+      var Q;
+      (X.key === "Enter" || X.key === " ") && !g && (X.preventDefault(), (Q = h.current) == null || Q.click());
     },
     [g]
   ), W = {
@@ -3504,7 +3505,7 @@ const Zr = z(function({
     flexDirection: "column",
     gap: 6,
     ...f
-  }, A = {
+  }, B = {
     fontSize: D.fontSize,
     fontWeight: 500,
     color: "var(--brycks-foreground-default)"
@@ -3542,7 +3543,7 @@ const Zr = z(function({
   }, _ = {
     color: "var(--brycks-primary-default)",
     fontWeight: 500
-  }, Y = {
+  }, K = {
     fontSize: D.fontSize - 2,
     color: "var(--brycks-error-default)"
   }, ie = n ? "Drag files here or click to browse" : "Drag a file here or click to browse";
@@ -3552,18 +3553,18 @@ const Zr = z(function({
       className: S("brycks-file-input", `brycks-file-input--${e}`, `brycks-file-input--${t}`, u),
       style: W,
       children: [
-        l && /* @__PURE__ */ s("label", { style: A, children: l }),
+        l && /* @__PURE__ */ s("label", { style: B, children: l }),
         /* @__PURE__ */ w(
           "div",
           {
             style: O,
             onDragOver: $,
-            onDragLeave: H,
-            onDrop: F,
-            onClick: E,
+            onDragLeave: R,
+            onDrop: H,
+            onClick: F,
             onKeyDown: V,
-            onFocus: () => T(!0),
-            onBlur: () => T(!1),
+            onFocus: () => I(!0),
+            onBlur: () => I(!1),
             tabIndex: g ? -1 : 0,
             role: "button",
             "aria-label": String(i) || ie,
@@ -3579,7 +3580,7 @@ const Zr = z(function({
             ]
           }
         ),
-        d && /* @__PURE__ */ s("span", { style: Y, children: d }),
+        d && /* @__PURE__ */ s("span", { style: K, children: d }),
         /* @__PURE__ */ s(
           "input",
           {
@@ -3590,7 +3591,7 @@ const Zr = z(function({
             accept: o,
             multiple: n,
             disabled: g,
-            onChange: I,
+            onChange: T,
             style: { display: "none" },
             "data-testid": p,
             ...b
@@ -3606,14 +3607,14 @@ function Ie(r) {
   return `${r}-${++Qr}`;
 }
 function Jr(r = "brycks") {
-  const [e, t] = B("");
-  return K(() => {
+  const [e, t] = A("");
+  return Y(() => {
     t(Ie(r));
   }, [r]), e || Ie(r);
 }
 function Aa(r, e = "brycks") {
-  const [t, o] = B([]);
-  return K(() => {
+  const [t, o] = A([]);
+  return Y(() => {
     o(Array.from({ length: r }, () => Ie(e)));
   }, [r, e]), t.length ? t : Array.from({ length: r }, () => Ie(e));
 }
@@ -3638,10 +3639,10 @@ const eo = {
   testId: f,
   ...p
 }, b) {
-  const v = Jr("field"), x = d || v, k = `${x}-helper`, C = `${x}-error`, T = eo[e], h = l || !!a, D = {
+  const v = Jr("field"), x = d || v, k = `${x}-helper`, C = `${x}-error`, I = eo[e], h = l || !!a, D = {
     display: "flex",
     flexDirection: c === "horizontal" ? "row" : "column",
-    gap: c === "horizontal" ? 16 : T.gap,
+    gap: c === "horizontal" ? 16 : I.gap,
     alignItems: c === "horizontal" ? "flex-start" : "stretch",
     opacity: i ? 0.6 : 1,
     ...g
@@ -3655,23 +3656,23 @@ const eo = {
       paddingTop: e === "lg" ? 14 : e === "md" ? 10 : 8
     }
   }, N = {
-    fontSize: T.labelSize,
+    fontSize: I.labelSize,
     fontWeight: 500,
     color: i ? "var(--brycks-foreground-muted)" : "var(--brycks-foreground-default)",
     lineHeight: 1.4
   }, $ = {
     color: "var(--brycks-error-default)",
     marginLeft: 2
-  }, H = {
+  }, R = {
     display: "flex",
     flexDirection: "column",
-    gap: T.gap,
+    gap: I.gap,
     flex: 1
-  }, F = {
-    fontSize: T.helperSize,
+  }, H = {
+    fontSize: I.helperSize,
     color: h ? "var(--brycks-error-default)" : "var(--brycks-foreground-muted)",
     lineHeight: 1.4
-  }, I = {
+  }, T = {
     id: x,
     "aria-describedby": n || a ? a ? C : k : void 0,
     "aria-invalid": h ? !0 : void 0
@@ -3689,13 +3690,13 @@ const eo = {
           t,
           o && /* @__PURE__ */ s("span", { style: $, "aria-hidden": "true", children: "*" })
         ] }) }),
-        /* @__PURE__ */ w("div", { style: H, children: [
-          typeof u == "function" ? u(I) : u,
+        /* @__PURE__ */ w("div", { style: R, children: [
+          typeof u == "function" ? u(T) : u,
           (n || a) && /* @__PURE__ */ s(
             "span",
             {
               id: a ? C : k,
-              style: F,
+              style: H,
               role: a ? "alert" : void 0,
               children: a || n
             }
@@ -3927,7 +3928,7 @@ const lo = {
   }, C = {
     ...k,
     color: "var(--brycks-error-default)"
-  }, T = {
+  }, I = {
     ...k,
     color: "var(--brycks-foreground-muted)"
   };
@@ -3958,7 +3959,7 @@ const lo = {
         ),
         y,
         i && /* @__PURE__ */ s("span", { className: "brycks-form-group__error", style: C, role: "alert", children: i }),
-        !i && d && /* @__PURE__ */ s("span", { className: "brycks-form-group__helper", style: T, children: d })
+        !i && d && /* @__PURE__ */ s("span", { className: "brycks-form-group__helper", style: I, children: d })
       ]
     }
   );
@@ -3978,42 +3979,42 @@ const uo = z(
     className: y,
     testId: m
   }, g) {
-    const [u, f] = B(!1), p = J(null), b = R(
-      (I) => {
-        I.preventDefault(), I.stopPropagation(), a || f(!0);
+    const [u, f] = A(!1), p = Z(null), b = E(
+      (T) => {
+        T.preventDefault(), T.stopPropagation(), a || f(!0);
       },
       [a]
-    ), v = R((I) => {
-      I.preventDefault(), I.stopPropagation(), f(!1);
-    }, []), x = R(
-      (I) => {
-        I.preventDefault(), I.stopPropagation(), a || f(!0);
+    ), v = E((T) => {
+      T.preventDefault(), T.stopPropagation(), f(!1);
+    }, []), x = E(
+      (T) => {
+        T.preventDefault(), T.stopPropagation(), a || f(!0);
       },
       [a]
-    ), k = R(
-      (I) => {
-        if (!I || I.length === 0) return;
-        let E = Array.from(I);
-        n && (E = E.filter((V) => V.size <= n)), !o && E.length > 1 && (E = [E[0]]), e == null || e(E);
+    ), k = E(
+      (T) => {
+        if (!T || T.length === 0) return;
+        let F = Array.from(T);
+        n && (F = F.filter((V) => V.size <= n)), !o && F.length > 1 && (F = [F[0]]), e == null || e(F);
       },
       [n, o, e]
-    ), C = R(
-      (I) => {
-        I.preventDefault(), I.stopPropagation(), f(!1), !a && k(I.dataTransfer.files);
+    ), C = E(
+      (T) => {
+        T.preventDefault(), T.stopPropagation(), f(!1), !a && k(T.dataTransfer.files);
       },
       [a, k]
-    ), T = R(() => {
-      var I;
-      a || (I = p.current) == null || I.click();
-    }, [a]), h = R(
-      (I) => {
-        k(I.target.files), p.current && (p.current.value = "");
+    ), I = E(() => {
+      var T;
+      a || (T = p.current) == null || T.click();
+    }, [a]), h = E(
+      (T) => {
+        k(T.target.files), p.current && (p.current.value = "");
       },
       [k]
-    ), D = R(
-      (I) => {
-        var E;
-        (I.key === "Enter" || I.key === " ") && !a && (I.preventDefault(), (E = p.current) == null || E.click());
+    ), D = E(
+      (T) => {
+        var F;
+        (T.key === "Enter" || T.key === " ") && !a && (T.preventDefault(), (F = p.current) == null || F.click());
       },
       [a]
     ), M = {
@@ -4036,11 +4037,11 @@ const uo = z(
       fontWeight: 500,
       color: "var(--brycks-foreground-default)",
       marginBottom: d ? 4 : 0
-    }, H = {
+    }, R = {
       fontFamily: "var(--brycks-font-sans)",
       fontSize: "var(--brycks-font-size-xs)",
       color: "var(--brycks-foreground-muted)"
-    }, F = {
+    }, H = {
       fontFamily: "var(--brycks-font-sans)",
       fontSize: "var(--brycks-font-size-xs)",
       color: "var(--brycks-error-default)",
@@ -4058,7 +4059,7 @@ const uo = z(
           y
         ),
         style: M,
-        onClick: T,
+        onClick: I,
         onDragEnter: b,
         onDragLeave: v,
         onDragOver: x,
@@ -4083,8 +4084,8 @@ const uo = z(
           ),
           i && /* @__PURE__ */ s("div", { style: N, children: i }),
           l && /* @__PURE__ */ s("div", { style: $, children: l }),
-          d && /* @__PURE__ */ s("div", { style: H, children: d }),
-          c && /* @__PURE__ */ s("div", { style: F, children: c })
+          d && /* @__PURE__ */ s("div", { style: R, children: d }),
+          c && /* @__PURE__ */ s("div", { style: H, children: c })
         ]
       }
     );
@@ -4208,37 +4209,38 @@ const go = z(function({
   children: g,
   ...u
 }, f) {
-  const p = J(null), b = J(null);
-  K(() => {
+  const p = Z(null), b = Z(null), v = Z(!1);
+  Y(() => {
+    var H;
+    e && !v.current ? (b.current = document.activeElement, v.current = !0) : !e && v.current && (document.activeElement instanceof HTMLElement && document.activeElement.blur(), (H = b.current) == null || H.focus(), b.current = null, v.current = !1);
+  }, [e]), Y(() => {
     if (!e) return;
-    b.current = document.activeElement;
     const H = p.current;
     H && H.focus();
-    const F = (I) => {
-      if (I.key === "Escape" && i) {
+    const T = (F) => {
+      if (F.key === "Escape" && i) {
         t();
         return;
       }
-      if (I.key === "Tab" && H) {
-        const E = H.querySelectorAll(
+      if (F.key === "Tab" && H) {
+        const V = H.querySelectorAll(
           'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
-        ), V = E[0], W = E[E.length - 1];
-        I.shiftKey && document.activeElement === V ? (I.preventDefault(), W == null || W.focus()) : !I.shiftKey && document.activeElement === W && (I.preventDefault(), V == null || V.focus());
+        ), W = V[0], B = V[V.length - 1];
+        F.shiftKey && document.activeElement === W ? (F.preventDefault(), B == null || B.focus()) : !F.shiftKey && document.activeElement === B && (F.preventDefault(), W == null || W.focus());
       }
     };
-    return document.addEventListener("keydown", F), document.body.style.overflow = "hidden", () => {
-      var I;
-      document.removeEventListener("keydown", F), document.body.style.overflow = "", (I = b.current) == null || I.focus();
+    return document.addEventListener("keydown", T), document.body.style.overflow = "hidden", () => {
+      document.removeEventListener("keydown", T), document.body.style.overflow = "";
     };
   }, [e, i, t]);
-  const v = R(
+  const x = E(
     (H) => {
       H.target === H.currentTarget && l && t();
     },
     [l, t]
   );
   if (!e) return null;
-  const x = {
+  const k = {
     position: "fixed",
     inset: 0,
     zIndex: "var(--brycks-z-modal)",
@@ -4249,7 +4251,7 @@ const go = z(function({
     backgroundColor: "var(--brycks-background-overlay)",
     backdropFilter: "blur(4px)",
     animation: "brycks-fade-in 200ms ease-out"
-  }, k = {
+  }, C = {
     position: "relative",
     width: "100%",
     maxWidth: mo[o],
@@ -4263,27 +4265,27 @@ const go = z(function({
     animation: "brycks-scale-in 200ms cubic-bezier(0.34, 1.56, 0.64, 1)",
     outline: "none",
     ...y
-  }, C = {
+  }, I = {
     display: "flex",
     alignItems: "flex-start",
     justifyContent: "space-between",
     padding: "20px 24px",
     borderBottom: "1px solid var(--brycks-border-muted)"
-  }, T = {
+  }, h = {
     display: "flex",
     flexDirection: "column",
     gap: 4
-  }, h = {
+  }, D = {
     fontSize: 18,
     fontWeight: 600,
     color: "var(--brycks-foreground-default)",
     margin: 0,
     lineHeight: 1.3
-  }, D = {
+  }, M = {
     fontSize: 14,
     color: "var(--brycks-foreground-muted)",
     margin: 0
-  }, M = {
+  }, N = {
     display: "flex",
     alignItems: "center",
     justifyContent: "center",
@@ -4294,11 +4296,11 @@ const go = z(function({
     transition: "all 150ms ease-out",
     marginLeft: 12,
     flexShrink: 0
-  }, N = {
+  }, $ = {
     flex: 1,
     overflow: "auto",
     padding: 24
-  }, $ = /* @__PURE__ */ w(ne, { children: [
+  }, R = /* @__PURE__ */ w(ne, { children: [
     /* @__PURE__ */ s("style", { children: `
           @keyframes brycks-fade-in {
             from { opacity: 0; }
@@ -4313,9 +4315,8 @@ const go = z(function({
       "div",
       {
         className: "brycks-modal-overlay",
-        style: x,
-        onClick: v,
-        "aria-hidden": "true",
+        style: k,
+        onClick: x,
         children: /* @__PURE__ */ w(
           "div",
           {
@@ -4327,22 +4328,22 @@ const go = z(function({
             "aria-labelledby": n ? "brycks-modal-title" : void 0,
             "aria-describedby": a ? "brycks-modal-description" : void 0,
             className: S("brycks-modal", `brycks-modal--${o}`, c),
-            style: k,
+            style: C,
             tabIndex: -1,
             "data-testid": m,
             ...u,
             children: [
-              (n || d) && /* @__PURE__ */ w("div", { className: "brycks-modal-header", style: C, children: [
-                /* @__PURE__ */ w("div", { style: T, children: [
-                  n && /* @__PURE__ */ s("h2", { id: "brycks-modal-title", style: h, children: n }),
-                  a && /* @__PURE__ */ s("p", { id: "brycks-modal-description", style: D, children: a })
+              (n || d) && /* @__PURE__ */ w("div", { className: "brycks-modal-header", style: I, children: [
+                /* @__PURE__ */ w("div", { style: h, children: [
+                  n && /* @__PURE__ */ s("h2", { id: "brycks-modal-title", style: D, children: n }),
+                  a && /* @__PURE__ */ s("p", { id: "brycks-modal-description", style: M, children: a })
                 ] }),
                 d && /* @__PURE__ */ s(
                   "button",
                   {
                     type: "button",
                     className: "brycks-modal-close",
-                    style: M,
+                    style: N,
                     onClick: t,
                     "aria-label": "Close modal",
                     onMouseEnter: (H) => {
@@ -4355,14 +4356,14 @@ const go = z(function({
                   }
                 )
               ] }),
-              /* @__PURE__ */ s("div", { className: "brycks-modal-content", style: N, children: g })
+              /* @__PURE__ */ s("div", { className: "brycks-modal-content", style: $, children: g })
             ]
           }
         )
       }
     )
   ] });
-  return ve($, document.body);
+  return ve(R, document.body);
 });
 go.displayName = "Modal";
 const po = {
@@ -4497,7 +4498,7 @@ const po = {
     fontWeight: 600,
     marginBottom: g ? 4 : 0,
     color: b.color
-  }, T = {
+  }, I = {
     fontSize: 14,
     lineHeight: 1.5,
     color: t === "solid" ? b.color : "var(--brycks-foreground-muted)"
@@ -4535,7 +4536,7 @@ const po = {
         a && /* @__PURE__ */ s("span", { className: "brycks-alert-icon", style: x, children: n ?? p.icon }),
         /* @__PURE__ */ w("div", { className: "brycks-alert-content", style: k, children: [
           o && /* @__PURE__ */ s("div", { className: "brycks-alert-title", style: C, children: o }),
-          g && /* @__PURE__ */ s("div", { className: "brycks-alert-description", style: T, children: g })
+          g && /* @__PURE__ */ s("div", { className: "brycks-alert-description", style: I, children: g })
         ] }),
         (l || i) && /* @__PURE__ */ w("div", { className: "brycks-alert-actions", style: h, children: [
           l,
@@ -4572,38 +4573,38 @@ const ko = z(function({
   children: i,
   ...d
 }, c) {
-  const [y, m] = B(!1), [g, u] = B({ top: 0, left: 0 }), f = J(null), p = J(null), b = J(null), v = Te(), x = We(), k = R(() => {
+  const [y, m] = A(!1), [g, u] = A({ top: 0, left: 0 }), f = Z(null), p = Z(null), b = Z(null), v = Te(), x = We(), k = E(() => {
     if (!f.current || !p.current) return;
-    const N = f.current.getBoundingClientRect(), $ = p.current.getBoundingClientRect(), H = 8;
-    let F = 0, I = 0;
+    const N = f.current.getBoundingClientRect(), $ = p.current.getBoundingClientRect(), R = 8;
+    let H = 0, T = 0;
     switch (t) {
       case "top":
-        F = N.top - $.height - H, I = N.left + (N.width - $.width) / 2;
+        H = N.top - $.height - R, T = N.left + (N.width - $.width) / 2;
         break;
       case "bottom":
-        F = N.bottom + H, I = N.left + (N.width - $.width) / 2;
+        H = N.bottom + R, T = N.left + (N.width - $.width) / 2;
         break;
       case "left":
-        F = N.top + (N.height - $.height) / 2, I = N.left - $.width - H;
+        H = N.top + (N.height - $.height) / 2, T = N.left - $.width - R;
         break;
       case "right":
-        F = N.top + (N.height - $.height) / 2, I = N.right + H;
+        H = N.top + (N.height - $.height) / 2, T = N.right + R;
         break;
     }
-    const E = 8;
-    I = Math.max(E, Math.min(I, window.innerWidth - $.width - E)), F = Math.max(E, Math.min(F, window.innerHeight - $.height - E)), u({ top: F, left: I });
+    const F = 8;
+    T = Math.max(F, Math.min(T, window.innerWidth - $.width - F)), H = Math.max(F, Math.min(H, window.innerHeight - $.height - F)), u({ top: H, left: T });
   }, [t]);
-  K(() => (y && (k(), window.addEventListener("scroll", k, !0), window.addEventListener("resize", k)), () => {
+  Y(() => (y && (k(), window.addEventListener("scroll", k, !0), window.addEventListener("resize", k)), () => {
     window.removeEventListener("scroll", k, !0), window.removeEventListener("resize", k);
   }), [y, k]);
   const C = () => {
     n || (b.current = setTimeout(() => {
       m(!0);
     }, o));
-  }, T = () => {
+  }, I = () => {
     b.current && clearTimeout(b.current), m(!1);
   };
-  K(() => () => {
+  Y(() => () => {
     b.current && clearTimeout(b.current);
   }, []);
   const h = {
@@ -4642,9 +4643,9 @@ const ko = z(function({
         ref: f,
         style: h,
         onMouseEnter: C,
-        onMouseLeave: T,
+        onMouseLeave: I,
         onFocus: C,
-        onBlur: T,
+        onBlur: I,
         "aria-describedby": y ? v : void 0,
         children: i
       }
@@ -4729,8 +4730,8 @@ const Ge = z(function({
   testId: g,
   ...u
 }, f) {
-  const [p, b] = B(n), [v, x] = B(!1);
-  if (K(() => {
+  const [p, b] = A(n), [v, x] = A(!1);
+  if (Y(() => {
     if (n)
       b(!0), x(!1);
     else {
@@ -4738,7 +4739,7 @@ const Ge = z(function({
       const $ = setTimeout(() => b(!1), 200);
       return () => clearTimeout($);
     }
-  }, [n]), K(() => {
+  }, [n]), Y(() => {
     if (!n || a === 0) return;
     const $ = setTimeout(() => {
       l == null || l();
@@ -4757,7 +4758,7 @@ const Ge = z(function({
     maxWidth: 400,
     animation: v ? "brycks-toast-out 200ms ease-in forwards" : "brycks-toast-in 200ms ease-out",
     ...m
-  }, T = {
+  }, I = {
     color: k.icon,
     flexShrink: 0,
     marginTop: 2
@@ -4809,7 +4810,7 @@ const Ge = z(function({
         "data-testid": g,
         ...u,
         children: [
-          /* @__PURE__ */ s("span", { style: T, children: c || /* @__PURE__ */ s(xo, { intent: e }) }),
+          /* @__PURE__ */ s("span", { style: I, children: c || /* @__PURE__ */ s(xo, { intent: e }) }),
           /* @__PURE__ */ w("div", { style: h, children: [
             t && /* @__PURE__ */ s("span", { style: D, children: t }),
             o && /* @__PURE__ */ s("span", { style: M, children: o }),
@@ -4858,11 +4859,11 @@ function Va({
   position: e = "top-right",
   maxToasts: t = 5
 }) {
-  const [o, n] = B([]), [a, l] = B(!1);
-  K(() => {
+  const [o, n] = A([]), [a, l] = A(!1);
+  Y(() => {
     l(!0);
   }, []);
-  const i = R(
+  const i = E(
     (g) => {
       const u = `toast-${++zo}`;
       return n((f) => {
@@ -4871,9 +4872,9 @@ function Va({
       }), u;
     },
     [t]
-  ), d = R((g) => {
+  ), d = E((g) => {
     n((u) => u.filter((f) => f.id !== g));
-  }, []), c = R(() => {
+  }, []), c = E(() => {
     n([]);
   }, []), y = {
     position: "fixed",
@@ -4920,37 +4921,37 @@ const No = z(function({
   testId: u,
   ...f
 }, p) {
-  const b = J(null), v = J(null);
-  K(() => {
+  const b = Z(null), v = Z(null);
+  Y(() => {
     if (!e) return;
     v.current = document.activeElement;
-    const I = b.current;
-    I && I.focus();
-    const E = (V) => {
+    const T = b.current;
+    T && T.focus();
+    const F = (V) => {
       if (V.key === "Escape" && i) {
         t();
         return;
       }
-      if (V.key === "Tab" && I) {
-        const W = I.querySelectorAll(
+      if (V.key === "Tab" && T) {
+        const W = T.querySelectorAll(
           'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
-        ), A = W[0], O = W[W.length - 1];
-        V.shiftKey && document.activeElement === A ? (V.preventDefault(), O == null || O.focus()) : !V.shiftKey && document.activeElement === O && (V.preventDefault(), A == null || A.focus());
+        ), B = W[0], O = W[W.length - 1];
+        V.shiftKey && document.activeElement === B ? (V.preventDefault(), O == null || O.focus()) : !V.shiftKey && document.activeElement === O && (V.preventDefault(), B == null || B.focus());
       }
     };
-    return document.addEventListener("keydown", E), document.body.style.overflow = "hidden", () => {
+    return document.addEventListener("keydown", F), document.body.style.overflow = "hidden", () => {
       var V;
-      document.removeEventListener("keydown", E), document.body.style.overflow = "", (V = v.current) == null || V.focus();
+      document.removeEventListener("keydown", F), document.body.style.overflow = "", (V = v.current) == null || V.focus();
     };
   }, [e, i, t]);
-  const x = R(
-    (I) => {
-      I.target === I.currentTarget && l && t();
+  const x = E(
+    (T) => {
+      T.target === T.currentTarget && l && t();
     },
     [l, t]
   );
   if (!e) return null;
-  const k = o === "left" || o === "right", C = Co[n], T = {
+  const k = o === "left" || o === "right", C = Co[n], I = {
     position: "fixed",
     inset: 0,
     zIndex: "var(--brycks-z-drawer)",
@@ -4959,7 +4960,7 @@ const No = z(function({
     animation: "brycks-drawer-overlay-in 200ms ease-out"
   }, D = {
     ...(() => {
-      const I = {
+      const T = {
         position: "absolute",
         backgroundColor: "var(--brycks-background-elevated)",
         boxShadow: "var(--brycks-shadow-2xl)",
@@ -4968,14 +4969,14 @@ const No = z(function({
         overflow: "hidden"
       };
       return k ? {
-        ...I,
+        ...T,
         top: 0,
         bottom: 0,
         [o]: 0,
         width: C,
         maxWidth: "100vw"
       } : {
-        ...I,
+        ...T,
         left: 0,
         right: 0,
         [o]: 0,
@@ -5007,11 +5008,11 @@ const No = z(function({
     borderRadius: "var(--brycks-radius-md)",
     color: "var(--brycks-foreground-muted)",
     transition: "all 150ms ease-out"
-  }, H = {
+  }, R = {
     flex: 1,
     overflow: "auto",
     padding: 20
-  }, F = /* @__PURE__ */ w(ne, { children: [
+  }, H = /* @__PURE__ */ w(ne, { children: [
     /* @__PURE__ */ s("style", { children: `
           @keyframes brycks-drawer-overlay-in {
             from { opacity: 0; }
@@ -5038,14 +5039,14 @@ const No = z(function({
       "div",
       {
         className: "brycks-drawer-overlay",
-        style: T,
+        style: I,
         onClick: x,
         "aria-hidden": "true",
         children: /* @__PURE__ */ w(
           "div",
           {
-            ref: (I) => {
-              b.current = I, typeof p == "function" ? p(I) : p && (p.current = I);
+            ref: (T) => {
+              b.current = T, typeof p == "function" ? p(T) : p && (p.current = T);
             },
             role: "dialog",
             "aria-modal": "true",
@@ -5066,29 +5067,29 @@ const No = z(function({
                     style: $,
                     onClick: t,
                     "aria-label": "Close drawer",
-                    onMouseEnter: (I) => {
-                      I.currentTarget.style.backgroundColor = "var(--brycks-background-muted)", I.currentTarget.style.color = "var(--brycks-foreground-default)";
+                    onMouseEnter: (T) => {
+                      T.currentTarget.style.backgroundColor = "var(--brycks-background-muted)", T.currentTarget.style.color = "var(--brycks-foreground-default)";
                     },
-                    onMouseLeave: (I) => {
-                      I.currentTarget.style.backgroundColor = "transparent", I.currentTarget.style.color = "var(--brycks-foreground-muted)";
+                    onMouseLeave: (T) => {
+                      T.currentTarget.style.backgroundColor = "transparent", T.currentTarget.style.color = "var(--brycks-foreground-muted)";
                     },
                     children: /* @__PURE__ */ s(Mo, {})
                   }
                 )
               ] }),
-              /* @__PURE__ */ s("div", { className: "brycks-drawer-content", style: H, children: g })
+              /* @__PURE__ */ s("div", { className: "brycks-drawer-content", style: R, children: g })
             ]
           }
         )
       }
     )
   ] });
-  return ve(F, document.body);
+  return ve(H, document.body);
 });
 No.displayName = "Drawer";
 function Io(r, e = {}) {
-  const { enabled: t = !0, eventType: o = "mousedown" } = e, n = J(null);
-  return K(() => {
+  const { enabled: t = !0, eventType: o = "mousedown" } = e, n = Z(null);
+  return Y(() => {
     if (!t) return;
     const a = (l) => {
       const i = n.current;
@@ -5117,102 +5118,102 @@ const To = z(function({
   testId: p,
   ...b
 }, v) {
-  const [x, k] = B(l), [C, T] = B({ top: 0, left: 0 }), [h, D] = B(!1), M = J(null), N = J(null), $ = J(null), H = J(null), F = Te(), I = We(), E = a ?? x, V = R(
-    (Y) => {
-      a === void 0 && k(Y), i == null || i(Y);
+  const [x, k] = A(l), [C, I] = A({ top: 0, left: 0 }), [h, D] = A(!1), M = Z(null), N = Z(null), $ = Z(null), R = Z(null), H = Te(), T = We(), F = a ?? x, V = E(
+    (K) => {
+      a === void 0 && k(K), i == null || i(K);
     },
     [a, i]
   ), W = Io(() => {
-    m && n === "click" && E && V(!1);
-  }, { enabled: E && n === "click" });
-  K(() => (D(!0), () => D(!1)), []), K(() => {
-    if (!E || !M.current || !h) return;
-    const Y = () => {
+    m && n === "click" && F && V(!1);
+  }, { enabled: F && n === "click" });
+  Y(() => (D(!0), () => D(!1)), []), Y(() => {
+    if (!F || !M.current || !h) return;
+    const K = () => {
       const ie = M.current, X = N.current;
       if (!ie || !X) return;
-      const Z = ie.getBoundingClientRect(), ue = X.getBoundingClientRect(), we = window.scrollX, ze = window.scrollY;
+      const Q = ie.getBoundingClientRect(), ue = X.getBoundingClientRect(), we = window.scrollX, ze = window.scrollY;
       let xe = 0, Se = 0;
       switch (o) {
         case "top":
         case "top-start":
         case "top-end":
-          xe = Z.top + ze - ue.height - d;
+          xe = Q.top + ze - ue.height - d;
           break;
         case "bottom":
         case "bottom-start":
         case "bottom-end":
-          xe = Z.bottom + ze + d;
+          xe = Q.bottom + ze + d;
           break;
         case "left":
         case "left-start":
         case "left-end":
-          Se = Z.left + we - ue.width - d;
+          Se = Q.left + we - ue.width - d;
           break;
         case "right":
         case "right-start":
         case "right-end":
-          Se = Z.right + we + d;
+          Se = Q.right + we + d;
           break;
       }
       switch (o) {
         case "top":
         case "bottom":
-          Se = Z.left + we + (Z.width - ue.width) / 2;
+          Se = Q.left + we + (Q.width - ue.width) / 2;
           break;
         case "top-start":
         case "bottom-start":
-          Se = Z.left + we;
+          Se = Q.left + we;
           break;
         case "top-end":
         case "bottom-end":
-          Se = Z.right + we - ue.width;
+          Se = Q.right + we - ue.width;
           break;
         case "left":
         case "right":
-          xe = Z.top + ze + (Z.height - ue.height) / 2;
+          xe = Q.top + ze + (Q.height - ue.height) / 2;
           break;
         case "left-start":
         case "right-start":
-          xe = Z.top + ze;
+          xe = Q.top + ze;
           break;
         case "left-end":
         case "right-end":
-          xe = Z.bottom + ze - ue.height;
+          xe = Q.bottom + ze - ue.height;
           break;
       }
-      T({ top: xe, left: Se });
+      I({ top: xe, left: Se });
     };
-    return Y(), window.addEventListener("resize", Y), window.addEventListener("scroll", Y, !0), () => {
-      window.removeEventListener("resize", Y), window.removeEventListener("scroll", Y, !0);
+    return K(), window.addEventListener("resize", K), window.addEventListener("scroll", K, !0), () => {
+      window.removeEventListener("resize", K), window.removeEventListener("scroll", K, !0);
     };
-  }, [E, o, d, h]), K(() => () => {
-    $.current && clearTimeout($.current), H.current && clearTimeout(H.current);
+  }, [F, o, d, h]), Y(() => () => {
+    $.current && clearTimeout($.current), R.current && clearTimeout(R.current);
   }, []);
-  const A = R(() => {
-    H.current && clearTimeout(H.current), n === "hover" ? $.current = setTimeout(() => V(!0), c) : V(!0);
-  }, [n, c, V]), O = R(() => {
-    $.current && clearTimeout($.current), n === "hover" ? H.current = setTimeout(() => V(!1), y) : V(!1);
-  }, [n, y, V]), q = R(() => {
-    E ? O() : A();
-  }, [E, A, O]), P = t.props, j = De(t, {
+  const B = E(() => {
+    R.current && clearTimeout(R.current), n === "hover" ? $.current = setTimeout(() => V(!0), c) : V(!0);
+  }, [n, c, V]), O = E(() => {
+    $.current && clearTimeout($.current), n === "hover" ? R.current = setTimeout(() => V(!1), y) : V(!1);
+  }, [n, y, V]), q = E(() => {
+    F ? O() : B();
+  }, [F, B, O]), P = t.props, j = De(t, {
     ref: M,
-    "aria-expanded": E,
+    "aria-expanded": F,
     "aria-haspopup": "dialog",
-    "aria-controls": E ? F : void 0,
+    "aria-controls": F ? H : void 0,
     ...n === "click" && {
-      onClick: (Y) => {
+      onClick: (K) => {
         var ie;
-        (ie = P.onClick) == null || ie.call(P, Y), q();
+        (ie = P.onClick) == null || ie.call(P, K), q();
       }
     },
     ...n === "hover" && {
-      onMouseEnter: (Y) => {
+      onMouseEnter: (K) => {
         var ie;
-        (ie = P.onMouseEnter) == null || ie.call(P, Y), A();
+        (ie = P.onMouseEnter) == null || ie.call(P, K), B();
       },
-      onMouseLeave: (Y) => {
+      onMouseLeave: (K) => {
         var ie;
-        (ie = P.onMouseLeave) == null || ie.call(P, Y), O();
+        (ie = P.onMouseLeave) == null || ie.call(P, K), O();
       }
     }
   }), re = {
@@ -5226,9 +5227,9 @@ const To = z(function({
     boxShadow: "var(--brycks-shadow-lg)",
     padding: "var(--brycks-space-3)",
     minWidth: 120,
-    animation: I ? "none" : "brycks-popover-in 150ms ease-out",
+    animation: T ? "none" : "brycks-popover-in 150ms ease-out",
     ...f
-  }, _ = E && h && /* @__PURE__ */ w(ne, { children: [
+  }, _ = F && h && /* @__PURE__ */ w(ne, { children: [
     /* @__PURE__ */ s("style", { children: `
           @keyframes brycks-popover-in {
             from { opacity: 0; transform: scale(0.95); }
@@ -5238,16 +5239,16 @@ const To = z(function({
     /* @__PURE__ */ s(
       "div",
       {
-        ref: (Y) => {
-          N.current = Y, W.current = Y, typeof v == "function" ? v(Y) : v && (v.current = Y);
+        ref: (K) => {
+          N.current = K, W.current = K, typeof v == "function" ? v(K) : v && (v.current = K);
         },
-        id: F,
+        id: H,
         className: S("brycks-popover", u),
         style: re,
         role: "dialog",
         "aria-modal": "false",
         "data-testid": p,
-        onMouseEnter: n === "hover" ? A : void 0,
+        onMouseEnter: n === "hover" ? B : void 0,
         onMouseLeave: n === "hover" ? O : void 0,
         ...b,
         children: e
@@ -5292,17 +5293,17 @@ const Lo = {
 }, f) {
   const p = Math.min(100, Math.max(0, e / t * 100)), b = Do[a];
   if (n === "circular") {
-    const M = $o[o], N = (M.size - M.strokeWidth) / 2, $ = 2 * Math.PI * N, H = $ - p / 100 * $, F = {
+    const M = $o[o], N = (M.size - M.strokeWidth) / 2, $ = 2 * Math.PI * N, R = $ - p / 100 * $, H = {
       display: "inline-flex",
       flexDirection: "column",
       alignItems: "center",
       gap: 8,
       ...m
-    }, I = {
+    }, T = {
       transform: "rotate(-90deg)",
       width: M.size,
       height: M.size
-    }, E = {
+    }, F = {
       fill: "none",
       stroke: "var(--brycks-background-muted)",
       strokeWidth: M.strokeWidth
@@ -5312,7 +5313,7 @@ const Lo = {
       strokeWidth: M.strokeWidth,
       strokeLinecap: "round",
       strokeDasharray: $,
-      strokeDashoffset: i ? $ * 0.75 : H,
+      strokeDashoffset: i ? $ * 0.75 : R,
       transition: i ? "none" : "stroke-dashoffset 300ms ease-out",
       animation: i ? "brycks-progress-circular-spin 1s linear infinite" : void 0,
       transformOrigin: "center"
@@ -5321,7 +5322,7 @@ const Lo = {
       fontSize: o === "xs" ? 8 : o === "sm" ? 10 : o === "md" ? 12 : 14,
       fontWeight: 600,
       color: "var(--brycks-foreground-default)"
-    }, A = {
+    }, B = {
       fontSize: o === "xs" ? 10 : o === "sm" ? 11 : o === "md" ? 12 : 14,
       color: "var(--brycks-foreground-muted)"
     };
@@ -5337,7 +5338,7 @@ const Lo = {
         {
           ref: f,
           className: S("brycks-progress", "brycks-progress--circular", `brycks-progress--${o}`, y),
-          style: F,
+          style: H,
           role: "progressbar",
           "aria-valuenow": i ? void 0 : e,
           "aria-valuemin": 0,
@@ -5347,13 +5348,13 @@ const Lo = {
           ...u,
           children: [
             /* @__PURE__ */ w("div", { style: { position: "relative", display: "flex", alignItems: "center", justifyContent: "center" }, children: [
-              /* @__PURE__ */ w("svg", { style: I, children: [
-                /* @__PURE__ */ s("circle", { cx: M.size / 2, cy: M.size / 2, r: N, style: E }),
+              /* @__PURE__ */ w("svg", { style: T, children: [
+                /* @__PURE__ */ s("circle", { cx: M.size / 2, cy: M.size / 2, r: N, style: F }),
                 /* @__PURE__ */ s("circle", { cx: M.size / 2, cy: M.size / 2, r: N, style: V })
               ] }),
               l && !i && o !== "xs" && /* @__PURE__ */ s("span", { style: W, children: d(e, t) })
             ] }),
-            c && /* @__PURE__ */ s("span", { style: A, children: c })
+            c && /* @__PURE__ */ s("span", { style: B, children: c })
           ]
         }
       )
@@ -5374,7 +5375,7 @@ const Lo = {
     fontSize: o === "xs" ? 11 : o === "sm" ? 12 : o === "md" ? 13 : 14,
     fontWeight: 500,
     color: "var(--brycks-foreground-default)"
-  }, T = {
+  }, I = {
     fontSize: o === "xs" ? 11 : o === "sm" ? 12 : o === "md" ? 13 : 14,
     fontWeight: 500,
     color: "var(--brycks-foreground-muted)",
@@ -5416,7 +5417,7 @@ const Lo = {
         children: [
           (c || l) && /* @__PURE__ */ w("div", { style: k, children: [
             c && /* @__PURE__ */ s("span", { style: C, children: c }),
-            l && !i && /* @__PURE__ */ s("span", { style: T, children: d(e, t) })
+            l && !i && /* @__PURE__ */ s("span", { style: I, children: d(e, t) })
           ] }),
           /* @__PURE__ */ s("div", { style: h, children: /* @__PURE__ */ s("div", { style: D }) })
         ]
@@ -5445,7 +5446,7 @@ const Wo = z(function({
   testId: y,
   ...m
 }, g) {
-  const [u, f] = B(t), p = e ?? u, b = R(
+  const [u, f] = A(t), p = e ?? u, b = E(
     (x) => {
       e === void 0 && f(x), o == null || o(x);
     },
@@ -5509,9 +5510,9 @@ const Bo = {
     if (t) return;
     const C = Array.from(
       ((D = k.currentTarget.parentElement) == null ? void 0 : D.querySelectorAll('[role="tab"]:not([disabled])')) ?? []
-    ), T = C.indexOf(k.currentTarget);
+    ), I = C.indexOf(k.currentTarget);
     let h = null;
-    u === "horizontal" ? (k.key === "ArrowRight" && (h = (T + 1) % C.length), k.key === "ArrowLeft" && (h = (T - 1 + C.length) % C.length)) : (k.key === "ArrowDown" && (h = (T + 1) % C.length), k.key === "ArrowUp" && (h = (T - 1 + C.length) % C.length)), k.key === "Home" && (h = 0), k.key === "End" && (h = C.length - 1), h !== null && (k.preventDefault(), (M = C[h]) == null || M.focus(), (N = C[h]) == null || N.click());
+    u === "horizontal" ? (k.key === "ArrowRight" && (h = (I + 1) % C.length), k.key === "ArrowLeft" && (h = (I - 1 + C.length) % C.length)) : (k.key === "ArrowDown" && (h = (I + 1) % C.length), k.key === "ArrowUp" && (h = (I - 1 + C.length) % C.length)), k.key === "Home" && (h = 0), k.key === "End" && (h = C.length - 1), h !== null && (k.preventDefault(), (M = C[h]) == null || M.focus(), (N = C[h]) == null || N.click());
   }, x = () => {
     const k = {
       display: "inline-flex",
@@ -5630,7 +5631,7 @@ const jo = z(function({
   testId: c,
   ...y
 }, m) {
-  const [g, u] = B(t), f = e ?? g, p = R(
+  const [g, u] = A(t), f = e ?? g, p = E(
     (v) => {
       const x = f.includes(v);
       let k;
@@ -5803,86 +5804,86 @@ const Yo = z(function({
   ...g
 }, u) {
   var V;
-  const [f, p] = B(o), [b, v] = B({ top: 0, left: 0 }), [x, k] = B(-1), [C, T] = B(!1), h = J(null), D = J(null), M = t ?? f;
-  K(() => (T(!0), () => T(!1)), []);
-  const N = R(
+  const [f, p] = A(o), [b, v] = A({ top: 0, left: 0 }), [x, k] = A(-1), [C, I] = A(!1), h = Z(null), D = Z(null), M = t ?? f;
+  Y(() => (I(!0), () => I(!1)), []);
+  const N = E(
     (W) => {
       t === void 0 && p(W), n == null || n(W), W || k(-1);
     },
     [t, n]
-  ), $ = R(() => N(!1), [N]);
-  K(() => {
+  ), $ = E(() => N(!1), [N]);
+  Y(() => {
     if (!M || !h.current || !C) return;
     const W = () => {
-      const A = h.current;
-      if (!A) return;
-      const O = A.getBoundingClientRect(), q = window.scrollX, P = window.scrollY;
+      const B = h.current;
+      if (!B) return;
+      const O = B.getBoundingClientRect(), q = window.scrollX, P = window.scrollY;
       let j = 0, re = 0;
       a.startsWith("bottom") ? j = O.bottom + P + l : j = O.top + P - l, a.endsWith("start") ? re = O.left + q : re = O.right + q, v({ top: j, left: re });
     };
     return W(), window.addEventListener("resize", W), window.addEventListener("scroll", W, !0), () => {
       window.removeEventListener("resize", W), window.removeEventListener("scroll", W, !0);
     };
-  }, [M, a, l, C]), K(() => {
+  }, [M, a, l, C]), Y(() => {
     if (!M) return;
-    const W = (A) => {
+    const W = (B) => {
       var O, q;
-      (O = h.current) != null && O.contains(A.target) || (q = D.current) != null && q.contains(A.target) || N(!1);
+      (O = h.current) != null && O.contains(B.target) || (q = D.current) != null && q.contains(B.target) || N(!1);
     };
     return document.addEventListener("mousedown", W), () => document.removeEventListener("mousedown", W);
   }, [M, N]);
-  const H = R(
+  const R = E(
     (W) => {
       var O, q, P;
       if (!M) {
         (W.key === "ArrowDown" || W.key === "Enter" || W.key === " ") && (W.preventDefault(), N(!0));
         return;
       }
-      const A = (O = D.current) == null ? void 0 : O.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])');
-      if (A != null && A.length)
+      const B = (O = D.current) == null ? void 0 : O.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])');
+      if (B != null && B.length)
         switch (W.key) {
           case "ArrowDown":
-            W.preventDefault(), k((j) => (j + 1) % A.length);
+            W.preventDefault(), k((j) => (j + 1) % B.length);
             break;
           case "ArrowUp":
-            W.preventDefault(), k((j) => (j - 1 + A.length) % A.length);
+            W.preventDefault(), k((j) => (j - 1 + B.length) % B.length);
             break;
           case "Home":
             W.preventDefault(), k(0);
             break;
           case "End":
-            W.preventDefault(), k(A.length - 1);
+            W.preventDefault(), k(B.length - 1);
             break;
           case "Escape":
             W.preventDefault(), N(!1), (q = h.current) == null || q.focus();
             break;
           case "Enter":
           case " ":
-            W.preventDefault(), x >= 0 && ((P = A[x]) == null || P.click());
+            W.preventDefault(), x >= 0 && ((P = B[x]) == null || P.click());
             break;
         }
     },
     [M, x, N]
   );
-  K(() => {
-    var A, O;
+  Y(() => {
+    var B, O;
     if (!M || x < 0) return;
-    const W = (A = D.current) == null ? void 0 : A.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])');
+    const W = (B = D.current) == null ? void 0 : B.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])');
     (O = W == null ? void 0 : W[x]) == null || O.focus();
   }, [M, x]);
-  const F = e.props, I = De(e, {
+  const H = e.props, T = De(e, {
     ref: h,
     "aria-haspopup": "menu",
     "aria-expanded": M,
     onClick: (W) => {
-      var A;
-      (A = F.onClick) == null || A.call(F, W), N(!M);
+      var B;
+      (B = H.onClick) == null || B.call(H, W), N(!M);
     },
     onKeyDown: (W) => {
-      var A;
-      (A = F.onKeyDown) == null || A.call(F, W), H(W);
+      var B;
+      (B = H.onKeyDown) == null || B.call(H, W), R(W);
     }
-  }), E = {
+  }), F = {
     position: "absolute",
     top: b.top,
     left: a.endsWith("end") ? "auto" : b.left,
@@ -5908,7 +5909,7 @@ const Yo = z(function({
       "data-testid": m,
       ...g,
       children: [
-        I,
+        T,
         M && C && ve(
           /* @__PURE__ */ w(ne, { children: [
             /* @__PURE__ */ s("style", { children: `
@@ -5922,8 +5923,8 @@ const Yo = z(function({
               {
                 ref: D,
                 role: "menu",
-                style: E,
-                onKeyDown: H,
+                style: F,
+                onKeyDown: R,
                 tabIndex: -1,
                 children: y
               }
@@ -6054,7 +6055,7 @@ const Uo = z(function({
   testId: d,
   ...c
 }, y) {
-  const [m, g] = B(null), u = e !== void 0 ? e : m, f = (b) => {
+  const [m, g] = A(null), u = e !== void 0 ? e : m, f = (b) => {
     e === void 0 && g(b), t == null || t(b);
   }, p = {
     display: "flex",
@@ -6121,11 +6122,11 @@ const Zo = {
       className: S("brycks-menu-item", p && "brycks-menu-item--active", l),
       style: x,
       onClick: v,
-      onMouseEnter: (T) => {
-        !n && !p && (T.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
+      onMouseEnter: (I) => {
+        !n && !p && (I.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
       },
-      onMouseLeave: (T) => {
-        p || (T.currentTarget.style.backgroundColor = "transparent");
+      onMouseLeave: (I) => {
+        p || (I.currentTarget.style.backgroundColor = "transparent");
       },
       title: f ? String(d) : void 0,
       ...c,
@@ -6216,17 +6217,17 @@ const sn = z(function({
     if (N)
       if ($) {
         h.push(1), h.push("ellipsis");
-        for (let H = D; H <= M; H++)
-          h.push(H);
+        for (let R = D; R <= M; R++)
+          h.push(R);
         h.push("ellipsis"), h.push(t);
       } else {
         h.push(1), h.push("ellipsis");
-        for (let H = Math.max(t - 2 - l, 1); H <= t; H++)
-          h.push(H);
+        for (let R = Math.max(t - 2 - l, 1); R <= t; R++)
+          h.push(R);
       }
     else {
-      for (let H = 1; H <= Math.min(3 + l, t); H++)
-        h.push(H);
+      for (let R = 1; R <= Math.min(3 + l, t); R++)
+        h.push(R);
       $ && (h.push("ellipsis"), h.push(t));
     }
     return h;
@@ -6263,7 +6264,7 @@ const sn = z(function({
     fontSize: p.fontSize,
     color: "var(--brycks-foreground-muted)",
     padding: `0 ${p.gap}px`
-  }, T = (h) => {
+  }, I = (h) => {
     h >= 1 && h <= t && h !== e && !c && o(h);
   };
   return /* @__PURE__ */ w(
@@ -6284,7 +6285,7 @@ const sn = z(function({
             "aria-label": "First page",
             disabled: e === 1 || c,
             style: x(!1, e === 1 || c),
-            onClick: () => T(1),
+            onClick: () => I(1),
             onMouseEnter: (h) => {
               e !== 1 && !c && (h.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
             },
@@ -6301,7 +6302,7 @@ const sn = z(function({
             "aria-label": "Previous page",
             disabled: e === 1 || c,
             style: x(!1, e === 1 || c),
-            onClick: () => T(e - 1),
+            onClick: () => I(e - 1),
             onMouseEnter: (h) => {
               e !== 1 && !c && (h.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
             },
@@ -6320,7 +6321,7 @@ const sn = z(function({
               "aria-current": h === e ? "page" : void 0,
               disabled: c,
               style: x(h === e, c),
-              onClick: () => T(h),
+              onClick: () => I(h),
               onMouseEnter: (M) => {
                 h !== e && !c && (M.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
               },
@@ -6339,7 +6340,7 @@ const sn = z(function({
             "aria-label": "Next page",
             disabled: e === t || c,
             style: x(!1, e === t || c),
-            onClick: () => T(e + 1),
+            onClick: () => I(e + 1),
             onMouseEnter: (h) => {
               e !== t && !c && (h.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
             },
@@ -6356,7 +6357,7 @@ const sn = z(function({
             "aria-label": "Last page",
             disabled: e === t || c,
             style: x(!1, e === t || c),
-            onClick: () => T(t),
+            onClick: () => I(t),
             onMouseEnter: (h) => {
               e !== t && !c && (h.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
             },
@@ -6429,10 +6430,10 @@ const cn = z(function({
       "data-testid": i,
       ...d,
       children: /* @__PURE__ */ s("ol", { style: p, children: g.map((k, C) => {
-        const T = C === g.length - 1, h = !T, D = u && C === Math.floor((o - 1) / 2) - 1;
+        const I = C === g.length - 1, h = !I, D = u && C === Math.floor((o - 1) / 2) - 1;
         return /* @__PURE__ */ w("li", { style: { display: "flex", alignItems: "center", gap: y.gap }, children: [
           De(k, {
-            isCurrentPage: T,
+            isCurrentPage: I,
             size: t
           }),
           D && /* @__PURE__ */ w(ne, { children: [
@@ -7575,8 +7576,8 @@ function jn({ size: r = 64 }) {
 }
 jn.displayName = "EmptyStateIcon";
 function ct({ children: r, container: e, disabled: t = !1 }) {
-  const [o, n] = B(!1), [a, l] = B(null);
-  return K(() => {
+  const [o, n] = A(!1), [a, l] = A(null);
+  return Y(() => {
     if (n(!0), typeof e == "string") {
       const i = document.querySelector(e);
       l(i);
@@ -7599,15 +7600,15 @@ function On(r = {}) {
     autoFocus: t = !0,
     restoreFocus: o = !0,
     initialFocus: n
-  } = r, a = J(null), l = J(null), i = R(() => a.current ? Array.from(a.current.querySelectorAll(Vn)) : [], []), d = R(() => {
+  } = r, a = Z(null), l = Z(null), i = E(() => a.current ? Array.from(a.current.querySelectorAll(Vn)) : [], []), d = E(() => {
     var m;
     (m = i()[0]) == null || m.focus();
-  }, [i]), c = R(() => {
+  }, [i]), c = E(() => {
     var m;
     const y = i();
     (m = y[y.length - 1]) == null || m.focus();
   }, [i]);
-  return K(() => {
+  return Y(() => {
     if (e) {
       if (l.current = document.activeElement, t) {
         const y = a.current;
@@ -7622,7 +7623,7 @@ function On(r = {}) {
         o && l.current && l.current.focus();
       };
     }
-  }, [e, t, o, n, d]), K(() => {
+  }, [e, t, o, n, d]), Y(() => {
     if (!e) return;
     const y = (m) => {
       if (m.key !== "Tab" || !a.current) return;
@@ -7992,11 +7993,11 @@ const sa = z(
 );
 sa.displayName = "Article";
 function Pa(r = {}) {
-  const { defaultIsOpen: e = !1, onOpen: t, onClose: o } = r, [n, a] = B(e), l = R(() => {
+  const { defaultIsOpen: e = !1, onOpen: t, onClose: o } = r, [n, a] = A(e), l = E(() => {
     a(!0), t == null || t();
-  }, [t]), i = R(() => {
+  }, [t]), i = E(() => {
     a(!1), o == null || o();
-  }, [o]), d = R(() => {
+  }, [o]), d = E(() => {
     const c = !n;
     a(c), c ? t == null || t() : o == null || o();
   }, [n, t, o]);
@@ -8016,12 +8017,12 @@ function _a(r) {
     orientation: n = "vertical",
     onIndexChange: a,
     onSelect: l
-  } = r, [i, d] = B(t), c = R(
+  } = r, [i, d] = A(t), c = E(
     (u) => {
       d(u), a == null || a(u);
     },
     [a]
-  ), y = R(
+  ), y = E(
     (u) => {
       let f;
       switch (u) {
@@ -8041,7 +8042,7 @@ function _a(r) {
       c(f);
     },
     [i, e, o, c]
-  ), m = R(
+  ), m = E(
     (u) => {
       const { key: f } = u, p = n === "vertical" || n === "both", b = n === "horizontal" || n === "both";
       switch (f) {
@@ -8070,7 +8071,7 @@ function _a(r) {
       }
     },
     [n, y, l, i]
-  ), g = R(
+  ), g = E(
     (u) => ({
       tabIndex: u === i ? 0 : -1,
       "data-focused": u === i,
@@ -8086,13 +8087,13 @@ function _a(r) {
   };
 }
 function Xa(r) {
-  const { value: e, defaultValue: t, onChange: o } = r, n = e !== void 0, a = J(n);
-  K(() => {
+  const { value: e, defaultValue: t, onChange: o } = r, n = e !== void 0, a = Z(n);
+  Y(() => {
     a.current !== n && console.warn(
       "Component is switching between controlled and uncontrolled modes. This is not recommended and may cause unexpected behavior."
     ), a.current = n;
   }, [n]);
-  const [l, i] = B(t), d = n ? e : l, c = R(
+  const [l, i] = A(t), d = n ? e : l, c = E(
     (y) => {
       const m = typeof y == "function" ? y(d) : y;
       n || i(m), o == null || o(m);
@@ -8239,7 +8240,7 @@ export {
   pa as duration,
   te as durations,
   ha as easing,
-  Q as easings,
+  J as easings,
   Ua as error,
   be as focusRing,
   ma as focusRingOffset,