@versaur/react 1.0.13 → 1.0.14

package/dist/blocks.js

@@ -1,103 +1,105 @@
-import { jsxs as y, jsx as o, Fragment as Tt } from "react/jsx-runtime";
-import { accordionStyles as D, avatarGroupStyles as St, tabsStyles as G, noResultsStyles as F, attributeListStyles as Bt, badgeGroupStyles as wt, cardStyles as C, menuStyles as H, tableStyles as w, buttonGroupStyles as At, topBarStyles as L, navStyles as j, sidebarStyles as T, bottomBarStyles as $, appLayoutStyles as x, formGroupStyles as X, featuresStyles as W, drawerStyles as Rt, modalStyles as It, bottomSheetStyles as Lt } from "@versaur/core/blocks";
-import { ChevronDownIcon as Z, XIcon as q } from "@versaur/icons";
-import xt, { createContext as A, forwardRef as n, useRef as M, useState as P, useEffect as z, useContext as R, useLayoutEffect as Ft, useId as O, useCallback as Dt } from "react";
-import { u as v } from "./use-data-attrs-iPFyfiKN.js";
-import { c as d } from "./cx-B9vmfsc1.js";
-import { c as ee, I as E, T as I, B as V, H as Mt } from "./tooltip-_eEMRSo8.js";
-import { checkboxStyles as k } from "@versaur/core/forms";
-import { overlayPartsStyles as B } from "@versaur/core/utils";
-import { c as J, a as te, O as K, b as Ht } from "./overlay-parts-Zq9CuT31.js";
-const ae = A(void 0);
-function Gt() {
-  const e = R(ae);
+import { jsxs as b, jsx as s } from "react/jsx-runtime";
+import { accordionStyles as L, avatarGroupStyles as mt, tabsStyles as M, noResultsStyles as I, attributeListStyles as ut, badgeGroupStyles as pt, cardStyles as D, menuStyles as G, tableStyles as S, buttonGroupStyles as bt, topBarStyles as R, sidebarStyles as y, bottomBarStyles as P, appLayoutStyles as w, formGroupStyles as _, featuresStyles as O, modalStyles as Nt, bottomSheetStyles as yt } from "@versaur/core/blocks";
+import { ChevronDownIcon as W, XIcon as X } from "@versaur/icons";
+import { createContext as x, forwardRef as n, useRef as z, useState as H, useEffect as k, useContext as F, useLayoutEffect as vt, useId as q } from "react";
+import { u as v, I as J, B as E } from "./helpers-DTL6qrTe.js";
+import { c } from "./cx-B9vmfsc1.js";
+import { c as K, T as A, H as ht } from "./tooltip-BMKVL6jz.js";
+import { checkboxStyles as $ } from "@versaur/core/forms";
+import { a as Q } from "./drawer-DRv9k7lp.js";
+import { D as ma } from "./drawer-DRv9k7lp.js";
+import { overlayPartsStyles as C } from "@versaur/core/utils";
+import { O as U, a as Y, b as ft, c as gt } from "./overlay-parts-CFeD8VN0.js";
+const Z = x(void 0);
+function Tt() {
+  const e = F(Z);
   if (!e)
     throw new Error("Accordion.Summary must be used within an Accordion component");
   return e;
 }
-function Pt({ summary: e, open: t, onOpenChange: a, children: s, className: r, ...l }, i) {
-  const [m, u] = P(t ?? !1), c = M(null);
-  z(() => {
+function St({ summary: e, open: t, onOpenChange: a, children: o, className: r, ...i }, l) {
+  const [d, u] = H(t ?? !1), m = z(null);
+  k(() => {
     t !== void 0 && u(t);
-  }, [t]), z(() => {
-    c.current && (c.current.open = m);
-  }, [m]);
+  }, [t]), k(() => {
+    m.current && (m.current.open = d);
+  }, [d]);
   const p = () => {
-    const b = !m;
-    u(b), a == null || a(b);
-  }, N = v({ open: m ? "" : void 0 });
-  return /* @__PURE__ */ o(ae.Provider, { value: { isOpen: m, toggle: p }, children: /* @__PURE__ */ y(
+    const h = !d;
+    u(h), a == null || a(h);
+  }, N = v({ open: d ? "" : void 0 });
+  return /* @__PURE__ */ s(Z.Provider, { value: { isOpen: d, toggle: p }, children: /* @__PURE__ */ b(
     "details",
     {
-      ref: i || c,
-      className: d(D.item, r),
-      open: m,
+      ref: l || m,
+      className: c(L.item, r),
+      open: d,
       ...N,
-      ...l,
+      ...i,
       children: [
         e,
-        /* @__PURE__ */ o("div", { className: D.content, children: s })
+        /* @__PURE__ */ s("div", { className: L.content, children: o })
       ]
     }
   ) });
 }
-const se = n(Pt);
-se.displayName = "Accordion";
-const oe = n(
-  ({ children: e, right: t, clamp: a = 2, className: s, ...r }, l) => {
-    const { isOpen: i, toggle: m } = Gt(), u = M(null), c = (p) => {
-      p.preventDefault(), !(u.current && u.current.contains(p.target)) && m();
+const ee = n(St);
+ee.displayName = "Accordion";
+const te = n(
+  ({ children: e, right: t, clamp: a = 2, className: o, ...r }, i) => {
+    const { isOpen: l, toggle: d } = Tt(), u = z(null), m = (p) => {
+      p.preventDefault(), !(u.current && u.current.contains(p.target)) && d();
     };
-    return /* @__PURE__ */ y(
+    return /* @__PURE__ */ b(
       "summary",
       {
-        ref: l,
-        className: d(D.trigger, s),
-        onClick: c,
+        ref: i,
+        className: c(L.trigger, o),
+        onClick: m,
         role: "button",
-        "aria-expanded": i,
+        "aria-expanded": l,
         ...r,
         children: [
-          /* @__PURE__ */ o("span", { className: D.label, style: { "--_clamp": a }, children: e }),
-          t && /* @__PURE__ */ o("span", { ref: u, className: D.right, children: t }),
-          /* @__PURE__ */ o("span", { className: D.chevron, children: /* @__PURE__ */ o(Z, { width: 20, height: 20 }) })
+          /* @__PURE__ */ s("span", { className: L.label, style: { "--_clamp": a }, children: e }),
+          t && /* @__PURE__ */ s("span", { ref: u, className: L.right, children: t }),
+          /* @__PURE__ */ s("span", { className: L.chevron, children: /* @__PURE__ */ s(W, { width: 20, height: 20 }) })
         ]
       }
     );
   }
 );
-oe.displayName = "Accordion.Summary";
-const na = Object.assign(se, {
-  Summary: oe
-}), zt = n(
+te.displayName = "Accordion.Summary";
+const Qt = Object.assign(ee, {
+  Summary: te
+}), Bt = n(
   ({
     direction: e = "horizontal",
     size: t = "md",
     align: a = "center",
-    wrap: s = "nowrap",
+    wrap: o = "nowrap",
     "aria-label": r = "Avatar group",
-    children: l,
-    className: i,
-    ...m
+    children: i,
+    className: l,
+    ...d
   }, u) => {
-    const c = v({ align: a, direction: e, size: t, wrap: s });
-    return /* @__PURE__ */ o(
+    const m = v({ align: a, direction: e, size: t, wrap: o });
+    return /* @__PURE__ */ s(
       "div",
       {
         ref: u,
-        className: d(St["avatar-group"], i),
+        className: c(mt["avatar-group"], l),
         role: "group",
         "aria-label": r,
-        ...c,
         ...m,
-        children: l
+        ...d,
+        children: i
       }
     );
   }
 );
-zt.displayName = "AvatarGroup";
-function jt(e, t) {
-  z(() => {
+Bt.displayName = "AvatarGroup";
+function At(e, t) {
+  k(() => {
     if (!e.current)
       return;
     const a = new ResizeObserver(t);
@@ -106,64 +108,64 @@ function jt(e, t) {
     };
   }, [e, t]);
 }
-const re = A(void 0);
-function $t() {
-  const e = R(re);
+const ae = x(void 0);
+function Rt() {
+  const e = F(ae);
   if (!e)
     throw new Error("Tabs.Item must be used within a Tabs component");
   return e;
 }
-const le = n(({ value: e, onChange: t, children: a, className: s }, r) => {
-  const l = M(null), i = M(/* @__PURE__ */ new Map()), [m, u] = P(0), [c, p] = P(0), N = () => {
-    const f = i.current.get(e);
-    if (!f || !l.current)
+const se = n(({ value: e, onChange: t, children: a, className: o }, r) => {
+  const i = z(null), l = z(/* @__PURE__ */ new Map()), [d, u] = H(0), [m, p] = H(0), N = () => {
+    const f = l.current.get(e);
+    if (!f || !i.current)
       return;
-    const h = l.current.getBoundingClientRect(), g = f.getBoundingClientRect(), ht = g.left - h.left + l.current.scrollLeft, { width: gt } = g;
-    u(ht), p(gt), f.scrollIntoView({
+    const g = i.current.getBoundingClientRect(), T = f.getBoundingClientRect(), ct = T.left - g.left + i.current.scrollLeft, { width: dt } = T;
+    u(ct), p(dt), f.scrollIntoView({
       behavior: "smooth",
       block: "nearest",
       inline: "center"
     });
-  }, b = (f, h) => {
-    h && i.current.set(f, h);
+  }, h = (f, g) => {
+    g && l.current.set(f, g);
   };
-  Ft(() => {
+  vt(() => {
     N();
-  }, [e]), jt(l, N);
-  const S = v({});
-  return /* @__PURE__ */ o(re.Provider, { value: { activeValue: e, onChange: t, registerTrigger: b }, children: /* @__PURE__ */ y("nav", { ref: ee(r, l), className: d(G.tabs, s), ...S, children: [
-    /* @__PURE__ */ o("ul", { className: G.tablist, role: "tablist", children: a }),
-    /* @__PURE__ */ o(
+  }, [e]), At(i, N);
+  const B = v({});
+  return /* @__PURE__ */ s(ae.Provider, { value: { activeValue: e, onChange: t, registerTrigger: h }, children: /* @__PURE__ */ b("nav", { ref: K(r, i), className: c(M.tabs, o), ...B, children: [
+    /* @__PURE__ */ s("ul", { className: M.tablist, role: "tablist", children: a }),
+    /* @__PURE__ */ s(
       "div",
       {
-        className: G["tabs-thumb"],
+        className: M["tabs-thumb"],
         style: {
-          left: `${m}px`,
-          width: `${c}px`
+          left: `${d}px`,
+          width: `${m}px`
         }
       }
     )
   ] }) });
 });
-le.displayName = "Tabs";
-const ie = n(
-  ({ value: e, disabled: t = !1, children: a, className: s }, r) => {
-    const { activeValue: l, onChange: i, registerTrigger: m } = $t(), u = l === e;
-    let c;
-    t ? c = "disabled" : u ? c = "active" : c = "default";
+se.displayName = "Tabs";
+const oe = n(
+  ({ value: e, disabled: t = !1, children: a, className: o }, r) => {
+    const { activeValue: i, onChange: l, registerTrigger: d } = Rt(), u = i === e;
+    let m;
+    t ? m = "disabled" : u ? m = "active" : m = "default";
     const p = () => {
-      t || i(e);
+      t || l(e);
     };
-    return /* @__PURE__ */ o("li", { className: G.tabitem, children: /* @__PURE__ */ o(
+    return /* @__PURE__ */ s("li", { className: M.tabitem, children: /* @__PURE__ */ s(
       "button",
       {
-        ref: ee(r, (N) => m(e, N)),
-        className: d(G.trigger, s),
+        ref: K(r, (N) => d(e, N)),
+        className: c(M.trigger, o),
         role: "tab",
         id: `tabs-trigger-${e}`,
         "aria-selected": u,
         "aria-controls": `tabs-panel-${e}`,
-        "data-state": c,
+        "data-state": m,
         disabled: t,
         onClick: p,
         children: a
@@ -171,979 +173,760 @@ const ie = n(
     ) });
   }
 );
-ie.displayName = "Tabs.Item";
-function Et(e) {
+oe.displayName = "Tabs.Item";
+function wt(e) {
   return {
     "aria-labelledby": `tabs-trigger-${e}`,
     id: `tabs-panel-${e}`,
     role: "tabpanel"
   };
 }
-const da = Object.assign(le, {
-  Item: ie,
-  getPanelAttribute: Et
-}), _t = n(
-  ({ icon: e, title: t, subtitle: a, action: s, className: r, ...l }, i) => /* @__PURE__ */ y(
+const Ut = Object.assign(se, {
+  Item: oe,
+  getPanelAttribute: wt
+}), It = n(
+  ({ icon: e, title: t, subtitle: a, action: o, className: r, ...i }, l) => /* @__PURE__ */ b(
     "section",
     {
-      ref: i,
-      className: d(F["no-results"], r),
+      ref: l,
+      className: c(I["no-results"], r),
       role: "status",
       "aria-label": t,
-      ...l,
+      ...i,
       children: [
-        /* @__PURE__ */ y("header", { className: F["no-results-header"], children: [
-          /* @__PURE__ */ o("div", { className: F["no-results-icon"], children: /* @__PURE__ */ o(E, { as: e, color: "inherit", "aria-hidden": "true" }) }),
-          /* @__PURE__ */ o("h5", { className: F["no-results-title"], children: t })
+        /* @__PURE__ */ b("header", { className: I["no-results-header"], children: [
+          /* @__PURE__ */ s("div", { className: I["no-results-icon"], children: /* @__PURE__ */ s(J, { as: e, color: "inherit", "aria-hidden": "true" }) }),
+          /* @__PURE__ */ s("h5", { className: I["no-results-title"], children: t })
         ] }),
-        a && /* @__PURE__ */ o("p", { className: F["no-results-subtitle"], children: a }),
-        s && /* @__PURE__ */ o("div", { className: F["no-results-action"], role: "group", "aria-label": "Available actions", children: s })
+        a && /* @__PURE__ */ s("p", { className: I["no-results-subtitle"], children: a }),
+        o && /* @__PURE__ */ s("div", { className: I["no-results-action"], role: "group", "aria-label": "Available actions", children: o })
       ]
     }
   )
 );
-_t.displayName = "NoResults";
-const ce = n(
-  ({ layout: e, columns: t = "repeat(3, 1fr)", gap: a, children: s, className: r, style: l, ...i }, m) => {
+It.displayName = "NoResults";
+const re = n(
+  ({ layout: e, columns: t = "repeat(3, 1fr)", gap: a, children: o, className: r, style: i, ...l }, d) => {
     const u = v({
       layout: e
     });
-    return /* @__PURE__ */ o(
+    return /* @__PURE__ */ s(
       "dl",
       {
-        ref: m,
-        className: d(Bt["attribute-list"], r),
+        ref: d,
+        className: c(ut["attribute-list"], r),
         ...u,
         style: {
           "--_columns": t,
           ...a !== void 0 && { "--_gap": typeof a == "number" ? `${a}px` : a },
-          ...l
+          ...i
         },
-        ...i,
-        children: s
+        ...l,
+        children: o
       }
     );
   }
 );
-ce.displayName = "AttributeList";
-const ne = n(
-  ({ title: e, area: t, children: a, className: s, style: r, ...l }, i) => /* @__PURE__ */ y(
+re.displayName = "AttributeList";
+const ie = n(
+  ({ title: e, area: t, children: a, className: o, style: r, ...i }, l) => /* @__PURE__ */ b(
     "div",
     {
-      ref: i,
-      className: d(s),
+      ref: l,
+      className: c(o),
       style: {
         "--_area": t,
         ...r
       },
-      ...l,
+      ...i,
       children: [
-        /* @__PURE__ */ o("dt", { children: e }),
-        /* @__PURE__ */ o("dd", { children: a })
+        /* @__PURE__ */ s("dt", { children: e }),
+        /* @__PURE__ */ s("dd", { children: a })
       ]
     }
   )
 );
-ne.displayName = "AttributeList.Item";
-const ma = Object.assign(ce, {
-  Item: ne
-}), Ct = n(
+ie.displayName = "AttributeList.Item";
+const Yt = Object.assign(re, {
+  Item: ie
+}), Lt = n(
   ({
     gap: e = "md",
     direction: t = "horizontal",
     align: a = "center",
-    wrap: s = "nowrap",
+    wrap: o = "nowrap",
     "aria-label": r = "Badge group",
-    children: l,
-    className: i,
-    ...m
+    children: i,
+    className: l,
+    ...d
   }, u) => {
-    const c = v({
+    const m = v({
       align: a,
       direction: t,
       gap: e,
-      wrap: s
+      wrap: o
     });
-    return /* @__PURE__ */ o(
+    return /* @__PURE__ */ s(
       "div",
       {
         ref: u,
-        className: d(wt["badge-group"], i),
+        className: c(pt["badge-group"], l),
         role: "group",
         "aria-label": r,
-        ...c,
         ...m,
-        children: l
+        ...d,
+        children: i
       }
     );
   }
 );
-Ct.displayName = "BadgeGroup";
-function Vt({ as: e = "div", size: t = "md", border: a, children: s, className: r, ...l }, i) {
-  const m = v({
+Lt.displayName = "BadgeGroup";
+function xt({ as: e = "div", size: t = "md", border: a, children: o, className: r, ...i }, l) {
+  const d = v({
     border: a,
     interactive: e === "button" ? "true" : "false",
     size: t
   });
-  return /* @__PURE__ */ o(e === "button" ? "button" : "div", { ref: i, className: d(C.card, r), ...m, ...l, children: s });
+  return /* @__PURE__ */ s(e === "button" ? "button" : "div", { ref: l, className: c(D.card, r), ...d, ...i, children: o });
 }
-const de = n(
-  Vt
+const le = n(
+  xt
 );
-de.displayName = "Card";
-const me = n(
-  ({ justify: e, gap: t, children: a, className: s, ...r }, l) => {
-    const i = v({ gap: t, justify: e });
-    return /* @__PURE__ */ o("div", { ref: l, className: d(C.header, s), ...i, ...r, children: a });
+le.displayName = "Card";
+const ne = n(
+  ({ justify: e, gap: t, children: a, className: o, ...r }, i) => {
+    const l = v({ gap: t, justify: e });
+    return /* @__PURE__ */ s("div", { ref: i, className: c(D.header, o), ...l, ...r, children: a });
   }
 );
-me.displayName = "Card.Header";
-const ue = n(
-  ({ align: e, gap: t, children: a, className: s, ...r }, l) => {
-    const i = v({ align: e, gap: t });
-    return /* @__PURE__ */ o("div", { ref: l, className: d(C.body, s), ...i, ...r, children: a });
+ne.displayName = "Card.Header";
+const ce = n(
+  ({ align: e, gap: t, children: a, className: o, ...r }, i) => {
+    const l = v({ align: e, gap: t });
+    return /* @__PURE__ */ s("div", { ref: i, className: c(D.body, o), ...l, ...r, children: a });
   }
 );
-ue.displayName = "Card.Body";
-const pe = n(
-  ({ justify: e, gap: t, children: a, className: s, ...r }, l) => {
-    const i = v({ gap: t, justify: e });
-    return /* @__PURE__ */ o("div", { ref: l, className: d(C.footer, s), ...i, ...r, children: a });
+ce.displayName = "Card.Body";
+const de = n(
+  ({ justify: e, gap: t, children: a, className: o, ...r }, i) => {
+    const l = v({ gap: t, justify: e });
+    return /* @__PURE__ */ s("div", { ref: i, className: c(D.footer, o), ...l, ...r, children: a });
   }
 );
-pe.displayName = "Card.Footer";
-const ua = Object.assign(de, {
-  Body: ue,
-  Footer: pe,
-  Header: me
-}), be = A(void 0), Ne = n(
+de.displayName = "Card.Footer";
+const Zt = Object.assign(le, {
+  Body: ce,
+  Footer: de,
+  Header: ne
+}), me = x(void 0), ue = n(
   ({
     id: e,
     placement: t,
     maxHeight: a = 400,
-    maxWidth: s = 320,
+    maxWidth: o = 320,
     gap: r = 8,
-    value: l,
-    onChange: i,
-    closeOnClick: m = !1,
+    value: i,
+    onChange: l,
+    closeOnClick: d = !1,
     children: u,
-    ...c
+    ...m
   }, p) => {
     const N = {
       id: e,
-      closeOnClick: m,
-      onChange: i,
-      value: l
+      closeOnClick: d,
+      onChange: l,
+      value: i
     };
-    return /* @__PURE__ */ o("div", { ref: p, ...c, children: /* @__PURE__ */ o(be.Provider, { value: N, children: /* @__PURE__ */ o(I, { id: e, placement: t, gap: r, type: "persisted", children: /* @__PURE__ */ o(
+    return /* @__PURE__ */ s("div", { ref: p, ...m, children: /* @__PURE__ */ s(me.Provider, { value: N, children: /* @__PURE__ */ s(A, { id: e, placement: t, gap: r, type: "persisted", children: /* @__PURE__ */ s(
       "div",
       {
-        className: H["menu-list"],
+        className: G["menu-list"],
         style: {
           "--_max-height": `${a}px`,
-          "--_max-width": `${s}px`
+          "--_max-width": `${o}px`
         },
         children: u
       }
     ) }) }) });
   }
 );
-Ne.displayName = "Menu";
-function kt(e) {
-  return I.getTooltipTriggerProps({
+ue.displayName = "Menu";
+function Ft(e) {
+  return A.getTooltipTriggerProps({
     id: e.id
   });
 }
-function Wt(e) {
-  I.close(e);
+function Ct(e) {
+  A.close(e);
 }
-const Q = Ne;
-Q.getTriggerProps = kt;
-Q.close = Wt;
-const ye = n(
-  ({ value: e, disabled: t = !1, leftIcon: a, rightIcon: s, children: r, onClick: l, className: i, ...m }, u) => {
-    const c = R(be), p = c != null && c.onChange && e !== void 0 ? c.value === e : !1, N = v({
+const V = ue;
+V.getTriggerProps = Ft;
+V.close = Ct;
+const pe = n(
+  ({ value: e, disabled: t = !1, leftIcon: a, rightIcon: o, children: r, onClick: i, className: l, ...d }, u) => {
+    const m = F(me), p = m != null && m.onChange && e !== void 0 ? m.value === e : !1, N = v({
       active: p,
       disabled: t
-    }), b = (S) => {
+    }), h = (B) => {
       if (t) {
-        S.preventDefault();
+        B.preventDefault();
         return;
       }
-      c != null && c.onChange && e !== void 0 && c.onChange(e), l == null || l(S), c != null && c.closeOnClick && (c != null && c.id) && I.close({ id: c.id });
+      m != null && m.onChange && e !== void 0 && m.onChange(e), i == null || i(B), m != null && m.closeOnClick && (m != null && m.id) && A.close({ id: m.id });
     };
-    return /* @__PURE__ */ y(
+    return /* @__PURE__ */ b(
       "button",
       {
         ref: u,
-        className: d(H["menu-item"], i),
+        className: c(G["menu-item"], l),
         disabled: t,
         ...N,
-        ...m,
-        onClick: b,
+        ...d,
+        onClick: h,
         children: [
-          a ? /* @__PURE__ */ o("span", { className: H["menu-item-icon"], children: a }) : null,
-          /* @__PURE__ */ o("span", { className: H["menu-item-label"], children: r }),
-          s ? /* @__PURE__ */ o("span", { className: H["menu-item-icon"], children: s }) : null
+          a ? /* @__PURE__ */ s("span", { className: G["menu-item-icon"], children: a }) : null,
+          /* @__PURE__ */ s("span", { className: G["menu-item-label"], children: r }),
+          o ? /* @__PURE__ */ s("span", { className: G["menu-item-icon"], children: o }) : null
         ]
       }
     );
   }
 );
-ye.displayName = "Menu.Item";
-const _ = Q;
-_.Item = ye;
-const ve = A(void 0);
-function fe() {
-  const e = R(ve);
+pe.displayName = "Menu.Item";
+const j = V;
+j.Item = pe;
+const be = x(void 0);
+function Ne() {
+  const e = F(be);
   if (!e)
     throw new Error("useTableProvider must be used within a Table component");
   return e;
 }
-const he = n(
-  ({ leftContent: e, rightContent: t, className: a, ...s }, r) => {
-    const l = fe(), i = typeof e == "function" ? e(l.selectedRows) : e, m = typeof t == "function" ? t(l.selectedRows) : t;
-    return /* @__PURE__ */ y("div", { ref: r, className: d(w.toolbar, a), ...s, children: [
-      /* @__PURE__ */ o("div", { children: i }),
-      /* @__PURE__ */ o("div", { children: m })
+const ye = n(
+  ({ leftContent: e, rightContent: t, className: a, ...o }, r) => {
+    const i = Ne(), l = typeof e == "function" ? e(i.selectedRows) : e, d = typeof t == "function" ? t(i.selectedRows) : t;
+    return /* @__PURE__ */ b("div", { ref: r, className: c(S.toolbar, a), ...o, children: [
+      /* @__PURE__ */ s("div", { children: l }),
+      /* @__PURE__ */ s("div", { children: d })
     ] });
   }
 );
-he.displayName = "Table.Toolbar";
-const ge = n(({ className: e, ...t }, a) => /* @__PURE__ */ o("div", { ref: a, className: d(w.header, e), ...t }));
-ge.displayName = "Table.Header";
-const Te = n(({ className: e, ...t }, a) => /* @__PURE__ */ o("div", { ref: a, className: d(w.body, e), ...t }));
-Te.displayName = "Table.Body";
-const Se = n(({ className: e, ...t }, a) => /* @__PURE__ */ o("div", { ref: a, className: d(w.footer, e), ...t }));
-Se.displayName = "Table.Footer";
-const Be = n(({ className: e, ...t }, a) => /* @__PURE__ */ o("div", { ref: a, className: d(w.row, e), ...t }));
-Be.displayName = "Table.Row";
-const we = n(
-  ({ as: e = "div", area: t, variant: a, className: s, style: r, ...l }, i) => {
-    const m = v({
+ye.displayName = "Table.Toolbar";
+const ve = n(({ className: e, ...t }, a) => /* @__PURE__ */ s("div", { ref: a, className: c(S.header, e), ...t }));
+ve.displayName = "Table.Header";
+const he = n(({ className: e, ...t }, a) => /* @__PURE__ */ s("div", { ref: a, className: c(S.body, e), ...t }));
+he.displayName = "Table.Body";
+const fe = n(({ className: e, ...t }, a) => /* @__PURE__ */ s("div", { ref: a, className: c(S.footer, e), ...t }));
+fe.displayName = "Table.Footer";
+const ge = n(({ className: e, ...t }, a) => /* @__PURE__ */ s("div", { ref: a, className: c(S.row, e), ...t }));
+ge.displayName = "Table.Row";
+const Te = n(
+  ({ as: e = "div", area: t, variant: a, className: o, style: r, ...i }, l) => {
+    const d = v({
       variant: a
     });
-    return /* @__PURE__ */ o(
+    return /* @__PURE__ */ s(
       e,
       {
-        ref: i,
-        className: d(w.col, s),
+        ref: l,
+        className: c(S.col, o),
         style: {
           "--_area": t,
           ...r
         },
-        ...m,
-        ...l
+        ...d,
+        ...i
       }
     );
   }
 );
-we.displayName = "Table.Col";
-const Ae = n(
-  ({ rowId: e, isMain: t = !1, checked: a, indeterminate: s, onChange: r }, l) => {
-    const i = fe(), m = t ? i.selectedRows.size === i.allRowIds.size && i.allRowIds.size > 0 : e !== void 0 && i.selectedRows.has(e);
-    !t && e !== void 0 && i.registerRowId(e);
+Te.displayName = "Table.Col";
+const Se = n(
+  ({ rowId: e, isMain: t = !1, checked: a, indeterminate: o, onChange: r }, i) => {
+    const l = Ne(), d = t ? l.selectedRows.size === l.allRowIds.size && l.allRowIds.size > 0 : e !== void 0 && l.selectedRows.has(e);
+    !t && e !== void 0 && l.registerRowId(e);
     const u = (p) => {
-      t ? i.onSelectAll(Array.from(i.allRowIds), p.target.checked) : e !== void 0 && i.onSelectionChange(e, p.target.checked), r == null || r(p.target.checked);
-    }, c = t && i.selectedRows.size > 0 && i.selectedRows.size < i.allRowIds.size;
-    return /* @__PURE__ */ y("label", { className: k.checkbox, children: [
-      /* @__PURE__ */ o(
+      t ? l.onSelectAll(Array.from(l.allRowIds), p.target.checked) : e !== void 0 && l.onSelectionChange(e, p.target.checked), r == null || r(p.target.checked);
+    }, m = t && l.selectedRows.size > 0 && l.selectedRows.size < l.allRowIds.size;
+    return /* @__PURE__ */ b("label", { className: $.checkbox, children: [
+      /* @__PURE__ */ s(
         "input",
         {
           ref: (p) => {
-            p && (p.indeterminate = c || s || !1, typeof l == "function" ? l(p) : l && (l.current = p));
+            p && (p.indeterminate = m || o || !1, typeof i == "function" ? i(p) : i && (i.current = p));
           },
           type: "checkbox",
-          className: k.input,
-          checked: a !== void 0 ? a : m,
+          className: $.input,
+          checked: a !== void 0 ? a : d,
           onChange: u,
           "aria-label": t ? "Select all rows" : `Select row ${e}`
         }
       ),
-      /* @__PURE__ */ o("span", { className: k.indicator })
+      /* @__PURE__ */ s("span", { className: $.indicator })
     ] });
   }
 );
-Ae.displayName = "Table.Checkbox";
-const Re = n(
-  ({ as: e = "div", title: t, subtitle: a, size: s = "md", className: r, ...l }, i) => /* @__PURE__ */ y(e, { ref: i, className: d(w.col, r), "data-variant": "double-line", ...l, children: [
-    /* @__PURE__ */ o("div", { className: w["double-line-title"], "data-size": s, children: t }),
-    /* @__PURE__ */ o("div", { className: w["double-line-subtitle"], "data-size": s, children: a })
+Se.displayName = "Table.Checkbox";
+const Be = n(
+  ({ as: e = "div", title: t, subtitle: a, size: o = "md", className: r, ...i }, l) => /* @__PURE__ */ b(e, { ref: l, className: c(S.col, r), "data-variant": "double-line", ...i, children: [
+    /* @__PURE__ */ s("div", { className: S["double-line-title"], "data-size": o, children: t }),
+    /* @__PURE__ */ s("div", { className: S["double-line-subtitle"], "data-size": o, children: a })
   ] })
 );
-Re.displayName = "Table.DoubleLine";
-const Ie = _.Item;
-Ie.displayName = "Table.ActionItem";
-const Le = n(({ icon: e, children: t }, a) => {
-  const s = O(), r = _.getTriggerProps({ id: s });
-  return /* @__PURE__ */ y("div", { ref: a, className: d(w.action), children: [
-    /* @__PURE__ */ o(
-      V,
+Be.displayName = "Table.DoubleLine";
+const Ae = j.Item;
+Ae.displayName = "Table.ActionItem";
+const Re = n(({ icon: e, children: t }, a) => {
+  const o = q(), r = j.getTriggerProps({ id: o });
+  return /* @__PURE__ */ b("div", { ref: a, className: c(S.action), children: [
+    /* @__PURE__ */ s(
+      E,
       {
         ...r,
         as: e,
         variant: "ghost",
-        className: d(w["action-trigger"]),
+        className: c(S["action-trigger"]),
         "aria-label": "Actions",
-        onClick: (l) => {
-          l.stopPropagation();
+        onClick: (i) => {
+          i.stopPropagation();
         },
         size: "small"
       }
     ),
-    /* @__PURE__ */ o(_, { id: s, placement: "bottom", closeOnClick: !0, children: t })
+    /* @__PURE__ */ s(j, { id: o, placement: "bottom", closeOnClick: !0, children: t })
   ] });
 });
-Le.displayName = "Table.Action";
-const xe = n(({ columns: e, children: t, className: a, style: s, onSelectionChange: r, ...l }, i) => {
-  const [m, u] = P(/* @__PURE__ */ new Set()), c = M(/* @__PURE__ */ new Set()), p = (f, h) => {
-    const g = new Set(m);
-    h ? g.add(f) : g.delete(f), u(g), r == null || r({
-      selected: g,
-      allSelected: g.size === c.current.size && c.current.size > 0,
-      someSelected: g.size > 0
+Re.displayName = "Table.Action";
+const we = n(({ columns: e, children: t, className: a, style: o, onSelectionChange: r, ...i }, l) => {
+  const [d, u] = H(/* @__PURE__ */ new Set()), m = z(/* @__PURE__ */ new Set()), p = (f, g) => {
+    const T = new Set(d);
+    g ? T.add(f) : T.delete(f), u(T), r == null || r({
+      selected: T,
+      allSelected: T.size === m.current.size && m.current.size > 0,
+      someSelected: T.size > 0
     });
-  }, N = (f, h) => {
-    const g = h ? new Set(f) : /* @__PURE__ */ new Set();
-    u(g), r == null || r({
-      selected: g,
-      allSelected: h,
-      someSelected: h
+  }, N = (f, g) => {
+    const T = g ? new Set(f) : /* @__PURE__ */ new Set();
+    u(T), r == null || r({
+      selected: T,
+      allSelected: g,
+      someSelected: g
     });
-  }, b = (f) => {
-    c.current.add(f);
-  }, S = {
-    selectedRows: m,
-    allRowIds: c.current,
+  }, h = (f) => {
+    m.current.add(f);
+  }, B = {
+    selectedRows: d,
+    allRowIds: m.current,
     onSelectionChange: p,
     onSelectAll: N,
-    registerRowId: b
+    registerRowId: h
   };
-  return /* @__PURE__ */ o(ve.Provider, { value: S, children: /* @__PURE__ */ o(
+  return /* @__PURE__ */ s(be.Provider, { value: B, children: /* @__PURE__ */ s(
     "div",
     {
-      ref: i,
-      className: d(w.table, a),
+      ref: l,
+      className: c(S.table, a),
       style: {
         "--_columns": e,
-        ...s
+        ...o
       },
-      ...l,
+      ...i,
       children: t
     }
   ) });
 });
-xe.displayName = "Table";
-const pa = Object.assign(xe, {
-  Toolbar: he,
-  Header: ge,
-  Body: Te,
-  Footer: Se,
-  Row: Be,
-  Col: we,
-  Checkbox: Ae,
-  DoubleLine: Re,
-  Action: Le,
-  ActionItem: Ie
-}), Xt = n(
+we.displayName = "Table";
+const ea = Object.assign(we, {
+  Toolbar: ye,
+  Header: ve,
+  Body: he,
+  Footer: fe,
+  Row: ge,
+  Col: Te,
+  Checkbox: Se,
+  DoubleLine: Be,
+  Action: Re,
+  ActionItem: Ae
+}), Gt = n(
   ({
     gap: e = "md",
     direction: t = "horizontal",
     align: a = "center",
-    wrap: s = "nowrap",
+    wrap: o = "nowrap",
     fluid: r = !1,
-    "aria-label": l = "Button group",
-    children: i,
-    className: m,
+    "aria-label": i = "Button group",
+    children: l,
+    className: d,
     ...u
-  }, c) => {
+  }, m) => {
     const p = v({
       align: a,
       direction: t,
       fluid: r,
       gap: e,
-      wrap: s
+      wrap: o
     });
-    return /* @__PURE__ */ o(
+    return /* @__PURE__ */ s(
       "div",
       {
-        ref: c,
-        className: d(At["button-group"], m),
+        ref: m,
+        className: c(bt["button-group"], d),
         role: "group",
-        "aria-label": l,
+        "aria-label": i,
         ...p,
         ...u,
-        children: i
+        children: l
       }
     );
   }
 );
-Xt.displayName = "ButtonGroup";
-const Fe = n(({ children: e, className: t, ...a }, s) => /* @__PURE__ */ o("div", { ref: s, className: d(L["top-bar"], t), ...a, children: e }));
-Fe.displayName = "TopBar";
-const De = n(({ children: e, className: t, ...a }, s) => /* @__PURE__ */ o("div", { ref: s, className: d(L["top-bar-leading"], t), ...a, children: e }));
-De.displayName = "TopBar.Leading";
-const Me = n(({ children: e, className: t, ...a }, s) => /* @__PURE__ */ o("div", { ref: s, className: d(L["top-bar-centred"], t), ...a, children: e }));
-Me.displayName = "TopBar.Centred";
-const He = n(({ children: e, className: t, ...a }, s) => /* @__PURE__ */ o("div", { ref: s, className: d(L["top-bar-trailing"], t), ...a, children: e }));
-He.displayName = "TopBar.Trailing";
-const Ge = n(
-  ({ as: e = "button", active: t, disabled: a, icon: s, className: r, children: l, ...i }, m) => /* @__PURE__ */ y(
+Gt.displayName = "ButtonGroup";
+const Ie = n(({ children: e, className: t, ...a }, o) => /* @__PURE__ */ s("div", { ref: o, className: c(R["top-bar"], t), ...a, children: e }));
+Ie.displayName = "TopBar";
+const Le = n(({ children: e, className: t, ...a }, o) => /* @__PURE__ */ s("div", { ref: o, className: c(R["top-bar-leading"], t), ...a, children: e }));
+Le.displayName = "TopBar.Leading";
+const xe = n(({ children: e, className: t, ...a }, o) => /* @__PURE__ */ s("div", { ref: o, className: c(R["top-bar-centred"], t), ...a, children: e }));
+xe.displayName = "TopBar.Centred";
+const Fe = n(({ children: e, className: t, ...a }, o) => /* @__PURE__ */ s("div", { ref: o, className: c(R["top-bar-trailing"], t), ...a, children: e }));
+Fe.displayName = "TopBar.Trailing";
+const Ce = n(
+  ({ as: e = "button", active: t, disabled: a, icon: o, className: r, children: i, ...l }, d) => /* @__PURE__ */ b(
     e,
     {
-      ref: m,
-      className: d(L["top-bar-item"], r),
+      ref: d,
+      className: c(R["top-bar-item"], r),
       "data-active": t ? "" : void 0,
       "data-disabled": a ? "" : void 0,
-      ...i,
+      ...l,
       children: [
-        s && /* @__PURE__ */ o("span", { className: L["top-bar-item-icon"], children: s }),
-        l
+        o && /* @__PURE__ */ s("span", { className: R["top-bar-item-icon"], children: o }),
+        i
       ]
     }
   )
 );
-Ge.displayName = "TopBar.Item";
-const Pe = n(({ children: e, className: t, ...a }, s) => /* @__PURE__ */ o("div", { ref: s, className: d(L["top-bar-list-item"], t), ...a, children: e }));
-Pe.displayName = "TopBar.ListItem";
-const ba = Object.assign(Fe, {
-  Centred: Me,
-  Item: Ge,
-  Leading: De,
-  ListItem: Pe,
-  Trailing: He
-}), ze = A(void 0), U = n(
-  ({ direction: e = "horizontal", gap: t, value: a, onChange: s, children: r, className: l, ...i }, m) => {
-    const u = v({ direction: e }), c = {
-      lg: "var(--spacing-4)",
-      md: "var(--spacing-3)",
-      sm: "var(--spacing-2)",
-      xs: "var(--spacing-1)"
-    }, p = {
-      onChange: s,
-      value: a
-    };
-    return /* @__PURE__ */ o(ze.Provider, { value: p, children: /* @__PURE__ */ o(
-      "nav",
-      {
-        ref: m,
-        className: d(j.nav, l),
-        style: {
-          ...t && {
-            "--vers-comp-nav-gap": c[t]
-          }
-        },
-        ...u,
-        ...i,
-        children: r
-      }
-    ) });
-  }
-);
-U.displayName = "Nav";
-U.displayName = "Nav";
+Ce.displayName = "TopBar.Item";
+const Ge = n(({ children: e, className: t, ...a }, o) => /* @__PURE__ */ s("div", { ref: o, className: c(R["top-bar-list-item"], t), ...a, children: e }));
+Ge.displayName = "TopBar.ListItem";
+const ta = Object.assign(Ie, {
+  Centred: xe,
+  Item: Ce,
+  Leading: Le,
+  ListItem: Ge,
+  Trailing: Fe
+}), Me = n(({ children: e, className: t }, a) => /* @__PURE__ */ s("aside", { ref: a, className: c(y.sidebar, t), children: e }));
+Me.displayName = "Sidebar";
+const ze = n(({ children: e, className: t }, a) => /* @__PURE__ */ s("div", { ref: a, className: c(y["sidebar-header"], t), children: e }));
+ze.displayName = "Sidebar.Header";
+const He = n(({ children: e, className: t }, a) => /* @__PURE__ */ s("div", { ref: a, className: c(y["sidebar-body"], t), children: e }));
+He.displayName = "Sidebar.Body";
+const Pe = n(({ children: e, className: t }, a) => /* @__PURE__ */ s("div", { ref: a, className: c(y["sidebar-footer"], t), children: e }));
+Pe.displayName = "Sidebar.Footer";
 const je = n(
-  ({
-    as: e = "button",
-    active: t = !1,
-    value: a,
-    disabled: s = !1,
-    loading: r = !1,
-    leftIcon: l,
-    rightIcon: i,
-    children: m,
-    onClick: u,
-    className: c,
-    ...p
-  }, N) => {
-    const b = R(ze), S = b != null && b.onChange && a !== void 0 ? b.value === a : t, f = v({
-      active: S,
-      disabled: s || r,
-      loading: r
-    }), h = (g) => {
-      if (s || r) {
-        g.preventDefault();
-        return;
-      }
-      b != null && b.onChange && a !== void 0 && b.onChange(a), u == null || u(g);
-    };
-    return /* @__PURE__ */ y(
-      e,
-      {
-        ref: N,
-        className: d(j["nav-item"], c),
-        "aria-current": S && e !== "button" ? "page" : void 0,
-        "aria-disabled": s || r ? "true" : void 0,
-        "aria-busy": r ? "true" : void 0,
-        ...f,
-        ...p,
-        onClick: h,
-        children: [
-          l && /* @__PURE__ */ o("span", { className: j["nav-item-icon"], children: /* @__PURE__ */ o(E, { as: l }) }),
-          m,
-          i && /* @__PURE__ */ o("span", { className: j["nav-item-icon"], children: /* @__PURE__ */ o(E, { as: i }) })
-        ]
-      }
-    );
-  }
-);
-je.displayName = "NavItem";
-const Na = Object.assign(U, {
-  Item: je
-}), $e = n(({ children: e, className: t }, a) => /* @__PURE__ */ o("aside", { ref: a, className: d(T.sidebar, t), children: e }));
-$e.displayName = "Sidebar";
-const Ee = n(({ children: e, className: t }, a) => /* @__PURE__ */ o("div", { ref: a, className: d(T["sidebar-header"], t), children: e }));
-Ee.displayName = "Sidebar.Header";
-const _e = n(({ children: e, className: t }, a) => /* @__PURE__ */ o("div", { ref: a, className: d(T["sidebar-body"], t), children: e }));
-_e.displayName = "Sidebar.Body";
-const Ce = n(({ children: e, className: t }, a) => /* @__PURE__ */ o("div", { ref: a, className: d(T["sidebar-footer"], t), children: e }));
-Ce.displayName = "Sidebar.Footer";
-const Ve = n(
-  ({ label: e, icon: t, defaultExpanded: a = !0, isExpanded: s, onExpandedChange: r, children: l, className: i }, m) => {
-    const [u, c] = P(a), p = s !== void 0 ? s : u, N = () => {
-      const b = !p;
-      c(b), r == null || r(b);
+  ({ label: e, icon: t, defaultExpanded: a = !0, isExpanded: o, onExpandedChange: r, children: i, className: l }, d) => {
+    const [u, m] = H(a), p = o !== void 0 ? o : u, N = () => {
+      const h = !p;
+      m(h), r == null || r(h);
     };
-    return /* @__PURE__ */ y(
+    return /* @__PURE__ */ b(
       "div",
       {
-        ref: m,
-        className: d(T["sidebar-group"], i),
+        ref: d,
+        className: c(y["sidebar-group"], l),
         "data-expanded": p ? "" : void 0,
         children: [
-          /* @__PURE__ */ y("button", { className: T["sidebar-group-header"], onClick: N, "aria-expanded": p, children: [
-            t && /* @__PURE__ */ o("span", { children: t }),
-            /* @__PURE__ */ o("span", { className: T["sidebar-group-label"], children: e }),
-            /* @__PURE__ */ o(E, { as: Z, className: T["sidebar-group-chevron"], size: "sm" })
+          /* @__PURE__ */ b("button", { className: y["sidebar-group-header"], onClick: N, "aria-expanded": p, children: [
+            t && /* @__PURE__ */ s("span", { children: t }),
+            /* @__PURE__ */ s("span", { className: y["sidebar-group-label"], children: e }),
+            /* @__PURE__ */ s(J, { as: W, className: y["sidebar-group-chevron"], size: "sm" })
           ] }),
-          /* @__PURE__ */ o("div", { className: T["sidebar-group-content"], children: /* @__PURE__ */ o("div", { children: l }) })
+          /* @__PURE__ */ s("div", { className: y["sidebar-group-content"], children: /* @__PURE__ */ s("div", { children: i }) })
         ]
       }
     );
   }
 );
-Ve.displayName = "Sidebar.Group";
-const ke = n(
-  ({ as: e = "button", active: t, disabled: a, icon: s, action: r, className: l, children: i, ...m }, u) => /* @__PURE__ */ y(
+je.displayName = "Sidebar.Group";
+const De = n(
+  ({ as: e = "button", active: t, disabled: a, icon: o, action: r, className: i, children: l, ...d }, u) => /* @__PURE__ */ b(
     e,
     {
       ref: u,
-      className: d(T["sidebar-item"], l),
+      className: c(y["sidebar-item"], i),
       "data-active": t ? "" : void 0,
       "data-disabled": a ? "" : void 0,
       "data-action": r ? "" : void 0,
-      ...m,
+      ...d,
       children: [
-        s && /* @__PURE__ */ o("span", { className: T["sidebar-item-icon"], children: s }),
-        /* @__PURE__ */ o("span", { className: T["sidebar-item-text"], children: i }),
-        r && /* @__PURE__ */ o("span", { className: T["sidebar-item-action"], children: r })
+        o && /* @__PURE__ */ s("span", { className: y["sidebar-item-icon"], children: o }),
+        /* @__PURE__ */ s("span", { className: y["sidebar-item-text"], children: l }),
+        r && /* @__PURE__ */ s("span", { className: y["sidebar-item-action"], children: r })
       ]
     }
   )
 );
-ke.displayName = "Sidebar.Item";
-const We = n(({ children: e, className: t }, a) => /* @__PURE__ */ o("div", { ref: a, className: d(T["sidebar-item-list"], t), children: e }));
-We.displayName = "Sidebar.ItemList";
-const Xe = n(({ className: e }, t) => /* @__PURE__ */ o("div", { ref: t, className: d(T["sidebar-divider"], e), children: /* @__PURE__ */ o(Mt, {}) }));
-Xe.displayName = "Sidebar.Divider";
-const ya = Object.assign($e, {
-  Body: _e,
-  Divider: Xe,
-  Footer: Ce,
-  Group: Ve,
-  Header: Ee,
-  Item: ke,
-  ItemList: We
+De.displayName = "Sidebar.Item";
+const $e = n(({ children: e, className: t }, a) => /* @__PURE__ */ s("div", { ref: a, className: c(y["sidebar-item-list"], t), children: e }));
+$e.displayName = "Sidebar.ItemList";
+const Oe = n(({ className: e }, t) => /* @__PURE__ */ s("div", { ref: t, className: c(y["sidebar-divider"], e), children: /* @__PURE__ */ s(ht, {}) }));
+Oe.displayName = "Sidebar.Divider";
+const aa = Object.assign(Me, {
+  Body: He,
+  Divider: Oe,
+  Footer: Pe,
+  Group: je,
+  Header: ze,
+  Item: De,
+  ItemList: $e
 });
-function qt(e, t) {
+function Mt(e, t) {
   return e === t;
 }
-const qe = n(({ children: e, className: t, ...a }, s) => /* @__PURE__ */ o("nav", { ref: s, className: d($["bottom-bar"], t), ...a, children: e }));
-qe.displayName = "BottomBar";
-const Je = n(
-  ({ as: e = "button", href: t, active: a = !1, disabled: s = !1, icon: r, children: l, onClick: i, className: m, ...u }, c) => {
-    const p = qt(e, "a"), N = v({
+const ke = n(({ children: e, className: t, ...a }, o) => /* @__PURE__ */ s("nav", { ref: o, className: c(P["bottom-bar"], t), ...a, children: e }));
+ke.displayName = "BottomBar";
+const _e = n(
+  ({ as: e = "button", href: t, active: a = !1, disabled: o = !1, icon: r, children: i, onClick: l, className: d, ...u }, m) => {
+    const p = Mt(e, "a"), N = v({
       active: a,
-      disabled: s
-    }), b = (h) => {
-      if (s) {
-        h.preventDefault();
+      disabled: o
+    }), h = (g) => {
+      if (o) {
+        g.preventDefault();
         return;
       }
-      i == null || i(h);
-    }, S = {
-      className: d($["bottom-bar-item"], m),
-      onClick: b,
-      ref: c,
+      l == null || l(g);
+    }, B = {
+      className: c(P["bottom-bar-item"], d),
+      onClick: h,
+      ref: m,
       ...N,
       ...u
     };
-    return p && (S.href = t), /* @__PURE__ */ y(e || "button", { ...S, children: [
-      r && /* @__PURE__ */ o("span", { className: $["bottom-bar-item-icon"], children: r }),
-      l && /* @__PURE__ */ o("span", { className: $["bottom-bar-item-text"], children: l })
+    return p && (B.href = t), /* @__PURE__ */ b(e || "button", { ...B, children: [
+      r && /* @__PURE__ */ s("span", { className: P["bottom-bar-item-icon"], children: r }),
+      i && /* @__PURE__ */ s("span", { className: P["bottom-bar-item-text"], children: i })
     ] });
   }
 );
-Je.displayName = "BottomBar.Item";
-const va = Object.assign(qe, {
-  Item: Je
-}), Ke = n(
-  ({ className: e, children: t }, a) => /* @__PURE__ */ o("div", { ref: a, className: d(x["app-layout"], e), children: t })
-);
-Ke.displayName = "AppLayout";
-const Qe = n(
-  ({ centered: e, className: t, children: a }, s) => {
-    const r = v({
-      centered: e
-    });
-    return /* @__PURE__ */ o("div", { ref: s, className: d(x["app-layout-body"], t), ...r, children: a });
-  }
-);
-Qe.displayName = "AppLayout.Body";
-const Ue = n(({ className: e, children: t }, a) => /* @__PURE__ */ o("header", { ref: a, className: d(x["app-layout-header"], e), children: t }));
-Ue.displayName = "AppLayout.Header";
-const Ye = n(({ className: e, children: t }, a) => /* @__PURE__ */ o("main", { ref: a, className: d(x["app-layout-main"], e), children: t }));
-Ye.displayName = "AppLayout.Main";
-const Ze = n(({ className: e, children: t }, a) => /* @__PURE__ */ o("aside", { ref: a, className: d(x["app-layout-side-left"], e), children: t }));
-Ze.displayName = "AppLayout.SideLeft";
-const Oe = n(({ className: e, children: t }, a) => /* @__PURE__ */ o("aside", { ref: a, className: d(x["app-layout-side-right"], e), children: t }));
-Oe.displayName = "AppLayout.SideRight";
-const et = n(({ className: e, children: t }, a) => /* @__PURE__ */ o("footer", { ref: a, className: d(x["app-layout-footer"], e), children: t }));
-et.displayName = "AppLayout.Footer";
-const fa = Object.assign(Ke, {
-  Body: Qe,
-  Footer: et,
-  Header: Ue,
-  Main: Ye,
-  SideLeft: Ze,
-  SideRight: Oe
+_e.displayName = "BottomBar.Item";
+const sa = Object.assign(ke, {
+  Item: _e
+}), Ee = n(({ className: e, children: t }, a) => /* @__PURE__ */ s("div", { ref: a, className: c(w["app-layout"], e), children: t }));
+Ee.displayName = "AppLayout";
+const Ve = n(({ centered: e, className: t, children: a }, o) => {
+  const r = v({
+    centered: e
+  });
+  return /* @__PURE__ */ s("div", { ref: o, className: c(w["app-layout-body"], t), ...r, children: a });
 });
-function Jt({ columns: e = "1fr", children: t, className: a, style: s, ...r }, l) {
-  return /* @__PURE__ */ o(
+Ve.displayName = "AppLayout.Body";
+const We = n(({ className: e, children: t }, a) => /* @__PURE__ */ s("header", { ref: a, className: c(w["app-layout-header"], e), children: t }));
+We.displayName = "AppLayout.Header";
+const Xe = n(({ className: e, children: t }, a) => /* @__PURE__ */ s("main", { ref: a, className: c(w["app-layout-main"], e), children: t }));
+Xe.displayName = "AppLayout.Main";
+const qe = n(({ className: e, children: t }, a) => /* @__PURE__ */ s("aside", { ref: a, className: c(w["app-layout-side-left"], e), children: t }));
+qe.displayName = "AppLayout.SideLeft";
+const Je = n(({ className: e, children: t }, a) => /* @__PURE__ */ s("aside", { ref: a, className: c(w["app-layout-side-right"], e), children: t }));
+Je.displayName = "AppLayout.SideRight";
+const Ke = n(({ className: e, children: t }, a) => /* @__PURE__ */ s("footer", { ref: a, className: c(w["app-layout-footer"], e), children: t }));
+Ke.displayName = "AppLayout.Footer";
+const oa = Object.assign(Ee, {
+  Body: Ve,
+  Footer: Ke,
+  Header: We,
+  Main: Xe,
+  SideLeft: qe,
+  SideRight: Je
+});
+function zt({ columns: e = "1fr", children: t, className: a, style: o, ...r }, i) {
+  return /* @__PURE__ */ s(
     "form",
     {
-      ref: l,
-      className: d(X["form-group"], a),
+      ref: i,
+      className: c(_["form-group"], a),
       style: {
         "--_columns": e,
-        ...s
+        ...o
       },
       ...r,
       children: t
     }
   );
 }
-const tt = n(Jt);
-tt.displayName = "FormGroup";
-const at = n(
-  ({ area: e, children: t, className: a, style: s, ...r }, l) => /* @__PURE__ */ o(
+const Qe = n(zt);
+Qe.displayName = "FormGroup";
+const Ue = n(
+  ({ area: e, children: t, className: a, style: o, ...r }, i) => /* @__PURE__ */ s(
     "div",
     {
-      ref: l,
-      className: d(X.field, a),
+      ref: i,
+      className: c(_.field, a),
       style: {
         "--_area": e,
-        ...s
+        ...o
       },
       ...r,
       children: t
     }
   )
 );
-at.displayName = "FormGroup.Field";
-const st = n(
-  ({ className: e, ...t }, a) => /* @__PURE__ */ o(
-    "hr",
-    {
-      ref: a,
-      className: d(X.separator, e),
-      ...t
-    }
-  )
-);
-st.displayName = "FormGroup.Separator";
-const ha = Object.assign(tt, {
-  Field: at,
-  Separator: st
+Ue.displayName = "FormGroup.Field";
+const Ye = n(({ className: e, ...t }, a) => /* @__PURE__ */ s("hr", { ref: a, className: c(_.separator, e), ...t }));
+Ye.displayName = "FormGroup.Separator";
+const ra = Object.assign(Qe, {
+  Field: Ue,
+  Separator: Ye
 });
-function Kt({ direction: e = "column", children: t, className: a, ...s }, r) {
-  return /* @__PURE__ */ o(
-    "ul",
-    {
-      ref: r,
-      className: d(W.features, a),
-      "data-direction": e,
-      ...s,
-      children: t
-    }
-  );
+function Ht({ direction: e = "column", children: t, className: a, ...o }, r) {
+  return /* @__PURE__ */ s("ul", { ref: r, className: c(O.features, a), "data-direction": e, ...o, children: t });
 }
-const ot = n(Kt);
-ot.displayName = "Features";
-const rt = n(
-  ({ icon: e, children: t, className: a, "aria-label": s, ...r }, l) => {
-    const m = `features-item-${O()}`, u = s ? I.getTooltipTriggerProps({ id: m }) : {};
-    return /* @__PURE__ */ y(
-      "li",
-      {
-        ref: l,
-        "aria-label": s,
-        className: d(W.item, a),
-        ...u,
-        ...r,
-        children: [
-          e && /* @__PURE__ */ o("span", { className: W.icon, children: e }),
-          t,
-          s && /* @__PURE__ */ o(I, { id: m, children: /* @__PURE__ */ o(I.Text, { children: s }) })
-        ]
-      }
-    );
-  }
-);
-rt.displayName = "Features.Item";
-const Qt = Object.assign(ot, {
-  Item: rt
-}), ga = Qt, lt = xt.forwardRef(
-  ({ isOpen: e, onOpenChange: t, children: a, onClick: s, ...r }, l) => {
-    const i = M(null), m = l || i;
-    z(() => {
-      const c = m.current;
-      if (c) {
-        if (e)
-          try {
-            c.showModal(), document.documentElement.style.overflow = "hidden";
-          } catch {
-          }
-        else
-          c.close(), document.documentElement.style.overflow = "";
-        return () => {
-          document.documentElement.style.overflow = "";
-        };
-      }
-    }, [e, m]), z(() => {
-      const c = m.current;
-      if (!c)
-        return;
-      const p = () => t == null ? void 0 : t(!1), N = (b) => {
-        b.preventDefault(), t == null || t(!1);
-      };
-      return c.addEventListener("close", p), c.addEventListener("cancel", N), () => {
-        c.removeEventListener("close", p), c.removeEventListener("cancel", N);
-      };
-    }, [t, m]);
-    const u = Dt(
-      (c) => {
-        c.target === c.currentTarget && (t == null || t(!1)), s == null || s(c);
-      },
-      [t, s]
-    );
-    return /* @__PURE__ */ o("dialog", { ...r, ref: m, onClick: u, children: a });
+const Ze = n(Ht);
+Ze.displayName = "Features";
+const et = n(
+  ({ icon: e, children: t, className: a, "aria-label": o, ...r }, i) => {
+    const d = `features-item-${q()}`, u = o ? A.getTooltipTriggerProps({ id: d }) : {};
+    return /* @__PURE__ */ b("li", { ref: i, "aria-label": o, className: c(O.item, a), ...u, ...r, children: [
+      e && /* @__PURE__ */ s("span", { className: O.icon, children: e }),
+      t,
+      o && /* @__PURE__ */ s(A, { id: d, children: /* @__PURE__ */ s(A.Text, { children: o }) })
+    ] });
   }
 );
-lt.displayName = "Dialog";
-const Y = lt, it = A(void 0), Ut = () => {
-  const e = R(it);
-  if (!e)
-    throw new Error("Drawer subcomponents must be used within Drawer");
-  return e;
-}, ct = n(
-  ({ open: e, onOpenChange: t, placement: a = "right", children: s, className: r, ...l }, i) => {
-    const m = v({
-      placement: a
-    });
-    return /* @__PURE__ */ o(it.Provider, { value: { onClose: () => t == null ? void 0 : t(!1) }, children: /* @__PURE__ */ o(
-      Y,
-      {
-        ref: i,
-        isOpen: e,
-        onOpenChange: t,
-        className: d(e && Rt.drawer, r),
-        ...m,
-        ...l,
-        children: /* @__PURE__ */ o("div", { className: B.content, children: s })
-      }
-    ) });
-  }
-);
-ct.displayName = "Drawer";
-const nt = n(({ onClick: e, ...t }, a) => {
-  const { onClose: s } = Ut();
-  return /* @__PURE__ */ o(
-    V,
-    {
-      ref: a,
-      variant: "ghost",
-      as: q,
-      "aria-label": "Close",
-      onClick: (l) => {
-        s(), e == null || e(l);
-      },
-      className: B.closeButton,
-      ...t
-    }
-  );
-});
-nt.displayName = "Drawer.CloseButton";
-const dt = n(
-  ({ action: e, children: t, tabs: a, className: s, ...r }, l) => /* @__PURE__ */ y(
-    "div",
-    {
-      ref: l,
-      className: d(B.header, s),
-      ...r,
-      ...e && { "data-action": "" },
-      ...a && { "data-tabs": "" },
-      children: [
-        e ? /* @__PURE__ */ y(Tt, { children: [
-          /* @__PURE__ */ o("div", { className: B.headerTop, children: e }),
-          t && /* @__PURE__ */ o("div", { className: B.headerContent, children: t })
-        ] }) : /* @__PURE__ */ o("div", { className: B.headerTop, children: t }),
-        a
-      ]
-    }
-  )
-);
-dt.displayName = "Drawer.Header";
-const Ta = Object.assign(ct, {
-  Body: K,
-  CloseButton: nt,
-  Footer: te,
-  Header: dt,
-  Title: J
-}), mt = A(void 0), Yt = () => {
-  const e = R(mt);
+et.displayName = "Features.Item";
+const Pt = Object.assign(Ze, {
+  Item: et
+}), ia = Pt, tt = x(void 0), jt = () => {
+  const e = F(tt);
   if (!e)
     throw new Error("Modal subcomponents must be used within Modal");
   return e;
-}, ut = n(
-  ({ open: e, onOpenChange: t, size: a, position: s, children: r, className: l, ...i }, m) => {
-    const u = v({ size: a, position: s });
-    return /* @__PURE__ */ o(mt.Provider, { value: { onClose: () => t == null ? void 0 : t(!1) }, children: /* @__PURE__ */ o(
-      Y,
+}, at = n(
+  ({ open: e, onOpenChange: t, size: a, position: o, children: r, className: i, ...l }, d) => {
+    const u = v({ size: a, position: o });
+    return /* @__PURE__ */ s(tt.Provider, { value: { onClose: () => t == null ? void 0 : t(!1) }, children: /* @__PURE__ */ s(
+      Q,
       {
-        ref: m,
+        ref: d,
         isOpen: e,
         onOpenChange: t,
-        className: d(e && It.modal, l),
+        className: c(e && Nt.modal, i),
         "data-modal": "",
         ...u,
-        ...i,
-        children: /* @__PURE__ */ o("div", { className: B.content, children: r })
+        ...l,
+        children: /* @__PURE__ */ s("div", { className: C.content, children: r })
       }
     ) });
   }
 );
-ut.displayName = "Modal";
-const pt = n(({ onClick: e, ...t }, a) => {
-  const { onClose: s } = Yt();
-  return /* @__PURE__ */ o(
-    V,
+at.displayName = "Modal";
+const st = n(({ onClick: e, ...t }, a) => {
+  const { onClose: o } = jt();
+  return /* @__PURE__ */ s(
+    E,
     {
       ref: a,
       variant: "ghost",
-      as: q,
+      as: X,
       "aria-label": "Close",
-      onClick: (l) => {
-        s(), e == null || e(l);
+      onClick: (i) => {
+        o(), e == null || e(i);
       },
-      className: B.closeButton,
+      className: C.closeButton,
       ...t
     }
   );
 });
-pt.displayName = "Modal.CloseButton";
-const bt = n(({ action: e, children: t, className: a, ...s }, r) => /* @__PURE__ */ y("div", { ref: r, className: d(B.header, "modal-header", a), "data-modal-header": "", ...s, children: [
-  /* @__PURE__ */ o("div", { children: t }),
-  e && /* @__PURE__ */ o("div", { className: "modal-header-action", children: e })
+st.displayName = "Modal.CloseButton";
+const ot = n(({ action: e, children: t, className: a, ...o }, r) => /* @__PURE__ */ b("div", { ref: r, className: c(C.header, "modal-header", a), "data-modal-header": "", ...o, children: [
+  /* @__PURE__ */ s("div", { children: t }),
+  e && /* @__PURE__ */ s("div", { className: "modal-header-action", children: e })
 ] }));
-bt.displayName = "Modal.Header";
-const Nt = n(
-  ({ align: e = "end", children: t, className: a, ...s }, r) => /* @__PURE__ */ o(
+ot.displayName = "Modal.Header";
+const rt = n(
+  ({ align: e = "end", children: t, className: a, ...o }, r) => /* @__PURE__ */ s(
     "div",
     {
       ref: r,
-      className: d(B.footer, "modal-footer", a),
+      className: c(C.footer, "modal-footer", a),
       "data-modal-footer": "",
       "data-align": e,
-      ...s,
+      ...o,
       children: t
     }
   )
 );
-Nt.displayName = "Modal.Footer";
-const Sa = Object.assign(ut, {
-  Body: K,
-  CloseButton: pt,
-  Footer: Nt,
-  Header: bt,
-  Title: J
-}), yt = A(void 0), Zt = () => {
-  const e = R(yt);
+rt.displayName = "Modal.Footer";
+const la = Object.assign(at, {
+  Body: Y,
+  CloseButton: st,
+  Footer: rt,
+  Header: ot,
+  Title: U
+}), it = x(void 0), Dt = () => {
+  const e = F(it);
   if (!e)
     throw new Error("BottomSheet subcomponents must be used within BottomSheet");
   return e;
-}, vt = n(
-  ({ open: e, onOpenChange: t, children: a, className: s, ...r }, l) => /* @__PURE__ */ o(yt.Provider, { value: { onClose: () => t == null ? void 0 : t(!1) }, children: /* @__PURE__ */ o(
-    Y,
+}, lt = n(
+  ({ open: e, onOpenChange: t, children: a, className: o, ...r }, i) => /* @__PURE__ */ s(it.Provider, { value: { onClose: () => t == null ? void 0 : t(!1) }, children: /* @__PURE__ */ s(
+    Q,
     {
-      ref: l,
+      ref: i,
       isOpen: e,
       onOpenChange: t,
-      className: d(Lt.bottomSheet, s),
+      className: c(yt.bottomSheet, o),
       ...r,
-      children: /* @__PURE__ */ o("div", { className: B.content, children: a })
+      children: /* @__PURE__ */ s("div", { className: C.content, children: a })
     }
   ) })
 );
-vt.displayName = "BottomSheet";
-const ft = n(
+lt.displayName = "BottomSheet";
+const nt = n(
   ({ onClick: e, ...t }, a) => {
-    const { onClose: s } = Zt();
-    return /* @__PURE__ */ o(
-      V,
+    const { onClose: o } = Dt();
+    return /* @__PURE__ */ s(
+      E,
       {
-        as: q,
+        as: X,
         ref: a,
         variant: "ghost",
         "aria-label": "Close",
-        onClick: (l) => {
-          s(), e == null || e(l);
+        onClick: (i) => {
+          o(), e == null || e(i);
         },
-        className: B.closeButton,
+        className: C.closeButton,
         ...t
       }
     );
   }
 );
-ft.displayName = "BottomSheet.CloseButton";
-const Ba = Object.assign(vt, {
-  Body: K,
-  CloseButton: ft,
-  Footer: te,
-  Header: Ht,
-  Title: J
+nt.displayName = "BottomSheet.CloseButton";
+const na = Object.assign(lt, {
+  Body: Y,
+  CloseButton: nt,
+  Footer: gt,
+  Header: ft,
+  Title: U
 });
 export {
-  na as Accordion,
-  fa as AppLayout,
-  ma as AttributeList,
-  zt as AvatarGroup,
-  Ct as BadgeGroup,
-  va as BottomBar,
-  Ba as BottomSheet,
-  Xt as ButtonGroup,
-  ua as Card,
-  Y as Dialog,
-  Ta as Drawer,
-  ga as Features,
-  ha as FormGroup,
-  _ as Menu,
-  Sa as Modal,
-  Na as Nav,
-  je as NavItem,
-  _t as NoResults,
-  ya as Sidebar,
-  pa as Table,
-  da as Tabs,
-  ba as TopBar
+  Qt as Accordion,
+  oa as AppLayout,
+  Yt as AttributeList,
+  Bt as AvatarGroup,
+  Lt as BadgeGroup,
+  sa as BottomBar,
+  na as BottomSheet,
+  Gt as ButtonGroup,
+  Zt as Card,
+  Q as Dialog,
+  ma as Drawer,
+  ia as Features,
+  ra as FormGroup,
+  j as Menu,
+  la as Modal,
+  It as NoResults,
+  aa as Sidebar,
+  ea as Table,
+  Ut as Tabs,
+  ta as TopBar
 };