@noxickon/onyx 1.0.3 → 1.0.5

package/dist/layouts/layouts.es.js

@@ -1,90 +1,91 @@
-import { _ as s, $ as r, e as f, a1 as j, i as h, l as y, a2 as D, c as $, u as G, t as P } from "../chunks/ui-BgyYCO2P.js";
-import { createContext as w, useState as v, useMemo as R, useEffect as k, useContext as N, useCallback as S } from "react";
-const Ne = ({
+import { _ as n, e as h, a0 as N, i as v, l as O, a1 as $, c as G, u as P, t as R } from "../chunks/ui-Dmzl3_Y3.js";
+import { jsx as o, jsxs as m } from "react/jsx-runtime";
+import { createContext as M, useState as y, useMemo as W, useEffect as E, useContext as C, useCallback as w } from "react";
+const ke = ({
   brand: e,
   children: a,
   className: t,
-  hasSidebar: o = !1,
-  navClassName: n,
+  hasSidebar: r = !1,
+  navClassName: s,
   toggleSidebar: i,
   ...l
-}) => /* @__PURE__ */ s.jsx(
+}) => /* @__PURE__ */ o(
   "header",
   {
-    className: r("max-h-15 min-h-15 sticky top-0 z-10 bg-gray-100", t),
+    className: n("max-h-15 min-h-15 sticky top-0 z-10 bg-gray-100", t),
     "data-ox-slot": "header",
     ...l,
-    children: /* @__PURE__ */ s.jsxs(
+    children: /* @__PURE__ */ m(
       "nav",
       {
-        className: r(
+        className: n(
           "max-w-10xl mx-auto flex items-center justify-between px-4 py-2.5",
-          n
+          s
         ),
         children: [
-          /* @__PURE__ */ s.jsxs("div", { className: "flex items-center gap-[17px]", children: [
-            o ? /* @__PURE__ */ s.jsx(
-              f,
+          /* @__PURE__ */ m("div", { className: "flex items-center gap-[17px]", children: [
+            r ? /* @__PURE__ */ o(
+              h,
               {
                 "aria-label": "Open menu",
                 "data-ox-slot": "header-toggle",
                 size: "md",
                 variant: "ghost",
                 onClick: i,
-                children: /* @__PURE__ */ s.jsx(f.Icon, { path: "mdiMenu" })
+                children: /* @__PURE__ */ o(h.Icon, { path: "mdiMenu" })
               }
             ) : null,
-            e ? /* @__PURE__ */ s.jsx("div", { children: e }) : null
+            e ? /* @__PURE__ */ o("div", { children: e }) : null
           ] }),
           a
         ]
       }
     )
   }
-), I = "group ox-gray-inset-focus items-center rounded-lg text-sm transition-colors text-left col-span-2 grid grid-cols-subgrid", E = "size-10 justify-center", _ = "h-10 w-full px-2", L = "bg-gray-300 text-gray-1200", W = "h-15", B = w(void 0), Y = ({
+), _ = "group ox-gray-inset-focus items-center rounded-lg text-sm transition-colors text-left col-span-2 grid grid-cols-subgrid", L = "size-10 justify-center", B = "h-10 w-full px-2", T = "bg-gray-300 text-gray-1200", Y = "h-15", z = M(void 0), F = ({
   children: e,
   className: a,
   desktopCollapsed: t = !1,
-  hasHeader: o = !1,
-  mobileCollapsed: n = !0,
+  hasHeader: r = !1,
+  mobileCollapsed: s = !0,
   onClose: i,
   ...l
 }) => {
-  const [d, x] = v(window.innerWidth < j), b = d ? n : t, O = R(
-    () => ({ collapsed: b, isMobile: d }),
-    [b, d]
+  const [d, c] = y(window.innerWidth < N), x = d ? s : t, S = W(
+    () => ({ collapsed: x, isMobile: d }),
+    [x, d]
   );
-  return k(() => {
-    const c = () => {
-      x(window.innerWidth < j);
+  return E(() => {
+    const u = () => {
+      c(window.innerWidth < N);
     };
-    return c(), window.addEventListener("resize", c), () => {
-      window.removeEventListener("resize", c);
+    return u(), window.addEventListener("resize", u), () => {
+      window.removeEventListener("resize", u);
     };
-  }, []), /* @__PURE__ */ s.jsx(B.Provider, { value: O, children: d ? /* @__PURE__ */ s.jsx(h, { open: !b, onOpenChange: (c) => !c && i?.(), children: /* @__PURE__ */ s.jsx(h.Content, { closeOnOutsideClick: !!i, side: "left", ...l, children: /* @__PURE__ */ s.jsxs(
+  }, []), /* @__PURE__ */ o(z.Provider, { value: S, children: d ? /* @__PURE__ */ o(v, { open: !x, onOpenChange: (u) => !u && i?.(), children: /* @__PURE__ */ o(v.Content, { closeOnOutsideClick: !!i, side: "left", ...l, children: /* @__PURE__ */ m(
     "nav",
     {
       "aria-label": "Mobile navigation",
-      className: r("flex h-screen w-full flex-col bg-gray-100", a),
+      className: n("flex h-screen w-full flex-col bg-gray-100", a),
       "data-ox-slot": "sidebar",
       role: "navigation",
       ...l,
       children: [
-        i ? /* @__PURE__ */ s.jsx("div", { className: r("h-15 flex items-center gap-[17px] px-4", W), children: /* @__PURE__ */ s.jsx(f, { "aria-label": "Close sidebar", size: "md", variant: "ghost", onClick: i, children: /* @__PURE__ */ s.jsx(f.Icon, { path: "mdiClose" }) }) }) : null,
+        i ? /* @__PURE__ */ o("div", { className: n("h-15 flex items-center gap-[17px] px-4", Y), children: /* @__PURE__ */ o(h, { "aria-label": "Close sidebar", size: "md", variant: "ghost", onClick: i, children: /* @__PURE__ */ o(h.Icon, { path: "mdiClose" }) }) }) : null,
         e
       ]
     }
-  ) }) }) : /* @__PURE__ */ s.jsx(
+  ) }) }) : /* @__PURE__ */ o(
     "nav",
     {
       "aria-label": "Desktop navigation",
-      className: r(
+      className: n(
         "sticky box-content flex flex-col overflow-y-auto bg-gray-100",
         {
-          "top-0 h-screen": !o,
-          "viewport-minus-header top-15": o,
-          'max-w-18 min-w-18 [&_[data-ox-slot="sidebar-label"]]:hidden': b,
-          "min-w-64 max-w-64": !b
+          "top-0 h-screen": !r,
+          "viewport-minus-header top-15": r,
+          'max-w-18 min-w-18 [&_[data-ox-slot="sidebar-label"]]:hidden': x,
+          "min-w-64 max-w-64": !x
         },
         a
       ),
@@ -94,21 +95,21 @@ const Ne = ({
       children: e
     }
   ) });
-}, g = () => {
-  const e = N(B);
+}, p = () => {
+  const e = C(z);
   if (!e)
     throw new Error("useSidebar must be used within a SidebarProvider");
   return e;
-}, F = ({ children: e, className: a, ...t }) => {
-  const { collapsed: o, isMobile: n } = g();
-  return /* @__PURE__ */ s.jsx(
+}, V = ({ children: e, className: a, ...t }) => {
+  const { collapsed: r, isMobile: s } = p();
+  return /* @__PURE__ */ o(
     "div",
     {
-      className: r(
+      className: n(
         "grid flex-1 content-start gap-y-1 overflow-y-auto p-4",
         {
-          "grid-cols-1 place-items-center": o && !n,
-          "grid-cols-[auto_1fr]": !o || n
+          "grid-cols-1 place-items-center": r && !s,
+          "grid-cols-[auto_1fr]": !r || s
         },
         '[&_[data-ox-slot="sidebar-link"]]:col-span-2 [&_[data-ox-slot="sidebar-link"]]:grid [&_[data-ox-slot="sidebar-link"]]:grid-cols-subgrid',
         '[&_[data-ox-slot="sidebar-button"]]:col-span-2 [&_[data-ox-slot="sidebar-button"]]:grid [&_[data-ox-slot="sidebar-button"]]:grid-cols-subgrid',
@@ -121,146 +122,146 @@ const Ne = ({
       children: e
     }
   );
-}, V = ({
+}, K = ({
   active: e = !1,
   children: a,
   className: t,
-  disabled: o = !1,
-  ...n
+  disabled: r = !1,
+  ...s
 }) => {
-  const { collapsed: i } = g();
-  return /* @__PURE__ */ s.jsx(
+  const { collapsed: i } = p();
+  return /* @__PURE__ */ o(
     "button",
     {
-      className: r(
+      className: n(
         "enabled:text-gray-1000 enabled:hover:text-gray-1200 enabled:cursor-pointer enabled:hover:bg-gray-300",
-        I,
+        _,
         {
-          [E]: i,
-          [_]: !i,
-          [L]: e && !o,
-          "disabled:ox-default-disabled": o
+          [L]: i,
+          [B]: !i,
+          [T]: e && !r,
+          "disabled:ox-default-disabled": r
         },
         t
       ),
       "data-ox-slot": "sidebar-button",
-      disabled: o,
+      disabled: r,
       type: "button",
-      ...n,
+      ...s,
       "data-ox-state": e ? "active" : "inactive",
       children: a
     }
   );
-}, K = ({ children: e, className: a, ...t }) => /* @__PURE__ */ s.jsx("div", { className: r("p-4", a), "data-ox-slot": "sidebar-footer", ...t, children: e }), q = ({
+}, q = ({ children: e, className: a, ...t }) => /* @__PURE__ */ o("div", { className: n("p-4", a), "data-ox-slot": "sidebar-footer", ...t, children: e }), J = ({
   children: e,
   className: a,
   headline: t,
-  ...o
+  ...r
 }) => {
-  const { collapsed: n, isMobile: i } = g();
-  return /* @__PURE__ */ s.jsxs("div", { className: r("contents", a), "data-ox-slot": "sidebar-group", ...o, children: [
-    /* @__PURE__ */ s.jsx(
+  const { collapsed: s, isMobile: i } = p();
+  return /* @__PURE__ */ m("div", { className: n("contents", a), "data-ox-slot": "sidebar-group", ...r, children: [
+    /* @__PURE__ */ o(
       "h3",
       {
-        className: r("text-gray-1000 col-span-full mb-2 mt-4 block cursor-default text-xs", {
-          invisible: n && !i
+        className: n("text-gray-1000 col-span-full mb-2 mt-4 block cursor-default text-xs", {
+          invisible: s && !i
         }),
         children: t
       }
     ),
     e
   ] });
-}, J = ({ children: e, className: a, ...t }) => /* @__PURE__ */ s.jsx(
+}, Q = ({ children: e, className: a, ...t }) => /* @__PURE__ */ o(
   "div",
   {
-    className: r("h-15 flex items-center px-4", a),
+    className: n("h-15 flex items-center px-4", a),
     "data-ox-slot": "sidebar-header",
     ...t,
     children: e
   }
-), Q = ({ className: e, size: a = 0.8, ...t }) => {
-  const { collapsed: o } = g();
-  return /* @__PURE__ */ s.jsx(
-    y,
+), U = ({ className: e, size: a = 0.8, ...t }) => {
+  const { collapsed: r } = p();
+  return /* @__PURE__ */ o(
+    O,
     {
-      className: r("shrink-0 text-current", { "mr-2": !o }, e),
+      className: n("shrink-0 text-current", { "mr-2": !r }, e),
       "data-ox-slot": "sidebar-icon",
       size: a,
       ...t
     }
   );
-}, U = ({ children: e, className: a, ...t }) => /* @__PURE__ */ s.jsx(
+}, X = ({ children: e, className: a, ...t }) => /* @__PURE__ */ o(
   "span",
   {
-    className: r("overflow-hidden text-ellipsis", a),
+    className: n("overflow-hidden text-ellipsis", a),
     "data-ox-slot": "sidebar-label",
     ...t,
     children: e
   }
-), X = ({
+), Z = ({
   active: e = !1,
   children: a,
   className: t,
-  disabled: o = !1,
-  href: n,
+  disabled: r = !1,
+  href: s,
   ...i
 }) => {
-  const { collapsed: l } = g();
-  return /* @__PURE__ */ s.jsx(
+  const { collapsed: l } = p();
+  return /* @__PURE__ */ o(
     "a",
     {
       "aria-current": e ? "page" : void 0,
-      className: r(
-        I,
+      className: n(
+        _,
         {
-          [E]: l,
-          [_]: !l,
-          [L]: e && !o,
-          "text-gray-1000 hover:text-gray-1200 cursor-pointer hover:bg-gray-300": !e && !o,
-          "ox-default-disabled": o
+          [L]: l,
+          [B]: !l,
+          [T]: e && !r,
+          "text-gray-1000 hover:text-gray-1200 cursor-pointer hover:bg-gray-300": !e && !r,
+          "ox-default-disabled": r
         },
         t
       ),
       "data-ox-slot": "sidebar-link",
-      href: o ? void 0 : n,
+      href: r ? void 0 : s,
       role: "link",
-      onClick: o ? (d) => d.preventDefault() : void 0,
+      onClick: r ? (d) => d.preventDefault() : void 0,
       ...i,
       "data-ox-state": e ? "active" : "inactive",
       children: a
     }
   );
-}, m = Y;
-m.Body = F;
-m.Button = V;
-m.Footer = K;
-m.Group = q;
-m.Header = J;
-m.Icon = Q;
-m.Label = U;
-m.Link = X;
-const Me = ({
+}, g = F;
+g.Body = V;
+g.Button = K;
+g.Footer = q;
+g.Group = J;
+g.Header = Q;
+g.Icon = U;
+g.Label = X;
+g.Link = Z;
+const Ie = ({
   children: e,
   className: a,
   color: t = "purple",
-  icon: o,
-  subtitle: n,
+  icon: r,
+  subtitle: s,
   title: i,
   ...l
 }) => {
-  const d = i || n || o, x = D[t];
-  return /* @__PURE__ */ s.jsxs(
+  const d = i || s || r, c = $[t];
+  return /* @__PURE__ */ m(
     "main",
     {
       "aria-labelledby": d ? "main-headline" : void 0,
-      className: r("w-full p-6", a),
+      className: n("w-full p-6", a),
       "data-ox-slot": "main-content",
       ...l,
       children: [
-        d ? /* @__PURE__ */ s.jsx("div", { className: "mb-8 border-b border-gray-400 pb-6", children: /* @__PURE__ */ s.jsxs("div", { className: "flex items-center gap-4", children: [
-          o ? /* @__PURE__ */ s.jsx("div", { className: r("rounded-lg border p-3", x.border, x.background), children: /* @__PURE__ */ s.jsx(y, { className: x.text, path: o, size: 1.41 }) }) : null,
-          /* @__PURE__ */ s.jsxs("div", { children: [
-            i ? /* @__PURE__ */ s.jsx(
+        d ? /* @__PURE__ */ o("div", { className: "mb-8 border-b border-gray-400 pb-6", children: /* @__PURE__ */ m("div", { className: "flex items-center gap-4", children: [
+          r ? /* @__PURE__ */ o("div", { className: n("rounded-lg border p-3", c.border, c.background), children: /* @__PURE__ */ o(O, { className: c.text, path: r, size: 1.41 }) }) : null,
+          /* @__PURE__ */ m("div", { children: [
+            i ? /* @__PURE__ */ o(
               "h2",
               {
                 id: "main-headline",
@@ -269,21 +270,21 @@ const Me = ({
                 children: i
               }
             ) : null,
-            n && /* @__PURE__ */ s.jsx("p", { className: "mt-1 text-sm", children: n })
+            s && /* @__PURE__ */ o("p", { className: "mt-1 text-sm", children: s })
           ] })
         ] }) }) : null,
         e
       ]
     }
   );
-}, Ce = ({ children: e, className: a, ...t }) => {
-  const { isMobile: o } = M();
-  return /* @__PURE__ */ s.jsx(
+}, Ee = ({ children: e, className: a, ...t }) => {
+  const { isMobile: r } = k();
+  return /* @__PURE__ */ o(
     "div",
     {
-      className: r(
+      className: n(
         "max-w-10xl mx-auto grid min-h-screen bg-transparent",
-        o ? "grid-cols-1" : "grid-cols-[auto_1fr]",
+        r ? "grid-cols-1" : "grid-cols-[auto_1fr]",
         a
       ),
       "data-ox-slot": "app-layout",
@@ -291,84 +292,84 @@ const Me = ({
       children: e
     }
   );
-}, Z = ({ children: e, className: a, ...t }) => /* @__PURE__ */ s.jsx(
+}, ee = ({ children: e, className: a, ...t }) => /* @__PURE__ */ o(
   "main",
   {
-    className: r("flex flex-col overflow-y-auto", a),
+    className: n("flex flex-col overflow-y-auto", a),
     "data-ox-slot": "main-content",
     ...t,
     children: e
   }
-), ee = ({ children: e, className: a, ...t }) => /* @__PURE__ */ s.jsx(
+), te = ({ children: e, className: a, ...t }) => /* @__PURE__ */ o(
   "div",
   {
-    className: r("flex-1 overflow-y-auto px-6 py-6", a),
+    className: n("flex-1 overflow-y-auto px-6 py-6", a),
     "data-ox-slot": "main-content-body",
     ...t,
     children: e
   }
-), te = ({
+), ae = ({
   children: e,
   className: a,
   ...t
-}) => /* @__PURE__ */ s.jsx(
+}) => /* @__PURE__ */ o(
   "div",
   {
-    className: r("flex-shrink-0 border-b border-gray-400 bg-gray-100 px-6 py-4", a),
+    className: n("flex-shrink-0 border-b border-gray-400 bg-gray-100 px-6 py-4", a),
     "data-ox-slot": "main-content-header",
     ...t,
     children: e
   }
-), ke = Object.assign(Z, {
-  Header: te,
-  Body: ee
-}), T = w(void 0);
-function M() {
-  const e = N(T);
+), _e = Object.assign(ee, {
+  Header: ae,
+  Body: te
+}), A = M(void 0);
+function k() {
+  const e = C(A);
   if (!e)
     throw new Error("useOxSidebar must be used within a SidebarProvider");
   return e;
 }
-const ae = 256, se = ({ children: e, className: a, ...t }) => {
-  const { isMobile: o, mobileOpen: n, toggleSidebar: i } = M();
-  return o ? /* @__PURE__ */ s.jsx(h, { open: n, onOpenChange: i, children: /* @__PURE__ */ s.jsx(h.Content, { closeOnOutsideClick: !0, side: "left", children: /* @__PURE__ */ s.jsx(
+const oe = 256, re = ({ children: e, className: a, ...t }) => {
+  const { isMobile: r, mobileOpen: s, toggleSidebar: i } = k();
+  return r ? /* @__PURE__ */ o(v, { open: s, onOpenChange: i, children: /* @__PURE__ */ o(v.Content, { closeOnOutsideClick: !0, side: "left", children: /* @__PURE__ */ o(
     "aside",
     {
-      className: r("bg-gray-150 flex h-full flex-col", a),
+      className: n("bg-gray-150 flex h-full flex-col", a),
       "data-ox-slot": "sidebar",
       ...t,
       children: e
     }
-  ) }) }) : /* @__PURE__ */ s.jsx(
+  ) }) }) : /* @__PURE__ */ o(
     "aside",
     {
-      className: r("bg-gray-150 sticky top-0 flex h-screen flex-col overflow-y-auto", a),
+      className: n("bg-gray-150 sticky top-0 flex h-screen flex-col overflow-y-auto", a),
       "data-ox-slot": "sidebar",
-      style: { width: ae },
+      style: { width: oe },
       ...t,
       children: e
     }
   );
-}, oe = ({ children: e, className: a, ...t }) => /* @__PURE__ */ s.jsx(
+}, ne = ({ children: e, className: a, ...t }) => /* @__PURE__ */ o(
   "div",
   {
-    className: r("flex-1 overflow-y-auto p-2", a),
+    className: n("flex-1 overflow-y-auto p-2", a),
     "data-ox-slot": "sidebar-content",
     ...t,
     children: e
   }
-), re = ({ children: e, className: a, ...t }) => /* @__PURE__ */ s.jsx(
+), se = ({ children: e, className: a, ...t }) => /* @__PURE__ */ o(
   "div",
   {
-    className: r("flex shrink-0 flex-col p-2", a),
+    className: n("flex shrink-0 flex-col p-2", a),
     "data-ox-slot": "sidebar-footer",
     ...t,
     children: e
   }
-), ne = ({ children: e, className: a, ...t }) => /* @__PURE__ */ s.jsx(
+), ie = ({ children: e, className: a, ...t }) => /* @__PURE__ */ o(
   "div",
   {
-    className: r(
+    className: n(
       "flex flex-wrap items-center gap-2",
       '[&_[data-ox-slot="sidebar-group-content"]]:w-full',
       a
@@ -377,14 +378,14 @@ const ae = 256, se = ({ children: e, className: a, ...t }) => {
     ...t,
     children: e
   }
-), ie = ({
+), le = ({
   children: e,
   className: a,
   ...t
-}) => /* @__PURE__ */ s.jsx(
+}) => /* @__PURE__ */ o(
   "button",
   {
-    className: r(
+    className: n(
       "mr-1.5 inline-flex size-6 shrink-0 items-center justify-center rounded-md",
       "enabled:hover:text-gray-1200 enabled:cursor-pointer enabled:text-gray-900 enabled:hover:bg-gray-300",
       "ox-gray-outset-focus disabled:ox-default-disabled",
@@ -395,46 +396,46 @@ const ae = 256, se = ({ children: e, className: a, ...t }) => {
     ...t,
     children: e
   }
-), le = ({
+), de = ({
   children: e,
   className: a,
   ...t
-}) => /* @__PURE__ */ s.jsx("div", { className: r(a), "data-ox-slot": "sidebar-group-content", ...t, children: e }), de = ({
+}) => /* @__PURE__ */ o("div", { className: n(a), "data-ox-slot": "sidebar-group-content", ...t, children: e }), ce = ({
   children: e,
   className: a,
   ...t
-}) => /* @__PURE__ */ s.jsx(
+}) => /* @__PURE__ */ o(
   "div",
   {
-    className: r("flex flex-1 items-center pl-2 text-xs font-medium text-gray-900", a),
+    className: n("flex flex-1 items-center pl-2 text-xs font-medium text-gray-900", a),
     "data-ox-slot": "sidebar-group-label",
     ...t,
     children: e
   }
-), xe = ({ children: e, className: a, ...t }) => /* @__PURE__ */ s.jsx(
+), ue = ({ children: e, className: a, ...t }) => /* @__PURE__ */ o(
   "div",
   {
-    className: r("flex shrink-0 flex-col p-2", a),
+    className: n("flex shrink-0 flex-col p-2", a),
     "data-ox-slot": "sidebar-header",
     ...t,
     children: e
   }
-), ce = ({ children: e, className: a, ...t }) => /* @__PURE__ */ s.jsx(
+), be = ({ children: e, className: a, ...t }) => /* @__PURE__ */ o(
   "ul",
   {
-    className: r("flex flex-col items-stretch gap-1", a),
+    className: n("flex flex-col items-stretch gap-1", a),
     "data-ox-slot": "sidebar-menu",
     ...t,
     children: e
   }
-), ue = ({
+), xe = ({
   children: e,
   className: a,
   ...t
-}) => /* @__PURE__ */ s.jsx(
+}) => /* @__PURE__ */ o(
   "button",
   {
-    className: r(
+    className: n(
       "inline-flex size-9 shrink-0 items-center justify-center rounded-lg border border-transparent",
       "enabled:text-gray-1200 enabled:cursor-pointer enabled:bg-transparent enabled:hover:bg-gray-300",
       "ox-gray-outset-focus disabled:ox-default-disabled",
@@ -445,71 +446,71 @@ const ae = 256, se = ({ children: e, className: a, ...t }) => {
     ...t,
     children: e
   }
-), be = ({ children: e, className: a }) => /* @__PURE__ */ s.jsx($, { className: r("ml-auto", a), "data-ox-slot": "sidebar-menu-badge", size: "sm", children: e }), z = w(void 0), A = () => {
-  const e = N(z);
+), me = ({ children: e, className: a }) => /* @__PURE__ */ o(G, { className: n("ml-auto", a), "data-ox-slot": "sidebar-menu-badge", size: "sm", children: e }), H = M(void 0), D = () => {
+  const e = C(H);
   if (!e)
     throw new Error("useMenuItemContext must be used within MenuItemProvider");
   return e;
-}, H = ({ className: e, path: a, placeholder: t }) => /* @__PURE__ */ s.jsx(
-  y,
+}, j = ({ className: e, path: a, placeholder: t }) => /* @__PURE__ */ o(
+  O,
   {
-    className: r("shrink-0", e),
+    className: n("shrink-0", e),
     "data-ox-slot": "sidebar-menu-icon",
     path: a,
     placeholder: t,
     size: 0.8
   }
-), me = ({
+), ge = ({
   children: e,
   className: a,
   disabled: t = !1,
-  href: o,
-  onClick: n,
+  href: r,
+  onClick: s,
   ...i
 }) => {
-  const { hasSub: l, isOpen: d, toggleOpen: x } = A(), b = r(
+  const { hasSub: l, isOpen: d, toggleOpen: c } = D(), x = n(
     "flex h-9 flex-1 items-center gap-2 rounded-lg border border-transparent bg-transparent px-2 text-left text-sm",
     "ox-gray-outset-focus",
     a
   );
-  if (o)
-    return /* @__PURE__ */ s.jsx(
+  if (r)
+    return /* @__PURE__ */ o(
       "a",
       {
         "aria-disabled": t ? "true" : void 0,
-        className: r(b, {
+        className: n(x, {
           "text-gray-1200 cursor-pointer hover:bg-gray-300": !t,
           "ox-default-disabled": t
         }),
         "data-ox-slot": "sidebar-menu-button",
-        href: t ? void 0 : o,
-        onClick: t ? (c) => c.preventDefault() : void 0,
+        href: t ? void 0 : r,
+        onClick: t ? (u) => u.preventDefault() : void 0,
         ...i,
         children: e
       }
     );
-  const O = (c) => {
-    l && x(), n && n(c);
+  const S = (u) => {
+    l && c(), s && s(u);
   };
-  return /* @__PURE__ */ s.jsxs(
+  return /* @__PURE__ */ m(
     "button",
     {
-      className: r(
-        b,
+      className: n(
+        x,
         "enabled:text-gray-1200 enabled:cursor-pointer enabled:hover:bg-gray-300",
         "disabled:ox-default-disabled"
       ),
       "data-ox-slot": "sidebar-menu-button",
       disabled: t,
       type: "button",
-      onClick: O,
+      onClick: S,
       ...i,
       children: [
         e,
-        l ? /* @__PURE__ */ s.jsx(
-          H,
+        l ? /* @__PURE__ */ o(
+          j,
           {
-            className: r("ml-auto transition-transform duration-200", { "rotate-180": d }),
+            className: n("ml-auto transition-transform duration-200", { "rotate-180": d }),
             path: "mdiChevronDown"
           }
         ) : null
@@ -517,40 +518,40 @@ const ae = 256, se = ({ children: e, className: a, ...t }) => {
     }
   );
 };
-function ge({
+function pe({
   children: e,
   defaultOpen: a = !1,
   hasSub: t = !1
 }) {
-  const [o, n] = v(a), i = () => n((l) => !l);
-  return /* @__PURE__ */ s.jsx(z.Provider, { value: { hasSub: t, isOpen: o, setIsOpen: n, toggleOpen: i }, children: e });
+  const [r, s] = y(a), i = () => s((l) => !l);
+  return /* @__PURE__ */ o(H.Provider, { value: { hasSub: t, isOpen: r, setIsOpen: s, toggleOpen: i }, children: e });
 }
-const pe = ({
+const fe = ({
   children: e,
   className: a,
   defaultOpen: t = !1,
-  hasSub: o = !1,
-  ...n
-}) => /* @__PURE__ */ s.jsx(ge, { defaultOpen: t, hasSub: o, children: /* @__PURE__ */ s.jsx(
+  hasSub: r = !1,
+  ...s
+}) => /* @__PURE__ */ o(pe, { defaultOpen: t, hasSub: r, children: /* @__PURE__ */ o(
   "li",
   {
-    className: r("group flex flex-wrap items-center gap-x-2", a),
+    className: n("group flex flex-wrap items-center gap-x-2", a),
     "data-ox-slot": "sidebar-menu-item",
-    ...n,
+    ...s,
     children: e
   }
-) }), fe = ({ className: e }) => /* @__PURE__ */ s.jsx(G, { className: e, "data-ox-slot": "sidebar-menu-skeleton", fullWidth: !0, height: 36 }), he = ({ children: e, className: a, ...t }) => {
-  const { isOpen: o } = A();
-  return /* @__PURE__ */ s.jsx(
+) }), he = ({ className: e }) => /* @__PURE__ */ o(P, { className: e, "data-ox-slot": "sidebar-menu-skeleton", fullWidth: !0, height: 36 }), ve = ({ children: e, className: a, ...t }) => {
+  const { isOpen: r } = D();
+  return /* @__PURE__ */ o(
     "div",
     {
       className: "ox-sidebar-submenu w-content grid w-full",
       "data-ox-slot": "sidebar-menu-sub-wrapper",
-      "data-ox-state": o ? "open" : "closed",
-      children: /* @__PURE__ */ s.jsx(
+      "data-ox-state": r ? "open" : "closed",
+      children: /* @__PURE__ */ o(
         "ul",
         {
-          className: r(
+          className: n(
             "ml-4.5 flex flex-col gap-1 border-l border-gray-400 py-0.5 pl-2.5",
             a
           ),
@@ -561,57 +562,57 @@ const pe = ({
       )
     }
   );
-}, ve = ({
+}, ye = ({
   children: e,
   className: a,
   href: t,
-  ...o
+  ...r
 }) => {
-  const n = r(
+  const s = n(
     "text-gray-1200 flex h-8 flex-1 cursor-pointer items-center gap-2 rounded-lg border border-transparent bg-transparent px-2 text-left text-sm hover:bg-gray-300",
     "ox-gray-outset-focus",
     a
   );
-  return t ? /* @__PURE__ */ s.jsx(
+  return t ? /* @__PURE__ */ o(
     "a",
     {
-      className: n,
+      className: s,
       "data-ox-slot": "sidebar-menu-sub-button",
       href: t,
-      ...o,
+      ...r,
       children: e
     }
-  ) : /* @__PURE__ */ s.jsx(
+  ) : /* @__PURE__ */ o(
     "button",
     {
-      className: n,
+      className: s,
       "data-ox-slot": "sidebar-menu-sub-button",
       type: "button",
-      ...o,
+      ...r,
       children: e
     }
   );
-}, ye = ({
+}, Oe = ({
   children: e,
   className: a,
   ...t
-}) => /* @__PURE__ */ s.jsx(
+}) => /* @__PURE__ */ o(
   "li",
   {
-    className: r("flex items-center gap-2", a),
+    className: n("flex items-center gap-2", a),
     "data-ox-slot": "sidebar-menu-sub-item",
     ...t,
     children: e
   }
-), Oe = ({ className: e, ...a }) => /* @__PURE__ */ s.jsx(P, { className: e, "data-ox-slot": "sidebar-separator", ...a }), Se = ({ className: e, onClick: a }) => {
-  const { isMobile: t, toggleSidebar: o } = M(), n = () => {
-    t ? o() : a && a();
+), Se = ({ className: e, ...a }) => /* @__PURE__ */ o(R, { className: e, "data-ox-slot": "sidebar-separator", ...a }), we = ({ className: e, onClick: a }) => {
+  const { isMobile: t, toggleSidebar: r } = k(), s = () => {
+    t ? r() : a && a();
   }, i = t || a;
-  return /* @__PURE__ */ s.jsx(
+  return /* @__PURE__ */ o(
     "button",
     {
       "aria-label": "Toggle sidebar",
-      className: r(
+      className: n(
         "inline-flex size-8 items-center justify-center rounded-lg",
         "text-gray-1200 border border-transparent bg-transparent",
         {
@@ -622,32 +623,32 @@ const pe = ({
       "data-ox-slot": "sidebar-trigger",
       disabled: !i,
       type: "button",
-      onClick: n,
-      children: /* @__PURE__ */ s.jsx(y, { path: "mdiDockLeft", size: 0.8 })
+      onClick: s,
+      children: /* @__PURE__ */ o(O, { path: "mdiDockLeft", size: 0.8 })
     }
   );
 };
-function Ie({ children: e }) {
-  const [a, t] = v(!1), [o, n] = v(!1);
-  k(() => {
-    const x = () => {
-      n(window.innerWidth < j);
+function Le({ children: e }) {
+  const [a, t] = y(!1), [r, s] = y(!1);
+  E(() => {
+    const c = () => {
+      s(window.innerWidth < N);
     };
-    return x(), window.addEventListener("resize", x), () => window.removeEventListener("resize", x);
+    return c(), window.addEventListener("resize", c), () => window.removeEventListener("resize", c);
   }, []);
-  const i = S(() => {
+  const i = w(() => {
     t(!0);
-  }, []), l = S(() => {
+  }, []), l = w(() => {
     t(!1);
-  }, []), d = S(() => {
-    t((x) => !x);
+  }, []), d = w(() => {
+    t((c) => !c);
   }, []);
-  return /* @__PURE__ */ s.jsx(
-    T.Provider,
+  return /* @__PURE__ */ o(
+    A.Provider,
     {
       value: {
         closeSidebar: l,
-        isMobile: o,
+        isMobile: r,
         mobileOpen: a,
         openSidebar: i,
         toggleSidebar: d
@@ -656,33 +657,33 @@ function Ie({ children: e }) {
     }
   );
 }
-const p = se, u = ce, C = ne;
-p.Header = xe;
-p.Content = oe;
-p.Footer = re;
-p.Separator = Oe;
-p.Trigger = Se;
-u.Item = pe;
-u.Button = me;
-u.Icon = H;
-u.Badge = be;
-u.Action = ue;
-u.Skeleton = fe;
-u.Sub = he;
-u.SubItem = ye;
-u.SubButton = ve;
-C.Label = de;
-C.Action = ie;
-C.Content = le;
+const f = re, b = be, I = ie;
+f.Header = ue;
+f.Content = ne;
+f.Footer = se;
+f.Separator = Se;
+f.Trigger = we;
+b.Item = fe;
+b.Button = ge;
+b.Icon = j;
+b.Badge = me;
+b.Action = xe;
+b.Skeleton = he;
+b.Sub = ve;
+b.SubItem = Oe;
+b.SubButton = ye;
+I.Label = ce;
+I.Action = le;
+I.Content = de;
 export {
-  Ce as OxAppLayout,
-  Ne as OxLegacyHeader,
-  Me as OxLegacyMainContent,
-  m as OxLegacySidebar,
-  ke as OxMainContent,
-  p as OxSidebar,
-  C as OxSidebarGroup,
-  u as OxSidebarMenu,
-  Ie as OxSidebarProvider,
-  M as useOxSidebar
+  Ee as OxAppLayout,
+  ke as OxLegacyHeader,
+  Ie as OxLegacyMainContent,
+  g as OxLegacySidebar,
+  _e as OxMainContent,
+  f as OxSidebar,
+  I as OxSidebarGroup,
+  b as OxSidebarMenu,
+  Le as OxSidebarProvider,
+  k as useOxSidebar
 };