@noxickon/onyx 2.0.3 → 3.0.0

package/dist/layouts/layouts.es.js

@@ -1,765 +1,503 @@
-import { a0 as p, e as M, a4 as Q, a5 as B, i as I, a6 as U, m as L, a7 as X, c as Z, a8 as ee, w as te, v as le, a9 as se } from "../chunks/ui-DaFpw1V6.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 qe = (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: Q }) }) : 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", oe = "h-15", F = z(void 0), ae = (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 $(), window.addEventListener("resize", $), () => {
-      window.removeEventListener("resize", $);
-    };
-  }, 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", oe), children: /* @__PURE__ */ b(M, { "aria-label": "Close sidebar", size: "md", variant: "ghost", onClick: o, children: /* @__PURE__ */ b(M.Icon, { path: U }) }) }) : 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 n;
-}, ne = (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;
-}, re = (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;
-}, ie = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+import { af as x, n as M, r as j, I as E, e as L, H as T, ai as z, ag as A } from "../chunks/ui-DrKTwQ0M.js";
+import { jsx as f, jsxs as D } from "react/jsx-runtime";
+import { d as b } from "../chunks/hooks-6tQOArBm.js";
+import { createContext as P, useContext as w, useState as $, useEffect as H } from "react";
+import { ChevronDown as G, PanelLeft as R } from "lucide-react";
+const $e = (r) => {
+  const e = b.c(11);
+  let t, s, l;
+  e[0] !== r ? ({
     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;
-}, ce = (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;
-}, de = (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;
-}, fe = (n) => {
-  const e = g.c(11);
-  let t, l, s;
-  e[0] !== n ? ({
-    className: t,
-    size: s,
+    className: 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;
-}, 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("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;
-}, be = (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 ? me : 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 me(n) {
-  return n.preventDefault();
-}
-const w = ae;
-w.Body = ne;
-w.Button = re;
-w.Footer = ie;
-w.Group = ce;
-w.Header = de;
-w.Icon = fe;
-w.Label = ue;
-w.Link = be;
-const Je = (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 = X[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;
-}, Qe = (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]);
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = e[3]);
   const {
     isMobile: o
-  } = H(), a = o ? "grid-cols-1" : "grid-cols-[auto_1fr]";
+  } = C(), n = o ? "grid-cols-1" : "grid-cols-[auto_1fr]";
+  let a;
+  e[4] !== s || e[5] !== n ? (a = x("mx-auto grid min-h-screen max-w-16xl bg-transparent", n, s), e[4] = s, e[5] = n, e[6] = a) : a = e[6];
   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;
-}, xe = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  return e[7] !== t || e[8] !== l || e[9] !== a ? (i = /* @__PURE__ */ f("div", { className: a, ...l, "data-ox-slot": "app-layout", children: t }), e[7] = t, e[8] = l, e[9] = a, e[10] = i) : i = e[10], i;
+}, F = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, pe = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  e[4] !== s ? (o = x("flex flex-col overflow-y-auto", s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("main", { className: o, ...l, "data-ox-slot": "main-content", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, W = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, he = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  e[4] !== s ? (o = x("flex-1 overflow-y-auto p-6", s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("div", { className: o, ...l, "data-ox-slot": "main-content-body", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, K = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, Ue = Object.assign(xe, {
-  Header: he,
-  Body: pe
-}), V = z(void 0);
-function H() {
-  const n = T(V);
-  if (!n)
+  e[4] !== s ? (o = x("shrink-0 px-6 py-4", s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("div", { className: o, ...l, "data-ox-slot": "main-content-header", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, Ce = Object.assign(F, {
+  Header: K,
+  Body: W
+}), k = P(void 0);
+function C() {
+  const r = w(k);
+  if (!r)
     throw new Error("useOxSidebar must be used within a SidebarProvider");
-  return n;
+  return r;
 }
-const ge = 256, ve = (n) => {
-  const e = g.c(21);
-  let t, l, s;
-  e[0] !== n ? ({
+const q = 256, J = (r) => {
+  const e = b.c(21);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = e[3]);
   const {
     isMobile: o,
-    mobileOpen: a,
-    toggleSidebar: i
-  } = H();
+    mobileOpen: n,
+    toggleSidebar: a
+  } = C();
   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 d;
+    e[4] !== s ? (d = x("flex h-full flex-col bg-sidebar", s), e[4] = s, e[5] = d) : d = e[5];
     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;
+    e[6] !== t || e[7] !== l || e[8] !== d ? (m = /* @__PURE__ */ f(M.Content, { closeOnOutsideClick: !0, side: "left", children: /* @__PURE__ */ f("aside", { className: d, ...l, "data-ox-slot": "sidebar", children: t }) }), e[6] = t, e[7] = l, e[8] = d, e[9] = m) : m = e[9];
+    let p;
+    return e[10] !== n || e[11] !== m || e[12] !== a ? (p = /* @__PURE__ */ f(M, { open: n, onOpenChange: a, children: m }), e[10] = n, e[11] = m, e[12] = a, e[13] = p) : p = e[13], p;
   }
-  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 i;
+  e[14] !== s ? (i = x("sticky top-0 flex h-screen flex-col overflow-y-auto border-r border-sidebar-border bg-sidebar", s), e[14] = s, e[15] = i) : i = e[15];
   let c;
   e[16] === Symbol.for("react.memo_cache_sentinel") ? (c = {
-    width: ge
+    width: q
   }, 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;
-}, 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("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;
-}, ye = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  let u;
+  return e[17] !== t || e[18] !== l || e[19] !== i ? (u = /* @__PURE__ */ f("aside", { className: i, style: c, ...l, "data-ox-slot": "sidebar", children: t }), e[17] = t, e[18] = l, e[19] = i, e[20] = u) : u = e[20], u;
+}, Q = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, Ne = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  e[4] !== s ? (o = x("flex-1 overflow-y-auto p-2", s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("div", { className: o, ...l, "data-ox-slot": "sidebar-content", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, U = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, Oe = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  e[4] !== s ? (o = x("flex shrink-0 flex-col p-2", s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("div", { className: o, ...l, "data-ox-slot": "sidebar-footer", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, V = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, Ce = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  e[4] !== s ? (o = x("flex flex-wrap items-center gap-2", '**:data-[ox-slot="sidebar-group-content"]:w-full', s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("div", { className: o, ...l, "data-ox-slot": "sidebar-group", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, X = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, we = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  e[4] !== s ? (o = x("mr-1.5 inline-flex size-6 shrink-0 items-center justify-center rounded-md", "enabled:cursor-pointer enabled:text-muted-foreground enabled:hover:bg-sidebar-accent enabled:hover:text-sidebar-foreground", "ox-focus-ring disabled:ox-default-disabled", s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("button", { className: o, type: "button", ...l, "data-ox-slot": "sidebar-group-action", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, Y = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, $e = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  e[4] !== s ? (o = x(s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("div", { className: o, ...l, "data-ox-slot": "sidebar-group-content", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, Z = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, ke = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  e[4] !== s ? (o = x("flex flex-1 items-center pl-2 text-xs font-medium text-muted-foreground", s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("div", { className: o, ...l, "data-ox-slot": "sidebar-group-label", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, ee = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, _e = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  e[4] !== s ? (o = x("flex shrink-0 flex-col p-2", s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("div", { className: o, ...l, "data-ox-slot": "sidebar-header", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, te = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, Pe = (n) => {
-  const e = g.c(5), {
+  e[4] !== s ? (o = x("flex flex-col items-stretch gap-1", s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("ul", { className: o, ...l, "data-ox-slot": "sidebar-menu", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, se = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     children: t,
-    className: l
-  } = n;
-  let s;
-  e[0] !== l ? (s = p("ml-auto", l), e[0] = l, e[1] = s) : s = e[1];
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = e[3]);
   let o;
-  return e[2] !== t || e[3] !== s ? (o = /* @__PURE__ */ b(Z, { 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)
+  e[4] !== s ? (o = x("inline-flex size-9 shrink-0 items-center justify-center rounded-lg border border-transparent", "enabled:cursor-pointer enabled:bg-transparent enabled:text-sidebar-foreground enabled:hover:bg-sidebar-accent", "ox-focus-ring disabled:ox-default-disabled", s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("button", { className: o, type: "button", ...l, "data-ox-slot": "sidebar-menu-action", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, I = P(void 0), y = () => {
+  const r = w(I);
+  if (!r)
     throw new Error("useMenuItemContext must be used within MenuItemProvider");
-  return n;
-}, q = (n) => {
-  const e = g.c(6), {
+  return r;
+}, _ = (r) => {
+  const e = b.c(7), {
     className: t,
+    icon: s,
     path: l,
-    placeholder: s
-  } = n;
-  let o;
-  e[0] !== t ? (o = p("shrink-0", t), e[0] = t, e[1] = o) : o = e[1];
+    placeholder: o
+  } = r;
+  let n;
+  e[0] !== t ? (n = x("shrink-0", t), e[0] = t, e[1] = n) : n = 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;
-}, Me = (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", Ie = (n) => {
-  const e = g.c(23);
-  let t, l, s, o, a, i;
-  e[0] !== n ? ({
+  return e[2] !== s || e[3] !== l || e[4] !== o || e[5] !== n ? (a = /* @__PURE__ */ f(j, { className: n, icon: s, path: l, placeholder: o, size: "md" }), e[2] = s, e[3] = l, e[4] = o, e[5] = n, e[6] = a) : a = e[6], a;
+}, le = (r) => "href" in r, B = "flex h-9 flex-1 items-center gap-2 rounded-lg border border-transparent bg-transparent px-2 text-left text-sm ox-focus-ring", oe = (r) => {
+  const e = b.c(23);
+  let t, s, l, o, n, a;
+  e[0] !== r ? ({
     children: t,
-    className: l,
-    disabled: i,
-    href: s,
+    className: s,
+    disabled: a,
+    href: l,
     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, {
+    ...n
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l, e[4] = o, e[5] = n, e[6] = a) : (t = e[1], s = e[2], l = e[3], o = e[4], n = e[5], a = e[6]);
+  const i = a === void 0 ? !1 : a, {
     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();
+    toggleOpen: u
+  } = y(), d = !i;
+  let m;
+  e[7] !== s || e[8] !== i || e[9] !== d ? (m = x(B, {
+    "cursor-pointer text-sidebar-foreground hover:bg-sidebar-accent": d,
+    "ox-default-disabled": i
+  }, s), e[7] = s, e[8] = i, e[9] = d, e[10] = m) : m = e[10];
+  const p = m;
+  let S;
+  e[11] !== i || e[12] !== c || e[13] !== o || e[14] !== u ? (S = (v) => {
+    if (i) {
+      v.preventDefault();
       return;
     }
     if (c) {
-      N.preventDefault(), d();
+      v.preventDefault(), u();
       return;
     }
-    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;
-}, Ee = (n) => {
-  const e = g.c(24);
-  let t, l, s, o, a, i;
-  e[0] !== n ? ({
+    o?.(v);
+  }, e[11] = i, e[12] = c, e[13] = o, e[14] = u, e[15] = S) : S = e[15];
+  const h = S, O = i ? "true" : void 0, g = i ? void 0 : l;
+  let N;
+  return e[16] !== t || e[17] !== h || e[18] !== p || e[19] !== n || e[20] !== O || e[21] !== g ? (N = /* @__PURE__ */ f("a", { "aria-disabled": O, className: p, href: g, onClick: h, ...n, "data-ox-slot": "sidebar-menu-button", children: t }), e[16] = t, e[17] = h, e[18] = p, e[19] = n, e[20] = O, e[21] = g, e[22] = N) : N = e[22], N;
+}, ne = (r) => {
+  const e = b.c(24);
+  let t, s, l, o, n, a;
+  e[0] !== r ? ({
     children: t,
-    className: l,
-    disabled: a,
-    onClick: s,
-    type: i,
+    className: s,
+    disabled: n,
+    onClick: l,
+    type: a,
     ...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;
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l, e[4] = o, e[5] = n, e[6] = a) : (t = e[1], s = e[2], l = e[3], o = e[4], n = e[5], a = e[6]);
+  const i = n === void 0 ? !1 : n, c = a === void 0 ? "button" : a, {
+    hasSub: u,
+    isOpen: d,
+    toggleOpen: m
+  } = y();
+  let p;
+  e[7] !== s ? (p = x(B, "enabled:cursor-pointer enabled:text-sidebar-foreground enabled:hover:bg-sidebar-accent", "disabled:ox-default-disabled", s), e[7] = s, e[8] = p) : p = e[8];
+  const S = p;
   let h;
-  e[9] !== d || e[10] !== s || e[11] !== u ? (h = (N) => {
-    if (d) {
-      u();
+  e[9] !== u || e[10] !== l || e[11] !== m ? (h = (v) => {
+    if (u) {
+      m();
       return;
     }
-    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: ee }) : 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: [
+    l?.(v);
+  }, e[9] = u, e[10] = l, e[11] = m, e[12] = h) : h = e[12];
+  const O = h;
+  let g;
+  e[13] !== u || e[14] !== d ? (g = u ? /* @__PURE__ */ f(_, { className: x("ml-auto transition-transform duration-200", {
+    "rotate-180": d
+  }), icon: G }) : null, e[13] = u, e[14] = d, e[15] = g) : g = e[15];
+  let N;
+  return e[16] !== S || e[17] !== t || e[18] !== i || e[19] !== O || e[20] !== o || e[21] !== g || e[22] !== c ? (N = /* @__PURE__ */ D("button", { className: S, disabled: i, type: c, onClick: O, ...o, "data-ox-slot": "sidebar-menu-button", 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;
-}, Le = (n) => {
-  const e = g.c(2);
+    g
+  ] }), e[16] = S, e[17] = t, e[18] = i, e[19] = O, e[20] = o, e[21] = g, e[22] = c, e[23] = N) : N = e[23], N;
+}, re = (r) => {
+  const e = b.c(2);
   let t;
-  return e[0] !== n ? (t = Me(n) ? /* @__PURE__ */ b(Ie, { ...n }) : /* @__PURE__ */ b(Ee, { ...n }), e[0] = n, e[1] = t) : t = e[1], t;
+  return e[0] !== r ? (t = le(r) ? /* @__PURE__ */ f(oe, { ...r }) : /* @__PURE__ */ f(ne, { ...r }), e[0] = r, e[1] = t) : t = e[1], t;
 };
-function Be(n) {
-  const e = g.c(7), {
+function ae(r) {
+  const e = b.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);
+    defaultOpen: s,
+    hasSub: l
+  } = r, o = s === void 0 ? !1 : s, n = l === void 0 ? !1 : l, [a, i] = $(o);
   let c;
-  e[0] === Symbol.for("react.memo_cache_sentinel") ? (c = () => r(ze), 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;
+  e[0] === Symbol.for("react.memo_cache_sentinel") ? (c = () => i(ie), e[0] = c) : c = e[0];
+  const u = c;
+  let d;
+  e[1] !== n || e[2] !== a ? (d = {
+    hasSub: n,
+    isOpen: a,
+    setIsOpen: i,
+    toggleOpen: u
+  }, e[1] = n, e[2] = a, e[3] = d) : d = e[3];
+  let m;
+  return e[4] !== t || e[5] !== d ? (m = /* @__PURE__ */ f(I.Provider, { value: d, children: t }), e[4] = t, e[5] = d, e[6] = m) : m = e[6], m;
 }
-function ze(n) {
-  return !n;
+function ie(r) {
+  return !r;
 }
-const Te = (n) => {
-  const e = g.c(16);
-  let t, l, s, o, a;
-  e[0] !== n ? ({
+const ce = (r) => {
+  const e = b.c(16);
+  let t, s, l, o, n;
+  e[0] !== r ? ({
     children: t,
-    className: l,
+    className: s,
     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;
+    hasSub: n,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l, e[4] = o, e[5] = n) : (t = e[1], s = e[2], l = e[3], o = e[4], n = e[5]);
+  const a = o === void 0 ? !1 : o, i = n === void 0 ? !1 : n;
   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];
+  e[6] !== s ? (c = x("group flex flex-wrap items-center gap-x-2", s), e[6] = s, e[7] = c) : c = e[7];
+  let u;
+  e[8] !== t || e[9] !== l || e[10] !== c ? (u = /* @__PURE__ */ f("li", { className: c, ...l, "data-ox-slot": "sidebar-menu-item", children: t }), e[8] = t, e[9] = l, e[10] = c, e[11] = u) : u = e[11];
   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(Be, { defaultOpen: i, hasSub: r, children: d }), e[12] = i, e[13] = r, e[14] = d, e[15] = f) : f = e[15], f;
-}, He = (n) => {
-  const e = g.c(2), {
+  return e[12] !== a || e[13] !== i || e[14] !== u ? (d = /* @__PURE__ */ f(ae, { defaultOpen: a, hasSub: i, children: u }), e[12] = a, e[13] = i, e[14] = u, e[15] = d) : d = e[15], d;
+}, de = (r) => {
+  const e = b.c(4), {
     className: t
-  } = n;
+  } = r;
+  let s;
+  e[0] !== t ? (s = x("h-9 w-full", t), e[0] = t, e[1] = s) : s = e[1];
   let l;
-  return e[0] !== t ? (l = /* @__PURE__ */ b(te, { className: t, "data-ox-slot": "sidebar-menu-skeleton", fullWidth: !0, height: 36 }), e[0] = t, e[1] = l) : l = e[1], l;
-}, Ae = (n) => {
-  const e = g.c(13);
-  let t, l, s;
-  e[0] !== n ? ({
+  return e[2] !== s ? (l = /* @__PURE__ */ f(E, { className: s }), e[2] = s, e[3] = l) : l = e[3], l;
+}, fe = (r) => {
+  const e = b.c(13);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = e[3]);
   const {
     isOpen: o
-  } = A(), a = o ? "open" : "closed";
+  } = y(), n = o ? "open" : "closed";
+  let a;
+  e[4] !== s ? (a = x("border-onyx-700 ml-4.5 flex flex-col gap-1 border-l py-0.5 pl-2.5", s), e[4] = s, e[5] = a) : a = e[5];
   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];
+  e[6] !== t || e[7] !== l || e[8] !== a ? (i = /* @__PURE__ */ f("ul", { className: a, ...l, "data-ox-slot": "sidebar-menu-sub", children: t }), e[6] = t, e[7] = l, e[8] = a, e[9] = i) : i = 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;
-}, De = (n) => {
-  const e = g.c(16);
-  let t, l, s, o;
-  e[0] !== n ? ({
+  return e[10] !== n || e[11] !== i ? (c = /* @__PURE__ */ f("div", { className: "ox-sidebar-submenu w-content grid w-full", "data-ox-slot": "sidebar-menu-sub-wrapper", "data-ox-state": n, children: i }), e[10] = n, e[11] = i, e[12] = c) : c = e[12], c;
+}, ue = (r) => {
+  const e = b.c(16);
+  let t, s, l, o;
+  e[0] !== r ? ({
     children: t,
-    className: l,
+    className: s,
     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;
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l, e[4] = o) : (t = e[1], s = e[2], l = e[3], o = e[4]);
+  let n;
+  e[5] !== s ? (n = x(["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-sidebar-foreground", "hover:bg-sidebar-accent"], "ox-focus-ring", s), e[5] = s, e[6] = n) : n = e[6];
+  const a = n;
   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;
+    const c = l;
+    let u;
+    return e[7] !== a || e[8] !== t || e[9] !== o || e[10] !== c ? (u = /* @__PURE__ */ f("a", { className: a, href: o, ...c, "data-ox-slot": "sidebar-menu-sub-button", children: t }), e[7] = a, e[8] = t, e[9] = o, e[10] = c, e[11] = u) : u = e[11], u;
   }
-  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;
-}, je = (n) => {
-  const e = g.c(10);
-  let t, l, s;
-  e[0] !== n ? ({
+  let i;
+  return e[12] !== a || e[13] !== t || e[14] !== l ? (i = /* @__PURE__ */ f("button", { className: a, type: "button", ...l, "data-ox-slot": "sidebar-menu-sub-button", children: t }), e[12] = a, e[13] = t, e[14] = l, e[15] = i) : i = e[15], i;
+}, be = (r) => {
+  const e = b.c(10);
+  let t, s, l;
+  e[0] !== r ? ({
     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]);
+    className: s,
+    ...l
+  } = r, e[0] = r, e[1] = t, e[2] = s, e[3] = l) : (t = e[1], s = e[2], l = 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;
-}, Ge = (n) => {
-  const e = g.c(6);
-  let t, l;
-  e[0] !== n ? ({
+  e[4] !== s ? (o = x("flex items-center gap-2", s), e[4] = s, e[5] = o) : o = e[5];
+  let n;
+  return e[6] !== t || e[7] !== l || e[8] !== o ? (n = /* @__PURE__ */ f("li", { className: o, ...l, "data-ox-slot": "sidebar-menu-sub-item", children: t }), e[6] = t, e[7] = l, e[8] = o, e[9] = n) : n = e[9], n;
+}, me = (r) => {
+  const e = b.c(5), {
+    children: t,
+    className: s
+  } = r;
+  let l;
+  e[0] !== s ? (l = x("ml-auto", s), e[0] = s, e[1] = l) : l = e[1];
+  let o;
+  return e[2] !== t || e[3] !== l ? (o = /* @__PURE__ */ f(L, { className: l, children: t }), e[2] = t, e[3] = l, e[4] = o) : o = e[4], o;
+}, xe = (r) => {
+  const e = b.c(6);
+  let t, s;
+  e[0] !== r ? ({
     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(le, { className: t, "data-ox-slot": "sidebar-separator", ...l }), e[3] = t, e[4] = l, e[5] = s) : s = e[5], s;
-}, Re = (n) => {
-  const e = g.c(12), {
+    ...s
+  } = r, e[0] = r, e[1] = t, e[2] = s) : (t = e[1], s = e[2]);
+  let l;
+  return e[3] !== t || e[4] !== s ? (l = /* @__PURE__ */ f(T, { className: t, ...s }), e[3] = t, e[4] = s, e[5] = l) : l = e[5], l;
+}, pe = (r) => {
+  const e = b.c(12), {
     className: t,
-    onClick: l
-  } = n, {
-    isMobile: s,
+    onClick: s
+  } = r, {
+    isMobile: l,
     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;
+  } = C();
+  let n;
+  e[0] !== l || e[1] !== s || e[2] !== o ? (n = () => {
+    l ? o() : s && s();
+  }, e[0] = l, e[1] = s, e[2] = o, e[3] = n) : n = e[3];
+  const a = n, i = l || s;
   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: se, 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;
+  e[4] !== t || e[5] !== i ? (c = x("inline-flex size-8 items-center justify-center rounded-lg", "border border-transparent bg-transparent text-sidebar-foreground", {
+    "ox-focus-ring cursor-pointer hover:bg-sidebar-accent": i
+  }, t), e[4] = t, e[5] = i, e[6] = c) : c = e[6];
+  const u = !i;
+  let d;
+  e[7] === Symbol.for("react.memo_cache_sentinel") ? (d = /* @__PURE__ */ f(z, { icon: R, size: "md" }), e[7] = d) : d = e[7];
+  let m;
+  return e[8] !== a || e[9] !== c || e[10] !== u ? (m = /* @__PURE__ */ f("button", { "aria-label": "Toggle sidebar", className: c, "data-ox-slot": "sidebar-trigger", disabled: u, type: "button", onClick: a, children: d }), e[8] = a, e[9] = c, e[10] = u, e[11] = m) : m = e[11], m;
 };
-function Xe(n) {
-  const e = g.c(11), {
+function ye(r) {
+  const e = b.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);
+  } = r, [s, l] = $(!1), [o, n] = $(!1);
+  let a, i;
+  e[0] === Symbol.for("react.memo_cache_sentinel") ? (a = () => {
+    const g = () => {
+      n(window.innerWidth < A);
     };
-    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);
+    return g(), window.addEventListener("resize", g), () => window.removeEventListener("resize", g);
+  }, i = [], e[0] = a, e[1] = i) : (a = e[0], i = e[1]), H(a, i);
   let c;
   e[2] === Symbol.for("react.memo_cache_sentinel") ? (c = () => {
-    s(!0);
+    l(!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(We);
-  }, e[4] = m) : m = e[4];
-  const x = m;
+  const u = c;
+  let d;
+  e[3] === Symbol.for("react.memo_cache_sentinel") ? (d = () => {
+    l(!1);
+  }, e[3] = d) : d = e[3];
+  const m = d;
+  let p;
+  e[4] === Symbol.for("react.memo_cache_sentinel") ? (p = () => {
+    l(he);
+  }, e[4] = p) : p = e[4];
+  const S = p;
   let h;
-  e[5] !== o || e[6] !== l ? (h = {
-    closeSidebar: u,
+  e[5] !== o || e[6] !== s ? (h = {
+    closeSidebar: m,
     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;
+    mobileOpen: s,
+    openSidebar: u,
+    toggleSidebar: S
+  }, e[5] = o, e[6] = s, e[7] = h) : h = e[7];
+  let O;
+  return e[8] !== t || e[9] !== h ? (O = /* @__PURE__ */ f(k.Provider, { value: h, children: t }), e[8] = t, e[9] = h, e[10] = O) : O = e[10], O;
 }
-function We(n) {
-  return !n;
+function he(r) {
+  return !r;
 }
-const _ = ve, O = ke, D = Ne;
-_.Header = $e;
-_.Content = Se;
-_.Footer = ye;
-_.Separator = Ge;
-_.Trigger = Re;
-O.Item = Te;
-O.Button = Le;
-O.Icon = q;
-O.Badge = Pe;
-O.Action = _e;
-O.Skeleton = He;
-O.Sub = Ae;
-O.SubItem = je;
-O.SubButton = De;
-D.Label = we;
-D.Action = Oe;
-D.Content = Ce;
+const Me = Object.assign(J, {
+  Content: Q,
+  Footer: U,
+  Header: ee,
+  Separator: xe,
+  Trigger: pe
+}), Pe = Object.assign(te, {
+  Action: se,
+  Button: re,
+  Icon: _,
+  Item: ce,
+  Skeleton: de,
+  Sub: fe,
+  SubButton: ue,
+  SubItem: be,
+  Tag: me
+}), we = Object.assign(V, {
+  Action: X,
+  Content: Y,
+  Label: Z
+});
 export {
-  Qe as OxAppLayout,
-  qe as OxLegacyHeader,
-  Je as OxLegacyMainContent,
-  w as OxLegacySidebar,
-  Ue as OxMainContent,
-  _ as OxSidebar,
-  D as OxSidebarGroup,
-  O as OxSidebarMenu,
-  Xe as OxSidebarProvider,
-  H as useOxSidebar
+  $e as OxAppLayout,
+  Ce as OxMainContent,
+  Me as OxSidebar,
+  we as OxSidebarGroup,
+  Pe as OxSidebarMenu,
+  ye as OxSidebarProvider,
+  C as useOxSidebar
 };