blunt-ui 1.0.0 → 1.1.1

package/dist/index.js

@@ -1,13 +1,13 @@
-import { jsx as e, jsxs as S, Fragment as dr } from "react/jsx-runtime";
-import i, { css as s, keyframes as J, ThemeProvider as ur, createGlobalStyle as pr } from "styled-components";
-import Oo, { useId as Q, useState as T, useContext as To, createContext as Wo, forwardRef as Yo, createElement as zo, useRef as U, useCallback as X, useEffect as B, useMemo as Do } from "react";
-import { createPortal as go } from "react-dom";
-const eo = (o, r, n) => s`
+import { jsx as i, jsxs as S, Fragment as ur } from "react/jsx-runtime";
+import s, { css as t, keyframes as oo, ThemeProvider as pr, createGlobalStyle as fr } from "styled-components";
+import Mo, { useId as ro, useState as T, useContext as Wo, createContext as Do, forwardRef as Uo, createElement as Co, useRef as K, useCallback as X, useEffect as _, useLayoutEffect as gr, useMemo as Eo } from "react";
+import { createPortal as yo } from "react-dom";
+const po = (o, r, n) => t`
   background: ${r};
   color: ${n};
   border: ${o.brutalism.borderWidth} solid ${o.colors.neutral[900]};
   box-shadow: 2px 2px 0 ${o.colors.neutral[900]};
-`, fr = i.span`
+`, $r = s.span`
   display: inline-flex;
   align-items: center;
   font-weight: ${({ theme: o }) => o.fontWeights.bold};
@@ -20,80 +20,80 @@ const eo = (o, r, n) => s`
   max-width: 20ch;
 
   ${({ $size: o, theme: r }) => ({
-  sm: s`
+  sm: t`
         padding: ${r.spacing[0.5]} ${r.spacing[2]};
         font-size: ${r.fontSizes.xs};
       `,
-  md: s`
+  md: t`
         padding: ${r.spacing[1]} ${r.spacing[3]};
         font-size: ${r.fontSizes.sm};
       `
 })[o]}
 
   ${({ $variant: o, theme: r }) => r.brutalism ? {
-  primary: eo(
+  primary: po(
     r,
     r.colors.primary[500],
     r.colors.primary.contrast
   ),
-  neutral: eo(
+  neutral: po(
     r,
     r.colors.neutral[200],
     r.colors.neutral[900]
   ),
-  success: eo(
+  success: po(
     r,
     r.colors.success[50],
     r.colors.success[500]
   ),
-  error: eo(
+  error: po(
     r,
     r.colors.error[50],
     r.colors.error[500]
   ),
-  warning: eo(
+  warning: po(
     r,
     r.colors.warning[50],
     r.colors.warning[500]
   ),
-  info: eo(r, r.colors.info[50], r.colors.info[500])
+  info: po(r, r.colors.info[50], r.colors.info[500])
 }[o] : {
-  primary: s`
+  primary: t`
         background: ${r.colors.primary[50]};
         color: ${r.colors.primary[500]};
       `,
-  neutral: s`
+  neutral: t`
         background: ${r.colors.neutral[200]};
         color: ${r.colors.neutral[600]};
       `,
-  success: s`
+  success: t`
         background: ${r.colors.success[50]};
         color: ${r.colors.success[500]};
       `,
-  error: s`
+  error: t`
         background: ${r.colors.error[50]};
         color: ${r.colors.error[500]};
       `,
-  warning: s`
+  warning: t`
         background: ${r.colors.warning[50]};
         color: ${r.colors.warning[500]};
       `,
-  info: s`
+  info: t`
         background: ${r.colors.info[50]};
         color: ${r.colors.info[500]};
       `
 }[o]}
 `;
