blunt-ui 0.2.2 → 0.3.0

package/dist/index.js

@@ -1,13 +1,13 @@
-import { jsx as l, jsxs as h } from "react/jsx-runtime";
-import i, { css as s, keyframes as O, ThemeProvider as eo } from "styled-components";
-import H, { useId as F, useState as z, useRef as M, useEffect as j, useContext as Z, createContext as X, forwardRef as G, createElement as P, useCallback as B, useMemo as ao } from "react";
-import { createPortal as J } from "react-dom";
-const L = (o, r, n) => s`
+import { jsx as i, jsxs as m } from "react/jsx-runtime";
+import t, { css as n, keyframes as R, ThemeProvider as yo } from "styled-components";
+import G, { useId as M, useState as W, useRef as Y, useEffect as V, useContext as no, createContext as so, forwardRef as to, createElement as q, useCallback as j, useMemo as wo } from "react";
+import { createPortal as io } from "react-dom";
+const N = (o, r, s) => n`
   background: ${r};
-  color: ${n};
+  color: ${s};
   border: ${o.brutalism.borderWidth} solid ${o.colors.neutral[900]};
   box-shadow: 2px 2px 0 ${o.colors.neutral[900]};
-`, lo = i.span`
+`, vo = t.span`
   display: inline-flex;
   align-items: center;
   font-weight: 700;
@@ -20,82 +20,82 @@ const L = (o, r, n) => s`
   max-width: 20ch;
 
   ${({ $size: o, theme: r }) => ({
-  sm: s`
+  sm: n`
         padding: 2px 8px;
         font-size: ${r.fontSizes.xs};
       `,
-  md: s`
+  md: n`
         padding: 4px 10px;
         font-size: ${r.fontSizes.sm};
       `
 })[o]}
 
   ${({ $variant: o, theme: r }) => r.brutalism ? {
-  primary: L(
+  primary: N(
     r,
     r.colors.primary[500],
     r.colors.primary.contrast
   ),
-  neutral: L(
+  neutral: N(
     r,
     r.colors.neutral[200],
     r.colors.neutral[900]
   ),
-  success: L(
+  success: N(
     r,
     r.colors.success[50],
     r.colors.success[500]
   ),
-  error: L(
+  error: N(
     r,
     r.colors.error[50],
     r.colors.error[500]
   ),
-  warning: L(
+  warning: N(
     r,
     r.colors.warning[50],
     r.colors.warning[500]
   ),
-  info: L(r, r.colors.info[50], r.colors.info[500])
+  info: N(r, r.colors.info[50], r.colors.info[500])
 }[o] : {
-  primary: s`
+  primary: n`
         background: ${r.colors.primary[50]};
         color: ${r.colors.primary[500]};
       `,
-  neutral: s`
+  neutral: n`
         background: ${r.colors.neutral[200]};
         color: ${r.colors.neutral[600]};
       `,
-  success: s`
+  success: n`
         background: ${r.colors.success[50]};
         color: ${r.colors.success[500]};
       `,
-  error: s`
+  error: n`
         background: ${r.colors.error[50]};
         color: ${r.colors.error[500]};
       `,
-  warning: s`
+  warning: n`
         background: ${r.colors.warning[50]};
         color: ${r.colors.warning[500]};
       `,
-  info: s`
+  info: n`
         background: ${r.colors.info[50]};
         color: ${r.colors.info[500]};
       `
 }[o]}
 `;
