@noxickon/onyx 1.0.4 → 1.1.0

package/dist/layouts/layouts.es.js

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