-function $r({
+function br({
   variant: o = "primary",
   size: r = "md",
   children: n,
-  ...t
+  ...e
 }) {
-  return /* @__PURE__ */ e(fr, { $variant: o, $size: r, ...t, children: n });
+  return /* @__PURE__ */ i($r, { $variant: o, $size: r, ...e, children: n });
 }
-$r.displayName = "Badge";
-const ho = (o, r, n) => s`
+br.displayName = "Badge";
+const wo = (o, r, n) => t`
   background-color: ${r};
   color: ${n};
   border: ${o.brutalism.borderWidth} solid ${o.colors.neutral[900]};
@@ -106,7 +106,7 @@ const ho = (o, r, n) => s`
     transform: translate(2px, 2px);
     box-shadow: 2px 2px 0 ${o.colors.neutral[900]};
   }
-`, gr = i.button`
+`, xr = s.button`
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -114,6 +114,7 @@ const ho = (o, r, n) => s`
   font-weight: ${({ theme: o }) => o.fontWeights.semibold};
   cursor: pointer;
   text-decoration: none;
+  touch-action: manipulation;
 
   &:focus-visible {
     outline: 2px solid ${({ theme: o }) => o.colors.primary[500]};
@@ -126,23 +127,23 @@ const ho = (o, r, n) => s`
   }
 
   ${({ $variant: o, theme: r }) => r.brutalism ? {
-  primary: ho(
+  primary: wo(
     r,
     r.colors.primary[500],
     r.colors.primary.contrast
   ),
-  secondary: ho(
+  secondary: wo(
     r,
     r.colors.neutral[100],
     r.colors.neutral[900]
   ),
-  outline: ho(
+  outline: wo(
     r,
     r.colors.neutral[0],
     r.colors.neutral[900]
   )
 }[o] : {
-  primary: s`
+  primary: t`
         background-color: ${r.colors.primary[500]};
         color: ${r.colors.neutral[0]};
         border: none;
@@ -150,7 +151,7 @@ const ho = (o, r, n) => s`
           background-color: ${r.colors.primary[700]};
         }
       `,
-  secondary: s`
+  secondary: t`
         background-color: ${r.colors.neutral[200]};
         color: ${r.colors.neutral[600]};
         border: none;
@@ -158,7 +159,7 @@ const ho = (o, r, n) => s`
           background-color: ${r.colors.neutral[300]};
         }
       `,
-  outline: s`
+  outline: t`
         background-color: transparent;
         color: ${r.colors.primary[500]};
         border: 2px solid ${r.colors.primary[500]};
@@ -169,38 +170,38 @@ const ho = (o, r, n) => s`
 }[o]}
 
   ${({ $size: o, theme: r }) => ({
-  sm: s`
+  sm: t`
         padding: ${r.spacing[1]} ${r.spacing[3]};
         font-size: ${r.fontSizes.sm};
       `,
-  md: s`
+  md: t`
         padding: ${r.spacing[2]} ${r.spacing[4]};
         font-size: ${r.fontSizes.md};
       `,
-  lg: s`
+  lg: t`
         padding: ${r.spacing[3]} ${r.spacing[6]};
         font-size: ${r.fontSizes.lg};
       `
 })[o]}
 `;
-function Co({
+function Io({
   ref: o,
   as: r,
   href: n,
-  variant: t = "primary",
+  variant: e = "primary",
   size: a = "md",
   isLoading: l,
   disabled: d,
   children: p,
   ...u
 }) {
-  return /* @__PURE__ */ e(
-    gr,
+  return /* @__PURE__ */ i(
+    xr,
     {
       ref: o,
       as: r ?? (n ? "a" : "button"),
       href: n,
-      $variant: t,
+      $variant: e,
       $size: a,
       disabled: l || d,
       ...u,
@@ -208,19 +209,19 @@ function Co({
     }
   );
 }
-Co.displayName = "Button";
-const br = i.div`
+Io.displayName = "Button";
+const yr = s.div`
   display: flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
   width: ${({ $fullWidth: o }) => o ? "100%" : "auto"};
-`, xr = i.label`
+`, hr = s.label`
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   font-weight: ${({ theme: o }) => o.brutalism ? o.fontWeights.bold : o.fontWeights.medium};
-`, yr = i.span`
+`, wr = s.span`
   font-size: ${({ theme: o }) => o.fontSizes.xs};
   color: ${({ $error: o, theme: r }) => o ? r.colors.error[500] : r.colors.neutral[500]};
-`, hr = i.div`
+`, mr = s.div`
   display: flex;
   align-items: center;
   border-radius: ${({ theme: o }) => o.radius.md};
@@ -229,39 +230,39 @@ const br = i.div`
     box-shadow 0.2s;
 
   ${({ $size: o = "md", theme: r }) => ({
-  sm: s`
+  sm: t`
         padding: ${r.spacing[1]} ${r.spacing[2]};
         font-size: ${r.fontSizes.sm};
       `,
-  md: s`
+  md: t`
         padding: ${r.spacing[2]} ${r.spacing[3]};
         font-size: ${r.fontSizes.md};
       `,
-  lg: s`
+  lg: t`
         padding: ${r.spacing[3]} ${r.spacing[4]};
         font-size: ${r.fontSizes.lg};
       `
 })[o]}
 
-  ${({ $variant: o = "default", theme: r }) => r.brutalism ? s`
+  ${({ $variant: o = "default", theme: r }) => r.brutalism ? t`
         border: ${r.brutalism.borderWidth} solid
           ${r.colors.neutral[900]};
         background-color: ${r.colors.neutral[0]};
         box-shadow: 3px 3px 0 ${r.colors.neutral[900]};
       ` : {
-  default: s`
+  default: t`
         border: 1px solid ${r.colors.neutral[400]};
         background-color: ${r.colors.neutral[0]};
       `,
-  outlined: s`
+  outlined: t`
         border: 2px solid ${r.colors.primary[500]};
         background-color: ${r.colors.neutral[0]};
       `
 }[o]}
 
-  ${({ $error: o, theme: r }) => o && s`
+  ${({ $error: o, theme: r }) => o && t`
       border-color: ${r.colors.error[500]};
-      ${r.brutalism && s`
+      ${r.brutalism && t`
         box-shadow: 3px 3px 0 ${r.colors.error[500]};
       `}
     `}
@@ -269,7 +270,7 @@ const br = i.div`
   &:focus-within {
     box-shadow: ${({ theme: o }) => o.shadows.focusRing};
   }
-`, wr = i.input`
+`, vr = s.input`
   flex: 1;
   border: none;
   outline: none;
@@ -280,11 +281,11 @@ const br = i.div`
     cursor: not-allowed;
     opacity: 0.6;
   }
-`, Lo = i.div`
+`, Lo = s.div`
   display: inline-flex;
   align-items: center;
   margin: 0 ${({ theme: o }) => o.spacing[1]};
-`, mr = i.button`
+`, kr = s.button`
   display: inline-flex;
   align-items: center;
   margin: 0 ${({ theme: o }) => o.spacing[1]};
@@ -298,11 +299,11 @@ const br = i.div`
     opacity: 0.8;
   }
 `;
-function vr({
+function Sr({
   ref: o,
   type: r = "text",
   size: n = "md",
-  variant: t = "default",
+  variant: e = "default",
   label: a,
   helperText: l,
   error: d,
@@ -310,62 +311,62 @@ function vr({
   rightElement: u,
   clearable: f,
   onClear: $,
-  fullWidth: h,
-  id: w,
+  fullWidth: m,
+  id: v,
   value: y,
-  defaultValue: v,
-  onChange: z,
-  ...O
+  defaultValue: k,
+  onChange: C,
+  ...M
 }) {
-  const R = Q(), L = w ?? R, g = `${L}-hint`, [C, m] = T(v ?? ""), x = y !== void 0, I = x ? y : C, D = typeof d == "string" ? d : void 0, W = !!(l || d), M = (_) => {
-    x || m(_.target.value), z?.(_);
-  }, A = () => {
-    x || m(""), $?.();
+  const P = ro(), L = v ?? P, x = `${L}-hint`, [I, w] = T(k ?? ""), b = y !== void 0, z = b ? y : I, E = typeof d == "string" ? d : void 0, D = !!(l || d), N = (B) => {
+    b || w(B.target.value), C?.(B);
+  }, F = () => {
+    b || w(""), $?.();
   };
-  return /* @__PURE__ */ S(br, { $fullWidth: h, children: [
-    a && /* @__PURE__ */ e(xr, { htmlFor: L, children: a }),
-    /* @__PURE__ */ S(hr, { $size: n, $variant: t, $error: !!d, children: [
-      p && /* @__PURE__ */ e(Lo, { children: p }),
-      /* @__PURE__ */ e(
-        wr,
+  return /* @__PURE__ */ S(yr, { $fullWidth: m, children: [
+    a && /* @__PURE__ */ i(hr, { htmlFor: L, children: a }),
+    /* @__PURE__ */ S(mr, { $size: n, $variant: e, $error: !!d, children: [
+      p && /* @__PURE__ */ i(Lo, { children: p }),
+      /* @__PURE__ */ i(
+        vr,
         {
           id: L,
           ref: o,
           type: r,
-          value: I,
-          onChange: M,
-          ...O,
+          value: z,
+          onChange: N,
+          ...M,
           "aria-invalid": !!d,
-          "aria-describedby": W ? g : void 0
+          "aria-describedby": D ? x : void 0
         }
       ),
-      f && I && /* @__PURE__ */ e(
-        mr,
+      f && z && /* @__PURE__ */ i(
+        kr,
         {
           type: "button",
-          onClick: A,
+          onClick: F,
           "aria-label": "Clear input",
           children: "✕"
         }
       ),
-      u && /* @__PURE__ */ e(Lo, { children: u })
+      u && /* @__PURE__ */ i(Lo, { children: u })
     ] }),
-    W && /* @__PURE__ */ e(yr, { id: g, $error: !!d, children: D ?? l })
+    D && /* @__PURE__ */ i(wr, { id: x, $error: !!d, children: E ?? l })
   ] });
 }
-vr.displayName = "Input";
-const kr = i.div`
+Sr.displayName = "Input";
+const zr = s.div`
   display: flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
   width: ${({ $fullWidth: o }) => o ? "100%" : "auto"};
-`, Sr = i.label`
+`, Cr = s.label`
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   font-weight: ${({ theme: o }) => o.brutalism ? o.fontWeights.bold : o.fontWeights.medium};
-`, zr = i.span`
+`, Ir = s.span`
   font-size: ${({ theme: o }) => o.fontSizes.xs};
   color: ${({ $error: o, theme: r }) => o ? r.colors.error[500] : r.colors.neutral[500]};
-`, Cr = i.div`
+`, Tr = s.div`
   display: flex;
   border-radius: ${({ theme: o }) => o.radius.md};
   transition:
@@ -373,39 +374,39 @@ const kr = i.div`
     box-shadow 0.2s;
 
   ${({ $size: o = "md", theme: r }) => ({
-  sm: s`
+  sm: t`
         padding: ${r.spacing[1]} ${r.spacing[2]};
         font-size: ${r.fontSizes.sm};
       `,
-  md: s`
+  md: t`
         padding: ${r.spacing[2]} ${r.spacing[3]};
         font-size: ${r.fontSizes.md};
       `,
-  lg: s`
+  lg: t`
         padding: ${r.spacing[3]} ${r.spacing[4]};
         font-size: ${r.fontSizes.lg};
       `
 })[o]}
 
-  ${({ $variant: o = "default", theme: r }) => r.brutalism ? s`
+  ${({ $variant: o = "default", theme: r }) => r.brutalism ? t`
         border: ${r.brutalism.borderWidth} solid
           ${r.colors.neutral[900]};
         background-color: ${r.colors.neutral[0]};
         box-shadow: 3px 3px 0 ${r.colors.neutral[900]};
       ` : {
-  default: s`
+  default: t`
         border: 1px solid ${r.colors.neutral[400]};
         background-color: ${r.colors.neutral[0]};
       `,
-  outlined: s`
+  outlined: t`
         border: 2px solid ${r.colors.primary[500]};
         background-color: ${r.colors.neutral[0]};
       `
 }[o]}
 
-  ${({ $error: o, theme: r }) => o && s`
+  ${({ $error: o, theme: r }) => o && t`
       border-color: ${r.colors.error[500]};
-      ${r.brutalism && s`
+      ${r.brutalism && t`
         box-shadow: 3px 3px 0 ${r.colors.error[500]};
       `}
     `}
@@ -413,7 +414,7 @@ const kr = i.div`
   &:focus-within {
     box-shadow: ${({ theme: o }) => o.shadows.focusRing};
   }
-`, Ir = i.textarea`
+`, Wr = s.textarea`
   flex: 1;
   border: none;
   outline: none;
@@ -427,11 +428,11 @@ const kr = i.div`
     opacity: 0.6;
   }
 `;
-function Tr({
+function Dr({
   ref: o,
   size: r = "md",
   variant: n = "default",
-  label: t,
+  label: e,
   helperText: a,
   error: l,
   fullWidth: d,
@@ -439,40 +440,40 @@ function Tr({
   value: u,
   defaultValue: f,
   onChange: $,
-  ...h
+  ...m
 }) {
-  const w = Q(), y = p ?? w, v = `${y}-hint`, [z, O] = T(f ?? ""), R = u !== void 0, L = R ? u : z, g = typeof l == "string" ? l : void 0, C = !!(a || l);
-  return /* @__PURE__ */ S(kr, { $fullWidth: d, children: [
-    t && /* @__PURE__ */ e(Sr, { htmlFor: y, children: t }),
-    /* @__PURE__ */ e(Cr, { $size: r, $variant: n, $error: !!l, children: /* @__PURE__ */ e(
-      Ir,
+  const v = ro(), y = p ?? v, k = `${y}-hint`, [C, M] = T(f ?? ""), P = u !== void 0, L = P ? u : C, x = typeof l == "string" ? l : void 0, I = !!(a || l);
+  return /* @__PURE__ */ S(zr, { $fullWidth: d, children: [
+    e && /* @__PURE__ */ i(Cr, { htmlFor: y, children: e }),
+    /* @__PURE__ */ i(Tr, { $size: r, $variant: n, $error: !!l, children: /* @__PURE__ */ i(
+      Wr,
       {
         id: y,
         ref: o,
         value: L,
-        onChange: (x) => {
-          R || O(x.target.value), $?.(x);
+        onChange: (b) => {
+          P || M(b.target.value), $?.(b);
         },
-        ...h,
+        ...m,
         "aria-invalid": !!l,
-        "aria-describedby": C ? v : void 0
+        "aria-describedby": I ? k : void 0
       }
     ) }),
-    C && /* @__PURE__ */ e(zr, { id: v, $error: !!l, children: g ?? a })
+    I && /* @__PURE__ */ i(Ir, { id: k, $error: !!l, children: x ?? a })
   ] });
 }
-Tr.displayName = "Textarea";
-const Uo = (...o) => o.filter((r, n, t) => !!r && r.trim() !== "" && t.indexOf(r) === n).join(" ").trim();
-const Wr = (o) => o.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
-const Dr = (o) => o.replace(
+Dr.displayName = "Textarea";
+const Yo = (...o) => o.filter((r, n, e) => !!r && r.trim() !== "" && e.indexOf(r) === n).join(" ").trim();
+const Er = (o) => o.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+const Or = (o) => o.replace(
   /^([A-Z])|[\s-_]+(\w)/g,
-  (r, n, t) => t ? t.toUpperCase() : n.toLowerCase()
+  (r, n, e) => e ? e.toUpperCase() : n.toLowerCase()
 );
 const No = (o) => {
-  const r = Dr(o);
+  const r = Or(o);
   return r.charAt(0).toUpperCase() + r.slice(1);
 };
-var wo = {
+var mo = {
   xmlns: "http://www.w3.org/2000/svg",
   width: 24,
   height: 24,
@@ -483,96 +484,96 @@ var wo = {
   strokeLinecap: "round",
   strokeLinejoin: "round"
 };
-const Er = (o) => {
+const Mr = (o) => {
   for (const r in o)
     if (r.startsWith("aria-") || r === "role" || r === "title")
       return !0;
   return !1;
-}, Mr = Wo({}), Or = () => To(Mr), Lr = Yo(
-  ({ color: o, size: r, strokeWidth: n, absoluteStrokeWidth: t, className: a = "", children: l, iconNode: d, ...p }, u) => {
+}, Lr = Do({}), Nr = () => Wo(Lr), Pr = Uo(
+  ({ color: o, size: r, strokeWidth: n, absoluteStrokeWidth: e, className: a = "", children: l, iconNode: d, ...p }, u) => {
     const {
       size: f = 24,
       strokeWidth: $ = 2,
-      absoluteStrokeWidth: h = !1,
-      color: w = "currentColor",
+      absoluteStrokeWidth: m = !1,
+      color: v = "currentColor",
       className: y = ""
-    } = Or() ?? {}, v = t ?? h ? Number(n ?? $) * 24 / Number(r ?? f) : n ?? $;
-    return zo(
+    } = Nr() ?? {}, k = e ?? m ? Number(n ?? $) * 24 / Number(r ?? f) : n ?? $;
+    return Co(
       "svg",
       {
         ref: u,
-        ...wo,
-        width: r ?? f ?? wo.width,
-        height: r ?? f ?? wo.height,
-        stroke: o ?? w,
-        strokeWidth: v,
-        className: Uo("lucide", y, a),
-        ...!l && !Er(p) && { "aria-hidden": "true" },
+        ...mo,
+        width: r ?? f ?? mo.width,
+        height: r ?? f ?? mo.height,
+        stroke: o ?? v,
+        strokeWidth: k,
+        className: Yo("lucide", y, a),
+        ...!l && !Mr(p) && { "aria-hidden": "true" },
         ...p
       },
       [
-        ...d.map(([z, O]) => zo(z, O)),
+        ...d.map(([C, M]) => Co(C, M)),
         ...Array.isArray(l) ? l : [l]
       ]
     );
   }
 );
-const Z = (o, r) => {
-  const n = Yo(
-    ({ className: t, ...a }, l) => zo(Lr, {
+const to = (o, r) => {
+  const n = Uo(
+    ({ className: e, ...a }, l) => Co(Pr, {
       ref: l,
       iconNode: r,
-      className: Uo(
-        `lucide-${Wr(No(o))}`,
+      className: Yo(
+        `lucide-${Er(No(o))}`,
         `lucide-${o}`,
-        t
+        e
       ),
       ...a
     })
   );
   return n.displayName = No(o), n;
 };
-const Nr = [
+const Rr = [
   ["path", { d: "M12 5v14", key: "s699le" }],
   ["path", { d: "m19 12-7 7-7-7", key: "1idqje" }]
-], Pr = Z("arrow-down", Nr);
-const Rr = [
+], Vr = to("arrow-down", Rr);
+const Br = [
   ["path", { d: "m21 16-4 4-4-4", key: "f6ql7i" }],
   ["path", { d: "M17 20V4", key: "1ejh1v" }],
   ["path", { d: "m3 8 4-4 4 4", key: "11wl7u" }],
   ["path", { d: "M7 4v16", key: "1glfcx" }]
-], Vr = Z("arrow-up-down", Rr);
-const Fr = [
+], Fr = to("arrow-up-down", Br);
+const Ar = [
   ["path", { d: "m5 12 7-7 7 7", key: "hav0vg" }],
   ["path", { d: "M12 19V5", key: "x0mq9r" }]
-], Ar = Z("arrow-up", Fr);
-const Br = [
+], _r = to("arrow-up", Ar);
+const jr = [
   ["path", { d: "M8 2v4", key: "1cmpym" }],
   ["path", { d: "M16 2v4", key: "4m81vk" }],
   ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
   ["path", { d: "M3 10h18", key: "8toen8" }]
-], _r = Z("calendar", Br);
-const jr = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], Ko = Z("chevron-down", jr);
-const Hr = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]], Yr = Z("chevron-left", Hr);
-const Ur = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]], Kr = Z("chevron-right", Ur);
-const qr = [
+], Hr = to("calendar", jr);
+const Ur = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], Ko = to("chevron-down", Ur);
+const Yr = [["path", { d: "m15 18-6-6 6-6", key: "1wnfg3" }]], Kr = to("chevron-left", Yr);
+const qr = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]], Gr = to("chevron-right", qr);
+const Xr = [
   ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
   ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
-], bo = Z("x", qr), Gr = i.div`
+], ho = to("x", Xr), Jr = s.div`
   display: inline-flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
   width: ${({ $fullWidth: o }) => o ? "100%" : "auto"};
   position: relative;
   min-width: 0;
-`, Xr = i.div`
+`, Qr = s.div`
   height: 0;
   overflow: hidden;
   visibility: hidden;
   pointer-events: none;
   display: flex;
   flex-direction: column;
-`, Jr = i.button`
+`, Zr = s.button`
   appearance: none;
   width: 100%;
   border-radius: ${({ theme: o }) => o.radius.md};
@@ -589,41 +590,41 @@ const qr = [
     box-shadow 0.2s;
 
   ${({ $size: o, theme: r }) => ({
-  sm: s`
+  sm: t`
         padding: ${r.spacing[1]} ${r.spacing[2]};
         font-size: ${r.fontSizes.sm};
       `,
-  md: s`
+  md: t`
         padding: ${r.spacing[2]} ${r.spacing[3]};
         font-size: ${r.fontSizes.md};
       `,
-  lg: s`
+  lg: t`
         padding: ${r.spacing[3]} ${r.spacing[4]};
         font-size: ${r.fontSizes.lg};
       `
 })[o]}
 
-  ${({ $variant: o, theme: r }) => r.brutalism ? s`
+  ${({ $variant: o, theme: r }) => r.brutalism ? t`
         border: ${r.brutalism.borderWidth} solid
           ${r.colors.neutral[900]};
         background-color: ${r.colors.neutral[0]};
         box-shadow: 3px 3px 0 ${r.colors.neutral[900]};
       ` : {
-  default: s`
+  default: t`
         border: 1px solid ${r.colors.neutral[400]};
         background-color: ${r.colors.neutral[0]};
       `,
-  outlined: s`
+  outlined: t`
         border: 2px solid ${r.colors.primary[500]};
         background-color: ${r.colors.neutral[0]};
       `
 }[o]}
 
-  ${({ $error: o, theme: r }) => o && s`
+  ${({ $error: o, theme: r }) => o && t`
       border-color: ${r.colors.error[500]};
     `}
 
-  ${({ $disabled: o }) => o && s`
+  ${({ $disabled: o }) => o && t`
       opacity: 0.6;
     `}
 
@@ -631,24 +632,24 @@ const qr = [
     outline: none;
     box-shadow: ${({ theme: o }) => o.shadows.focusRing};
   }
-`, mo = i.span`
+`, vo = s.span`
   flex: 1;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
   color: ${({ $placeholder: o, theme: r }) => o ? r.colors.neutral[400] : r.colors.neutral[900]};
-`, Qr = i.span`
+`, on = s.span`
   display: flex;
   align-items: center;
   gap: ${({ theme: o }) => o.spacing[1]};
   flex-shrink: 0;
   color: ${({ theme: o }) => o.colors.neutral[500]};
-`, Zr = i.span`
+`, rn = s.span`
   display: inline-flex;
   align-items: center;
   transition: transform 0.15s;
   transform: ${({ $open: o }) => o ? "rotate(180deg)" : "rotate(0deg)"};
-`, on = i.ul`
+`, nn = s.ul`
   z-index: ${({ theme: o }) => o.zIndex.modal};
   margin: 0;
   padding: ${({ theme: o }) => o.spacing[1]} 0;
@@ -658,19 +659,19 @@ const qr = [
   max-height: 240px;
   overflow-y: auto;
 
-  ${({ theme: o }) => o.brutalism ? s`
+  ${({ theme: o }) => o.brutalism ? t`
           border: ${o.brutalism.borderWidth} solid
             ${o.colors.neutral[900]};
           box-shadow: ${o.brutalism.shadowOffset}
             ${o.brutalism.shadowOffset} 0 ${o.colors.neutral[900]};
-        ` : s`
+        ` : t`
           border: 1px solid ${o.colors.neutral[300]};
           box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
         `}
-`, rn = i.div`
+`, tn = s.div`
   padding: ${({ theme: o }) => o.spacing[2]};
   border-bottom: 1px solid ${({ theme: o }) => o.colors.neutral[200]};
-`, nn = i.input`
+`, en = s.input`
   width: 100%;
   border: 1px solid ${({ theme: o }) => o.colors.neutral[300]};
   border-radius: ${({ theme: o }) => o.radius.md};
@@ -686,18 +687,18 @@ const qr = [
     box-shadow: ${({ theme: o }) => o.shadows.focusRing};
   }
 
-  ${({ theme: o }) => o.brutalism && s`
+  ${({ theme: o }) => o.brutalism && t`
       border: ${o.brutalism.borderWidth} solid ${o.colors.neutral[900]};
       &:focus {
         box-shadow: ${o.shadows.focusRing};
       }
     `}
-`, tn = i.li`
+`, sn = s.li`
   padding: ${({ theme: o }) => `${o.spacing[2]} ${o.spacing[3]}`};
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   color: ${({ theme: o }) => o.colors.neutral[400]};
   list-style: none;
-`, sn = i.li`
+`, an = s.li`
   display: flex;
   align-items: center;
   padding: ${({ theme: o }) => `${o.spacing[2]} ${o.spacing[3]}`};
@@ -709,7 +710,7 @@ const qr = [
 
   font-weight: ${({ $selected: o, theme: r }) => o ? r.fontWeights.semibold : r.fontWeights.normal};
 
-  ${({ $selected: o, theme: r }) => o && s`
+  ${({ $selected: o, theme: r }) => o && t`
       border-left: ${r.spacing[1]} solid ${r.colors.primary[500]};
       padding-left: ${r.spacing[2]};
     `}
@@ -717,10 +718,10 @@ const qr = [
   &:hover {
     background-color: ${({ $disabled: o, $selected: r, theme: n }) => o ? "transparent" : r ? n.colors.primary[50] : n.colors.neutral[100]};
   }
-`, en = i.span`
+`, ln = s.span`
   font-size: ${({ theme: o }) => o.fontSizes.xs};
   color: ${({ $error: o, theme: r }) => o ? r.colors.error[500] : r.colors.neutral[500]};
-`, an = i.button`
+`, cn = s.button`
   display: inline-flex;
   align-items: center;
   padding: 0;
@@ -739,11 +740,11 @@ const qr = [
     border-radius: 2px;
   }
 `;
-function ln({
+function qo({
   options: o,
   placeholder: r,
   size: n = "md",
-  variant: t = "default",
+  variant: e = "default",
   error: a,
   fullWidth: l,
   clearable: d,
@@ -751,232 +752,239 @@ function ln({
   id: u,
   name: f,
   value: $,
-  defaultValue: h,
-  onChange: w,
+  defaultValue: m,
+  onChange: v,
   disabled: y,
-  searchable: v,
-  "aria-label": z,
-  "aria-describedby": O
+  searchable: k,
+  "aria-label": C,
+  "aria-describedby": M
 }) {
-  const R = Q(), L = u ?? R, g = `${L}-list`, C = `${L}-search`, m = typeof a == "string" ? a : void 0, [x, I] = T(!1), [D, W] = T(-1), [M, A] = T(""), [_, P] = T({
+  const P = ro(), L = u ?? P, x = `${L}-list`, I = `${L}-search`, w = typeof a == "string" ? a : void 0, [b, z] = T(!1), [E, D] = T(-1), [N, F] = T(""), [B, V] = T({
     top: 0,
+    bottom: 0,
     left: 0,
-    width: 0
-  }), [j, oo] = T(
-    h ?? ""
-  ), F = $ !== void 0, K = F ? $ : j, ro = U(null), q = U(null), no = U(null), to = U(null), k = o.find(
-    (c) => c.value === K
-  ), N = v && M ? o.filter(
-    (c) => c.label.toLowerCase().includes(M.toLowerCase())
-  ) : o, Y = X(() => {
-    if (!q.current)
+    width: 0,
+    openUpward: !1
+  }), [q, ao] = T(
+    m ?? ""
+  ), O = $ !== void 0, H = O ? $ : q, lo = K(null), G = K(null), no = K(null), J = K(null), co = o.find(
+    (c) => c.value === H
+  ), j = k && N ? o.filter(
+    (c) => c.label.toLowerCase().includes(N.toLowerCase())
+  ) : o, U = X(() => {
+    if (!G.current)
       return;
-    const c = q.current.getBoundingClientRect();
-    P({
+    const c = G.current.getBoundingClientRect(), W = window.innerHeight, Y = no.current?.getBoundingClientRect().height ?? 200, io = W - c.bottom, $o = io < Y + 4 && c.top > io;
+    V({
       top: c.bottom + 4,
+      bottom: W - c.top + 4,
       left: c.left,
-      width: c.width
+      width: c.width,
+      openUpward: $o
     });
   }, []);
-  B(() => {
-    if (x)
-      return Y(), window.addEventListener("scroll", Y, !0), window.addEventListener("resize", Y), () => {
-        window.removeEventListener("scroll", Y, !0), window.removeEventListener("resize", Y);
+  _(() => {
+    if (b)
+      return U(), window.addEventListener("scroll", U, !0), window.addEventListener("resize", U), () => {
+        window.removeEventListener("scroll", U, !0), window.removeEventListener("resize", U);
       };
-  }, [x, Y]), B(() => {
-    if (!x)
+  }, [b, U]), gr(() => {
+    b && U();
+  }, [b, U]), _(() => {
+    if (!b)
       return;
-    const c = (E) => {
-      const G = ro.current?.contains(
-        E.target
-      ), po = no.current?.contains(
-        E.target
+    const c = (W) => {
+      const Y = lo.current?.contains(
+        W.target
+      ), io = no.current?.contains(
+        W.target
       );
-      !G && !po && I(!1);
+      !Y && !io && z(!1);
     };
     return document.addEventListener("mousedown", c), () => document.removeEventListener("mousedown", c);
-  }, [x]), B(() => {
-    x && v && setTimeout(() => to.current?.focus(), 0), x || (A(""), W(-1));
-  }, [x, v]), B(() => {
-    W(-1);
-  }, [M]), B(() => {
-    if (D < 0)
+  }, [b]), _(() => {
+    b && k && setTimeout(() => J.current?.focus(), 0), b || (F(""), D(-1));
+  }, [b, k]), _(() => {
+    D(-1);
+  }, [N]), _(() => {
+    if (E < 0)
       return;
-    const c = document.getElementById(`${g}-option-${D}`);
+    const c = document.getElementById(`${x}-option-${E}`);
     c && typeof c.scrollIntoView == "function" && c.scrollIntoView({ block: "nearest" });
-  }, [D, g]);
-  function H(c, E) {
-    let G = c + E;
-    for (; G >= 0 && G < N.length; ) {
-      if (!N[G].disabled)
-        return G;
-      G += E;
+  }, [E, x]);
+  function Q(c, W) {
+    let Y = c + W;
+    for (; Y >= 0 && Y < j.length; ) {
+      if (!j[Y].disabled)
+        return Y;
+      Y += W;
     }
     return c;
   }
-  function ao() {
-    return N.findIndex((c) => !c.disabled);
+  function Z() {
+    return j.findIndex((c) => !c.disabled);
   }
-  function uo() {
-    for (let c = N.length - 1; c >= 0; c--)
-      if (!N[c].disabled)
+  function eo() {
+    for (let c = j.length - 1; c >= 0; c--)
+      if (!j[c].disabled)
         return c;
     return -1;
   }
-  function lo(c) {
+  function so(c) {
     if (c.disabled)
       return;
-    F || oo(c.value);
-    const E = {
+    O || ao(c.value);
+    const W = {
       target: { name: f ?? "", value: c.value },
       currentTarget: { name: f ?? "", value: c.value }
     };
-    w?.(E), I(!1), q.current?.focus();
+    v?.(W), z(!1), G.current?.focus();
   }
-  function so(c) {
-    c.stopPropagation(), F || oo(""), w?.({
+  function h(c) {
+    c.stopPropagation(), O || ao(""), v?.({
       target: { name: f ?? "", value: "" },
       currentTarget: { name: f ?? "", value: "" }
-    }), p?.(), q.current?.focus();
+    }), p?.(), G.current?.focus();
   }
-  function xo(c) {
+  function A(c) {
     if (!y) {
-      if (!x) {
-        ["ArrowDown", "ArrowUp", "Enter", " "].includes(c.key) && (c.preventDefault(), I(!0), v || W(ao()));
+      if (!b) {
+        ["ArrowDown", "ArrowUp", "Enter", " "].includes(c.key) && (c.preventDefault(), z(!0), k || D(Z()));
         return;
       }
       if (c.key === "Escape") {
-        c.preventDefault(), I(!1);
+        c.preventDefault(), z(!1);
         return;
       }
-      if (!v) {
+      if (!k) {
         if (c.key === "ArrowDown") {
-          c.preventDefault(), W((E) => H(E, 1));
+          c.preventDefault(), D((W) => Q(W, 1));
           return;
         }
         if (c.key === "ArrowUp") {
-          c.preventDefault(), W((E) => H(E, -1));
+          c.preventDefault(), D((W) => Q(W, -1));
           return;
         }
         if (c.key === "Home") {
-          c.preventDefault(), W(ao());
+          c.preventDefault(), D(Z());
           return;
         }
         if (c.key === "End") {
-          c.preventDefault(), W(uo());
+          c.preventDefault(), D(eo());
           return;
         }
-        (c.key === "Enter" || c.key === " ") && D >= 0 && (c.preventDefault(), lo(N[D]));
+        (c.key === "Enter" || c.key === " ") && E >= 0 && (c.preventDefault(), so(j[E]));
       }
     }
   }
-  function yo(c) {
+  function uo(c) {
     if (c.key === "Escape") {
-      I(!1), q.current?.focus();
+      z(!1), G.current?.focus();
       return;
     }
     if (c.key === "ArrowDown") {
-      c.preventDefault(), W(
-        (E) => E < 0 ? ao() : H(E, 1)
+      c.preventDefault(), D(
+        (W) => W < 0 ? Z() : Q(W, 1)
       );
       return;
     }
     if (c.key === "ArrowUp") {
-      c.preventDefault(), W(
-        (E) => E < 0 ? uo() : H(E, -1)
+      c.preventDefault(), D(
+        (W) => W < 0 ? eo() : Q(W, -1)
       );
       return;
     }
-    c.key === "Enter" && D >= 0 && (c.preventDefault(), lo(N[D]));
+    c.key === "Enter" && E >= 0 && (c.preventDefault(), so(j[E]));
   }
-  const b = d && !!K && !y, V = D >= 0 ? `${g}-option-${D}` : void 0;
-  return /* @__PURE__ */ S(Gr, { ref: ro, $fullWidth: l, children: [
-    /* @__PURE__ */ S(Xr, { "aria-hidden": "true", children: [
-      r && /* @__PURE__ */ e(mo, { children: r }),
-      o.map((c) => /* @__PURE__ */ e(mo, { children: c.label }, c.value))
+  const g = d && !!H && !y, R = E >= 0 ? `${x}-option-${E}` : void 0;
+  return /* @__PURE__ */ S(Jr, { ref: lo, $fullWidth: l, children: [
+    /* @__PURE__ */ S(Qr, { "aria-hidden": "true", children: [
+      r && /* @__PURE__ */ i(vo, { children: r }),
+      o.map((c) => /* @__PURE__ */ i(vo, { children: c.label }, c.value))
     ] }),
     /* @__PURE__ */ S(
-      Jr,
+      Zr,
       {
-        ref: q,
+        ref: G,
         id: L,
         type: "button",
         role: "combobox",
-        "aria-expanded": x,
+        "aria-expanded": b,
         "aria-haspopup": "listbox",
-        "aria-controls": x ? g : void 0,
-        "aria-activedescendant": x && !v ? V : void 0,
+        "aria-controls": b ? x : void 0,
+        "aria-activedescendant": b && !k ? R : void 0,
         "aria-invalid": !!a,
-        "aria-label": z,
-        "aria-describedby": O,
+        "aria-label": C,
+        "aria-describedby": M,
         $size: n,
-        $variant: t,
+        $variant: e,
         $error: !!a,
         $disabled: y,
-        $open: x,
+        $open: b,
         disabled: y,
-        onClick: () => !y && I((c) => !c),
-        onKeyDown: xo,
+        onClick: () => !y && z((c) => !c),
+        onKeyDown: A,
         children: [
-          /* @__PURE__ */ e(mo, { $placeholder: !k, children: k?.label ?? r ?? "Select..." }),
-          /* @__PURE__ */ S(Qr, { children: [
-            b && /* @__PURE__ */ e(
-              an,
+          /* @__PURE__ */ i(vo, { $placeholder: !co, children: co?.label ?? r ?? "Select..." }),
+          /* @__PURE__ */ S(on, { children: [
+            g && /* @__PURE__ */ i(
+              cn,
               {
                 type: "button",
-                onClick: so,
+                onClick: h,
                 "aria-label": "Clear selection",
-                children: /* @__PURE__ */ e(bo, { size: 14 })
+                children: /* @__PURE__ */ i(ho, { size: 14 })
               }
             ),
-            /* @__PURE__ */ e(Zr, { $open: x, "aria-hidden": "true", children: /* @__PURE__ */ e(Ko, { size: 14 }) })
+            /* @__PURE__ */ i(rn, { $open: b, "aria-hidden": "true", children: /* @__PURE__ */ i(Ko, { size: 14 }) })
           ] })
         ]
       }
     ),
-    x && go(
+    b && yo(
       /* @__PURE__ */ S(
-        on,
+        nn,
         {
           ref: no,
-          id: g,
+          id: x,
           role: "listbox",
           "aria-label": r ?? "Options",
           style: {
             position: "fixed",
-            top: _.top,
-            left: _.left,
-            width: _.width
+            top: B.openUpward ? "auto" : B.top,
+            bottom: B.openUpward ? B.bottom : "auto",
+            left: B.left,
+            width: B.width
           },
           children: [
-            v && /* @__PURE__ */ e(rn, { children: /* @__PURE__ */ e(
-              nn,
+            k && /* @__PURE__ */ i(tn, { children: /* @__PURE__ */ i(
+              en,
               {
-                ref: to,
-                id: C,
+                ref: J,
+                id: I,
                 type: "text",
                 placeholder: "Search...",
-                value: M,
-                onChange: (c) => A(c.target.value),
-                onKeyDown: yo,
+                value: N,
+                onChange: (c) => F(c.target.value),
+                onKeyDown: uo,
                 "aria-label": "Search options",
-                "aria-controls": g,
-                "aria-activedescendant": V
+                "aria-controls": x,
+                "aria-activedescendant": R
               }
             ) }),
-            N.length === 0 && /* @__PURE__ */ e(tn, { children: "No options found" }),
-            N.map((c, E) => /* @__PURE__ */ e(
-              sn,
+            j.length === 0 && /* @__PURE__ */ i(sn, { children: "No options found" }),
+            j.map((c, W) => /* @__PURE__ */ i(
+              an,
               {
-                id: `${g}-option-${E}`,
+                id: `${x}-option-${W}`,
                 role: "option",
-                "aria-selected": c.value === K,
+                "aria-selected": c.value === H,
                 "aria-disabled": c.disabled,
-                $selected: c.value === K,
-                $focused: E === D,
+                $selected: c.value === H,
+                $focused: W === E,
                 $disabled: c.disabled,
-                onClick: () => lo(c),
-                onMouseEnter: () => !c.disabled && W(E),
+                onClick: () => so(c),
+                onMouseEnter: () => !c.disabled && D(W),
                 children: c.label
               },
               c.value
@@ -986,40 +994,40 @@ function ln({
       ),
       document.body
     ),
-    m && /* @__PURE__ */ e(en, { $error: !0, children: m })
+    w && /* @__PURE__ */ i(ln, { $error: !0, children: w })
   ] });
 }
-ln.displayName = "Select";
-const Po = i.span`
+qo.displayName = "Select";
+const Po = s.span`
   display: inline-block;
-`, cn = i.span`
+`, dn = s.span`
   display: inline-block;
   min-width: 60px;
   padding: ${({ theme: o }) => `${o.spacing[1]} ${o.spacing[2]}`};
   border-radius: ${({ theme: o }) => o.radius.md};
   color: ${({ $empty: o, theme: r }) => o ? r.colors.neutral[400] : "inherit"};
 
-  ${({ theme: o }) => o.brutalism ? s`
+  ${({ theme: o }) => o.brutalism ? t`
           border: ${o.brutalism.borderWidth} solid transparent;
-        ` : s`
+        ` : t`
           border: 1px solid transparent;
         `}
 
-  ${({ $disabled: o, theme: r }) => o ? s`
+  ${({ $disabled: o, theme: r }) => o ? t`
           opacity: 0.5;
-        ` : s`
+        ` : t`
           cursor: text;
           transition:
             border-color 0.15s ease,
             box-shadow 0.15s ease;
 
           &:hover {
-            ${r.brutalism ? s`
+            ${r.brutalism ? t`
                   border-color: ${r.colors.neutral[900]};
                   box-shadow: ${r.brutalism.shadowOffset}
                     ${r.brutalism.shadowOffset} 0
                     ${r.colors.neutral[900]};
-                ` : s`
+                ` : t`
                   border-color: ${r.colors.primary[500]};
                   box-shadow: ${r.shadows.focusRing};
                 `}
@@ -1030,7 +1038,7 @@ const Po = i.span`
             box-shadow: ${r.shadows.focusRing};
           }
         `}
-`, dn = i.input`
+`, un = s.input`
   display: inline-block;
   min-width: 60px;
   padding: ${({ theme: o }) => `${o.spacing[1]} ${o.spacing[2]}`};
@@ -1040,62 +1048,62 @@ const Po = i.span`
   background: ${({ theme: o }) => o.colors.neutral[0]};
   outline: none;
 
-  ${({ theme: o }) => o.brutalism ? s`
+  ${({ theme: o }) => o.brutalism ? t`
           border: ${o.brutalism.borderWidth} solid
             ${o.colors.neutral[900]};
           box-shadow: ${o.brutalism.shadowOffset}
             ${o.brutalism.shadowOffset} 0 ${o.colors.neutral[900]};
-        ` : s`
+        ` : t`
           border: 1px solid ${o.colors.primary[500]};
           box-shadow: ${o.shadows.focusRing};
         `}
 `;
-function un({
+function pn({
   value: o,
   defaultValue: r = "",
   onChange: n,
-  onSubmit: t,
+  onSubmit: e,
   onCancel: a,
   placeholder: l = "Click to edit",
   disabled: d = !1
 }) {
-  const p = o !== void 0, [u, f] = T(r), $ = p ? o : u, [h, w] = T(!1), [y, v] = T(""), z = U(null), O = () => {
-    d || (v($), w(!0), setTimeout(() => {
-      z.current?.focus(), z.current?.select();
+  const p = o !== void 0, [u, f] = T(r), $ = p ? o : u, [m, v] = T(!1), [y, k] = T(""), C = K(null), M = () => {
+    d || (k($), v(!0), setTimeout(() => {
+      C.current?.focus(), C.current?.select();
     }, 0));
-  }, R = () => {
-    p || f(y), n?.(y), t?.(y), w(!1);
+  }, P = () => {
+    p || f(y), n?.(y), e?.(y), v(!1);
   }, L = () => {
-    a?.($), w(!1);
-  }, g = (C) => {
-    C.key === "Enter" ? R() : C.key === "Escape" && L();
+    a?.($), v(!1);
+  }, x = (I) => {
+    I.key === "Enter" ? P() : I.key === "Escape" && L();
   };
-  return h ? /* @__PURE__ */ e(Po, { children: /* @__PURE__ */ e(
-    dn,
+  return m ? /* @__PURE__ */ i(Po, { children: /* @__PURE__ */ i(
+    un,
     {
-      ref: z,
+      ref: C,
       value: y,
       size: Math.max(y.length, l.length, 10),
-      onChange: (C) => v(C.target.value),
-      onBlur: R,
-      onKeyDown: g,
+      onChange: (I) => k(I.target.value),
+      onBlur: P,
+      onKeyDown: x,
       "aria-label": "Edit value"
     }
-  ) }) : /* @__PURE__ */ e(Po, { children: /* @__PURE__ */ e(
-    cn,
+  ) }) : /* @__PURE__ */ i(Po, { children: /* @__PURE__ */ i(
+    dn,
     {
       role: d ? void 0 : "button",
       tabIndex: d ? void 0 : 0,
       $disabled: d,
       $empty: !$,
-      onClick: O,
-      onKeyDown: (C) => C.key === "Enter" && O(),
+      onClick: M,
+      onKeyDown: (I) => I.key === "Enter" && M(),
       children: $ || l
     }
   ) });
 }
-un.displayName = "Editable";
-const pn = i.a`
+pn.displayName = "Editable";
+const fn = s.a`
   text-decoration: underline;
   text-underline-offset: 2px;
   transition: color 0.15s;
@@ -1107,13 +1115,13 @@ const pn = i.a`
   }
 
   ${({ $variant: o, theme: r }) => ({
-  default: s`
+  default: t`
         color: ${r.colors.primary[500]};
         &:hover {
           color: ${r.colors.primary[700]};
         }
       `,
-  subtle: s`
+  subtle: t`
         color: ${r.colors.neutral[500]};
         &:hover {
           color: ${r.colors.neutral[900]};
@@ -1121,55 +1129,55 @@ const pn = i.a`
       `
 })[o]}
 `;
-function qo({
+function Go({
   variant: o = "default",
   external: r,
   children: n,
-  ...t
+  ...e
 }) {
-  return /* @__PURE__ */ e(
-    pn,
+  return /* @__PURE__ */ i(
+    fn,
     {
       $variant: o,
       ...r && { target: "_blank", rel: "noreferrer" },
-      ...t,
+      ...e,
       children: n
     }
   );
 }
-qo.displayName = "Link";
-const fn = i.div`
+Go.displayName = "Link";
+const gn = s.div`
   display: flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
-`, $n = i.span`
+`, $n = s.span`
   font-size: ${({ theme: o }) => o.fontSizes.xs};
   color: ${({ theme: o }) => o.colors.neutral[500]};
   font-weight: ${({ theme: o }) => o.brutalism ? o.fontWeights.bold : o.fontWeights.medium};
-`, gn = i.span`
+`, bn = s.span`
   font-size: ${({ theme: o }) => o.fontSizes.md};
   color: ${({ theme: o }) => o.colors.neutral[900]};
 `;
-function bn({ label: o, value: r, href: n }) {
-  return /* @__PURE__ */ S(fn, { children: [
-    /* @__PURE__ */ e($n, { children: o }),
-    n ? /* @__PURE__ */ e(qo, { href: n, external: !0, children: r }) : /* @__PURE__ */ e(gn, { children: r ?? "—" })
+function xn({ label: o, value: r, href: n }) {
+  return /* @__PURE__ */ S(gn, { children: [
+    /* @__PURE__ */ i($n, { children: o }),
+    n ? /* @__PURE__ */ i(Go, { href: n, external: !0, children: r }) : /* @__PURE__ */ i(bn, { children: r ?? "—" })
   ] });
 }
-bn.displayName = "Field";
-const xn = J`
+xn.displayName = "Field";
+const yn = oo`
   from { opacity: 0; }
   to { opacity: 1; }
-`, yn = J`
+`, hn = oo`
   from { opacity: 1; }
   to { opacity: 0; }
-`, hn = J`
+`, wn = oo`
   from { opacity: 0; transform: scale(0.95) translateY(-8px); }
   to { opacity: 1; transform: scale(1) translateY(0); }
-`, wn = J`
+`, mn = oo`
   from { opacity: 1; transform: scale(1) translateY(0); }
   to { opacity: 0; transform: scale(0.95) translateY(-8px); }
-`, mn = i.div`
+`, vn = s.div`
   position: fixed;
   inset: 0;
   background-color: rgba(0, 0, 0, 0.5);
@@ -1177,9 +1185,9 @@ const xn = J`
   align-items: center;
   justify-content: center;
   z-index: ${({ theme: o }) => o.zIndex.modal};
-  animation: ${({ $closing: o }) => o ? yn : xn} 0.15s ease
+  animation: ${({ $closing: o }) => o ? hn : yn} 0.15s ease
     forwards;
-`, vn = i.div`
+`, kn = s.div`
   position: relative;
   background: ${({ theme: o }) => o.colors.neutral[0]};
   border-radius: ${({ theme: o }) => o.radius.md};
@@ -1188,37 +1196,37 @@ const xn = J`
   display: flex;
   flex-direction: column;
   max-height: 90vh;
-  animation: ${({ $closing: o }) => o ? wn : hn} 0.15s ease
+  animation: ${({ $closing: o }) => o ? mn : wn} 0.15s ease
     forwards;
 
-  ${({ $size: o }) => o === "sm" && s`
+  ${({ $size: o }) => o === "sm" && t`
       width: min(400px, 90vw);
     `}
-  ${({ $size: o }) => o === "md" && s`
+  ${({ $size: o }) => o === "md" && t`
       width: min(560px, 90vw);
     `}
-  ${({ $size: o }) => o === "lg" && s`
+  ${({ $size: o }) => o === "lg" && t`
       width: min(720px, 90vw);
     `}
-  ${({ $size: o }) => o === "fullscreen" && s`
+  ${({ $size: o }) => o === "fullscreen" && t`
       width: 100vw;
       height: 100vh;
       max-height: 100vh;
       border-radius: 0;
     `}
-`, kn = i.div`
+`, Sn = s.div`
   display: flex;
   align-items: center;
   gap: ${({ theme: o }) => o.spacing[2]};
   padding: ${({ theme: o }) => o.spacing[4]};
   border-bottom: 1px solid ${({ theme: o }) => o.colors.neutral[200]};
   flex-shrink: 0;
-`, Sn = i.h2`
+`, zn = s.h2`
   flex: 1;
   font-size: ${({ theme: o }) => o.fontSizes.lg};
   font-weight: ${({ theme: o }) => o.fontWeights.semibold};
   margin: 0;
-`, zn = i.button`
+`, Cn = s.button`
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -1243,11 +1251,11 @@ const xn = J`
     outline: 2px solid ${({ theme: o }) => o.colors.primary[500]};
     outline-offset: 2px;
   }
-`, Cn = i.div`
+`, In = s.div`
   padding: ${({ theme: o }) => o.spacing[4]};
   overflow-y: auto;
   flex: 1;
-`, In = i.div`
+`, Tn = s.div`
   display: flex;
   align-items: center;
   justify-content: flex-end;
@@ -1255,7 +1263,7 @@ const xn = J`
   padding: ${({ theme: o }) => o.spacing[4]};
   border-top: 1px solid ${({ theme: o }) => o.colors.neutral[200]};
   flex-shrink: 0;
-`, Tn = [
+`, Wn = [
   "button:not([disabled])",
   "input:not([disabled])",
   "select:not([disabled])",
@@ -1265,14 +1273,14 @@ const xn = J`
 ].join(", ");
 function Ro(o) {
   return Array.from(
-    o.querySelectorAll(Tn)
+    o.querySelectorAll(Wn)
   );
 }
-function Go({
+function Xo({
   open: o,
   onClose: r,
   title: n,
-  children: t,
+  children: e,
   footer: a,
   size: l = "md",
   closeOnBackdrop: d = !0,
@@ -1280,79 +1288,79 @@ function Go({
   ariaLabelledBy: u,
   ariaDescribedBy: f
 }) {
-  const $ = U(null), h = U(null), w = U(r);
-  w.current = r;
-  const y = Q(), v = u ?? (n ? y : void 0), [z, O] = T(o), [R, L] = T(!1);
-  return B(() => {
+  const $ = K(null), m = K(null), v = K(r);
+  v.current = r;
+  const y = ro(), k = u ?? (n ? y : void 0), [C, M] = T(o), [P, L] = T(!1);
+  return _(() => {
     if (o)
-      O(!0), L(!1);
-    else if (z) {
+      M(!0), L(!1);
+    else if (C) {
       L(!0);
-      const g = setTimeout(() => {
-        O(!1), L(!1);
+      const x = setTimeout(() => {
+        M(!1), L(!1);
       }, 150);
-      return () => clearTimeout(g);
+      return () => clearTimeout(x);
     }
-  }, [o, z]), B(() => {
+  }, [o, C]), _(() => {
     if (!o)
       return;
-    const g = document.body.style.overflow;
+    const x = document.body.style.overflow;
     return document.body.style.overflow = "hidden", () => {
-      document.body.style.overflow = g;
+      document.body.style.overflow = x;
     };
-  }, [o]), B(() => {
+  }, [o]), _(() => {
     if (!o || !$.current)
       return;
-    const g = $.current, C = document.activeElement;
-    (Ro(g)[0] ?? g).focus();
-    const x = (I) => {
-      if (I.key === "Escape" && p) {
-        w.current();
+    const x = $.current, I = document.activeElement;
+    (Ro(x)[0] ?? x).focus();
+    const b = (z) => {
+      if (z.key === "Escape" && p) {
+        v.current();
         return;
       }
-      if (I.key !== "Tab")
+      if (z.key !== "Tab")
         return;
-      const D = Ro(g);
-      if (D.length === 0) {
-        I.preventDefault();
+      const E = Ro(x);
+      if (E.length === 0) {
+        z.preventDefault();
         return;
       }
-      const W = D[0], M = D[D.length - 1];
-      I.shiftKey ? document.activeElement === W && (I.preventDefault(), M.focus()) : document.activeElement === M && (I.preventDefault(), W.focus());
+      const D = E[0], N = E[E.length - 1];
+      z.shiftKey ? document.activeElement === D && (z.preventDefault(), N.focus()) : document.activeElement === N && (z.preventDefault(), D.focus());
     };
-    return document.addEventListener("keydown", x), () => {
-      document.removeEventListener("keydown", x), C?.focus();
+    return document.addEventListener("keydown", b), () => {
+      document.removeEventListener("keydown", b), I?.focus();
     };
-  }, [o, p, z]), z ? go(
-    /* @__PURE__ */ e(
-      mn,
+  }, [o, p, C]), C ? yo(
+    /* @__PURE__ */ i(
+      vn,
       {
-        $closing: R,
-        onMouseDown: (g) => {
-          h.current = g.target;
+        $closing: P,
+        onMouseDown: (x) => {
+          m.current = x.target;
         },
-        onClick: (g) => {
-          d && h.current === g.currentTarget && r();
+        onClick: (x) => {
+          d && m.current === x.currentTarget && r();
         },
         children: /* @__PURE__ */ S(
-          vn,
+          kn,
           {
             ref: $,
             role: "dialog",
             "aria-modal": "true",
-            "aria-labelledby": v,
+            "aria-labelledby": k,
             "aria-describedby": f,
             $size: l,
-            $closing: R,
+            $closing: P,
             tabIndex: -1,
-            onClick: (g) => g.stopPropagation(),
+            onClick: (x) => x.stopPropagation(),
             children: [
-              /* @__PURE__ */ S(kn, { children: [
-                n && /* @__PURE__ */ e(Sn, { id: y, children: n }),
-                /* @__PURE__ */ e(zn, { onClick: r, "aria-label": "Close modal", children: "×" })
+              /* @__PURE__ */ S(Sn, { children: [
+                n && /* @__PURE__ */ i(zn, { id: y, children: n }),
+                /* @__PURE__ */ i(Cn, { onClick: r, "aria-label": "Close modal", children: "×" })
               ] }),
-              /* @__PURE__ */ e(Cn, { children: t }),
-              a && /* @__PURE__ */ e(In, { children: a })
+              /* @__PURE__ */ i(In, { children: e }),
+              a && /* @__PURE__ */ i(Tn, { children: a })
             ]
           }
         )
@@ -1361,64 +1369,64 @@ function Go({
     document.body
   ) : null;
 }
-Go.displayName = "Modal";
-const Xo = J`
+Xo.displayName = "Modal";
+const Jo = oo`
   from { opacity: 0; transform: translateY(12px); }
   to   { opacity: 1; transform: translateY(0); }
-`, Jo = J`
+`, Qo = oo`
   from { opacity: 0; transform: translateY(-12px); }
   to   { opacity: 1; transform: translateY(0); }
-`, Qo = J`
+`, Zo = oo`
   from { opacity: 1; }
   to   { opacity: 0; }
-`, fo = (o, r, n) => s`
+`, bo = (o, r, n) => t`
   background: ${r};
   border: ${o.brutalism.borderWidth} solid ${n};
   box-shadow: ${o.brutalism.shadowOffset} ${o.brutalism.shadowOffset}
     0 ${n};
 `;
-function Zo(o, r) {
+function or(o, r) {
   return r.brutalism ? {
-    success: fo(
+    success: bo(
       r,
       r.colors.success[50],
       r.colors.success[500]
     ),
-    error: fo(
+    error: bo(
       r,
       r.colors.error[50],
       r.colors.error[500]
     ),
-    warning: fo(
+    warning: bo(
       r,
       r.colors.warning[50],
       r.colors.warning[500]
     ),
-    info: fo(r, r.colors.info[50], r.colors.info[500])
+    info: bo(r, r.colors.info[50], r.colors.info[500])
   }[o] : {
-    success: s`
+    success: t`
       background: ${r.colors.success[50]};
       border-left: ${r.spacing[1]} solid ${r.colors.success[500]};
       box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
     `,
-    error: s`
+    error: t`
       background: ${r.colors.error[50]};
       border-left: ${r.spacing[1]} solid ${r.colors.error[500]};
       box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
     `,
-    warning: s`
+    warning: t`
       background: ${r.colors.warning[50]};
       border-left: ${r.spacing[1]} solid ${r.colors.warning[500]};
       box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
     `,
-    info: s`
+    info: t`
       background: ${r.colors.info[50]};
       border-left: ${r.spacing[1]} solid ${r.colors.info[500]};
       box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
     `
   }[o];
 }
-const or = s`
+const rr = t`
   display: flex;
   align-items: center;
   gap: ${({ theme: o }) => o.spacing[3]};
@@ -1426,52 +1434,58 @@ const or = s`
   max-width: 400px;
   padding: ${({ theme: o }) => `${o.spacing[3]} ${o.spacing[4]}`};
   border-radius: ${({ theme: o }) => o.radius.md};
-`, Wn = {
-  "bottom-right": s`
+
+  @media (max-width: 640px) {
+    min-width: unset;
+    max-width: unset;
+    width: 100%;
+  }
+`, Dn = {
+  "bottom-right": t`
     bottom: 24px;
     right: 24px;
   `,
-  "bottom-left": s`
+  "bottom-left": t`
     bottom: 24px;
     left: 24px;
   `,
-  "top-right": s`
+  "top-right": t`
     top: 24px;
     right: 24px;
   `,
-  "top-left": s`
+  "top-left": t`
     top: 24px;
     left: 24px;
   `
-}, Dn = i.div`
+}, En = s.div`
   position: fixed;
   z-index: ${({ theme: o }) => o.zIndex.toast};
-  ${or}
+  ${rr}
 
-  animation: ${({ $closing: o, $position: r }) => o ? s`
-          ${Qo} 0.2s ease forwards
-        ` : r.startsWith("top") ? s`
+  animation: ${({ $closing: o, $position: r }) => o ? t`
+          ${Zo} 0.2s ease forwards
+        ` : r.startsWith("top") ? t`
+            ${Qo} 0.2s ease forwards
+          ` : t`
             ${Jo} 0.2s ease forwards
-          ` : s`
-            ${Xo} 0.2s ease forwards
           `};
 
-  ${({ $position: o }) => Wn[o]}
-  ${({ $variant: o, theme: r }) => Zo(o, r)}
-`, En = i.div`
-  ${or}
+  ${({ $position: o }) => Dn[o]}
+  ${({ $variant: o, theme: r }) => or(o, r)}
+`, On = s.div`
+  ${rr}
   pointer-events: all;
 
-  animation: ${({ $closing: o, $isTop: r }) => o ? s`
-          ${Qo} 0.2s ease forwards
-        ` : r ? s`
+  animation: ${({ $closing: o, $isTop: r }) => o ? t`
+          ${Zo} 0.2s ease forwards
+        ` : r ? t`
+            ${Qo} 0.2s ease forwards
+          ` : t`
             ${Jo} 0.2s ease forwards
-          ` : s`
-            ${Xo} 0.2s ease forwards
           `};
 
-  ${({ $variant: o, theme: r }) => Zo(o, r)}
-`, Mn = i.div`
+  ${({ $variant: o, theme: r }) => or(o, r)}
+`, Mn = s.div`
   position: fixed;
   z-index: ${({ theme: o }) => o.zIndex.toast};
   display: flex;
@@ -1480,35 +1494,43 @@ const or = s`
   pointer-events: none;
 
   ${({ $position: o, theme: r }) => ({
-  "bottom-right": s`
+  "bottom-right": t`
         bottom: ${r.spacing[6]};
         right: ${r.spacing[6]};
         align-items: flex-end;
       `,
-  "bottom-left": s`
+  "bottom-left": t`
         bottom: ${r.spacing[6]};
         left: ${r.spacing[6]};
         align-items: flex-start;
       `,
-  "top-right": s`
+  "top-right": t`
         top: ${r.spacing[6]};
         right: ${r.spacing[6]};
         align-items: flex-end;
       `,
-  "top-left": s`
+  "top-left": t`
         top: ${r.spacing[6]};
         left: ${r.spacing[6]};
         align-items: flex-start;
       `
 })[o]}
-`, rr = i.p`
+
+  @media (max-width: 640px) {
+    top: ${({ theme: o }) => o.spacing[4]};
+    left: ${({ theme: o }) => o.spacing[3]};
+    right: ${({ theme: o }) => o.spacing[3]};
+    bottom: auto;
+    align-items: stretch;
+  }
+`, nr = s.p`
   flex: 1;
   margin: 0;
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   font-weight: ${({ theme: o }) => o.brutalism ? o.fontWeights.semibold : o.fontWeights.normal};
   line-height: 1.5;
   color: ${({ theme: o }) => o.colors.neutral[900]};
-`, nr = i.button`
+`, tr = s.button`
   flex-shrink: 0;
   display: inline-flex;
   align-items: center;
@@ -1531,16 +1553,16 @@ const or = s`
     outline-offset: 2px;
   }
 `;
-function On({
+function Ln({
   open: o,
   onClose: r,
   message: n,
-  variant: t = "info",
+  variant: e = "info",
   duration: a = 4e3,
   position: l = "bottom-right"
 }) {
   const [d, p] = T(o), [u, f] = T(!1);
-  return B(() => {
+  return _(() => {
     if (o)
       p(!0), f(!1);
     else if (d) {
@@ -1552,46 +1574,46 @@ function On({
         clearTimeout($);
       };
     }
-  }, [o, d]), B(() => {
+  }, [o, d]), _(() => {
     if (!o || a === 0)
       return;
     const $ = setTimeout(r, a);
     return () => {
       clearTimeout($);
     };
-  }, [o, a, r]), d ? go(
+  }, [o, a, r]), d ? yo(
     /* @__PURE__ */ S(
-      Dn,
+      En,
       {
         $position: l,
-        $variant: t,
+        $variant: e,
         $closing: u,
         role: "alert",
         "aria-live": "polite",
         children: [
-          /* @__PURE__ */ e(rr, { children: n }),
-          /* @__PURE__ */ e(nr, { onClick: r, "aria-label": "Close notification", children: /* @__PURE__ */ e(bo, { size: 14, strokeWidth: 2.5 }) })
+          /* @__PURE__ */ i(nr, { children: n }),
+          /* @__PURE__ */ i(tr, { onClick: r, "aria-label": "Close notification", children: /* @__PURE__ */ i(ho, { size: 14, strokeWidth: 2.5 }) })
         ]
       }
     ),
     document.body
   ) : null;
 }
-On.displayName = "Toast";
-const tr = Wo(null), Vo = 5, Ln = "bottom-right";
-function Nn({
+Ln.displayName = "Toast";
+const er = Do(null), Vo = 5, Nn = "bottom-right";
+function Pn({
   toast: o,
   isTop: r,
   onClose: n
 }) {
-  return B(() => {
-    const t = o.duration ?? 4e3;
-    if (t === 0)
+  return _(() => {
+    const e = o.duration ?? 4e3;
+    if (e === 0)
       return;
-    const a = setTimeout(() => n(o.id), t);
+    const a = setTimeout(() => n(o.id), e);
     return () => clearTimeout(a);
   }, [o.id, o.duration, n]), /* @__PURE__ */ S(
-    En,
+    On,
     {
       $variant: o.variant ?? "info",
       $closing: o.closing,
@@ -1599,21 +1621,21 @@ function Nn({
       role: "alert",
       "aria-live": "polite",
       children: [
-        /* @__PURE__ */ e(rr, { children: o.message }),
-        /* @__PURE__ */ e(
-          nr,
+        /* @__PURE__ */ i(nr, { children: o.message }),
+        /* @__PURE__ */ i(
+          tr,
           {
             onClick: () => n(o.id),
             "aria-label": "Close notification",
-            children: /* @__PURE__ */ e(bo, { size: 14, strokeWidth: 2.5 })
+            children: /* @__PURE__ */ i(ho, { size: 14, strokeWidth: 2.5 })
           }
         )
       ]
     }
   );
 }
-function $s({ children: o }) {
-  const [r, n] = T([]), t = X((u) => {
+function ye({ children: o }) {
+  const [r, n] = T([]), e = X((u) => {
     n(
       (f) => f.map(
         ($) => $.id === u ? { ...$, closing: !0 } : $
@@ -1626,24 +1648,24 @@ function $s({ children: o }) {
   }, []), a = X((u) => {
     const f = Date.now();
     n(($) => {
-      const h = [...$, { ...u, id: f, closing: !1 }];
-      return h.length > Vo ? h.slice(h.length - Vo) : h;
+      const m = [...$, { ...u, id: f, closing: !1 }];
+      return m.length > Vo ? m.slice(m.length - Vo) : m;
     });
-  }, []), l = Do(() => Object.assign((u) => a(u), {
+  }, []), l = Eo(() => Object.assign((u) => a(u), {
     success: (u, f) => a({ ...f, message: u, variant: "success" }),
     error: (u, f) => a({ ...f, message: u, variant: "error" }),
     warning: (u, f) => a({ ...f, message: u, variant: "warning" }),
     info: (u, f) => a({ ...f, message: u, variant: "info" })
-  }), [a]), d = r[r.length - 1]?.position ?? Ln, p = d.startsWith("top");
-  return /* @__PURE__ */ S(tr.Provider, { value: { toast: l }, children: [
+  }), [a]), d = r[r.length - 1]?.position ?? Nn, p = d.startsWith("top");
+  return /* @__PURE__ */ S(er.Provider, { value: { toast: l }, children: [
     o,
-    r.length > 0 && go(
-      /* @__PURE__ */ e(Mn, { $position: d, children: r.map((u) => /* @__PURE__ */ e(
-        Nn,
+    r.length > 0 && yo(
+      /* @__PURE__ */ i(Mn, { $position: d, children: r.map((u) => /* @__PURE__ */ i(
+        Pn,
         {
           toast: u,
           isTop: p,
-          onClose: t
+          onClose: e
         },
         u.id
       )) }),
@@ -1651,23 +1673,23 @@ function $s({ children: o }) {
     )
   ] });
 }
-function gs() {
-  const o = To(tr);
+function he() {
+  const o = Wo(er);
   if (!o)
     throw new Error("useToast must be used within a ToastProvider");
   return o;
 }
-const Pn = i.form`
+const Rn = s.form`
   display: flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[4]};
 `;
-function Rn({ onSubmit: o, children: r, ...n }) {
-  return /* @__PURE__ */ e(
-    Pn,
+function Vn({ onSubmit: o, children: r, ...n }) {
+  return /* @__PURE__ */ i(
+    Rn,
     {
-      onSubmit: (t) => {
-        t.preventDefault(), o?.(t);
+      onSubmit: (e) => {
+        e.preventDefault(), o?.(e);
       },
       noValidate: !0,
       ...n,
@@ -1675,19 +1697,19 @@ function Rn({ onSubmit: o, children: r, ...n }) {
     }
   );
 }
-Rn.displayName = "Form";
-const Vn = i.div`
+Vn.displayName = "Form";
+const Bn = s.div`
   display: flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
-`, Fn = i.label`
+`, Fn = s.label`
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   font-weight: ${({ theme: o }) => o.fontWeights.medium};
   color: ${({ theme: o }) => o.colors.neutral[900]};
-`, An = i.span`
+`, An = s.span`
   color: ${({ theme: o }) => o.colors.error[500]};
   margin-left: ${({ theme: o }) => o.spacing[0.5]};
-`, Bn = i.span`
+`, _n = s.span`
   font-size: ${({ theme: o }) => o.fontSizes.xs};
   color: ${({ $error: o, theme: r }) => o ? r.colors.error[500] : r.colors.neutral[500]};
 `;
@@ -1695,10 +1717,10 @@ function sr({
   label: o,
   error: r,
   helperText: n,
-  required: t,
+  required: e,
   children: a
 }) {
-  const l = Q(), d = `${l}-hint`, p = !!(r || n), u = typeof r == "string" ? r : void 0, f = Oo.isValidElement(a) ? Oo.cloneElement(
+  const l = ro(), d = `${l}-hint`, p = !!(r || n), u = typeof r == "string" ? r : void 0, f = Mo.isValidElement(a) ? Mo.cloneElement(
     a,
     {
       id: l,
@@ -1706,144 +1728,144 @@ function sr({
       ...r && { "aria-invalid": !0 }
     }
   ) : a;
-  return /* @__PURE__ */ S(Vn, { children: [
+  return /* @__PURE__ */ S(Bn, { children: [
     o && /* @__PURE__ */ S(Fn, { htmlFor: l, children: [
       o,
-      t && /* @__PURE__ */ e(An, { "aria-hidden": "true", children: " *" })
+      e && /* @__PURE__ */ i(An, { "aria-hidden": "true", children: " *" })
     ] }),
     f,
-    p && /* @__PURE__ */ e(Bn, { id: d, $error: !!r, children: u ?? n })
+    p && /* @__PURE__ */ i(_n, { id: d, $error: !!r, children: u ?? n })
   ] });
 }
 sr.displayName = "FormField";
-function bs({
+function we({
   initialValues: o,
   validate: r,
   onSubmit: n,
-  onError: t
+  onError: e
 }) {
   const [a, l] = T(o), [d, p] = T(
     {}
-  ), [u, f] = T({}), [$, h] = T(!1), w = U(a);
-  w.current = a;
+  ), [u, f] = T({}), [$, m] = T(!1), v = K(a);
+  v.current = a;
   const y = X(
-    (m) => {
+    (w) => {
       if (!r)
         return {};
-      const x = r(m);
+      const b = r(w);
       return Object.fromEntries(
-        Object.entries(x).filter(([, I]) => I !== void 0)
+        Object.entries(b).filter(([, z]) => z !== void 0)
       );
     },
     [r]
-  ), v = U(u);
-  v.current = u;
-  const z = X(
-    (m) => {
-      const { name: x, value: I } = m.target;
-      process.env.NODE_ENV !== "production" && !x && console.warn(
+  ), k = K(u);
+  k.current = u;
+  const C = X(
+    (w) => {
+      const { name: b, value: z } = w.target;
+      process.env.NODE_ENV !== "production" && !b && console.warn(
         "[useForm] handleChange: field is missing a `name` attribute — value will not be tracked."
       );
-      const D = { ...w.current, [x]: I };
-      l(D), v.current[x] && p(y(D));
+      const E = { ...v.current, [b]: z };
+      l(E), k.current[b] && p(y(E));
     },
     [y]
-  ), O = X(
-    (m) => {
-      const { name: x } = m.target;
-      process.env.NODE_ENV !== "production" && !x && console.warn(
+  ), M = X(
+    (w) => {
+      const { name: b } = w.target;
+      process.env.NODE_ENV !== "production" && !b && console.warn(
         "[useForm] handleBlur: field is missing a `name` attribute — touched state will not be tracked."
-      ), f((I) => ({ ...I, [x]: !0 })), p(y(w.current));
+      ), f((z) => ({ ...z, [b]: !0 })), p(y(v.current));
     },
     [y]
-  ), R = X(
-    (m) => {
-      m?.preventDefault();
-      const x = Object.keys(w.current).reduce(
-        (W, M) => ({ ...W, [M]: !0 }),
+  ), P = X(
+    (w) => {
+      w?.preventDefault();
+      const b = Object.keys(v.current).reduce(
+        (D, N) => ({ ...D, [N]: !0 }),
         {}
       );
-      f(x);
-      const I = y(w.current);
-      if (p(I), Object.keys(I).length > 0) {
-        t?.(I);
+      f(b);
+      const z = y(v.current);
+      if (p(z), Object.keys(z).length > 0) {
+        e?.(z);
         return;
       }
       (async () => {
-        h(!0);
+        m(!0);
         try {
-          await n?.(w.current);
+          await n?.(v.current);
         } finally {
-          h(!1);
+          m(!1);
         }
       })();
     },
-    [y, n, t]
-  ), L = X((m, x) => {
-    l((I) => ({ ...I, [m]: x }));
-  }, []), g = X(
-    (m) => {
-      l(m ?? o), p({}), f({}), h(!1);
+    [y, n, e]
+  ), L = X((w, b) => {
+    l((z) => ({ ...z, [w]: b }));
+  }, []), x = X(
+    (w) => {
+      l(w ?? o), p({}), f({}), m(!1);
     },
     [o]
-  ), C = Object.fromEntries(
-    Object.entries(d).filter(([m]) => u[m])
+  ), I = Object.fromEntries(
+    Object.entries(d).filter(([w]) => u[w])
   );
   return {
     values: a,
-    errors: C,
+    errors: I,
     touched: u,
-    handleChange: z,
-    handleBlur: O,
-    handleSubmit: R,
+    handleChange: C,
+    handleBlur: M,
+    handleSubmit: P,
     setFieldValue: L,
-    reset: g,
+    reset: x,
     isSubmitting: $
   };
 }
-const xs = (o = "Required") => (r) => {
+const me = (o = "Required") => (r) => {
   if (!r.trim())
     return o;
-}, ys = (o, r) => (n) => {
+}, ve = (o, r) => (n) => {
   if (n.length < o)
     return r ?? `Must be at least ${o} characters`;
-}, hs = (o, r) => (n) => {
+}, ke = (o, r) => (n) => {
   if (n.length > o)
     return r ?? `Must be at most ${o} characters`;
-}, ws = (o = "Enter a valid email") => (r) => {
+}, Se = (o = "Enter a valid email") => (r) => {
   if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(r))
     return o;
-}, ms = (o = "Enter a valid URL") => (r) => {
+}, ze = (o = "Enter a valid URL") => (r) => {
   try {
     new URL(r);
     return;
   } catch {
     return o;
   }
-}, vs = (o, r) => (n) => {
+}, Ce = (o, r) => (n) => {
   if (!o.test(n))
     return r;
 };
-function ks(...o) {
+function Ie(...o) {
   return (r) => {
     for (const n of o) {
-      const t = n(r);
-      if (t !== void 0)
-        return t;
+      const e = n(r);
+      if (e !== void 0)
+        return e;
     }
   };
 }
-const _n = i.div`
+const jn = s.div`
   display: flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
-`, jn = i.label`
+`, Hn = s.label`
   display: inline-flex;
   align-items: center;
   gap: ${({ theme: o }) => o.spacing[2]};
   cursor: ${({ $disabled: o }) => o ? "not-allowed" : "pointer"};
   opacity: ${({ $disabled: o }) => o ? 0.6 : 1};
-`, Hn = i.input`
+`, Un = s.input`
   position: absolute;
   opacity: 0;
   width: 0;
@@ -1854,7 +1876,7 @@ const _n = i.div`
   &:focus-visible + div {
     box-shadow: ${({ theme: o }) => o.shadows.focusRing};
   }
-`, Yn = i.div`
+`, Yn = s.div`
   position: relative;
   display: flex;
   align-items: center;
@@ -1869,17 +1891,17 @@ const _n = i.div`
     border-color 0.1s;
 
   ${({ $size: o = "md", theme: r }) => ({
-  sm: s`
+  sm: t`
         width: ${r.spacing[4]};
         height: ${r.spacing[4]};
       `,
-  md: s`
+  md: t`
         width: ${r.spacing[5]};
         height: ${r.spacing[5]};
       `
 })[o]}
 
-  ${({ $checked: o, $checkColor: r }) => o && s`
+  ${({ $checked: o, $checkColor: r }) => o && t`
       &::after {
         content: "";
         display: block;
@@ -1891,18 +1913,18 @@ const _n = i.div`
         transform: rotate(45deg) translate(-1px, -1px);
       }
     `}
-`, Un = i.span`
+`, Kn = s.span`
   font-size: ${({ $size: o = "md", theme: r }) => o === "sm" ? r.fontSizes.sm : r.fontSizes.md};
   font-weight: ${({ theme: o }) => o.fontWeights.medium};
-`, Kn = i.span`
+`, qn = s.span`
   font-size: ${({ theme: o }) => o.fontSizes.xs};
   color: ${({ $error: o, theme: r }) => o ? r.colors.error[500] : r.colors.neutral[500]};
 `;
-function qn({
+function Gn({
   ref: o,
   label: r,
   size: n = "md",
-  error: t,
+  error: e,
   helperText: a,
   disabled: l,
   checked: d,
@@ -1910,28 +1932,28 @@ function qn({
   color: u,
   borderColor: f,
   checkColor: $,
-  ...h
+  ...m
 }) {
-  const w = Q(), y = p ?? w, v = typeof t == "string" ? t : void 0, z = !!(a || t);
-  return /* @__PURE__ */ S(_n, { children: [
-    /* @__PURE__ */ S(jn, { htmlFor: y, $disabled: l, children: [
-      /* @__PURE__ */ e(
-        Hn,
+  const v = ro(), y = p ?? v, k = typeof e == "string" ? e : void 0, C = !!(a || e);
+  return /* @__PURE__ */ S(jn, { children: [
+    /* @__PURE__ */ S(Hn, { htmlFor: y, $disabled: l, children: [
+      /* @__PURE__ */ i(
+        Un,
         {
           id: y,
           ref: o,
           type: "checkbox",
           checked: d,
           disabled: l,
-          "aria-invalid": !!t,
-          ...h
+          "aria-invalid": !!e,
+          ...m
         }
       ),
-      /* @__PURE__ */ e(
+      /* @__PURE__ */ i(
         Yn,
         {
           $checked: d,
-          $error: !!t,
+          $error: !!e,
           $disabled: l,
           $size: n,
           $color: u,
@@ -1939,23 +1961,23 @@ function qn({
           $checkColor: $
         }
       ),
-      r && /* @__PURE__ */ e(Un, { $size: n, children: r })
+      r && /* @__PURE__ */ i(Kn, { $size: n, children: r })
     ] }),
-    z && /* @__PURE__ */ e(Kn, { $error: !!t, children: v ?? a })
+    C && /* @__PURE__ */ i(qn, { $error: !!e, children: k ?? a })
   ] });
 }
-qn.displayName = "Checkbox";
-const Gn = i.div`
+Gn.displayName = "Checkbox";
+const Xn = s.div`
   display: flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
-`, Xn = i.label`
+`, Jn = s.label`
   display: inline-flex;
   align-items: center;
   gap: ${({ theme: o }) => o.spacing[2]};
   cursor: ${({ $disabled: o }) => o ? "not-allowed" : "pointer"};
   opacity: ${({ $disabled: o }) => o ? 0.6 : 1};
-`, Jn = i.input`
+`, Qn = s.input`
   position: absolute;
   opacity: 0;
   width: 0;
@@ -1966,7 +1988,7 @@ const Gn = i.div`
   &:focus-visible + div {
     box-shadow: ${({ theme: o }) => o.shadows.focusRing};
   }
-`, Qn = i.div`
+`, Zn = s.div`
   position: relative;
   display: flex;
   align-items: center;
@@ -1981,17 +2003,17 @@ const Gn = i.div`
     border-color 0.1s;
 
   ${({ $size: o = "md", theme: r }) => ({
-  sm: s`
+  sm: t`
         width: ${r.spacing[4]};
         height: ${r.spacing[4]};
       `,
-  md: s`
+  md: t`
         width: ${r.spacing[5]};
         height: ${r.spacing[5]};
       `
 })[o]}
 
-  ${({ $checked: o, $color: r, theme: n }) => o && s`
+  ${({ $checked: o, $color: r, theme: n }) => o && t`
       &::after {
         content: "";
         display: block;
@@ -2001,18 +2023,18 @@ const Gn = i.div`
         background-color: ${r ?? n.colors.primary[500]};
       }
     `}
-`, Zn = i.span`
+`, ot = s.span`
   font-size: ${({ $size: o = "md", theme: r }) => o === "sm" ? r.fontSizes.sm : r.fontSizes.md};
   font-weight: ${({ theme: o }) => o.fontWeights.medium};
-`, ot = i.span`
+`, rt = s.span`
   font-size: ${({ theme: o }) => o.fontSizes.xs};
   color: ${({ $error: o, theme: r }) => o ? r.colors.error[500] : r.colors.neutral[500]};
 `;
-function rt({
+function nt({
   ref: o,
   label: r,
   size: n = "md",
-  error: t,
+  error: e,
   helperText: a,
   disabled: l,
   checked: d,
@@ -2021,49 +2043,49 @@ function rt({
   borderColor: f,
   ...$
 }) {
-  const h = Q(), w = p ?? h, y = !!(a || t);
-  return /* @__PURE__ */ S(Gn, { children: [
-    /* @__PURE__ */ S(Xn, { htmlFor: w, $disabled: l, children: [
-      /* @__PURE__ */ e(
-        Jn,
+  const m = ro(), v = p ?? m, y = !!(a || e);
+  return /* @__PURE__ */ S(Xn, { children: [
+    /* @__PURE__ */ S(Jn, { htmlFor: v, $disabled: l, children: [
+      /* @__PURE__ */ i(
+        Qn,
         {
-          id: w,
+          id: v,
           ref: o,
           type: "radio",
           checked: d,
           disabled: l,
-          "aria-invalid": !!t,
+          "aria-invalid": !!e,
           ...$
         }
       ),
-      /* @__PURE__ */ e(
-        Qn,
+      /* @__PURE__ */ i(
+        Zn,
         {
           $checked: d,
-          $error: t,
+          $error: e,
           $disabled: l,
           $size: n,
           $color: u,
           $borderColor: f
         }
       ),
-      r && /* @__PURE__ */ e(Zn, { $size: n, children: r })
+      r && /* @__PURE__ */ i(ot, { $size: n, children: r })
     ] }),
-    y && /* @__PURE__ */ e(ot, { $error: t, children: a })
+    y && /* @__PURE__ */ i(rt, { $error: e, children: a })
   ] });
 }
-rt.displayName = "Radio";
-const nt = i.div`
+nt.displayName = "Radio";
+const tt = s.div`
   display: flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
-`, tt = i.label`
+`, et = s.label`
   display: inline-flex;
   align-items: center;
   gap: ${({ theme: o }) => o.spacing[2]};
   cursor: ${({ $disabled: o }) => o ? "not-allowed" : "pointer"};
   opacity: ${({ $disabled: o }) => o ? 0.6 : 1};
-`, st = i.input`
+`, st = s.input`
   position: absolute;
   opacity: 0;
   width: 0;
@@ -2074,7 +2096,7 @@ const nt = i.div`
   &:focus-visible + div {
     box-shadow: ${({ theme: o }) => o.shadows.focusRing};
   }
-`, et = i.div`
+`, it = s.div`
   position: relative;
   flex-shrink: 0;
   border-radius: 9999px;
@@ -2085,17 +2107,17 @@ const nt = i.div`
     background-color 0.15s,
     box-shadow 0.15s;
 
-  ${({ $checked: o, theme: r }) => o && s`
+  ${({ $checked: o, theme: r }) => o && t`
       box-shadow: ${r.brutalism?.shadowOffset ?? "4px"}
         ${r.brutalism?.shadowOffset ?? "4px"} 0 ${r.colors.neutral[900]};
     `}
 
   ${({ $size: o = "md" }) => ({
-  sm: s`
+  sm: t`
         width: 36px;
         height: 20px;
       `,
-  md: s`
+  md: t`
         width: 44px;
         height: 24px;
       `
@@ -2111,38 +2133,38 @@ const nt = i.div`
     transition: transform 0.15s;
 
     ${({ $size: o = "md", $checked: r }) => {
-  const n = s`
+  const n = t`
         width: 12px;
         height: 12px;
         margin-top: -6px;
         transform: translateX(${r ? "calc(100% + 4px)" : "2px"});
-      `, t = s`
+      `, e = t`
         width: 16px;
         height: 16px;
         margin-top: -8px;
         transform: translateX(${r ? "calc(100% + 4px)" : "2px"});
       `;
-  return o === "sm" ? n : t;
+  return o === "sm" ? n : e;
 }}
   }
-`, it = i.span`
+`, at = s.span`
   font-size: ${({ $size: o = "md", theme: r }) => o === "sm" ? r.fontSizes.sm : r.fontSizes.md};
   font-weight: ${({ theme: o }) => o.fontWeights.medium};
 `;
-function at({
+function lt({
   ref: o,
   label: r,
   size: n = "md",
-  disabled: t,
+  disabled: e,
   checked: a,
   id: l,
   color: d,
   borderColor: p,
   ...u
 }) {
-  const f = Q(), $ = l ?? f;
-  return /* @__PURE__ */ e(nt, { children: /* @__PURE__ */ S(tt, { htmlFor: $, $disabled: t, children: [
-    /* @__PURE__ */ e(
+  const f = ro(), $ = l ?? f;
+  return /* @__PURE__ */ i(tt, { children: /* @__PURE__ */ S(et, { htmlFor: $, $disabled: e, children: [
+    /* @__PURE__ */ i(
       st,
       {
         id: $,
@@ -2150,12 +2172,12 @@ function at({
         type: "checkbox",
         role: "switch",
         checked: a,
-        disabled: t,
+        disabled: e,
         ...u
       }
     ),
-    /* @__PURE__ */ e(
-      et,
+    /* @__PURE__ */ i(
+      it,
       {
         $checked: a,
         $size: n,
@@ -2163,26 +2185,26 @@ function at({
         $borderColor: p
       }
     ),
-    r && /* @__PURE__ */ e(it, { $size: n, children: r })
+    r && /* @__PURE__ */ i(at, { $size: n, children: r })
   ] }) });
 }
-at.displayName = "Switch";
-const lt = i.div`
+lt.displayName = "Switch";
+const ct = s.div`
   border-radius: ${({ theme: o }) => o.radius.md};
   background: ${({ theme: o }) => o.colors.neutral[0]};
   overflow: hidden;
 
-  ${({ theme: o, $accentColor: r }) => o.brutalism ? s`
+  ${({ theme: o, $accentColor: r }) => o.brutalism ? t`
           border: ${o.brutalism.borderWidth} solid
             ${r ?? o.colors.neutral[900]};
           box-shadow: ${o.brutalism.shadowOffset}
             ${o.brutalism.shadowOffset} 0
             ${r ?? o.colors.neutral[900]};
-        ` : s`
+        ` : t`
           border: 1px solid ${r ?? o.colors.neutral[200]};
           box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
         `}
-`, ct = i.button`
+`, dt = s.button`
   width: 100%;
   display: flex;
   align-items: flex-start;
@@ -2202,19 +2224,19 @@ const lt = i.div`
       ${({ theme: o, $accentColor: r }) => r ?? o.colors.primary[500]};
     outline-offset: -2px;
   }
-`, dt = i.div`
+`, ut = s.div`
   flex: 1;
   min-width: 0;
-`, ut = i.span`
+`, pt = s.span`
   display: block;
   font-size: ${({ theme: o }) => o.fontSizes.md};
   font-weight: ${({ theme: o }) => o.fontWeights.semibold};
   color: ${({ theme: o }) => o.colors.neutral[900]};
-`, pt = i.span`
+`, ft = s.span`
   display: block;
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   color: ${({ theme: o }) => o.colors.neutral[500]};
-`, ft = i.div`
+`, gt = s.div`
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -2226,11 +2248,11 @@ const lt = i.div`
     align-items: flex-start;
     gap: ${({ theme: o }) => o.spacing[2]};
   }
-`, $t = i.div`
+`, $t = s.div`
   display: flex;
   align-items: center;
   gap: ${({ theme: o }) => o.spacing[2]};
-`, gt = i.span`
+`, bt = s.span`
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -2238,82 +2260,82 @@ const lt = i.div`
   transition: transform 0.2s ease;
   transform: ${({ $open: o }) => o ? "rotate(180deg)" : "rotate(0deg)"};
   color: ${({ theme: o, $accentColor: r }) => r ?? o.colors.neutral[500]};
-`, bt = i.div`
+`, xt = s.div`
   display: grid;
   grid-template-rows: ${({ $open: o }) => o ? "1fr" : "0fr"};
   transition: grid-template-rows 0.2s ease;
-`, xt = i.div`
+`, yt = s.div`
   overflow: hidden;
-`, yt = i.div`
+`, ht = s.div`
   padding: ${({ theme: o }) => o.spacing[4]};
   border-top: 1px solid ${({ theme: o }) => o.colors.neutral[200]};
 `;
-function ht({
+function wt({
   title: o,
   children: r,
   defaultOpen: n = !1,
-  open: t,
+  open: e,
   onToggle: a,
   subtitle: l,
   headerActions: d,
   accentColor: p
 }) {
-  const [u, f] = T(n), $ = Q(), h = t !== void 0, w = h ? t : u;
-  return /* @__PURE__ */ S(lt, { $accentColor: p, children: [
+  const [u, f] = T(n), $ = ro(), m = e !== void 0, v = m ? e : u;
+  return /* @__PURE__ */ S(ct, { $accentColor: p, children: [
     /* @__PURE__ */ S(
-      ct,
+      dt,
       {
         type: "button",
-        $open: w,
+        $open: v,
         $accentColor: p,
-        "aria-expanded": w,
+        "aria-expanded": v,
         "aria-controls": $,
         onClick: () => {
-          const v = !w;
-          h || f(v), a?.(v);
+          const k = !v;
+          m || f(k), a?.(k);
         },
         children: [
-          /* @__PURE__ */ S(dt, { children: [
-            /* @__PURE__ */ e(ut, { children: o }),
-            (l || d) && /* @__PURE__ */ S(ft, { children: [
-              l && /* @__PURE__ */ e(pt, { children: l }),
-              d && /* @__PURE__ */ e($t, { onClick: (v) => v.stopPropagation(), children: d })
+          /* @__PURE__ */ S(ut, { children: [
+            /* @__PURE__ */ i(pt, { children: o }),
+            (l || d) && /* @__PURE__ */ S(gt, { children: [
+              l && /* @__PURE__ */ i(ft, { children: l }),
+              d && /* @__PURE__ */ i($t, { onClick: (k) => k.stopPropagation(), children: d })
             ] })
           ] }),
-          /* @__PURE__ */ e(
-            gt,
+          /* @__PURE__ */ i(
+            bt,
             {
-              $open: w,
+              $open: v,
               $accentColor: p,
               "aria-hidden": "true",
-              children: /* @__PURE__ */ e(Ko, { size: 18, strokeWidth: 2.5 })
+              children: /* @__PURE__ */ i(Ko, { size: 18, strokeWidth: 2.5 })
             }
           )
         ]
       }
     ),
-    /* @__PURE__ */ e(bt, { $open: w, children: /* @__PURE__ */ e(xt, { id: $, role: "region", "aria-label": o, children: /* @__PURE__ */ e(yt, { children: r }) }) })
+    /* @__PURE__ */ i(xt, { $open: v, children: /* @__PURE__ */ i(yt, { id: $, role: "region", "aria-label": o, children: /* @__PURE__ */ i(ht, { children: r }) }) })
   ] });
 }
-ht.displayName = "CollapsibleCard";
-const wt = J`
+wt.displayName = "CollapsibleCard";
+const mt = oo`
   to { transform: rotate(360deg); }
-`, mt = {
+`, vt = {
   sm: "16px",
   md: "24px",
   lg: "40px"
-}, vt = {
+}, kt = {
   thin: "2px",
   normal: "3px",
   bold: "5px"
-}, kt = i.span`
+}, St = s.span`
   display: inline-block;
   border-radius: 50%;
-  animation: ${wt} 0.7s linear infinite;
+  animation: ${mt} 0.7s linear infinite;
 
-  ${({ $size: o = "md", $weight: r = "normal", $color: n, theme: t }) => {
-  const a = mt[o], l = vt[r], d = t.colors.neutral[200], p = n ?? t.colors.primary[500];
-  return s`
+  ${({ $size: o = "md", $weight: r = "normal", $color: n, theme: e }) => {
+  const a = vt[o], l = kt[r], d = e.colors.neutral[200], p = n ?? e.colors.primary[500];
+  return t`
       width: ${a};
       height: ${a};
       border: ${l} solid ${d};
@@ -2321,104 +2343,110 @@ const wt = J`
     `;
 }}
 `;
-function St({
+function zt({
   size: o = "md",
   weight: r = "normal",
   color: n,
-  label: t = "Loading..."
+  label: e = "Loading..."
 }) {
-  return /* @__PURE__ */ e(
-    kt,
+  return /* @__PURE__ */ i(
+    St,
     {
       $size: o,
       $weight: r,
       $color: n,
       role: "status",
-      "aria-label": t
+      "aria-label": e
     }
   );
 }
-St.displayName = "Spinner";
-const zt = 7, Fo = 3, Ao = 1;
-function Ss({
+zt.displayName = "Spinner";
+const Ct = 7, Bo = 3, Fo = 1;
+function Te({
   defaultSort: o,
   defaultPage: r = 1
 } = {}) {
-  const [n, t] = T(o ?? null), [a, l] = T(r);
+  const [n, e] = T(o ?? null), [a, l] = T(r);
   return { sort: n, page: a, onSortChange: (u) => {
-    t(u), l(1);
+    e(u), l(1);
   }, onPageChange: (u) => {
     l(u);
   } };
 }
-function Ct(o, r) {
+function It(o, r) {
   return o?.key !== r ? { key: r, direction: "asc" } : o.direction === "asc" ? { key: r, direction: "desc" } : null;
 }
-function It({
+function Tt({
   data: o,
   sort: r,
   defaultSort: n,
-  onSortChange: t
+  onSortChange: e
 }) {
   const a = r !== void 0, [l, d] = T(
     n ?? null
   ), p = a ? r ?? null : l, u = ($) => {
-    const h = Ct(p, $);
-    return a || d(h), t?.(h), h;
-  }, f = Do(() => a || !p ? o : [...o].sort(($, h) => {
-    const w = $[p.key], y = h[p.key], v = w < y ? -1 : w > y ? 1 : 0;
-    return p.direction === "asc" ? v : -v;
+    const m = It(p, $);
+    return a || d(m), e?.(m), m;
+  }, f = Eo(() => a || !p ? o : [...o].sort(($, m) => {
+    const v = $[p.key], y = m[p.key], k = v < y ? -1 : v > y ? 1 : 0;
+    return p.direction === "asc" ? k : -k;
   }), [o, p, a]);
   return { activeSort: p, sortedData: f, handleSort: u };
 }
-function Tt(o, r) {
-  if (r <= zt)
-    return Array.from({ length: r }, (t, a) => a + 1);
+function Wt(o, r) {
+  if (r <= Ct)
+    return Array.from({ length: r }, (e, a) => a + 1);
   const n = [1];
-  o > Fo && n.push("...");
-  for (let t = Math.max(2, o - Ao); t <= Math.min(r - 1, o + Ao); t++)
-    n.push(t);
-  return o < r - Fo + 1 && n.push("..."), n.push(r), n;
+  o > Bo && n.push("...");
+  for (let e = Math.max(2, o - Fo); e <= Math.min(r - 1, o + Fo); e++)
+    n.push(e);
+  return o < r - Bo + 1 && n.push("..."), n.push(r), n;
 }
-function Wt({
+function Dt({
   data: o,
   pageSize: r,
   page: n,
-  defaultPage: t,
+  defaultPage: e,
   totalRows: a,
   onPageChange: l
 }) {
-  const d = n !== void 0, [p, u] = T(t ?? 1), f = d ? n : p, $ = (z) => {
-    d || u(z), l?.(z);
-  }, h = d || a !== void 0, w = a ?? o.length, y = r ? Math.max(1, Math.ceil(w / r)) : 1, v = Do(() => {
-    if (!r || h)
+  const d = n !== void 0, [p, u] = T(e ?? 1), f = d ? n : p, $ = (C) => {
+    d || u(C), l?.(C);
+  }, m = a !== void 0, v = a ?? o.length, y = r ? Math.max(1, Math.ceil(v / r)) : 1, k = Eo(() => {
+    if (!r || m)
       return o;
-    const z = (f - 1) * r;
-    return o.slice(z, z + r);
-  }, [o, r, f, h]);
-  return { activePage: f, totalPages: y, displayData: v, handlePageChange: $ };
+    const C = (f - 1) * r;
+    return o.slice(C, C + r);
+  }, [o, r, f, m]);
+  return { activePage: f, totalPages: y, displayData: k, handlePageChange: $ };
 }
-const er = (o, r) => o === "sm" ? `${r.spacing[1]} ${r.spacing[2]}` : o === "lg" ? `${r.spacing[3]} ${r.spacing[4]}` : `${r.spacing[2]} ${r.spacing[3]}`, Dt = i.div`
+const ir = (o, r) => o === "sm" ? `${r.spacing[1]} ${r.spacing[2]}` : o === "lg" ? `${r.spacing[3]} ${r.spacing[4]}` : `${r.spacing[2]} ${r.spacing[3]}`, Et = s.div`
   width: 100%;
 
-  ${({ theme: o, $borderColor: r }) => o.brutalism ? s`
+  ${({ theme: o, $borderColor: r }) => o.brutalism ? t`
           border: ${o.brutalism.borderWidth} solid
             ${r ?? o.colors.neutral[900]};
           box-shadow: ${o.brutalism.shadowOffset}
             ${o.brutalism.shadowOffset} 0
             ${r ?? o.colors.neutral[900]};
-        ` : s`
+        ` : t`
           border: 1px solid ${r ?? o.colors.neutral[300]};
           border-radius: ${o.radius.md};
           overflow: hidden;
         `}
 
-  overflow-x: auto;
-  ${({ $stickyHeader: o }) => o && s`
-      overflow-y: auto;
-    `}
-`, Et = i.table`
-  width: 100%;
+  ${({ $stickyPagination: o }) => o ? t`
+          display: flex;
+          flex-direction: column;
+        ` : t`
+          overflow-x: auto;
+        `}
+`, Ot = s.div`
+  overflow: auto;
+  min-height: 0;
+`, Mt = s.table`
+  width: max-content;
+  min-width: 100%;
   border-collapse: collapse;
   font-size: ${({ $size: o, theme: r }) => ({
   sm: r.fontSizes.sm,
@@ -2429,34 +2457,34 @@ const er = (o, r) => o === "sm" ? `${r.spacing[1]} ${r.spacing[2]}` : o === "lg"
   caption {
     padding: ${({ theme: o }) => o.spacing[2]} 0;
   }
-`, Mt = i.thead`
-  ${({ $stickyHeader: o }) => o && s`
+`, Lt = s.thead`
+  ${({ $stickyHeader: o }) => o && t`
       position: sticky;
       top: 0;
       z-index: 1;
     `}
 
-  ${({ theme: o, $headerColor: r, $borderColor: n }) => r ? s`
+  ${({ theme: o, $headerColor: r, $borderColor: n }) => r ? t`
           --th-bg: ${r};
           --th-text: ${o.colors.neutral[0]};
           --th-sep: rgba(255, 255, 255, 0.25);
-        ` : o.brutalism ? s`
+        ` : o.brutalism ? t`
             --th-bg: ${o.colors.neutral[900]};
             --th-text: ${o.colors.neutral[0]};
             --th-sep: ${n ?? o.colors.neutral[600]};
-          ` : s`
+          ` : t`
             --th-bg: ${o.colors.neutral[100]};
             --th-text: ${o.colors.neutral[600]};
             --th-sep: ${n ?? o.colors.neutral[300]};
           `}
-`, Ot = i.tbody`
-  ${({ $rowColor: o }) => o && s`
+`, Nt = s.tbody`
+  ${({ $rowColor: o }) => o && t`
       tr {
         background-color: ${o};
       }
     `}
 
-  ${({ $striped: o, theme: r, $stripeColor: n }) => o && s`
+  ${({ $striped: o, theme: r, $stripeColor: n }) => o && t`
       tr:nth-child(even) {
         background-color: ${n ?? r.colors.neutral[100]};
       }
@@ -2469,7 +2497,7 @@ const er = (o, r) => o === "sm" ? `${r.spacing[1]} ${r.spacing[2]}` : o === "lg"
   tr:hover td {
     background-color: rgba(0, 0, 0, 0.04);
   }
-`, $o = i.tr``, Lt = i($o)`
+`, xo = s.tr``, Pt = s(xo)`
   cursor: pointer;
 
   td {
@@ -2486,25 +2514,25 @@ const er = (o, r) => o === "sm" ? `${r.spacing[1]} ${r.spacing[2]}` : o === "lg"
     box-shadow: inset 4px 0 0
       ${({ $accentColor: o, theme: r }) => o ?? r.colors.neutral[900]};
   }
-`, Nt = i.th`
+`, Rt = s.th`
   background-color: var(--th-bg);
   color: var(--th-text);
   text-align: left;
   font-weight: ${({ theme: o }) => o.fontWeights.bold};
   white-space: nowrap;
 
-  padding: ${({ $size: o, theme: r }) => er(o, r)};
+  padding: ${({ $size: o, theme: r }) => ir(o, r)};
 
-  ${({ theme: o, $bordered: r }) => o.brutalism ? s`` : s`
+  ${({ theme: o, $bordered: r }) => o.brutalism ? t`` : t`
           border-bottom: 2px solid var(--th-sep);
-          ${r && s`
+          ${r && t`
             border-right: 1px solid var(--th-sep);
             &:last-child {
               border-right: none;
             }
           `}
         `}
-`, Pt = i.button`
+`, Vt = s.button`
   display: inline-flex;
   align-items: center;
   gap: ${({ theme: o }) => o.spacing[1]};
@@ -2523,39 +2551,39 @@ const er = (o, r) => o === "sm" ? `${r.spacing[1]} ${r.spacing[2]}` : o === "lg"
     outline-offset: 2px;
     border-radius: 2px;
   }
-`, Rt = i.span`
+`, Bt = s.span`
   opacity: 0.5;
   display: inline-flex;
   align-items: center;
-`, ir = i.td`
-  padding: ${({ $size: o, theme: r }) => er(o, r)};
+`, ar = s.td`
+  padding: ${({ $size: o, theme: r }) => ir(o, r)};
 
-  ${({ $bordered: o, $borderColor: r, theme: n }) => n.brutalism ? s`
+  ${({ $bordered: o, $borderColor: r, theme: n }) => n.brutalism ? t`
           border-bottom: ${n.brutalism.borderWidth} solid
             ${r ?? n.colors.neutral[900]};
-          ${o && s`
+          ${o && t`
             border-right: ${n.brutalism.borderWidth} solid
               ${r ?? n.colors.neutral[900]};
             &:last-child {
               border-right: none;
             }
           `}
-        ` : o ? s`
+        ` : o ? t`
             border: 1px solid ${r ?? n.colors.neutral[300]};
-          ` : s`
+          ` : t`
             border-bottom: 1px solid
               ${r ?? n.colors.neutral[200]};
           `}
-`, Vt = i.td`
+`, Ft = s.td`
   text-align: center;
   color: ${({ theme: o }) => o.colors.neutral[400]};
   padding: ${({ theme: o }) => `${o.spacing[4]} ${o.spacing[3]}`};
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   border-bottom: none;
-`, Ft = J`
+`, At = oo`
   0% { background-position: -400px 0; }
   100% { background-position: 400px 0; }
-`, At = i(ir)``, Bt = i.div`
+`, _t = s(ar)``, jt = s.div`
   height: 14px;
   border-radius: 4px;
   background: linear-gradient(
@@ -2565,21 +2593,62 @@ const er = (o, r) => o === "sm" ? `${r.spacing[1]} ${r.spacing[2]}` : o === "lg"
     ${({ theme: o }) => o.colors.neutral[200]} 75%
   );
   background-size: 800px 100%;
-  animation: ${Ft} 1.6s ease-in-out infinite;
-`, _t = i.div`
+  animation: ${At} 1.6s ease-in-out infinite;
+`, Ht = s.div`
   display: flex;
   align-items: center;
-  justify-content: center;
+  justify-content: ${({ $hasPageSizeOptions: o }) => o ? "space-between" : "center"};
   gap: ${({ theme: o }) => o.spacing[1]};
   padding: ${({ theme: o }) => `${o.spacing[2]} ${o.spacing[3]}`};
+  flex-shrink: 0;
+  flex-wrap: wrap;
 
-  ${({ theme: o }) => o.brutalism ? s`
+  ${({ theme: o }) => o.brutalism ? t`
           border-top: ${o.brutalism.borderWidth} solid
             ${o.colors.neutral[900]};
-        ` : s`
+        ` : t`
           border-top: 1px solid ${o.colors.neutral[200]};
         `}
-`, vo = i.button`
+`, Ut = s.label`
+  display: flex;
+  align-items: center;
+  gap: ${({ theme: o }) => o.spacing[2]};
+  font-size: ${({ theme: o }) => o.fontSizes.sm};
+  color: ${({ theme: o }) => o.colors.neutral[500]};
+  white-space: nowrap;
+
+  select {
+    padding: ${({ theme: o }) => `${o.spacing[1]} ${o.spacing[2]}`};
+    font-size: ${({ theme: o }) => o.fontSizes.sm};
+    font-family: inherit;
+    color: ${({ theme: o }) => o.colors.neutral[900]};
+    background-color: ${({ theme: o }) => o.colors.neutral[0]};
+    cursor: pointer;
+
+    ${({ theme: o }) => o.brutalism ? t`
+            border: ${o.brutalism.borderWidth} solid
+              ${o.colors.neutral[900]};
+          ` : t`
+            border: 1px solid ${o.colors.neutral[300]};
+            border-radius: ${o.radius.md};
+
+            &:hover {
+              border-color: ${o.colors.neutral[400]};
+            }
+
+            &:focus {
+              outline: 2px solid ${o.colors.primary[500]};
+              outline-offset: 1px;
+            }
+          `}
+  }
+`, Yt = s.div`
+  display: flex;
+  align-items: center;
+  gap: ${({ theme: o }) => o.spacing[1]};
+  flex-wrap: wrap;
+  justify-content: center;
+`, ko = s.button`
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -2590,7 +2659,7 @@ const er = (o, r) => o === "sm" ? `${r.spacing[1]} ${r.spacing[2]}` : o === "lg"
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   cursor: pointer;
 
-  ${({ $active: o, theme: r }) => r.brutalism ? s`
+  ${({ $active: o, theme: r }) => r.brutalism ? t`
           border: ${r.brutalism.borderWidth} solid
             ${r.colors.neutral[900]};
           background: ${o ? r.colors.neutral[900] : "transparent"};
@@ -2600,7 +2669,7 @@ const er = (o, r) => o === "sm" ? `${r.spacing[1]} ${r.spacing[2]}` : o === "lg"
           &:hover:not(:disabled) {
             background: ${o ? r.colors.neutral[600] : r.colors.neutral[100]};
           }
-        ` : s`
+        ` : t`
           border: 1px solid
             ${o ? r.colors.primary[500] : "transparent"};
           border-radius: ${r.radius.md};
@@ -2622,196 +2691,206 @@ const er = (o, r) => o === "sm" ? `${r.spacing[1]} ${r.spacing[2]}` : o === "lg"
     outline: 2px solid ${({ theme: o }) => o.colors.primary[500]};
     outline-offset: 2px;
   }
-`, jt = 4;
-function Ht(o, r) {
-  return o?.key !== r ? /* @__PURE__ */ e(Vr, { size: 14 }) : o.direction === "asc" ? /* @__PURE__ */ e(Ar, { size: 14 }) : /* @__PURE__ */ e(Pr, { size: 14 });
+`, Kt = 4;
+function qt(o, r) {
+  return o?.key !== r ? /* @__PURE__ */ i(Fr, { size: 14 }) : o.direction === "asc" ? /* @__PURE__ */ i(_r, { size: 14 }) : /* @__PURE__ */ i(Vr, { size: 14 });
 }
-function Yt({
+function Gt({
   columns: o,
   data: r,
   rowKey: n,
-  size: t = "md",
+  size: e = "md",
   striped: a,
   bordered: l,
   stickyHeader: d,
-  caption: p,
-  emptyMessage: u = "No data",
-  loading: f,
-  sort: $,
-  defaultSort: h,
-  onSortChange: w,
-  pageSize: y,
-  page: v,
-  defaultPage: z,
-  totalRows: O,
-  onPageChange: R,
-  onChange: L,
-  onRowClick: g,
-  borderColor: C,
-  headerColor: m,
-  rowColor: x,
-  stripeColor: I,
-  className: D,
-  style: W
+  stickyPagination: p,
+  caption: u,
+  emptyMessage: f = "No data",
+  loading: $,
+  sort: m,
+  defaultSort: v,
+  onSortChange: y,
+  pageSize: k,
+  page: C,
+  defaultPage: M,
+  totalRows: P,
+  onPageChange: L,
+  pageSizeOptions: x,
+  onPageSizeChange: I,
+  onChange: w,
+  onRowClick: b,
+  borderColor: z,
+  headerColor: E,
+  rowColor: D,
+  stripeColor: N,
+  className: F,
+  style: B
 }) {
   const {
-    activeSort: M,
-    sortedData: A,
-    handleSort: _
-  } = It({
+    activeSort: V,
+    sortedData: q,
+    handleSort: ao
+  } = Tt({
     data: r,
-    sort: $,
-    defaultSort: h,
-    onSortChange: w
+    sort: m,
+    defaultSort: v,
+    onSortChange: y
   }), {
-    activePage: P,
-    totalPages: j,
-    displayData: oo,
-    handlePageChange: F
-  } = Wt({
-    data: A,
-    pageSize: y,
-    page: v,
-    defaultPage: z,
-    totalRows: O,
-    onPageChange: R
-  }), K = (k) => {
-    const N = _(k);
-    L?.({ sort: N, page: P });
-  }, ro = (k) => {
-    F(k), L?.({ sort: M, page: k });
-  }, q = (k, N) => String(n ? k[n] : N), no = !f && oo.length === 0, to = y ?? jt;
+    activePage: O,
+    totalPages: H,
+    displayData: lo,
+    handlePageChange: G
+  } = Dt({
+    data: q,
+    pageSize: k,
+    page: C,
+    defaultPage: M,
+    totalRows: P,
+    onPageChange: L
+  }), no = (h) => {
+    const A = ao(h);
+    w?.({ sort: A, page: O });
+  }, J = (h) => {
+    G(h), w?.({ sort: V, page: h });
+  }, co = (h, A) => String(n ? h[n] : A), j = !$ && lo.length === 0, U = k ?? Kt, Q = !!k && H > 1, Z = !!x?.length, eo = /* @__PURE__ */ S(Mt, { $size: e, children: [
+    u && /* @__PURE__ */ i("caption", { children: u }),
+    /* @__PURE__ */ i(
+      Lt,
+      {
+        $headerColor: E,
+        $borderColor: z,
+        $stickyHeader: d,
+        children: /* @__PURE__ */ i(xo, { children: o.map((h) => /* @__PURE__ */ i(
+          Rt,
+          {
+            $size: e,
+            $bordered: l,
+            scope: "col",
+            style: h.width ? { width: h.width } : void 0,
+            children: h.sortable ? /* @__PURE__ */ S(
+              Vt,
+              {
+                type: "button",
+                onClick: () => no(h.key),
+                "aria-label": `Sort by ${h.header}${V?.key === h.key ? `, ${V.direction}ending` : ""}`,
+                children: [
+                  h.header,
+                  /* @__PURE__ */ i(Bt, { "aria-hidden": "true", children: qt(V, h.key) })
+                ]
+              }
+            ) : h.header
+          },
+          h.key
+        )) })
+      }
+    ),
+    /* @__PURE__ */ i(Nt, { $striped: a, $rowColor: D, $stripeColor: N, children: $ ? Array.from({ length: U }).map((h, A) => /* @__PURE__ */ i(xo, { children: o.map((uo) => /* @__PURE__ */ i(
+      _t,
+      {
+        $size: e,
+        $bordered: l,
+        $borderColor: z,
+        children: /* @__PURE__ */ i(jt, {})
+      },
+      uo.key
+    )) }, A)) : j ? /* @__PURE__ */ i("tr", { children: /* @__PURE__ */ i(Ft, { colSpan: o.length, children: f }) }) : lo.map((h, A) => /* @__PURE__ */ i(
+      b ? Pt : xo,
+      {
+        onClick: b ? () => b(h) : void 0,
+        $accentColor: b ? z : void 0,
+        children: o.map((g) => /* @__PURE__ */ i(
+          ar,
+          {
+            $size: e,
+            $bordered: l,
+            $borderColor: z,
+            children: g.render ? g.render(h[g.key], h, A) : String(h[g.key] ?? "") || " "
+          },
+          g.key
+        ))
+      },
+      co(h, A)
+    )) })
+  ] }), so = (Q || Z) && /* @__PURE__ */ S(Ht, { $hasPageSizeOptions: Z, children: [
+    Z && /* @__PURE__ */ S(Ut, { children: [
+      "Rows per page:",
+      /* @__PURE__ */ i(
+        qo,
+        {
+          size: "sm",
+          value: String(k),
+          options: x.map((h) => ({ value: String(h), label: String(h) })),
+          onChange: (h) => I?.(Number(h.target.value)),
+          "aria-label": "Rows per page"
+        }
+      )
+    ] }),
+    Q && /* @__PURE__ */ S(Yt, { children: [
+      /* @__PURE__ */ i(
+        ko,
+        {
+          type: "button",
+          onClick: () => J(O - 1),
+          disabled: O <= 1,
+          "aria-label": "Previous page",
+          children: "←"
+        }
+      ),
+      Wt(O, H).map(
+        (h, A) => h === "..." ? /* @__PURE__ */ i(
+          "span",
+          {
+            "aria-hidden": "true",
+            style: { padding: "0 4px" },
+            children: "…"
+          },
+          `e${A}`
+        ) : /* @__PURE__ */ i(
+          ko,
+          {
+            type: "button",
+            $active: h === O,
+            onClick: () => J(h),
+            "aria-label": `Page ${h}`,
+            "aria-current": h === O ? "page" : void 0,
+            children: h
+          },
+          h
+        )
+      ),
+      /* @__PURE__ */ i(
+        ko,
+        {
+          type: "button",
+          onClick: () => J(O + 1),
+          disabled: O >= H,
+          "aria-label": "Next page",
+          children: "→"
+        }
+      )
+    ] })
+  ] });
   return /* @__PURE__ */ S(
-    Dt,
+    Et,
     {
-      $borderColor: C,
-      $stickyHeader: d,
-      className: D,
-      style: W,
+      $borderColor: z,
+      $stickyPagination: p,
+      className: F,
+      style: B,
       children: [
-        /* @__PURE__ */ S(Et, { $size: t, children: [
-          p && /* @__PURE__ */ e("caption", { children: p }),
-          /* @__PURE__ */ e(
-            Mt,
-            {
-              $headerColor: m,
-              $borderColor: C,
-              $stickyHeader: d,
-              children: /* @__PURE__ */ e($o, { children: o.map((k) => /* @__PURE__ */ e(
-                Nt,
-                {
-                  $size: t,
-                  $bordered: l,
-                  scope: "col",
-                  style: k.width ? { width: k.width } : void 0,
-                  children: k.sortable ? /* @__PURE__ */ S(
-                    Pt,
-                    {
-                      type: "button",
-                      onClick: () => K(k.key),
-                      "aria-label": `Sort by ${k.header}${M?.key === k.key ? `, ${M.direction}ending` : ""}`,
-                      children: [
-                        k.header,
-                        /* @__PURE__ */ e(Rt, { "aria-hidden": "true", children: Ht(M, k.key) })
-                      ]
-                    }
-                  ) : k.header
-                },
-                k.key
-              )) })
-            }
-          ),
-          /* @__PURE__ */ e(
-            Ot,
-            {
-              $striped: a,
-              $rowColor: x,
-              $stripeColor: I,
-              children: f ? Array.from({ length: to }).map((k, N) => /* @__PURE__ */ e($o, { children: o.map((Y) => /* @__PURE__ */ e(
-                At,
-                {
-                  $size: t,
-                  $bordered: l,
-                  $borderColor: C,
-                  children: /* @__PURE__ */ e(Bt, {})
-                },
-                Y.key
-              )) }, N)) : no ? /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(Vt, { colSpan: o.length, children: u }) }) : oo.map((k, N) => /* @__PURE__ */ e(
-                g ? Lt : $o,
-                {
-                  onClick: g ? () => g(k) : void 0,
-                  $accentColor: g ? C : void 0,
-                  children: o.map((H) => /* @__PURE__ */ e(
-                    ir,
-                    {
-                      $size: t,
-                      $bordered: l,
-                      $borderColor: C,
-                      children: H.render ? H.render(k[H.key], k, N) : String(k[H.key] ?? "") || " "
-                    },
-                    H.key
-                  ))
-                },
-                q(k, N)
-              ))
-            }
-          )
-        ] }),
-        y && j > 1 && /* @__PURE__ */ S(_t, { children: [
-          /* @__PURE__ */ e(
-            vo,
-            {
-              type: "button",
-              onClick: () => ro(P - 1),
-              disabled: P <= 1,
-              "aria-label": "Previous page",
-              children: "←"
-            }
-          ),
-          Tt(P, j).map(
-            (k, N) => k === "..." ? /* @__PURE__ */ e(
-              "span",
-              {
-                "aria-hidden": "true",
-                style: { padding: "0 4px" },
-                children: "…"
-              },
-              `e${N}`
-            ) : /* @__PURE__ */ e(
-              vo,
-              {
-                type: "button",
-                $active: k === P,
-                onClick: () => ro(k),
-                "aria-label": `Page ${k}`,
-                "aria-current": k === P ? "page" : void 0,
-                children: k
-              },
-              k
-            )
-          ),
-          /* @__PURE__ */ e(
-            vo,
-            {
-              type: "button",
-              onClick: () => ro(P + 1),
-              disabled: P >= j,
-              "aria-label": "Next page",
-              children: "→"
-            }
-          )
-        ] })
+        p ? /* @__PURE__ */ i(Ot, { children: eo }) : eo,
+        so
       ]
     }
   );
 }
-Yt.displayName = "Table";
-const Ut = i.p`
+Gt.displayName = "Table";
+const Xt = s.p`
   margin: 0;
   font-size: ${({ theme: o }) => o.fontSizes.md};
   color: ${({ theme: o }) => o.colors.neutral[600]};
   line-height: 1.5;
-`, Kt = i.button`
+`, Jt = s.button`
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -2838,7 +2917,7 @@ const Ut = i.p`
     cursor: not-allowed;
   }
 
-  ${({ theme: o }) => o.brutalism && s`
+  ${({ theme: o }) => o.brutalism && t`
       border: ${o.brutalism.borderWidth} solid ${o.colors.neutral[900]};
       box-shadow: ${o.brutalism.shadowOffset}
         ${o.brutalism.shadowOffset} 0 ${o.colors.neutral[900]};
@@ -2852,47 +2931,47 @@ const Ut = i.p`
       }
     `}
 `;
-function ar({
+function lr({
   open: o,
   title: r = "Are you sure?",
   message: n,
-  confirmLabel: t = "Confirm",
+  confirmLabel: e = "Confirm",
   cancelLabel: a = "Cancel",
   variant: l = "default",
   size: d = "sm",
   onConfirm: p,
   onCancel: u
 }) {
-  return /* @__PURE__ */ e(
-    Go,
+  return /* @__PURE__ */ i(
+    Xo,
     {
       open: o,
       onClose: u,
       title: r,
       size: d,
       closeOnBackdrop: !1,
-      footer: /* @__PURE__ */ S(dr, { children: [
-        /* @__PURE__ */ e(Co, { variant: "outline", onClick: u, children: a }),
-        l === "danger" ? /* @__PURE__ */ e(Kt, { type: "button", onClick: p, children: t }) : /* @__PURE__ */ e(Co, { variant: "primary", onClick: p, children: t })
+      footer: /* @__PURE__ */ S(ur, { children: [
+        /* @__PURE__ */ i(Io, { variant: "outline", onClick: u, children: a }),
+        l === "danger" ? /* @__PURE__ */ i(Jt, { type: "button", onClick: p, children: e }) : /* @__PURE__ */ i(Io, { variant: "primary", onClick: p, children: e })
       ] }),
-      children: /* @__PURE__ */ e(Ut, { children: n })
+      children: /* @__PURE__ */ i(Xt, { children: n })
     }
   );
 }
-ar.displayName = "ConfirmDialog";
-const lr = Wo(null);
-function zs({ children: o }) {
-  const [r, n] = T(null), t = X((d) => new Promise((p) => {
+lr.displayName = "ConfirmDialog";
+const cr = Do(null);
+function We({ children: o }) {
+  const [r, n] = T(null), e = X((d) => new Promise((p) => {
     n({ ...d, resolve: p });
   }), []), a = () => {
     r?.resolve(!0), n(null);
   }, l = () => {
     r?.resolve(!1), n(null);
   };
-  return /* @__PURE__ */ S(lr.Provider, { value: { confirm: t }, children: [
+  return /* @__PURE__ */ S(cr.Provider, { value: { confirm: e }, children: [
     o,
-    r && /* @__PURE__ */ e(
-      ar,
+    r && /* @__PURE__ */ i(
+      lr,
       {
         open: !0,
         title: r.title,
@@ -2907,18 +2986,18 @@ function zs({ children: o }) {
     )
   ] });
 }
-function Cs() {
-  const o = To(lr);
+function De() {
+  const o = Wo(cr);
   if (!o)
     throw new Error("useConfirm must be used within a ConfirmProvider");
   return o.confirm;
 }
-const qt = i.div`
+const Qt = s.div`
   position: relative;
   display: inline-flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
-`, Gt = i.div`
+`, Zt = s.div`
   display: flex;
   align-items: center;
   border-radius: ${({ theme: o }) => o.radius.md};
@@ -2930,35 +3009,35 @@ const qt = i.div`
     box-shadow 0.2s;
 
   ${({ $size: o, theme: r }) => ({
-  sm: s`
+  sm: t`
         padding: ${r.spacing[1]} ${r.spacing[2]};
         font-size: ${r.fontSizes.sm};
       `,
-  md: s`
+  md: t`
         padding: ${r.spacing[2]} ${r.spacing[3]};
         font-size: ${r.fontSizes.md};
       `,
-  lg: s`
+  lg: t`
         padding: ${r.spacing[3]} ${r.spacing[4]};
         font-size: ${r.fontSizes.lg};
       `
 })[o]}
 
-  ${({ theme: o }) => o.brutalism ? s`
+  ${({ theme: o }) => o.brutalism ? t`
         border: ${o.brutalism.borderWidth} solid
           ${o.colors.neutral[900]};
         background-color: ${o.colors.neutral[0]};
         box-shadow: 3px 3px 0 ${o.colors.neutral[900]};
-      ` : s`
+      ` : t`
       border: 1px solid ${o.colors.neutral[400]};
       background-color: ${o.colors.neutral[0]};
     `}
 
-  ${({ $error: o, theme: r }) => o && s`
+  ${({ $error: o, theme: r }) => o && t`
       border-color: ${r.colors.error[500]};
     `}
 
-  ${({ $disabled: o }) => o && s`
+  ${({ $disabled: o }) => o && t`
       cursor: not-allowed;
       opacity: 0.6;
     `}
@@ -2967,19 +3046,19 @@ const qt = i.div`
     outline: none;
     box-shadow: ${({ theme: o }) => o.shadows.focusRing};
   }
-`, Xt = i.span`
+`, oe = s.span`
   flex: 1;
   color: ${({ $hasValue: o, theme: r }) => o ? r.colors.neutral[900] : r.colors.neutral[400]};
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-`, Jt = i.span`
+`, re = s.span`
   display: inline-flex;
   align-items: center;
   margin-left: ${({ theme: o }) => o.spacing[2]};
   color: ${({ theme: o }) => o.colors.neutral[500]};
   flex-shrink: 0;
-`, Qt = i.button`
+`, ne = s.button`
   display: inline-flex;
   align-items: center;
   margin-left: ${({ theme: o }) => o.spacing[2]};
@@ -3000,11 +3079,11 @@ const qt = i.div`
     border-radius: 2px;
   }
 `;
-i.span`
+s.span`
   font-size: ${({ theme: o }) => o.fontSizes.xs};
   color: ${({ $error: o, theme: r }) => o ? r.colors.error[500] : r.colors.neutral[500]};
 `;
-const Zt = i.div`
+const te = s.div`
   position: absolute;
   top: calc(100% + 4px);
   left: 0;
@@ -3014,21 +3093,21 @@ const Zt = i.div`
   padding: ${({ theme: o }) => o.spacing[3]};
   min-width: 280px;
 
-  ${({ theme: o }) => o.brutalism ? s`
+  ${({ theme: o }) => o.brutalism ? t`
         border: ${o.brutalism.borderWidth} solid
           ${o.colors.neutral[900]};
         box-shadow: ${o.brutalism.shadowOffset}
           ${o.brutalism.shadowOffset} 0 ${o.colors.neutral[900]};
-      ` : s`
+      ` : t`
       border: 1px solid ${o.colors.neutral[200]};
       box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
     `}
-`, os = i.div`
+`, ee = s.div`
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: ${({ theme: o }) => o.spacing[3]};
-`, Bo = i.button`
+`, Ao = s.button`
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -3051,22 +3130,22 @@ const Zt = i.div`
     outline-offset: 2px;
   }
 
-  ${({ theme: o }) => o.brutalism && s`
+  ${({ theme: o }) => o.brutalism && t`
       border: ${o.brutalism.borderWidth} solid ${o.colors.neutral[900]};
       &:hover {
         background-color: ${o.colors.neutral[100]};
         transform: translate(1px, 1px);
       }
     `}
-`, rs = i.span`
+`, se = s.span`
   font-weight: ${({ theme: o }) => o.fontWeights.semibold};
   font-size: ${({ theme: o }) => o.fontSizes.md};
   color: ${({ theme: o }) => o.colors.neutral[900]};
-`, ns = i.div`
+`, ie = s.div`
   display: grid;
   grid-template-columns: repeat(7, 1fr);
   gap: ${({ theme: o }) => o.spacing[0.5]};
-`, ts = i.span`
+`, ae = s.span`
   display: flex;
   align-items: center;
   justify-content: center;
@@ -3075,7 +3154,7 @@ const Zt = i.div`
   color: ${({ theme: o }) => o.colors.neutral[500]};
   padding: ${({ theme: o }) => o.spacing[1]};
   margin-bottom: ${({ theme: o }) => o.spacing[0.5]};
-`, ko = i.button`
+`, So = s.button`
   display: flex;
   align-items: center;
   justify-content: center;
@@ -3090,32 +3169,32 @@ const Zt = i.div`
   $today: o,
   $selected: r,
   $rangeStart: n,
-  $rangeEnd: t,
+  $rangeEnd: e,
   $inRange: a,
   theme: l
-}) => o || r || n || t ? l.fontWeights.semibold : l.fontWeights.normal};
+}) => o || r || n || e ? l.fontWeights.semibold : l.fontWeights.normal};
   pointer-events: ${({ $currentMonth: o }) => o ? "auto" : "none"};
 
   color: ${({
   $currentMonth: o,
   $selected: r,
   $today: n,
-  $rangeStart: t,
+  $rangeStart: e,
   $rangeEnd: a,
   theme: l
-}) => o ? r || t || a ? l.colors.primary.contrast : n ? l.colors.primary[500] : l.colors.neutral[900] : l.colors.neutral[300]};
+}) => o ? r || e || a ? l.colors.primary.contrast : n ? l.colors.primary[500] : l.colors.neutral[900] : l.colors.neutral[300]};
 
   background-color: ${({
   $selected: o,
   $rangeStart: r,
   $rangeEnd: n,
-  $inRange: t,
+  $inRange: e,
   $currentMonth: a,
   theme: l
-}) => a ? o || r || n ? l.colors.primary[500] : t ? l.colors.primary[50] : "transparent" : "transparent"};
+}) => a ? o || r || n ? l.colors.primary[500] : e ? l.colors.primary[50] : "transparent" : "transparent"};
 
   &:hover:not(:disabled) {
-    background-color: ${({ $selected: o, $rangeStart: r, $rangeEnd: n, theme: t }) => o || r || n ? t.colors.primary[700] : t.colors.neutral[100]};
+    background-color: ${({ $selected: o, $rangeStart: r, $rangeEnd: n, theme: e }) => o || r || n ? e.colors.primary[700] : e.colors.neutral[100]};
   }
 
   &:disabled {
@@ -3128,13 +3207,13 @@ const Zt = i.div`
     outline-offset: 1px;
   }
 
-  ${({ $selected: o, $rangeStart: r, $rangeEnd: n, $today: t, theme: a }) => a.brutalism && (o || r || n || t) && s`
+  ${({ $selected: o, $rangeStart: r, $rangeEnd: n, $today: e, theme: a }) => a.brutalism && (o || r || n || e) && t`
       border: ${a.brutalism.borderWidth} solid ${a.colors.neutral[900]};
-      ${(o || r || n) && s`
+      ${(o || r || n) && t`
         box-shadow: 2px 2px 0 ${a.colors.neutral[900]};
       `}
     `}
-`, ss = [
+`, le = [
   "January",
   "February",
   "March",
@@ -3147,33 +3226,33 @@ const Zt = i.div`
   "October",
   "November",
   "December"
-], es = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
+], ce = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
 function _o(o, r) {
   return new Date(o, r + 1, 0).getDate();
 }
-function is(o, r) {
+function de(o, r) {
   return new Date(o, r, 1).getDay();
 }
-function co(o, r) {
+function go(o, r) {
   return o.getFullYear() === r.getFullYear() && o.getMonth() === r.getMonth() && o.getDate() === r.getDate();
 }
-function as(o, r, n) {
+function ue(o, r, n) {
   if (r) {
-    const t = new Date(
+    const e = new Date(
       r.getFullYear(),
       r.getMonth(),
       r.getDate()
     );
-    if (o < t)
+    if (o < e)
       return !0;
   }
   if (n) {
-    const t = new Date(
+    const e = new Date(
       n.getFullYear(),
       n.getMonth(),
       n.getDate()
     );
-    if (o > t)
+    if (o > e)
       return !0;
   }
   return !1;
@@ -3193,24 +3272,24 @@ function Ho(o) {
     year: "numeric"
   });
 }
-function So(o) {
+function zo(o) {
   if (!o)
     return null;
   const r = o.split("-");
   if (r.length !== 3)
     return null;
-  const n = parseInt(r[0], 10), t = parseInt(r[1], 10), a = parseInt(r[2], 10);
-  return isNaN(n) || isNaN(t) || isNaN(a) ? null : new Date(n, t - 1, a);
+  const n = parseInt(r[0], 10), e = parseInt(r[1], 10), a = parseInt(r[2], 10);
+  return isNaN(n) || isNaN(e) || isNaN(a) ? null : new Date(n, e - 1, a);
 }
-function io(o) {
-  const r = o.getFullYear(), n = String(o.getMonth() + 1).padStart(2, "0"), t = String(o.getDate()).padStart(2, "0");
-  return `${r}-${n}-${t}`;
+function fo(o) {
+  const r = o.getFullYear(), n = String(o.getMonth() + 1).padStart(2, "0"), e = String(o.getDate()).padStart(2, "0");
+  return `${r}-${n}-${e}`;
 }
-function ls({
+function pe({
   name: o,
   label: r,
   value: n,
-  onChange: t,
+  onChange: e,
   placeholder: a = "Select date...",
   size: l = "md",
   disabled: d = !1,
@@ -3218,157 +3297,157 @@ function ls({
   minDate: u,
   maxDate: f,
   formatDate: $,
-  error: h,
-  required: w,
+  error: m,
+  required: v,
   helperText: y,
-  mode: v = "single",
-  nameFrom: z,
-  nameTo: O,
-  valueFrom: R,
+  mode: k = "single",
+  nameFrom: C,
+  nameTo: M,
+  valueFrom: P,
   valueTo: L
 }) {
-  const g = v === "range", C = So(n ?? ""), m = So(R ?? ""), x = So(L ?? ""), I = /* @__PURE__ */ new Date(), D = () => g ? m ?? x ?? I : C ?? I, [W, M] = T(!1), [A, _] = T(
-    () => D().getFullYear()
-  ), [P, j] = T(
-    () => D().getMonth()
-  ), [oo, F] = T("from"), K = U(null);
-  B(() => {
-    if (!W)
+  const x = k === "range", I = zo(n ?? ""), w = zo(P ?? ""), b = zo(L ?? ""), z = /* @__PURE__ */ new Date(), E = () => x ? w ?? b ?? z : I ?? z, [D, N] = T(!1), [F, B] = T(
+    () => E().getFullYear()
+  ), [V, q] = T(
+    () => E().getMonth()
+  ), [ao, O] = T("from"), H = K(null);
+  _(() => {
+    if (!D)
       return;
-    const b = (V) => {
-      K.current && !K.current.contains(V.target) && (M(!1), g && F("from"));
+    const g = (R) => {
+      H.current && !H.current.contains(R.target) && (N(!1), x && O("from"));
     };
-    return document.addEventListener("mousedown", b), () => document.removeEventListener("mousedown", b);
-  }, [W, g]), B(() => {
-    !g && C && (_(C.getFullYear()), j(C.getMonth()));
-  }, [n, g]), B(() => {
-    g && m && (_(m.getFullYear()), j(m.getMonth()));
-  }, [R, g]);
-  const q = (() => {
-    if (!g)
-      return C ? $ ? $(C) : jo(C) : "";
-    if (!m && !x)
+    return document.addEventListener("mousedown", g), () => document.removeEventListener("mousedown", g);
+  }, [D, x]), _(() => {
+    !x && I && (B(I.getFullYear()), q(I.getMonth()));
+  }, [n, x]), _(() => {
+    x && w && (B(w.getFullYear()), q(w.getMonth()));
+  }, [P, x]);
+  const G = (() => {
+    if (!x)
+      return I ? $ ? $(I) : jo(I) : "";
+    if (!w && !b)
       return "";
-    const b = $ ?? jo;
-    return m && x ? `${b(m)} - ${b(x)}` : m ? `${b(m)} - ...` : "";
-  })(), no = g ? !!(m || x) : !!C, to = (b) => {
-    const V = new Date(A, P, b);
-    if (!g) {
-      t(o ?? "", io(V)), M(!1);
+    const g = $ ?? jo;
+    return w && b ? `${g(w)} - ${g(b)}` : w ? `${g(w)} - ...` : "";
+  })(), no = x ? !!(w || b) : !!I, J = (g) => {
+    const R = new Date(F, V, g);
+    if (!x) {
+      e(o ?? "", fo(R)), N(!1);
       return;
     }
-    if (oo === "from") {
-      t(z ?? "", io(V)), F("to");
+    if (ao === "from") {
+      e(C ?? "", fo(R)), O("to");
       return;
     }
-    if (!m) {
-      t(z ?? "", io(V)), F("to");
+    if (!w) {
+      e(C ?? "", fo(R)), O("to");
       return;
     }
-    if (co(V, m)) {
-      t(z ?? "", ""), t(O ?? "", ""), F("from");
+    if (go(R, w)) {
+      e(C ?? "", ""), e(M ?? "", ""), O("from");
       return;
     }
-    if (V >= m) {
-      t(O ?? "", io(V)), F("from"), M(!1);
+    if (R >= w) {
+      e(M ?? "", fo(R)), O("from"), N(!1);
       return;
     }
-    t(O ?? "", io(m)), t(z ?? "", io(V)), F("from"), M(!1);
-  }, k = (b) => {
-    b.stopPropagation(), g ? (t(z ?? "", ""), t(O ?? "", ""), F("from")) : t(o ?? "", "");
-  }, N = () => {
+    e(M ?? "", fo(w)), e(C ?? "", fo(R)), O("from"), N(!1);
+  }, co = (g) => {
+    g.stopPropagation(), x ? (e(C ?? "", ""), e(M ?? "", ""), O("from")) : e(o ?? "", "");
+  }, j = () => {
     if (d)
       return;
-    const b = !W;
-    M(b), !b && g && F("from");
-  }, Y = (b) => {
-    if ((b.key === "Enter" || b.key === " ") && !d) {
-      b.preventDefault();
-      const V = !W;
-      M(V), !V && g && F("from");
+    const g = !D;
+    N(g), !g && x && O("from");
+  }, U = (g) => {
+    if ((g.key === "Enter" || g.key === " ") && !d) {
+      g.preventDefault();
+      const R = !D;
+      N(R), !R && x && O("from");
     }
-    b.key === "Escape" && (M(!1), g && F("from"));
-  }, H = () => {
-    P === 0 ? (j(11), _((b) => b - 1)) : j((b) => b - 1);
-  }, ao = () => {
-    P === 11 ? (j(0), _((b) => b + 1)) : j((b) => b + 1);
-  }, uo = _o(A, P), lo = is(A, P), so = [], xo = _o(
-    P === 0 ? A - 1 : A,
-    P === 0 ? 11 : P - 1
+    g.key === "Escape" && (N(!1), x && O("from"));
+  }, Q = () => {
+    V === 0 ? (q(11), B((g) => g - 1)) : q((g) => g - 1);
+  }, Z = () => {
+    V === 11 ? (q(0), B((g) => g + 1)) : q((g) => g + 1);
+  }, eo = _o(F, V), so = de(F, V), h = [], A = _o(
+    V === 0 ? F - 1 : F,
+    V === 0 ? 11 : V - 1
   );
-  for (let b = lo - 1; b >= 0; b--)
-    so.push({ day: xo - b, currentMonth: !1 });
-  for (let b = 1; b <= uo; b++)
-    so.push({ day: b, currentMonth: !0 });
-  const yo = 42 - so.length;
-  for (let b = 1; b <= yo; b++)
-    so.push({ day: b, currentMonth: !1 });
-  return /* @__PURE__ */ e(
+  for (let g = so - 1; g >= 0; g--)
+    h.push({ day: A - g, currentMonth: !1 });
+  for (let g = 1; g <= eo; g++)
+    h.push({ day: g, currentMonth: !0 });
+  const uo = 42 - h.length;
+  for (let g = 1; g <= uo; g++)
+    h.push({ day: g, currentMonth: !1 });
+  return /* @__PURE__ */ i(
     sr,
     {
       label: r,
-      error: h,
+      error: m,
       helperText: y,
-      required: w,
-      children: /* @__PURE__ */ S(qt, { ref: K, children: [
+      required: v,
+      children: /* @__PURE__ */ S(Qt, { ref: H, children: [
         /* @__PURE__ */ S(
-          Gt,
+          Zt,
           {
             $size: l,
-            $error: !!h,
+            $error: !!m,
             $disabled: d,
             role: "combobox",
             "aria-haspopup": "true",
-            "aria-expanded": W,
+            "aria-expanded": D,
             tabIndex: d ? -1 : 0,
-            onClick: N,
-            onKeyDown: Y,
+            onClick: j,
+            onKeyDown: U,
             children: [
-              /* @__PURE__ */ e(Xt, { $hasValue: no, children: q || a }),
-              p && no ? /* @__PURE__ */ e(
-                Qt,
+              /* @__PURE__ */ i(oe, { $hasValue: no, children: G || a }),
+              p && no ? /* @__PURE__ */ i(
+                ne,
                 {
                   type: "button",
-                  onClick: k,
+                  onClick: co,
                   "aria-label": "Clear date",
-                  children: /* @__PURE__ */ e(bo, { size: 14 })
+                  children: /* @__PURE__ */ i(ho, { size: 14 })
                 }
-              ) : /* @__PURE__ */ e(Jt, { "aria-hidden": "true", children: /* @__PURE__ */ e(_r, { size: 14 }) })
+              ) : /* @__PURE__ */ i(re, { "aria-hidden": "true", children: /* @__PURE__ */ i(Hr, { size: 14 }) })
             ]
           }
         ),
-        W && /* @__PURE__ */ S(Zt, { role: "dialog", "aria-label": "Calendar", children: [
-          /* @__PURE__ */ S(os, { children: [
-            /* @__PURE__ */ e(
-              Bo,
+        D && /* @__PURE__ */ S(te, { role: "dialog", "aria-label": "Calendar", children: [
+          /* @__PURE__ */ S(ee, { children: [
+            /* @__PURE__ */ i(
+              Ao,
               {
                 type: "button",
-                onClick: H,
+                onClick: Q,
                 "aria-label": "Previous month",
-                children: /* @__PURE__ */ e(Yr, { size: 16 })
+                children: /* @__PURE__ */ i(Kr, { size: 16 })
               }
             ),
-            /* @__PURE__ */ S(rs, { children: [
-              ss[P],
+            /* @__PURE__ */ S(se, { children: [
+              le[V],
               " ",
-              A
+              F
             ] }),
-            /* @__PURE__ */ e(
-              Bo,
+            /* @__PURE__ */ i(
+              Ao,
               {
                 type: "button",
-                onClick: ao,
+                onClick: Z,
                 "aria-label": "Next month",
-                children: /* @__PURE__ */ e(Kr, { size: 16 })
+                children: /* @__PURE__ */ i(Gr, { size: 16 })
               }
             )
           ] }),
-          /* @__PURE__ */ S(ns, { children: [
-            es.map((b) => /* @__PURE__ */ e(ts, { children: b }, b)),
-            so.map((b, V) => {
-              if (!b.currentMonth)
-                return /* @__PURE__ */ e(
-                  ko,
+          /* @__PURE__ */ S(ie, { children: [
+            ce.map((g) => /* @__PURE__ */ i(ae, { children: g }, g)),
+            h.map((g, R) => {
+              if (!g.currentMonth)
+                return /* @__PURE__ */ i(
+                  So,
                   {
                     type: "button",
                     $currentMonth: !1,
@@ -3376,47 +3455,47 @@ function ls({
                     $today: !1,
                     disabled: !0,
                     tabIndex: -1,
-                    children: b.day
+                    children: g.day
                   },
-                  V
+                  R
                 );
-              const c = new Date(A, P, b.day), E = co(c, I), G = as(c, u, f);
-              if (g) {
-                const Eo = m ? co(c, m) : !1, Mo = x ? co(c, x) : !1, cr = m && x ? c > m && c < x : !1;
-                return /* @__PURE__ */ e(
-                  ko,
+              const c = new Date(F, V, g.day), W = go(c, z), Y = ue(c, u, f);
+              if (x) {
+                const $o = w ? go(c, w) : !1, Oo = b ? go(c, b) : !1, dr = w && b ? c > w && c < b : !1;
+                return /* @__PURE__ */ i(
+                  So,
                   {
                     type: "button",
                     $currentMonth: !0,
                     $selected: !1,
-                    $today: E,
-                    $rangeStart: Eo,
-                    $rangeEnd: Mo,
-                    $inRange: cr,
-                    disabled: G,
+                    $today: W,
+                    $rangeStart: $o,
+                    $rangeEnd: Oo,
+                    $inRange: dr,
+                    disabled: Y,
                     "aria-label": Ho(c),
-                    "aria-pressed": Eo || Mo,
-                    onClick: () => to(b.day),
-                    children: b.day
+                    "aria-pressed": $o || Oo,
+                    onClick: () => J(g.day),
+                    children: g.day
                   },
-                  V
+                  R
                 );
               }
-              const po = C ? co(c, C) : !1;
-              return /* @__PURE__ */ e(
-                ko,
+              const io = I ? go(c, I) : !1;
+              return /* @__PURE__ */ i(
+                So,
                 {
                   type: "button",
                   $currentMonth: !0,
-                  $selected: po,
-                  $today: E,
-                  disabled: G,
+                  $selected: io,
+                  $today: W,
+                  disabled: Y,
                   "aria-label": Ho(c),
-                  "aria-pressed": po,
-                  onClick: () => to(b.day),
-                  children: b.day
+                  "aria-pressed": io,
+                  onClick: () => J(g.day),
+                  children: g.day
                 },
-                V
+                R
               );
             })
           ] })
@@ -3425,12 +3504,12 @@ function ls({
     }
   );
 }
-ls.displayName = "DatePicker";
-function cs(o) {
-  const r = parseInt(o.slice(1, 3), 16) / 255, n = parseInt(o.slice(3, 5), 16) / 255, t = parseInt(o.slice(5, 7), 16) / 255, a = (d) => d <= 0.03928 ? d / 12.92 : ((d + 0.055) / 1.055) ** 2.4;
-  return 0.2126 * a(r) + 0.7152 * a(n) + 0.0722 * a(t) > 0.179 ? "#111111" : "#ffffff";
+pe.displayName = "DatePicker";
+function fe(o) {
+  const r = parseInt(o.slice(1, 3), 16) / 255, n = parseInt(o.slice(3, 5), 16) / 255, e = parseInt(o.slice(5, 7), 16) / 255, a = (d) => d <= 0.03928 ? d / 12.92 : ((d + 0.055) / 1.055) ** 2.4;
+  return 0.2126 * a(r) + 0.7152 * a(n) + 0.0722 * a(e) > 0.179 ? "#111111" : "#ffffff";
 }
-const Io = {
+const To = {
   colors: {
     primary: {
       50: "#fffde6",
@@ -3471,27 +3550,27 @@ const Io = {
   shadows: { focusRing: "3px 3px 0 #111111" },
   brutalism: { borderWidth: "2px", shadowOffset: "4px" }
 };
-function Is(o) {
+function Ee(o) {
   return {
-    ...Io,
+    ...To,
     colors: {
-      ...Io.colors,
+      ...To.colors,
       primary: {
         50: "#fffff0",
         500: o,
         700: o,
-        contrast: cs(o)
+        contrast: fe(o)
       }
     }
   };
 }
-function Ts({
-  theme: o = Io,
+function Oe({
+  theme: o = To,
   children: r
 }) {
-  return /* @__PURE__ */ e(ur, { theme: o, children: r });
+  return /* @__PURE__ */ i(pr, { theme: o, children: r });
 }
-const Ws = pr`
+const Me = fr`
   *, *::before, *::after {
     box-sizing: border-box;
     margin: 0;
@@ -3508,43 +3587,47 @@ const Ws = pr`
   button, input, select, textarea {
     font-family: inherit;
   }
+
+  button, a, [role="button"] {
+    touch-action: manipulation;
+  }
 `;
 export {
-  $r as Badge,
-  Co as Button,
-  qn as Checkbox,
-  ht as CollapsibleCard,
-  ar as ConfirmDialog,
-  zs as ConfirmProvider,
-  ls as DatePicker,
-  un as Editable,
-  bn as Field,
-  Rn as Form,
+  br as Badge,
+  Io as Button,
+  Gn as Checkbox,
+  wt as CollapsibleCard,
+  lr as ConfirmDialog,
+  We as ConfirmProvider,
+  pe as DatePicker,
+  pn as Editable,
+  xn as Field,
+  Vn as Form,
   sr as FormField,
-  Ws as GlobalStyles,
-  vr as Input,
-  qo as Link,
-  Go as Modal,
-  rt as Radio,
-  ln as Select,
-  St as Spinner,
-  at as Switch,
-  Yt as Table,
-  Tr as Textarea,
-  Ts as ThemeProvider,
-  On as Toast,
-  $s as ToastProvider,
-  ks as composeValidators,
-  Is as createNeoBrutalTheme,
-  ws as isEmail,
-  ms as isUrl,
-  hs as maxLength,
-  ys as minLength,
-  Io as neoBrutalTheme,
-  vs as pattern,
-  xs as required,
-  Cs as useConfirm,
-  bs as useForm,
-  Ss as useTable,
-  gs as useToast
+  Me as GlobalStyles,
+  Sr as Input,
+  Go as Link,
+  Xo as Modal,
+  nt as Radio,
+  qo as Select,
+  zt as Spinner,
+  lt as Switch,
+  Gt as Table,
+  Dr as Textarea,
+  Oe as ThemeProvider,
+  Ln as Toast,
+  ye as ToastProvider,
+  Ie as composeValidators,
+  Ee as createNeoBrutalTheme,
+  Se as isEmail,
+  ze as isUrl,
+  ke as maxLength,
+  ve as minLength,
+  To as neoBrutalTheme,
+  Ce as pattern,
+  me as required,
+  De as useConfirm,
+  we as useForm,
+  Te as useTable,
+  he as useToast
 };