-function co({
+function mo({
   variant: o = "primary",
   size: r = "md",
-  children: n,
-  ...t
+  children: s,
+  ...a
 }) {
-  return /* @__PURE__ */ l(lo, { $variant: o, $size: r, ...t, children: n });
+  return /* @__PURE__ */ i(vo, { $variant: o, $size: r, ...a, children: s });
 }
-co.displayName = "Badge";
-const A = (o, r, n) => s`
+mo.displayName = "Badge";
+const _ = (o, r, s) => n`
   background-color: ${r};
-  color: ${n};
+  color: ${s};
   border: ${o.brutalism.borderWidth} solid ${o.colors.neutral[900]};
   box-shadow: ${o.brutalism.shadowOffset} ${o.brutalism.shadowOffset}
     0 ${o.colors.neutral[900]};
@@ -106,7 +106,7 @@ const A = (o, r, n) => s`
     transform: translate(2px, 2px);
     box-shadow: 2px 2px 0 ${o.colors.neutral[900]};
   }
-`, uo = i.button`
+`, ho = t.button`
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -126,23 +126,23 @@ const A = (o, r, n) => s`
   }
 
   ${({ $variant: o, theme: r }) => r.brutalism ? {
-  primary: A(
+  primary: _(
     r,
     r.colors.primary[500],
     r.colors.primary.contrast
   ),
-  secondary: A(
+  secondary: _(
     r,
     r.colors.neutral[100],
     r.colors.neutral[900]
   ),
-  outline: A(
+  outline: _(
     r,
     r.colors.neutral[0],
     r.colors.neutral[900]
   )
 }[o] : {
-  primary: s`
+  primary: n`
         background-color: ${r.colors.primary[500]};
         color: ${r.colors.neutral[0]};
         border: none;
@@ -150,7 +150,7 @@ const A = (o, r, n) => s`
           background-color: ${r.colors.primary[700]};
         }
       `,
-  secondary: s`
+  secondary: n`
         background-color: ${r.colors.neutral[200]};
         color: ${r.colors.neutral[600]};
         border: none;
@@ -158,7 +158,7 @@ const A = (o, r, n) => s`
           background-color: ${r.colors.neutral[300]};
         }
       `,
-  outline: s`
+  outline: n`
         background-color: transparent;
         color: ${r.colors.primary[500]};
         border: 2px solid ${r.colors.primary[500]};
@@ -169,58 +169,58 @@ const A = (o, r, n) => s`
 }[o]}
 
   ${({ $size: o, theme: r }) => ({
-  sm: s`
+  sm: n`
         padding: ${r.spacing[1]} ${r.spacing[3]};
         font-size: ${r.fontSizes.sm};
       `,
-  md: s`
+  md: n`
         padding: ${r.spacing[2]} ${r.spacing[4]};
         font-size: ${r.fontSizes.md};
       `,
-  lg: s`
+  lg: n`
         padding: ${r.spacing[3]} ${r.spacing[6]};
         font-size: ${r.fontSizes.lg};
       `
 })[o]}
 `;
-function fo({
+function ko({
   ref: o,
   as: r,
-  href: n,
-  variant: t = "primary",
-  size: c = "md",
-  isLoading: a,
-  disabled: e,
-  children: d,
+  href: s,
+  variant: a = "primary",
+  size: l = "md",
+  isLoading: d,
+  disabled: c,
+  children: e,
   ...p
 }) {
-  return /* @__PURE__ */ l(
-    uo,
+  return /* @__PURE__ */ i(
+    ho,
     {
       ref: o,
-      as: r ?? (n ? "a" : "button"),
-      href: n,
-      $variant: t,
-      $size: c,
-      disabled: a || e,
+      as: r ?? (s ? "a" : "button"),
+      href: s,
+      $variant: a,
+      $size: l,
+      disabled: d || c,
       ...p,
-      children: a ? "Loading..." : d
+      children: d ? "Loading..." : e
     }
   );
 }
-fo.displayName = "Button";
-const po = i.div`
+ko.displayName = "Button";
+const Co = t.div`
   display: flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
   width: ${({ $fullWidth: o }) => o ? "100%" : "auto"};
-`, go = i.label`
+`, zo = t.label`
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   font-weight: ${({ theme: o }) => o.brutalism ? "700" : "500"};
-`, $o = i.span`
+`, So = t.span`
   font-size: ${({ theme: o }) => o.fontSizes.xs};
   color: ${({ $error: o, theme: r }) => o ? r.colors.error[500] : r.colors.neutral[500]};
-`, bo = i.div`
+`, To = t.div`
   display: flex;
   align-items: center;
   border-radius: ${({ theme: o }) => o.radius.md};
@@ -229,43 +229,43 @@ const po = i.div`
     box-shadow 0.2s;
 
   ${({ $size: o = "md", theme: r }) => ({
-  sm: s`
+  sm: n`
         padding: ${r.spacing[1]} ${r.spacing[2]};
         font-size: ${r.fontSizes.sm};
       `,
-  md: s`
+  md: n`
         padding: ${r.spacing[2]} ${r.spacing[3]};
         font-size: ${r.fontSizes.md};
       `,
-  lg: s`
+  lg: n`
         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 ? n`
         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: n`
         border: 1px solid ${r.colors.neutral[400]};
         background-color: ${r.colors.neutral[0]};
       `,
-  outlined: s`
+  outlined: n`
         border: 2px solid ${r.colors.primary[500]};
         background-color: ${r.colors.neutral[0]};
       `,
-  filled: s`
+  filled: n`
         border: 1px solid transparent;
         background-color: ${r.colors.neutral[100]};
       `
 }[o]}
 
-  ${({ $error: o, theme: r }) => o && s`
+  ${({ $error: o, theme: r }) => o && n`
       border-color: ${r.colors.error[500]};
-      ${r.brutalism && s`
+      ${r.brutalism && n`
         box-shadow: 3px 3px 0 ${r.colors.error[500]};
       `}
     `}
@@ -273,7 +273,7 @@ const po = i.div`
   &:focus-within {
     box-shadow: ${({ theme: o }) => o.shadows.focusRing};
   }
-`, xo = i.input`
+`, Io = t.input`
   flex: 1;
   border: none;
   outline: none;
@@ -284,11 +284,11 @@ const po = i.div`
     cursor: not-allowed;
     opacity: 0.6;
   }
-`, _ = i.div`
+`, J = t.div`
   display: inline-flex;
   align-items: center;
   margin: 0 ${({ theme: o }) => o.spacing[1]};
-`, yo = i.button`
+`, Wo = t.button`
   display: inline-flex;
   align-items: center;
   margin: 0 ${({ theme: o }) => o.spacing[1]};
@@ -302,75 +302,75 @@ const po = i.div`
     opacity: 0.8;
   }
 `;
-function wo({
+function Eo({
   ref: o,
   type: r = "text",
-  size: n = "md",
-  variant: t = "default",
-  label: c,
-  helperText: a,
-  error: e,
-  leftElement: d,
+  size: s = "md",
+  variant: a = "default",
+  label: l,
+  helperText: d,
+  error: c,
+  leftElement: e,
   rightElement: p,
   clearable: u,
-  onClear: b,
-  fullWidth: m,
-  id: $,
-  value: x,
-  defaultValue: w,
+  onClear: x,
+  fullWidth: C,
+  id: w,
+  value: b,
+  defaultValue: f,
   onChange: S,
-  ...C
+  ...z
 }) {
-  const k = F(), I = $ ?? k, T = `${I}-hint`, [W, f] = z(w ?? ""), g = x !== void 0, y = g ? x : W, v = typeof e == "string" ? e : void 0, E = !!(a || e), V = (D) => {
-    g || f(D.target.value), S?.(D);
-  }, io = () => {
-    g || f(""), b?.();
+  const h = M(), E = w ?? h, B = `${E}-hint`, [O, $] = W(f ?? ""), y = b !== void 0, v = y ? b : O, k = typeof c == "string" ? c : void 0, A = !!(d || c), D = (T) => {
+    y || $(T.target.value), S?.(T);
+  }, g = () => {
+    y || $(""), x?.();
   };
-  return /* @__PURE__ */ h(po, { $fullWidth: m, children: [
-    c && /* @__PURE__ */ l(go, { htmlFor: I, children: c }),
-    /* @__PURE__ */ h(bo, { $size: n, $variant: t, $error: !!e, children: [
-      d && /* @__PURE__ */ l(_, { children: d }),
-      /* @__PURE__ */ l(
-        xo,
+  return /* @__PURE__ */ m(Co, { $fullWidth: C, children: [
+    l && /* @__PURE__ */ i(zo, { htmlFor: E, children: l }),
+    /* @__PURE__ */ m(To, { $size: s, $variant: a, $error: !!c, children: [
+      e && /* @__PURE__ */ i(J, { children: e }),
+      /* @__PURE__ */ i(
+        Io,
         {
-          id: I,
+          id: E,
           ref: o,
           type: r,
-          value: y,
-          onChange: V,
-          ...C,
-          "aria-invalid": !!e,
-          "aria-describedby": E ? T : void 0
+          value: v,
+          onChange: D,
+          ...z,
+          "aria-invalid": !!c,
+          "aria-describedby": A ? B : void 0
         }
       ),
-      u && y && /* @__PURE__ */ l(
-        yo,
+      u && v && /* @__PURE__ */ i(
+        Wo,
         {
           type: "button",
-          onClick: io,
+          onClick: g,
           "aria-label": "Clear input",
           children: "✕"
         }
       ),
-      p && /* @__PURE__ */ l(_, { children: p })
+      p && /* @__PURE__ */ i(J, { children: p })
     ] }),
-    E && /* @__PURE__ */ l($o, { id: T, $error: !!e, children: v ?? a })
+    A && /* @__PURE__ */ i(So, { id: B, $error: !!c, children: k ?? d })
   ] });
 }
-wo.displayName = "Input";
-const vo = O`
+Eo.displayName = "Input";
+const Bo = R`
   from { opacity: 0; }
   to { opacity: 1; }
-`, mo = O`
+`, Oo = R`
   from { opacity: 1; }
   to { opacity: 0; }
-`, ko = O`
+`, jo = R`
   from { opacity: 0; transform: scale(0.95) translateY(-8px); }
   to { opacity: 1; transform: scale(1) translateY(0); }
-`, ho = O`
+`, Ro = R`
   from { opacity: 1; transform: scale(1) translateY(0); }
   to { opacity: 0; transform: scale(0.95) translateY(-8px); }
-`, Co = i.div`
+`, Ao = t.div`
   position: fixed;
   inset: 0;
   background-color: rgba(0, 0, 0, 0.5);
@@ -378,9 +378,9 @@ const vo = O`
   align-items: center;
   justify-content: center;
   z-index: ${({ theme: o }) => o.zIndex.modal};
-  animation: ${({ $closing: o }) => o ? mo : vo} 0.15s ease
+  animation: ${({ $closing: o }) => o ? Oo : Bo} 0.15s ease
     forwards;
-`, zo = i.div`
+`, Lo = t.div`
   position: relative;
   background: ${({ theme: o }) => o.colors.neutral[0]};
   border-radius: ${({ theme: o }) => o.radius.md};
@@ -389,37 +389,37 @@ const vo = O`
   display: flex;
   flex-direction: column;
   max-height: 90vh;
-  animation: ${({ $closing: o }) => o ? ho : ko} 0.15s ease
+  animation: ${({ $closing: o }) => o ? Ro : jo} 0.15s ease
     forwards;
 
-  ${({ $size: o }) => o === "sm" && s`
+  ${({ $size: o }) => o === "sm" && n`
       width: min(400px, 90vw);
     `}
-  ${({ $size: o }) => o === "md" && s`
+  ${({ $size: o }) => o === "md" && n`
       width: min(560px, 90vw);
     `}
-  ${({ $size: o }) => o === "lg" && s`
+  ${({ $size: o }) => o === "lg" && n`
       width: min(720px, 90vw);
     `}
-  ${({ $size: o }) => o === "fullscreen" && s`
+  ${({ $size: o }) => o === "fullscreen" && n`
       width: 100vw;
       height: 100vh;
       max-height: 100vh;
       border-radius: 0;
     `}
-`, So = i.div`
+`, No = t.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;
-`, Io = i.h2`
+`, Vo = t.h2`
   flex: 1;
   font-size: ${({ theme: o }) => o.fontSizes.lg};
   font-weight: 600;
   margin: 0;
-`, To = i.button`
+`, Do = t.button`
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -444,11 +444,11 @@ const vo = O`
     outline: 2px solid ${({ theme: o }) => o.colors.primary[500]};
     outline-offset: 2px;
   }
-`, Wo = i.div`
+`, Fo = t.div`
   padding: ${({ theme: o }) => o.spacing[4]};
   overflow-y: auto;
   flex: 1;
-`, Bo = i.div`
+`, Mo = t.div`
   display: flex;
   align-items: center;
   justify-content: flex-end;
@@ -456,7 +456,7 @@ const vo = O`
   padding: ${({ theme: o }) => o.spacing[4]};
   border-top: 1px solid ${({ theme: o }) => o.colors.neutral[200]};
   flex-shrink: 0;
-`, Oo = [
+`, Po = [
   "button:not([disabled])",
   "input:not([disabled])",
   "select:not([disabled])",
@@ -464,89 +464,89 @@ const vo = O`
   "a[href]",
   '[tabindex]:not([tabindex="-1"])'
 ].join(", ");
-function q(o) {
+function Q(o) {
   return Array.from(
-    o.querySelectorAll(Oo)
+    o.querySelectorAll(Po)
   );
 }
-function Lo({
+function Yo({
   open: o,
   onClose: r,
-  title: n,
-  children: t,
-  footer: c,
-  size: a = "md",
-  closeOnBackdrop: e = !0,
-  closeOnEscape: d = !0,
+  title: s,
+  children: a,
+  footer: l,
+  size: d = "md",
+  closeOnBackdrop: c = !0,
+  closeOnEscape: e = !0,
   ariaLabelledBy: p,
   ariaDescribedBy: u
 }) {
-  const b = M(null), m = F(), $ = p ?? (n ? m : void 0), [x, w] = z(o), [S, C] = z(!1);
-  return j(() => {
+  const x = Y(null), C = M(), w = p ?? (s ? C : void 0), [b, f] = W(o), [S, z] = W(!1);
+  return V(() => {
     if (o)
-      w(!0), C(!1);
-    else if (x) {
-      C(!0);
-      const k = setTimeout(() => {
-        w(!1), C(!1);
+      f(!0), z(!1);
+    else if (b) {
+      z(!0);
+      const h = setTimeout(() => {
+        f(!1), z(!1);
       }, 150);
-      return () => clearTimeout(k);
+      return () => clearTimeout(h);
     }
-  }, [o, x]), j(() => {
+  }, [o, b]), V(() => {
     if (!o)
       return;
-    const k = document.body.style.overflow;
+    const h = document.body.style.overflow;
     return document.body.style.overflow = "hidden", () => {
-      document.body.style.overflow = k;
+      document.body.style.overflow = h;
     };
-  }, [o]), j(() => {
-    if (!o || !b.current)
+  }, [o]), V(() => {
+    if (!o || !x.current)
       return;
-    const k = b.current, I = document.activeElement;
-    (q(k)[0] ?? k).focus();
-    const W = (f) => {
-      if (f.key === "Escape" && d) {
+    const h = x.current, E = document.activeElement;
+    (Q(h)[0] ?? h).focus();
+    const O = ($) => {
+      if ($.key === "Escape" && e) {
         r();
         return;
       }
-      if (f.key !== "Tab")
+      if ($.key !== "Tab")
         return;
-      const g = q(k);
-      if (g.length === 0) {
-        f.preventDefault();
+      const y = Q(h);
+      if (y.length === 0) {
+        $.preventDefault();
         return;
       }
-      const y = g[0], v = g[g.length - 1];
-      f.shiftKey ? document.activeElement === y && (f.preventDefault(), v.focus()) : document.activeElement === v && (f.preventDefault(), y.focus());
+      const v = y[0], k = y[y.length - 1];
+      $.shiftKey ? document.activeElement === v && ($.preventDefault(), k.focus()) : document.activeElement === k && ($.preventDefault(), v.focus());
     };
-    return document.addEventListener("keydown", W), () => {
-      document.removeEventListener("keydown", W), I?.focus();
+    return document.addEventListener("keydown", O), () => {
+      document.removeEventListener("keydown", O), E?.focus();
     };
-  }, [o, d, r, x]), x ? J(
-    /* @__PURE__ */ l(
-      Co,
+  }, [o, e, r, b]), b ? io(
+    /* @__PURE__ */ i(
+      Ao,
       {
         $closing: S,
-        onClick: e ? r : void 0,
-        children: /* @__PURE__ */ h(
-          zo,
+        onClick: c ? r : void 0,
+        children: /* @__PURE__ */ m(
+          Lo,
           {
-            ref: b,
+            ref: x,
             role: "dialog",
             "aria-modal": "true",
-            "aria-labelledby": $,
+            "aria-labelledby": w,
             "aria-describedby": u,
-            $size: a,
+            $size: d,
             $closing: S,
             tabIndex: -1,
-            onClick: (k) => k.stopPropagation(),
+            onClick: (h) => h.stopPropagation(),
             children: [
-              /* @__PURE__ */ h(So, { children: [
-                n && /* @__PURE__ */ l(Io, { id: m, children: n }),
-                /* @__PURE__ */ l(To, { onClick: r, "aria-label": "Close modal", children: "×" })
+              /* @__PURE__ */ m(No, { children: [
+                s && /* @__PURE__ */ i(Vo, { id: C, children: s }),
+                /* @__PURE__ */ i(Do, { onClick: r, "aria-label": "Close modal", children: "×" })
               ] }),
-              /* @__PURE__ */ l(Wo, { children: t }),
-              c && /* @__PURE__ */ l(Bo, { children: c })
+              /* @__PURE__ */ i(Fo, { children: a }),
+              l && /* @__PURE__ */ i(Mo, { children: l })
             ]
           }
         )
@@ -555,18 +555,18 @@ function Lo({
     document.body
   ) : null;
 }
-Lo.displayName = "Modal";
-const Q = (...o) => o.filter((r, n, t) => !!r && r.trim() !== "" && t.indexOf(r) === n).join(" ").trim();
-const jo = (o) => o.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
-const Fo = (o) => o.replace(
+Yo.displayName = "Modal";
+const ao = (...o) => o.filter((r, s, a) => !!r && r.trim() !== "" && a.indexOf(r) === s).join(" ").trim();
+const Ho = (o) => o.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+const _o = (o) => o.replace(
   /^([A-Z])|[\s-_]+(\w)/g,
-  (r, n, t) => t ? t.toUpperCase() : n.toLowerCase()
+  (r, s, a) => a ? a.toUpperCase() : s.toLowerCase()
 );
-const K = (o) => {
-  const r = Fo(o);
+const oo = (o) => {
+  const r = _o(o);
   return r.charAt(0).toUpperCase() + r.slice(1);
 };
-var R = {
+var K = {
   xmlns: "http://www.w3.org/2000/svg",
   width: 24,
   height: 24,
@@ -577,69 +577,69 @@ var R = {
   strokeLinecap: "round",
   strokeLinejoin: "round"
 };
-const Eo = (o) => {
+const Ko = (o) => {
   for (const r in o)
     if (r.startsWith("aria-") || r === "role" || r === "title")
       return !0;
   return !1;
-}, No = X({}), Vo = () => Z(No), Ao = G(
-  ({ color: o, size: r, strokeWidth: n, absoluteStrokeWidth: t, className: c = "", children: a, iconNode: e, ...d }, p) => {
+}, qo = so({}), Uo = () => no(qo), Zo = to(
+  ({ color: o, size: r, strokeWidth: s, absoluteStrokeWidth: a, className: l = "", children: d, iconNode: c, ...e }, p) => {
     const {
       size: u = 24,
-      strokeWidth: b = 2,
-      absoluteStrokeWidth: m = !1,
-      color: $ = "currentColor",
-      className: x = ""
-    } = Vo() ?? {}, w = t ?? m ? Number(n ?? b) * 24 / Number(r ?? u) : n ?? b;
-    return P(
+      strokeWidth: x = 2,
+      absoluteStrokeWidth: C = !1,
+      color: w = "currentColor",
+      className: b = ""
+    } = Uo() ?? {}, f = a ?? C ? Number(s ?? x) * 24 / Number(r ?? u) : s ?? x;
+    return q(
       "svg",
       {
         ref: p,
-        ...R,
-        width: r ?? u ?? R.width,
-        height: r ?? u ?? R.height,
-        stroke: o ?? $,
-        strokeWidth: w,
-        className: Q("lucide", x, c),
-        ...!a && !Eo(d) && { "aria-hidden": "true" },
-        ...d
+        ...K,
+        width: r ?? u ?? K.width,
+        height: r ?? u ?? K.height,
+        stroke: o ?? w,
+        strokeWidth: f,
+        className: ao("lucide", b, l),
+        ...!d && !Ko(e) && { "aria-hidden": "true" },
+        ...e
       },
       [
-        ...e.map(([S, C]) => P(S, C)),
-        ...Array.isArray(a) ? a : [a]
+        ...c.map(([S, z]) => q(S, z)),
+        ...Array.isArray(d) ? d : [d]
       ]
     );
   }
 );
-const oo = (o, r) => {
-  const n = G(
-    ({ className: t, ...c }, a) => P(Ao, {
-      ref: a,
+const eo = (o, r) => {
+  const s = to(
+    ({ className: a, ...l }, d) => q(Zo, {
+      ref: d,
       iconNode: r,
-      className: Q(
-        `lucide-${jo(K(o))}`,
+      className: ao(
+        `lucide-${Ho(oo(o))}`,
         `lucide-${o}`,
-        t
+        a
       ),
-      ...c
+      ...l
     })
   );
-  return n.displayName = K(o), n;
+  return s.displayName = oo(o), s;
 };
-const Ro = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], ro = oo("chevron-down", Ro);
-const Mo = [
+const Xo = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], lo = eo("chevron-down", Xo);
+const Go = [
   ["path", { d: "M18 6 6 18", key: "1bl5f8" }],
   ["path", { d: "m6 6 12 12", key: "d8bk6v" }]
-], no = oo("x", Mo), Po = O`
+], co = eo("x", Go), Jo = R`
   from { opacity: 0; transform: translateY(12px); }
   to   { opacity: 1; transform: translateY(0); }
-`, Yo = O`
+`, Qo = R`
   from { opacity: 0; transform: translateY(-12px); }
   to   { opacity: 1; transform: translateY(0); }
-`, Do = O`
+`, or = R`
   from { opacity: 1; }
   to   { opacity: 0; }
-`, Ho = i.div`
+`, rr = t.div`
   position: fixed;
   z-index: ${({ theme: o }) => o.zIndex.toast};
   display: flex;
@@ -649,85 +649,85 @@ const Mo = [
   max-width: 400px;
   padding: ${({ theme: o }) => `${o.spacing[3]} ${o.spacing[4]}`};
   border-radius: ${({ theme: o }) => o.radius.md};
-  animation: ${({ $closing: o, $position: r }) => o ? s`
-          ${Do} 0.2s ease forwards
-        ` : r.startsWith("top") ? s`
-            ${Yo} 0.2s ease forwards
-          ` : s`
-            ${Po} 0.2s ease forwards
+  animation: ${({ $closing: o, $position: r }) => o ? n`
+          ${or} 0.2s ease forwards
+        ` : r.startsWith("top") ? n`
+            ${Qo} 0.2s ease forwards
+          ` : n`
+            ${Jo} 0.2s ease forwards
           `};
 
   ${({ $position: o, theme: r }) => ({
-  "bottom-right": s`
+  "bottom-right": n`
         bottom: ${r.spacing[6]};
         right: ${r.spacing[6]};
       `,
-  "bottom-left": s`
+  "bottom-left": n`
         bottom: ${r.spacing[6]};
         left: ${r.spacing[6]};
       `,
-  "top-right": s`
+  "top-right": n`
         top: ${r.spacing[6]};
         right: ${r.spacing[6]};
       `,
-  "top-left": s`
+  "top-left": n`
         top: ${r.spacing[6]};
         left: ${r.spacing[6]};
       `
 })[o]}
-`, N = (o, r, n) => s`
+`, P = (o, r, s) => n`
   background: ${r};
-  border: ${o.brutalism.borderWidth} solid ${n};
+  border: ${o.brutalism.borderWidth} solid ${s};
   box-shadow: ${o.brutalism.shadowOffset} ${o.brutalism.shadowOffset}
-    0 ${n};
-`, _o = i(Ho)`
+    0 ${s};
+`, nr = t(rr)`
   ${({ $variant: o, theme: r }) => r.brutalism ? {
-  success: N(
+  success: P(
     r,
     r.colors.success[50],
     r.colors.success[500]
   ),
-  error: N(
+  error: P(
     r,
     r.colors.error[50],
     r.colors.error[500]
   ),
-  warning: N(
+  warning: P(
     r,
     r.colors.warning[50],
     r.colors.warning[500]
   ),
-  info: N(r, r.colors.info[50], r.colors.info[500])
+  info: P(r, r.colors.info[50], r.colors.info[500])
 }[o] : {
-  success: s`
+  success: n`
         background: ${r.colors.success[50]};
         border-left: 4px solid ${r.colors.success[500]};
         box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
       `,
-  error: s`
+  error: n`
         background: ${r.colors.error[50]};
         border-left: 4px solid ${r.colors.error[500]};
         box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
       `,
-  warning: s`
+  warning: n`
         background: ${r.colors.warning[50]};
         border-left: 4px solid ${r.colors.warning[500]};
         box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
       `,
-  info: s`
+  info: n`
         background: ${r.colors.info[50]};
         border-left: 4px solid ${r.colors.info[500]};
         box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
       `
 }[o]}
-`, qo = i.p`
+`, sr = t.p`
   flex: 1;
   margin: 0;
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   font-weight: ${({ theme: o }) => o.brutalism ? 600 : 400};
   line-height: 1.5;
   color: ${({ theme: o }) => o.colors.neutral[900]};
-`, Ko = i.button`
+`, tr = t.button`
   flex-shrink: 0;
   display: inline-flex;
   align-items: center;
@@ -750,121 +750,121 @@ const Mo = [
     outline-offset: 2px;
   }
 `;
-function so({
+function uo({
   open: o,
   onClose: r,
-  message: n,
-  variant: t = "info",
-  duration: c = 4e3,
-  position: a = "bottom-right"
+  message: s,
+  variant: a = "info",
+  duration: l = 4e3,
+  position: d = "bottom-right"
 }) {
-  const [e, d] = z(o), [p, u] = z(!1);
-  return j(() => {
+  const [c, e] = W(o), [p, u] = W(!1);
+  return V(() => {
     if (o)
-      d(!0), u(!1);
-    else if (e) {
+      e(!0), u(!1);
+    else if (c) {
       u(!0);
-      const b = setTimeout(() => {
-        d(!1), u(!1);
+      const x = setTimeout(() => {
+        e(!1), u(!1);
       }, 200);
-      return () => clearTimeout(b);
+      return () => clearTimeout(x);
     }
-  }, [o, e]), j(() => {
-    if (!o || c === 0)
+  }, [o, c]), V(() => {
+    if (!o || l === 0)
       return;
-    const b = setTimeout(r, c);
-    return () => clearTimeout(b);
-  }, [o, c, r]), e ? J(
-    /* @__PURE__ */ h(
-      _o,
+    const x = setTimeout(r, l);
+    return () => clearTimeout(x);
+  }, [o, l, r]), c ? io(
+    /* @__PURE__ */ m(
+      nr,
       {
-        $position: a,
-        $variant: t,
+        $position: d,
+        $variant: a,
         $closing: p,
         role: "alert",
         "aria-live": "polite",
         children: [
-          /* @__PURE__ */ l(qo, { children: n }),
-          /* @__PURE__ */ l(Ko, { onClick: r, "aria-label": "Close notification", children: /* @__PURE__ */ l(no, { size: 14, strokeWidth: 2.5 }) })
+          /* @__PURE__ */ i(sr, { children: s }),
+          /* @__PURE__ */ i(tr, { onClick: r, "aria-label": "Close notification", children: /* @__PURE__ */ i(co, { size: 14, strokeWidth: 2.5 }) })
         ]
       }
     ),
     document.body
   ) : null;
 }
-so.displayName = "Toast";
-const Uo = i.form`
+uo.displayName = "Toast";
+const ir = t.form`
   display: flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[4]};
-`, Zo = i.div`
+`, ar = t.div`
   display: flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
-`, Xo = i.label`
+`, er = t.label`
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   font-weight: 500;
   color: ${({ theme: o }) => o.colors.neutral[900]};
-`, Go = i.span`
+`, lr = t.span`
   color: ${({ theme: o }) => o.colors.error[500]};
   margin-left: 2px;
   aria-hidden: true;
-`, Jo = i.span`
+`, cr = t.span`
   font-size: ${({ theme: o }) => o.fontSizes.xs};
   color: ${({ $error: o, theme: r }) => o ? r.colors.error[500] : r.colors.neutral[500]};
 `;
-function Qo({ onSubmit: o, children: r, ...n }) {
-  return /* @__PURE__ */ l(
-    Uo,
+function dr({ onSubmit: o, children: r, ...s }) {
+  return /* @__PURE__ */ i(
+    ir,
     {
-      onSubmit: (t) => {
-        t.preventDefault(), o?.(t);
+      onSubmit: (a) => {
+        a.preventDefault(), o?.(a);
       },
       noValidate: !0,
-      ...n,
+      ...s,
       children: r
     }
   );
 }
-Qo.displayName = "Form";
-function or({
+dr.displayName = "Form";
+function ur({
   label: o,
   error: r,
-  helperText: n,
-  required: t,
-  children: c
+  helperText: s,
+  required: a,
+  children: l
 }) {
-  const a = F(), e = `${a}-hint`, d = !!(r || n), p = typeof r == "string" ? r : void 0, u = H.isValidElement(c) ? H.cloneElement(
-    c,
+  const d = M(), c = `${d}-hint`, e = !!(r || s), p = typeof r == "string" ? r : void 0, u = G.isValidElement(l) ? G.cloneElement(
+    l,
     {
-      id: a,
-      ...d && { "aria-describedby": e },
+      id: d,
+      ...e && { "aria-describedby": c },
       ...r && { "aria-invalid": !0 }
     }
-  ) : c;
-  return /* @__PURE__ */ h(Zo, { children: [
-    o && /* @__PURE__ */ h(Xo, { htmlFor: a, children: [
+  ) : l;
+  return /* @__PURE__ */ m(ar, { children: [
+    o && /* @__PURE__ */ m(er, { htmlFor: d, children: [
       o,
-      t && /* @__PURE__ */ l(Go, { "aria-hidden": "true", children: " *" })
+      a && /* @__PURE__ */ i(lr, { "aria-hidden": "true", children: " *" })
     ] }),
     u,
-    d && /* @__PURE__ */ l(Jo, { id: e, $error: !!r, children: p ?? n })
+    e && /* @__PURE__ */ i(cr, { id: c, $error: !!r, children: p ?? s })
   ] });
 }
-or.displayName = "FormField";
-const rr = i.div`
+ur.displayName = "FormField";
+const pr = t.div`
   display: inline-flex;
   flex-direction: column;
   gap: ${({ theme: o }) => o.spacing[1]};
   width: ${({ $fullWidth: o }) => o ? "100%" : "auto"};
-`, nr = i.div`
+`, fr = t.div`
   position: relative;
   display: flex;
   width: 100%;
-`, sr = i.span`
+`, $r = t.span`
   font-size: ${({ theme: o }) => o.fontSizes.xs};
   color: ${({ $error: o, theme: r }) => o ? r.colors.error[500] : r.colors.neutral[500]};
-`, tr = i.select`
+`, br = t.select`
   appearance: none;
   width: 100%;
   border-radius: ${({ theme: o }) => o.radius.md};
@@ -876,15 +876,15 @@ const rr = i.div`
     box-shadow 0.2s;
 
   ${({ $size: o, theme: r }) => ({
-  sm: s`
+  sm: n`
         padding: ${r.spacing[1]} ${r.spacing[2]};
         font-size: ${r.fontSizes.sm};
       `,
-  md: s`
+  md: n`
         padding: ${r.spacing[2]} ${r.spacing[3]};
         font-size: ${r.fontSizes.md};
       `,
-  lg: s`
+  lg: n`
         padding: ${r.spacing[3]} ${r.spacing[4]};
         font-size: ${r.fontSizes.lg};
       `
@@ -892,27 +892,27 @@ const rr = i.div`
 
   padding-right: 2.5rem;
 
-  ${({ $variant: o, theme: r }) => r.brutalism ? s`
+  ${({ $variant: o, theme: r }) => r.brutalism ? n`
         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: n`
         border: 1px solid ${r.colors.neutral[400]};
         background-color: ${r.colors.neutral[0]};
       `,
-  outlined: s`
+  outlined: n`
         border: 2px solid ${r.colors.primary[500]};
         background-color: ${r.colors.neutral[0]};
       `,
-  filled: s`
+  filled: n`
         border: 1px solid transparent;
         background-color: ${r.colors.neutral[100]};
       `
 }[o]}
 
-  ${({ $error: o, theme: r }) => o && s`
+  ${({ $error: o, theme: r }) => o && n`
       border-color: ${r.colors.error[500]};
     `}
 
@@ -925,7 +925,7 @@ const rr = i.div`
     cursor: not-allowed;
     opacity: 0.6;
   }
-`, ir = i.button`
+`, gr = t.button`
   position: absolute;
   right: ${({ theme: o }) => o.spacing[3]};
   top: 50%;
@@ -947,7 +947,7 @@ const rr = i.div`
     outline-offset: 2px;
     border-radius: 2px;
   }
-`, er = i.span`
+`, xr = t.span`
   position: absolute;
   right: ${({ theme: o }) => o.spacing[3]};
   top: 50%;
@@ -957,63 +957,63 @@ const rr = i.div`
   align-items: center;
   color: ${({ theme: o }) => o.colors.neutral[500]};
 `;
-function ar({
+function yr({
   options: o,
   placeholder: r,
-  size: n = "md",
-  variant: t = "default",
-  error: c,
-  fullWidth: a,
-  clearable: e,
-  onClear: d,
+  size: s = "md",
+  variant: a = "default",
+  error: l,
+  fullWidth: d,
+  clearable: c,
+  onClear: e,
   id: p,
   value: u,
-  defaultValue: b,
-  onChange: m,
-  ...$
+  defaultValue: x,
+  onChange: C,
+  ...w
 }) {
-  const x = F(), w = p ?? x, S = `${w}-hint`, C = typeof c == "string" ? c : void 0, [k, I] = z(
-    b ?? ""
-  ), T = u !== void 0, W = T ? u : k, f = (v) => {
-    T || I(v.target.value), m?.(v);
-  }, g = () => {
-    T || I(""), d?.();
-  }, y = e && !!W;
-  return /* @__PURE__ */ h(rr, { $fullWidth: a, children: [
-    /* @__PURE__ */ h(nr, { children: [
-      /* @__PURE__ */ h(
-        tr,
+  const b = M(), f = p ?? b, S = `${f}-hint`, z = typeof l == "string" ? l : void 0, [h, E] = W(
+    x ?? ""
+  ), B = u !== void 0, O = B ? u : h, $ = (k) => {
+    B || E(k.target.value), C?.(k);
+  }, y = () => {
+    B || E(""), e?.();
+  }, v = c && !!O;
+  return /* @__PURE__ */ m(pr, { $fullWidth: d, children: [
+    /* @__PURE__ */ m(fr, { children: [
+      /* @__PURE__ */ m(
+        br,
         {
-          id: w,
-          $size: n,
-          $variant: t,
-          $error: !!c,
-          "aria-invalid": !!c,
-          "aria-describedby": C ? S : void 0,
-          value: W,
-          onChange: f,
-          ...$,
+          id: f,
+          $size: s,
+          $variant: a,
+          $error: !!l,
+          "aria-invalid": !!l,
+          "aria-describedby": z ? S : void 0,
+          value: O,
+          onChange: $,
+          ...w,
           children: [
-            r && /* @__PURE__ */ l("option", { value: "", disabled: !0, children: r }),
-            o.map((v) => /* @__PURE__ */ l("option", { value: v.value, disabled: v.disabled, children: v.label }, v.value))
+            r && /* @__PURE__ */ i("option", { value: "", disabled: !0, children: r }),
+            o.map((k) => /* @__PURE__ */ i("option", { value: k.value, disabled: k.disabled, children: k.label }, k.value))
           ]
         }
       ),
-      y ? /* @__PURE__ */ l(
-        ir,
+      v ? /* @__PURE__ */ i(
+        gr,
         {
           type: "button",
-          onClick: g,
+          onClick: y,
           "aria-label": "Clear selection",
-          children: /* @__PURE__ */ l(no, { size: 14 })
+          children: /* @__PURE__ */ i(co, { size: 14 })
         }
-      ) : /* @__PURE__ */ l(er, { "aria-hidden": "true", children: /* @__PURE__ */ l(ro, { size: 14 }) })
+      ) : /* @__PURE__ */ i(xr, { "aria-hidden": "true", children: /* @__PURE__ */ i(lo, { size: 14 }) })
     ] }),
-    C && /* @__PURE__ */ l(sr, { id: S, $error: !0, children: C })
+    z && /* @__PURE__ */ i($r, { id: S, $error: !0, children: z })
   ] });
 }
-ar.displayName = "Select";
-const lr = i.a`
+yr.displayName = "Select";
+const wr = t.a`
   text-decoration: underline;
   text-underline-offset: 2px;
   transition: color 0.15s;
@@ -1025,13 +1025,13 @@ const lr = i.a`
   }
 
   ${({ $variant: o, theme: r }) => ({
-  default: s`
+  default: n`
         color: ${r.colors.primary[500]};
         &:hover {
           color: ${r.colors.primary[700]};
         }
       `,
-  subtle: s`
+  subtle: n`
         color: ${r.colors.neutral[500]};
         &:hover {
           color: ${r.colors.neutral[900]};
@@ -1039,39 +1039,39 @@ const lr = i.a`
       `
 })[o]}
 `;
-function cr({
+function vr({
   variant: o = "default",
   external: r,
-  children: n,
-  ...t
+  children: s,
+  ...a
 }) {
-  return /* @__PURE__ */ l(
-    lr,
+  return /* @__PURE__ */ i(
+    wr,
     {
       $variant: o,
       ...r && { target: "_blank", rel: "noreferrer" },
-      ...t,
-      children: n
+      ...a,
+      children: s
     }
   );
 }
-cr.displayName = "Link";
-const dr = i.div`
+vr.displayName = "Link";
+const mr = t.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 ? n`
           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`
+        ` : n`
           border: 1px solid ${r ?? o.colors.neutral[200]};
           box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
         `}
-`, ur = i.button`
+`, hr = t.button`
   width: 100%;
   display: flex;
   align-items: flex-start;
@@ -1091,19 +1091,19 @@ const dr = i.div`
       ${({ theme: o, $accentColor: r }) => r ?? o.colors.primary[500]};
     outline-offset: -2px;
   }
-`, fr = i.div`
+`, kr = t.div`
   flex: 1;
   min-width: 0;
-`, pr = i.span`
+`, Cr = t.span`
   display: block;
   font-size: ${({ theme: o }) => o.fontSizes.md};
   font-weight: 600;
   color: ${({ theme: o }) => o.colors.neutral[900]};
-`, gr = i.span`
+`, zr = t.span`
   display: block;
   font-size: ${({ theme: o }) => o.fontSizes.sm};
   color: ${({ theme: o }) => o.colors.neutral[500]};
-`, $r = i.div`
+`, Sr = t.div`
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -1115,11 +1115,11 @@ const dr = i.div`
     align-items: flex-start;
     gap: ${({ theme: o }) => o.spacing[2]};
   }
-`, br = i.div`
+`, Tr = t.div`
   display: flex;
   align-items: center;
   gap: ${({ theme: o }) => o.spacing[2]};
-`, xr = i.span`
+`, Ir = t.span`
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -1127,79 +1127,79 @@ const dr = 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]};
-`, yr = i.div`
+`, Wr = t.div`
   display: grid;
   grid-template-rows: ${({ $open: o }) => o ? "1fr" : "0fr"};
   transition: grid-template-rows 0.2s ease;
-`, wr = i.div`
+`, Er = t.div`
   overflow: hidden;
-`, vr = i.div`
+`, Br = t.div`
   padding: ${({ theme: o }) => o.spacing[4]};
   border-top: 1px solid ${({ theme: o }) => o.colors.neutral[200]};
 `;
-function mr({
+function Or({
   title: o,
   children: r,
-  defaultOpen: n = !1,
-  open: t,
-  onToggle: c,
-  subtitle: a,
-  headerActions: e,
-  accentColor: d
+  defaultOpen: s = !1,
+  open: a,
+  onToggle: l,
+  subtitle: d,
+  headerActions: c,
+  accentColor: e
 }) {
-  const [p, u] = z(n), b = F(), m = t !== void 0, $ = m ? t : p;
-  return /* @__PURE__ */ h(dr, { $accentColor: d, children: [
-    /* @__PURE__ */ h(
-      ur,
+  const [p, u] = W(s), x = M(), C = a !== void 0, w = C ? a : p;
+  return /* @__PURE__ */ m(mr, { $accentColor: e, children: [
+    /* @__PURE__ */ m(
+      hr,
       {
         type: "button",
-        $open: $,
-        $accentColor: d,
-        "aria-expanded": $,
-        "aria-controls": b,
+        $open: w,
+        $accentColor: e,
+        "aria-expanded": w,
+        "aria-controls": x,
         onClick: () => {
-          const w = !$;
-          m || u(w), c?.(w);
+          const f = !w;
+          C || u(f), l?.(f);
         },
         children: [
-          /* @__PURE__ */ h(fr, { children: [
-            /* @__PURE__ */ l(pr, { children: o }),
-            (a || e) && /* @__PURE__ */ h($r, { children: [
-              a && /* @__PURE__ */ l(gr, { children: a }),
-              e && /* @__PURE__ */ l(br, { onClick: (w) => w.stopPropagation(), children: e })
+          /* @__PURE__ */ m(kr, { children: [
+            /* @__PURE__ */ i(Cr, { children: o }),
+            (d || c) && /* @__PURE__ */ m(Sr, { children: [
+              d && /* @__PURE__ */ i(zr, { children: d }),
+              c && /* @__PURE__ */ i(Tr, { onClick: (f) => f.stopPropagation(), children: c })
             ] })
           ] }),
-          /* @__PURE__ */ l(
-            xr,
+          /* @__PURE__ */ i(
+            Ir,
             {
-              $open: $,
-              $accentColor: d,
+              $open: w,
+              $accentColor: e,
               "aria-hidden": "true",
-              children: /* @__PURE__ */ l(ro, { size: 18, strokeWidth: 2.5 })
+              children: /* @__PURE__ */ i(lo, { size: 18, strokeWidth: 2.5 })
             }
           )
         ]
       }
     ),
-    /* @__PURE__ */ l(yr, { $open: $, children: /* @__PURE__ */ l(wr, { id: b, role: "region", "aria-label": o, children: /* @__PURE__ */ l(vr, { children: r }) }) })
+    /* @__PURE__ */ i(Wr, { $open: w, children: /* @__PURE__ */ i(Er, { id: x, role: "region", "aria-label": o, children: /* @__PURE__ */ i(Br, { children: r }) }) })
   ] });
 }
-mr.displayName = "CollapsibleCard";
-const to = X(null);
-function Or({ children: o }) {
-  const [r, n] = z(null), t = B((a) => {
-    n({ ...a, id: Date.now() });
-  }, []), c = ao(() => {
-    const a = (e) => t(e);
-    return a.success = (e, d) => t({ ...d, message: e, variant: "success" }), a.error = (e, d) => t({ ...d, message: e, variant: "error" }), a.warning = (e, d) => t({ ...d, message: e, variant: "warning" }), a.info = (e, d) => t({ ...d, message: e, variant: "info" }), a;
-  }, [t]);
-  return /* @__PURE__ */ h(to.Provider, { value: { toast: c }, children: [
+Or.displayName = "CollapsibleCard";
+const po = so(null);
+function Gr({ children: o }) {
+  const [r, s] = W(null), a = j((d) => {
+    s({ ...d, id: Date.now() });
+  }, []), l = wo(() => {
+    const d = (c) => a(c);
+    return d.success = (c, e) => a({ ...e, message: c, variant: "success" }), d.error = (c, e) => a({ ...e, message: c, variant: "error" }), d.warning = (c, e) => a({ ...e, message: c, variant: "warning" }), d.info = (c, e) => a({ ...e, message: c, variant: "info" }), d;
+  }, [a]);
+  return /* @__PURE__ */ m(po.Provider, { value: { toast: l }, children: [
     o,
-    r && /* @__PURE__ */ l(
-      so,
+    r && /* @__PURE__ */ i(
+      uo,
       {
         open: !0,
-        onClose: () => n(null),
+        onClose: () => s(null),
         message: r.message,
         variant: r.variant,
         duration: r.duration,
@@ -1209,89 +1209,395 @@ function Or({ children: o }) {
     )
   ] });
 }
-function Lr() {
-  const o = Z(to);
+function Jr() {
+  const o = no(po);
   if (!o)
     throw new Error("useToast must be used within a ToastProvider");
   return o;
 }
-function jr({
+function Qr({
   initialValues: o,
   validate: r,
-  onSubmit: n,
-  onError: t
+  onSubmit: s,
+  onError: a
 }) {
-  const [c, a] = z(o), [e, d] = z(
+  const [l, d] = W(o), [c, e] = W(
     {}
-  ), [p, u] = z({}), [b, m] = z(!1), $ = M(c);
-  $.current = c;
-  const x = B(
-    (f) => {
+  ), [p, u] = W({}), [x, C] = W(!1), w = Y(l);
+  w.current = l;
+  const b = j(
+    ($) => {
       if (!r)
         return {};
-      const g = r(f);
+      const y = r($);
       return Object.fromEntries(
-        Object.entries(g).filter(([, y]) => y !== void 0)
+        Object.entries(y).filter(([, v]) => v !== void 0)
       );
     },
     [r]
-  ), w = M(p);
-  w.current = p;
-  const S = B(
-    (f) => {
-      const { name: g, value: y } = f.target, v = { ...$.current, [g]: y };
-      a(v), w.current[g] && d(x(v));
+  ), f = Y(p);
+  f.current = p;
+  const S = j(
+    ($) => {
+      const { name: y, value: v } = $.target, k = { ...w.current, [y]: v };
+      d(k), f.current[y] && e(b(k));
     },
-    [x]
-  ), C = B(
-    (f) => {
-      const { name: g } = f.target;
-      u((y) => ({ ...y, [g]: !0 })), d(x($.current));
+    [b]
+  ), z = j(
+    ($) => {
+      const { name: y } = $.target;
+      u((v) => ({ ...v, [y]: !0 })), e(b(w.current));
     },
-    [x]
-  ), k = B(
-    (f) => {
-      f?.preventDefault();
-      const g = Object.keys($.current).reduce(
-        (E, V) => ({ ...E, [V]: !0 }),
+    [b]
+  ), h = j(
+    ($) => {
+      $?.preventDefault();
+      const y = Object.keys(w.current).reduce(
+        (A, D) => ({ ...A, [D]: !0 }),
         {}
       );
-      u(g);
-      const y = x($.current);
-      if (d(y), Object.keys(y).length > 0) {
-        t?.(y);
+      u(y);
+      const v = b(w.current);
+      if (e(v), Object.keys(v).length > 0) {
+        a?.(v);
         return;
       }
       (async () => {
-        m(!0);
+        C(!0);
         try {
-          await n?.($.current);
+          await s?.(w.current);
         } finally {
-          m(!1);
+          C(!1);
         }
       })();
     },
-    [x, n, t]
-  ), I = B((f, g) => {
-    a((y) => ({ ...y, [f]: g }));
-  }, []), T = B(() => {
-    a(o), d({}), u({}), m(!1);
-  }, [o]), W = Object.fromEntries(
-    Object.entries(e).filter(([f]) => p[f])
+    [b, s, a]
+  ), E = j(($, y) => {
+    d((v) => ({ ...v, [$]: y }));
+  }, []), B = j(() => {
+    d(o), e({}), u({}), C(!1);
+  }, [o]), O = Object.fromEntries(
+    Object.entries(c).filter(([$]) => p[$])
   );
   return {
-    values: c,
-    errors: W,
+    values: l,
+    errors: O,
     touched: p,
     handleChange: S,
-    handleBlur: C,
-    handleSubmit: k,
-    setFieldValue: I,
-    reset: T,
-    isSubmitting: b
+    handleBlur: z,
+    handleSubmit: h,
+    setFieldValue: E,
+    reset: B,
+    isSubmitting: x
   };
 }
-const U = {
+const fo = t.div`
+  overflow-x: auto;
+  width: 100%;
+
+  ${({ theme: o }) => o.brutalism ? n`
+          border: ${o.brutalism.borderWidth} solid ${o.colors.neutral[900]};
+          box-shadow: ${o.brutalism.shadowOffset} ${o.brutalism.shadowOffset}
+            0 ${o.colors.neutral[900]};
+        ` : n`
+          border: 1px solid ${o.colors.neutral[300]};
+          border-radius: ${o.radius.md};
+          overflow: hidden;
+        `}
+`, $o = t.table`
+  width: 100%;
+  border-collapse: collapse;
+  font-size: ${({ $size: o, theme: r }) => ({
+  sm: r.fontSizes.sm,
+  md: r.fontSizes.md,
+  lg: r.fontSizes.lg
+})[o]};
+`, bo = t.thead`
+  ${({ theme: o }) => o.brutalism ? n`
+          background-color: ${o.colors.neutral[900]};
+          color: ${o.colors.neutral[0]};
+        ` : n`
+          background-color: ${o.colors.neutral[100]};
+          color: ${o.colors.neutral[600]};
+        `}
+`, go = t.tbody`
+  ${({ $variant: o, theme: r }) => o === "striped" && n`
+      tr:nth-child(even) {
+        background-color: ${r.colors.neutral[100]};
+      }
+    `}
+
+  tr:last-child td {
+    border-bottom: none;
+  }
+`, H = t.tr``, Z = t.th`
+  text-align: left;
+  font-weight: 700;
+  white-space: nowrap;
+
+  ${({ $size: o, theme: r }) => ({
+  sm: n`
+        padding: ${r.spacing[1]} ${r.spacing[2]};
+      `,
+  md: n`
+        padding: ${r.spacing[2]} ${r.spacing[3]};
+      `,
+  lg: n`
+        padding: ${r.spacing[3]} ${r.spacing[4]};
+      `
+})[o]}
+
+  ${({ theme: o }) => o.brutalism ? n`
+          border-right: 1px solid ${o.colors.neutral[600]};
+          &:last-child {
+            border-right: none;
+          }
+        ` : n`
+          border-bottom: 2px solid ${o.colors.neutral[300]};
+          border-right: 1px solid ${o.colors.neutral[200]};
+          &:last-child {
+            border-right: none;
+          }
+        `}
+`, X = t.td`
+  ${({ $size: o, theme: r }) => ({
+  sm: n`
+        padding: ${r.spacing[1]} ${r.spacing[2]};
+      `,
+  md: n`
+        padding: ${r.spacing[2]} ${r.spacing[3]};
+      `,
+  lg: n`
+        padding: ${r.spacing[3]} ${r.spacing[4]};
+      `
+})[o]}
+
+  ${({ $variant: o, theme: r }) => r.brutalism ? n`
+          border-bottom: ${r.brutalism.borderWidth} solid
+            ${r.colors.neutral[900]};
+          ${o === "bordered" && n`
+            border-right: ${r.brutalism.borderWidth} solid
+              ${r.colors.neutral[900]};
+            &:last-child {
+              border-right: none;
+            }
+          `}
+        ` : o === "bordered" ? n`
+            border: 1px solid ${r.colors.neutral[300]};
+          ` : n`
+            border-bottom: 1px solid ${r.colors.neutral[200]};
+          `}
+`;
+function jr({
+  columns: o,
+  data: r,
+  size: s = "md",
+  variant: a = "default",
+  caption: l,
+  className: d,
+  style: c
+}) {
+  return /* @__PURE__ */ i(fo, { className: d, style: c, children: /* @__PURE__ */ m($o, { $size: s, children: [
+    l && /* @__PURE__ */ i("caption", { children: l }),
+    /* @__PURE__ */ i(bo, { children: /* @__PURE__ */ i(H, { children: o.map((e) => /* @__PURE__ */ i(
+      Z,
+      {
+        $size: s,
+        style: e.width ? { width: e.width } : void 0,
+        children: e.header
+      },
+      e.key
+    )) }) }),
+    /* @__PURE__ */ i(go, { $variant: a, children: r.map((e, p) => /* @__PURE__ */ i(H, { children: o.map((u) => /* @__PURE__ */ i(X, { $size: s, $variant: a, children: u.render ? u.render(e[u.key], e, p) : String(e[u.key] ?? "") }, u.key)) }, p)) })
+  ] }) });
+}
+jr.displayName = "Table";
+const Rr = t(X)`
+  ${({ $editable: o, theme: r }) => o && n`
+      cursor: pointer;
+      position: relative;
+
+      &:hover {
+        background-color: ${r.brutalism ? r.colors.neutral[100] : r.colors.primary[50]};
+      }
+    `}
+`, Ar = t.input`
+  width: 100%;
+  border: none;
+  outline: none;
+  background: transparent;
+  font: inherit;
+  color: inherit;
+  padding: 0;
+  margin: 0;
+
+  ${({ theme: o }) => o.brutalism ? n`
+          &:focus {
+            outline: 2px solid ${o.colors.neutral[900]};
+            outline-offset: 1px;
+          }
+        ` : n`
+          &:focus {
+            box-shadow: ${o.shadows.focusRing};
+          }
+        `}
+`, Lr = t(Z)`
+  width: 40px;
+`, Nr = t(X)`
+  width: 40px;
+  text-align: center;
+  padding-left: 0;
+  padding-right: 0;
+`, Vr = t.button`
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  background: none;
+  border: none;
+  cursor: pointer;
+  font-size: ${({ theme: o }) => o.fontSizes.xs};
+  color: ${({ theme: o }) => o.colors.neutral[500]};
+  border-radius: ${({ theme: o }) => o.radius.md};
+  transition: color 0.1s;
+
+  &:hover {
+    color: ${({ theme: o }) => o.colors.error[500]};
+
+    ${({ theme: o }) => o.brutalism && n`
+        background-color: ${o.colors.error[50]};
+      `}
+  }
+`, Dr = t.tr`
+  ${({ theme: o }) => o.brutalism ? n`
+          border-top: ${o.brutalism.borderWidth} solid
+            ${o.colors.neutral[900]};
+        ` : n`
+          border-top: 1px solid ${o.colors.neutral[200]};
+        `}
+`, Fr = t.button`
+  display: inline-flex;
+  align-items: center;
+  gap: ${({ theme: o }) => o.spacing[1]};
+  background: none;
+  border: none;
+  cursor: pointer;
+  font: inherit;
+  font-weight: 600;
+  color: ${({ theme: o }) => o.colors.neutral[600]};
+  padding: ${({ theme: o }) => `${o.spacing[2]} ${o.spacing[3]}`};
+  width: 100%;
+  text-align: left;
+
+  &:hover {
+    color: ${({ theme: o }) => o.brutalism ? o.colors.neutral[900] : o.colors.primary[500]};
+  }
+
+  &:focus-visible {
+    outline: 2px solid ${({ theme: o }) => o.colors.primary[500]};
+    outline-offset: 2px;
+  }
+`;
+function Mr({
+  columns: o,
+  defaultData: r,
+  data: s,
+  onChange: a,
+  size: l = "md",
+  addRowLabel: d = "Add row",
+  newRowFactory: c,
+  deletable: e = !1,
+  className: p,
+  style: u
+}) {
+  const x = s !== void 0, [C, w] = W(r ?? []), b = x ? s : C, [f, S] = W(null), [z, h] = W(""), E = Y(null);
+  V(() => {
+    f && (E.current?.focus(), E.current?.select());
+  }, [f]);
+  const B = j(
+    (g) => {
+      x || w(g), a?.(g);
+    },
+    [x, a]
+  ), O = (g, T, I) => {
+    S({ rowIndex: g, colKey: T }), h(String(I ?? ""));
+  }, $ = j(() => {
+    if (!f) return;
+    const { rowIndex: g, colKey: T } = f, I = b.map(
+      (L, F) => F === g ? { ...L, [T]: z } : L
+    );
+    B(I), S(null);
+  }, [f, b, z, B]), y = () => {
+    S(null), h("");
+  }, v = (g) => {
+    g.key === "Enter" && $(), g.key === "Escape" && y();
+  }, k = () => {
+    const g = c ? c() : Object.fromEntries(o.map((T) => [T.key, ""]));
+    B([...b, g]);
+  }, A = (g) => {
+    f?.rowIndex === g && S(null), B(b.filter((T, I) => I !== g));
+  }, D = e ? o.length + 1 : o.length;
+  return /* @__PURE__ */ i(fo, { className: p, style: u, children: /* @__PURE__ */ m($o, { $size: l, children: [
+    /* @__PURE__ */ i(bo, { children: /* @__PURE__ */ m(H, { children: [
+      o.map((g) => /* @__PURE__ */ i(
+        Z,
+        {
+          $size: l,
+          style: g.width ? { width: g.width } : void 0,
+          children: g.header
+        },
+        g.key
+      )),
+      e && /* @__PURE__ */ i(Lr, { $size: l, "aria-label": "Actions" })
+    ] }) }),
+    /* @__PURE__ */ m(go, { $variant: "default", children: [
+      b.map((g, T) => /* @__PURE__ */ m(H, { children: [
+        o.map((I) => {
+          const L = f?.rowIndex === T && f.colKey === I.key, F = g[I.key];
+          return /* @__PURE__ */ i(
+            Rr,
+            {
+              $size: l,
+              $variant: "default",
+              $editable: I.editable && !L,
+              onClick: I.editable && !L ? () => O(T, I.key, F) : void 0,
+              children: L ? /* @__PURE__ */ i(
+                Ar,
+                {
+                  ref: E,
+                  $size: l,
+                  value: z,
+                  onChange: (xo) => h(xo.target.value),
+                  onBlur: $,
+                  onKeyDown: v,
+                  "aria-label": `Edit ${I.header}`
+                }
+              ) : I.render ? I.render(F, g, T) : String(F ?? "")
+            },
+            I.key
+          );
+        }),
+        e && /* @__PURE__ */ i(Nr, { $size: l, $variant: "default", children: /* @__PURE__ */ i(
+          Vr,
+          {
+            type: "button",
+            onClick: () => A(T),
+            "aria-label": "Delete row",
+            children: "✕"
+          }
+        ) })
+      ] }, T)),
+      /* @__PURE__ */ i(Dr, { children: /* @__PURE__ */ i("td", { colSpan: D, children: /* @__PURE__ */ m(Fr, { type: "button", onClick: k, children: [
+        "+ ",
+        d
+      ] }) }) })
+    ] })
+  ] }) });
+}
+Mr.displayName = "EditableTable";
+const ro = {
   primary: {
     50: "#f0f8ff",
     500: "#0070f3",
@@ -1323,38 +1629,38 @@ const U = {
     50: "#eff6ff",
     500: "#2563eb"
   }
-}, kr = {
+}, Pr = {
   1: "4px",
   2: "8px",
   3: "12px",
   4: "16px",
   5: "20px",
   6: "24px"
-}, hr = {
+}, Yr = {
   md: "6px"
-}, Cr = {
+}, Hr = {
   modal: 1e3,
   toast: 1100
-}, zr = {
+}, _r = {
   xs: "12px",
   sm: "14px",
   md: "16px",
   lg: "18px"
-}, Fr = {
-  colors: { ...U, primary: { ...U.primary, contrast: "#ffffff" } },
-  spacing: kr,
-  fontSizes: zr,
-  radius: hr,
-  zIndex: Cr,
+}, on = {
+  colors: { ...ro, primary: { ...ro.primary, contrast: "#ffffff" } },
+  spacing: Pr,
+  fontSizes: _r,
+  radius: Yr,
+  zIndex: Hr,
   shadows: {
     focusRing: "0 0 0 2px rgba(0, 112, 243, 0.25)"
   }
 };
-function Sr(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, c = (e) => e <= 0.03928 ? e / 12.92 : ((e + 0.055) / 1.055) ** 2.4;
-  return 0.2126 * c(r) + 0.7152 * c(n) + 0.0722 * c(t) > 0.179 ? "#111111" : "#ffffff";
+function Kr(o) {
+  const r = parseInt(o.slice(1, 3), 16) / 255, s = parseInt(o.slice(3, 5), 16) / 255, a = parseInt(o.slice(5, 7), 16) / 255, l = (c) => c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
+  return 0.2126 * l(r) + 0.7152 * l(s) + 0.0722 * l(a) > 0.179 ? "#111111" : "#ffffff";
 }
-const Y = {
+const U = {
   colors: {
     primary: {
       50: "#fffde6",
@@ -1384,42 +1690,44 @@ const Y = {
   shadows: { focusRing: "3px 3px 0 #111111" },
   brutalism: { borderWidth: "2px", shadowOffset: "4px" }
 };
-function Er(o) {
+function rn(o) {
   return {
-    ...Y,
+    ...U,
     colors: {
-      ...Y.colors,
+      ...U.colors,
       primary: {
         50: "#fffff0",
         500: o,
         700: o,
-        contrast: Sr(o)
+        contrast: Kr(o)
       }
     }
   };
 }
-function Nr({
-  theme: o = Y,
+function nn({
+  theme: o = U,
   children: r
 }) {
-  return /* @__PURE__ */ l(eo, { theme: o, children: r });
+  return /* @__PURE__ */ i(yo, { theme: o, children: r });
 }
 export {
-  co as Badge,
-  fo as Button,
-  mr as CollapsibleCard,
-  Qo as Form,
-  or as FormField,
-  wo as Input,
-  cr as Link,
-  Lo as Modal,
-  ar as Select,
-  Nr as ThemeProvider,
-  so as Toast,
-  Or as ToastProvider,
-  Er as createNeoBrutalTheme,
-  Fr as defaultTheme,
-  Y as neoBrutalTheme,
-  jr as useForm,
-  Lr as useToast
+  mo as Badge,
+  ko as Button,
+  Or as CollapsibleCard,
+  Mr as EditableTable,
+  dr as Form,
+  ur as FormField,
+  Eo as Input,
+  vr as Link,
+  Yo as Modal,
+  yr as Select,
+  jr as Table,
+  nn as ThemeProvider,
+  uo as Toast,
+  Gr as ToastProvider,
+  rn as createNeoBrutalTheme,
+  on as defaultTheme,
+  U as neoBrutalTheme,
+  Qr as useForm,
+  Jr as useToast
 };