@dimasbaguspm/versaur 0.0.58 → 0.0.60

package/dist/js/top-bar-DMBbEIlR.js

@@ -0,0 +1,1078 @@
+import { j as s } from "./jsx-runtime-C5mzlN2N.js";
+import * as j from "react";
+import { forwardRef as l, createContext as S, useContext as C, useState as w } from "react";
+import { c as n, a as d } from "./index-BDtz_hQY.js";
+import { n as x, I as N } from "./image-rectangle-CCvXv24a.js";
+import "./snackbar-CTq4MLir.js";
+import { L as V } from "./skeleton-BRwIW26B.js";
+import { ChevronDown as z, ChevronRight as B, ChevronLeft as H } from "lucide-react";
+const T = n(
+  [
+    "h-screen w-full grid bg-background overflow-hidden",
+    "grid-rows-[auto_1fr_auto]",
+    "grid-cols-[auto_1fr_auto]",
+    '[grid-template-areas:"top_top_top"_"left_main_right"_"bottom_bottom_bottom"]'
+  ].join(" "),
+  {
+    variants: {},
+    defaultVariants: {}
+  }
+), P = n(
+  "[grid-area:top] z-30 sticky top-0 border-b border-border"
+), A = n(
+  "[grid-area:left] z-20 border-r border-border bg-white"
+), _ = n(
+  "[grid-area:right] z-20 border-l border-border bg-white"
+), I = n(
+  "[grid-area:bottom] z-30 border-t border-border bg-white"
+), k = n(
+  "[grid-area:main] overflow-y-auto min-h-0 [scrollbar-gutter:stable]"
+), G = l(function({ children: t, className: e, ...a }, o) {
+  return /* @__PURE__ */ s.jsx(
+    "div",
+    {
+      ref: o,
+      className: P({ className: e }),
+      ...a,
+      children: t
+    }
+  );
+}), M = l(function({ children: t, className: e, ...a }, o) {
+  return /* @__PURE__ */ s.jsx(
+    "aside",
+    {
+      ref: o,
+      className: A({ className: e }),
+      ...a,
+      children: t
+    }
+  );
+}), F = l(function({ children: t, className: e, ...a }, o) {
+  return /* @__PURE__ */ s.jsx(
+    "aside",
+    {
+      ref: o,
+      className: _({ className: e }),
+      ...a,
+      children: t
+    }
+  );
+}), O = l(function({ children: t, className: e, ...a }, o) {
+  return /* @__PURE__ */ s.jsx(
+    "div",
+    {
+      ref: o,
+      className: I({ className: e }),
+      ...a,
+      children: t
+    }
+  );
+}), E = l(function({ children: t, className: e, ...a }, o) {
+  return /* @__PURE__ */ s.jsx(
+    "main",
+    {
+      ref: o,
+      className: k({ className: e }),
+      ...a,
+      children: t
+    }
+  );
+}), W = l(
+  ({ children: r, className: t, ...e }, a) => /* @__PURE__ */ s.jsx("div", { ref: a, className: T({ className: t }), ...e, children: r })
+), ta = Object.assign(W, {
+  TopRegion: G,
+  SideLeftRegion: M,
+  SideRightRegion: F,
+  BottomRegion: O,
+  MainRegion: E
+}), D = n(
+  "sticky bottom-0 w-full flex justify-around items-center bg-white z-40 safe-bottom gap-4 select-none px-8",
+  {
+    variants: {
+      variant: {
+        primary: "",
+        secondary: "",
+        ghost: "",
+        neutral: "",
+        tertiary: ""
+      },
+      size: {
+        sm: "h-12 text-sm",
+        md: "h-16 text-base",
+        lg: "h-20 text-lg"
+      }
+    },
+    defaultVariants: {
+      variant: "primary",
+      size: "md"
+    }
+  }
+), $ = n(
+  "flex flex-col items-center justify-center gap-1",
+  {
+    variants: {
+      active: {
+        true: "text-primary",
+        false: "text-ghost"
+      },
+      as: {
+        button: "transition-all duration-200 h-8 w-8 outline-none cursor-pointer active:scale-98 focus-visible:ring-2 focus-visible:ring-primary-light focus-visible:rounded-full",
+        div: ""
+      }
+    },
+    defaultVariants: {
+      active: !1,
+      as: "button"
+    }
+  }
+), q = l(
+  ({
+    as: r = "button",
+    icon: t,
+    label: e,
+    active: a = !1,
+    className: o,
+    children: i,
+    ...c
+  }, u) => /* @__PURE__ */ s.jsxs(
+    r,
+    {
+      ref: u,
+      "aria-current": a ? "page" : void 0,
+      className: $({ active: a, className: o, as: r }),
+      ...c,
+      children: [
+        t && t,
+        i && i,
+        e && /* @__PURE__ */ s.jsx("span", { className: "text-xs mt-0.5", children: e })
+      ]
+    }
+  )
+), J = ({
+  children: r,
+  variant: t = "primary",
+  size: e = "md",
+  className: a,
+  ...o
+}) => /* @__PURE__ */ s.jsx(
+  "nav",
+  {
+    role: "navigation",
+    "aria-label": "Bottom navigation",
+    className: D({ variant: t, size: e, className: a }),
+    ...o,
+    children: r
+  }
+), sa = Object.assign(J, {
+  Item: q
+}), K = n("flex items-center", {
+  variants: {
+    orientation: {
+      horizontal: "flex-row",
+      vertical: "flex-col"
+    },
+    alignment: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    gap: {
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-3",
+      lg: "gap-4",
+      xl: "gap-6"
+    },
+    fluid: {
+      true: "[&>*]:flex-1",
+      false: ""
+    },
+    overlay: {
+      true: "flex-nowrap overflow-x-auto",
+      false: "flex-wrap"
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    alignment: "start",
+    gap: "md",
+    fluid: !1,
+    overlay: !1
+  }
+}), ra = l(
+  function({
+    className: t,
+    children: e,
+    orientation: a = "horizontal",
+    alignment: o = "start",
+    gap: i = "md",
+    fluid: c = !1,
+    hasMargin: u,
+    overlay: f = !1,
+    ...p
+  }, m) {
+    return /* @__PURE__ */ s.jsx(
+      "div",
+      {
+        ref: m,
+        className: d(
+          K({
+            orientation: a,
+            alignment: o,
+            gap: i,
+            fluid: c,
+            overlay: f
+          }),
+          u && "mb-4",
+          t
+        ),
+        role: "group",
+        ...p,
+        children: e
+      }
+    );
+  }
+), Q = n("flex items-center", {
+  variants: {
+    orientation: {
+      horizontal: "flex-row",
+      vertical: "flex-col"
+    },
+    alignment: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    gap: {
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-3",
+      lg: "gap-4",
+      xl: "gap-6"
+    },
+    fluid: {
+      true: "[&>*]:flex-1",
+      false: ""
+    },
+    overlay: {
+      true: "flex-nowrap overflow-x-auto",
+      false: "flex-wrap"
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    alignment: "start",
+    gap: "md",
+    fluid: !1,
+    overlay: !1
+  }
+}), oa = l(
+  function({
+    className: t,
+    children: e,
+    orientation: a = "horizontal",
+    alignment: o = "start",
+    gap: i = "md",
+    fluid: c = !1,
+    hasMargin: u,
+    overlay: f = !1,
+    ...p
+  }, m) {
+    return /* @__PURE__ */ s.jsx(
+      "div",
+      {
+        ref: m,
+        className: d(
+          Q({
+            orientation: a,
+            alignment: o,
+            gap: i,
+            fluid: c,
+            overlay: f
+          }),
+          u && "mb-4",
+          t
+        ),
+        role: "group",
+        ...p,
+        children: e
+      }
+    );
+  }
+), U = n("flex items-center", {
+  variants: {
+    orientation: {
+      horizontal: "flex-row",
+      vertical: "flex-col"
+    },
+    alignment: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    gap: {
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-3",
+      lg: "gap-4",
+      xl: "gap-6"
+    },
+    fluid: {
+      true: "[&>*]:flex-1",
+      false: ""
+    },
+    overlay: {
+      true: "flex-nowrap overflow-x-auto",
+      false: "flex-wrap"
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    alignment: "start",
+    gap: "md",
+    fluid: !1,
+    overlay: !1
+  }
+}), na = l(
+  function({
+    className: t,
+    children: e,
+    orientation: a = "horizontal",
+    alignment: o = "start",
+    gap: i = "md",
+    fluid: c = !1,
+    hasMargin: u,
+    overlay: f = !1,
+    ...p
+  }, m) {
+    return /* @__PURE__ */ s.jsx(
+      "div",
+      {
+        ref: m,
+        className: d(
+          U({
+            orientation: a,
+            alignment: o,
+            gap: i,
+            fluid: c,
+            overlay: f
+          }),
+          u && "mb-4",
+          t
+        ),
+        role: "group",
+        ...p,
+        children: e
+      }
+    );
+  }
+), X = n("w-full mb-4"), Y = n("w-full mx-auto pt-4 md:pt-10", {
+  variants: {
+    size: {
+      fluid: "max-w-full",
+      wide: "max-w-7xl",
+      narrow: "max-w-3xl"
+    }
+  },
+  defaultVariants: {
+    size: "fluid"
+  }
+}), Z = n(
+  "flex flex-col sm:flex-row sm:items-start sm:justify-between gap-4 mb-4",
+  {
+    variants: {
+      size: {
+        fluid: "px-0",
+        wide: "px-6",
+        narrow: "px-4"
+      }
+    },
+    defaultVariants: {
+      size: "fluid"
+    }
+  }
+), ee = n("mb-4", {
+  variants: {
+    size: {
+      fluid: "px-0",
+      wide: "px-6",
+      narrow: "px-4"
+    }
+  },
+  defaultVariants: {
+    size: "fluid"
+  }
+}), ae = n(
+  "flex-1 min-w-0 flex flex-col gap-2 w-full sm:w-auto"
+), te = n("flex items-center gap-2 flex-wrap"), se = n(
+  "hidden md:flex  flex-col sm:flex-row gap-2 sm:gap-3 w-full w-auto sm:ml-auto sm:shrink-0 [&>*]:w-full sm:[&>*]:w-auto"
+), re = n("md:hidden"), oe = n(
+  "w-full flex items-center py-0 overflow-x-auto"
+), ne = l(
+  ({ children: r, className: t, size: e = "fluid", ...a }, o) => /* @__PURE__ */ s.jsx(
+    "div",
+    {
+      ref: o,
+      className: d(Z({ size: e }), t),
+      "data-versaur-page-header-top": !0,
+      ...a,
+      children: r
+    }
+  )
+), ie = l(({ children: r, className: t, size: e = "fluid", ...a }, o) => /* @__PURE__ */ s.jsx(
+  "div",
+  {
+    ref: o,
+    className: d(ee({ size: e }), t),
+    "data-versaur-page-header-breadcrumbs": !0,
+    ...a,
+    children: r
+  }
+)), le = l(({ children: r, className: t, ...e }, a) => /* @__PURE__ */ s.jsx(
+  "div",
+  {
+    ref: a,
+    className: d(ae(), t),
+    "data-versaur-page-header-content": !0,
+    ...e,
+    children: r
+  }
+)), ce = l((r, t) => /* @__PURE__ */ s.jsx(
+  x,
+  {
+    ...r,
+    as: "h1",
+    fontSize: "xl",
+    fontWeight: "semibold",
+    ellipsis: !0,
+    ref: t
+  }
+)), de = l(({ className: r, ...t }, e) => /* @__PURE__ */ s.jsx(
+  x,
+  {
+    as: "p",
+    fontSize: "sm",
+    fontWeight: "normal",
+    clamp: 2,
+    ref: e,
+    className: d("mb-2 sm:clamp-3", r),
+    ...t
+  }
+)), ue = l(({ children: r, className: t, ...e }, a) => /* @__PURE__ */ s.jsx(
+  "div",
+  {
+    ref: a,
+    className: d(te(), t),
+    "data-versaur-page-header-badges": !0,
+    ...e,
+    children: r
+  }
+)), pe = l(({ children: r, className: t, ...e }, a) => /* @__PURE__ */ s.jsx(
+  "div",
+  {
+    ref: a,
+    className: d(se(), t),
+    "data-versaur-page-header-actions": !0,
+    ...e,
+    children: r
+  }
+)), fe = l(({ children: r, className: t, ...e }, a) => /* @__PURE__ */ s.jsx(
+  "div",
+  {
+    ref: a,
+    className: d(re(), t),
+    "data-versaur-page-header-mobile-actions": !0,
+    ...e,
+    children: r
+  }
+)), me = l(({ children: r, className: t, ...e }, a) => /* @__PURE__ */ s.jsx(
+  "div",
+  {
+    ref: a,
+    className: d(oe(), t),
+    "data-versaur-page-header-bottom": !0,
+    ...e,
+    children: r
+  }
+)), ge = l(
+  ({
+    children: r,
+    className: t,
+    size: e = "fluid",
+    title: a,
+    subtitle: o,
+    breadcrumbs: i,
+    badges: c,
+    actions: u,
+    mobileActions: f,
+    tabs: p,
+    ...m
+  }, g) => {
+    const v = p;
+    return /* @__PURE__ */ s.jsx(
+      "header",
+      {
+        ref: g,
+        className: d(X()),
+        role: "banner",
+        ...m,
+        children: /* @__PURE__ */ s.jsxs("div", { className: d(Y({ size: e }), t), children: [
+          i && /* @__PURE__ */ s.jsx(ie, { size: e, children: i }),
+          /* @__PURE__ */ s.jsxs(ne, { size: e, children: [
+            /* @__PURE__ */ s.jsxs(le, { children: [
+              /* @__PURE__ */ s.jsxs("div", { className: "flex items-center justify-between", children: [
+                /* @__PURE__ */ s.jsx(ce, { children: a }),
+                f && /* @__PURE__ */ s.jsx(fe, { children: f })
+              ] }),
+              o && /* @__PURE__ */ s.jsx(de, { children: o }),
+              c && /* @__PURE__ */ s.jsx(ue, { children: c })
+            ] }),
+            u && /* @__PURE__ */ s.jsx(pe, { children: u })
+          ] }),
+          v && /* @__PURE__ */ s.jsx(me, { children: p }),
+          r
+        ] })
+      }
+    );
+  }
+), ia = ge, xe = n("w-full"), he = n("w-full mx-auto relative", {
+  variants: {
+    size: {
+      fluid: "max-w-full px-0",
+      wide: "max-w-7xl px-6 pb-10",
+      narrow: "max-w-3xl px-4 pb-10"
+    },
+    template: {
+      "single-column": "grid grid-cols-1",
+      "two-column": "grid grid-cols-1 md:grid-cols-2 gap-6",
+      "two-column-asymmetric-left": "grid grid-cols-1 md:grid-cols-3 gap-6",
+      "two-column-asymmetric-right": "grid grid-cols-1 md:grid-cols-3 gap-6"
+    }
+  },
+  defaultVariants: {
+    size: "fluid",
+    template: "single-column"
+  }
+}), la = j.forwardRef(
+  function({
+    size: t = "fluid",
+    template: e = "single-column",
+    className: a,
+    children: o,
+    ...i
+  }, c) {
+    return /* @__PURE__ */ s.jsx("div", { ref: c, className: d(xe()), ...i, children: /* @__PURE__ */ s.jsx(
+      "div",
+      {
+        className: d(
+          he({ size: t, template: e }),
+          a
+        ),
+        children: /* @__PURE__ */ s.jsx("div", { children: o })
+      }
+    ) });
+  }
+), ve = n(
+  [
+    "grid",
+    "h-full",
+    "min-h-0",
+    "grid-rows-[auto_1fr]",
+    '[grid-template-areas:"header"_"content"]'
+  ].join(" "),
+  {
+    variants: {
+      hasMargin: {
+        true: '[&_[class*="grid-area:header"]]:px-4 [&_[class*="grid-area:header"]]:sm:px-6 [&_[class*="grid-area:header"]]:lg:px-8 [&_[class*="grid-area:content"]]:px-4 [&_[class*="grid-area:content"]]:sm:px-6 [&_[class*="grid-area:content"]]:lg:px-8',
+        false: ""
+      }
+    },
+    defaultVariants: {
+      hasMargin: !1
+    }
+  }
+), ye = n("[grid-area:header]", {
+  variants: {
+    backgroundColor: {
+      white: "bg-transparent",
+      gray: "bg-gray-100"
+    }
+  },
+  defaultVariants: {
+    backgroundColor: "white"
+  }
+}), be = n(
+  "[grid-area:content] min-h-0",
+  {
+    variants: {
+      backgroundColor: {
+        white: "bg-transparent",
+        gray: "bg-gray-100"
+      }
+    },
+    defaultVariants: {
+      backgroundColor: "white"
+    }
+  }
+), je = l(function({ children: t, className: e, backgroundColor: a = "white", ...o }, i) {
+  return /* @__PURE__ */ s.jsx(
+    "div",
+    {
+      ref: i,
+      className: ye({ backgroundColor: a, className: e }),
+      ...o,
+      children: t
+    }
+  );
+}), we = l(function({ children: t, className: e, backgroundColor: a = "white", ...o }, i) {
+  return /* @__PURE__ */ s.jsx(
+    "div",
+    {
+      ref: i,
+      className: be({ backgroundColor: a, className: e }),
+      ...o,
+      children: t
+    }
+  );
+}), Ne = l(
+  ({ children: r, className: t, hasMargin: e = !1, ...a }, o) => /* @__PURE__ */ s.jsx(
+    "div",
+    {
+      ref: o,
+      className: ve({ hasMargin: e, className: t }),
+      ...a,
+      children: r
+    }
+  )
+), ca = Object.assign(Ne, {
+  HeaderRegion: je,
+  ContentRegion: we
+}), Be = n(
+  [
+    // Base styles: flex container that centers content
+    "flex",
+    "items-center",
+    "justify-center",
+    "flex-col",
+    "gap-3",
+    // Ensure it takes available space
+    "flex-grow",
+    "w-full"
+  ],
+  {
+    variants: {
+      minimal: {
+        false: [
+          // Full height for standalone page loading
+          "min-h-96",
+          "h-full"
+        ],
+        true: [
+          // Minimal height for inline loading states
+          "min-h-32",
+          "py-8"
+        ]
+      },
+      fullscreen: {
+        true: ["fixed", "inset-0", "z-100", "bg-background"],
+        false: []
+      }
+    },
+    defaultVariants: {
+      minimal: !1,
+      fullscreen: !1
+    }
+  }
+), Re = n([
+  "text-foreground-light",
+  "text-sm",
+  "text-center",
+  "max-w-xs"
+]), da = j.forwardRef(
+  function({
+    type: t = "bar",
+    size: e = "sm",
+    color: a = "primary",
+    ariaLabel: o = "Loading page",
+    message: i,
+    fullscreen: c = !1,
+    minimal: u = !1,
+    className: f,
+    children: p,
+    ...m
+  }, g) {
+    return /* @__PURE__ */ s.jsxs(
+      "div",
+      {
+        ref: g,
+        className: d(Be({ minimal: u, fullscreen: c }), f),
+        ...m,
+        children: [
+          /* @__PURE__ */ s.jsx("div", { className: "max-w-xs w-full flex justify-center", children: /* @__PURE__ */ s.jsx(
+            V,
+            {
+              type: t,
+              size: e,
+              color: a,
+              ariaLabel: o
+            }
+          ) }),
+          i && /* @__PURE__ */ s.jsx("p", { className: Re(), "aria-live": "polite", children: i }),
+          p
+        ]
+      }
+    );
+  }
+), Le = n("grid w-full gap-4 grid-cols-12"), Se = n("", {
+  variants: {
+    span: {
+      1: "col-span-1",
+      2: "col-span-2",
+      3: "col-span-3",
+      4: "col-span-4",
+      5: "col-span-5",
+      6: "col-span-6",
+      7: "col-span-7",
+      8: "col-span-8",
+      9: "col-span-9",
+      10: "col-span-10",
+      11: "col-span-11",
+      12: "col-span-12"
+    }
+  },
+  defaultVariants: {
+    span: "4"
+  }
+}), Ce = l(
+  function({ className: t, children: e, ...a }, o) {
+    return /* @__PURE__ */ s.jsx(
+      "div",
+      {
+        ref: o,
+        className: d(Le(), t),
+        ...a,
+        children: e
+      }
+    );
+  }
+), Ve = l(
+  function({ span: t = 4, className: e, children: a, ...o }, i) {
+    const c = Math.min(12, Math.max(1, t));
+    return /* @__PURE__ */ s.jsx(
+      "div",
+      {
+        ref: i,
+        className: d(
+          Se({ span: `${c}` }),
+          e
+        ),
+        ...o,
+        children: a
+      }
+    );
+  }
+), ua = Object.assign(Ce, {
+  Column: Ve
+}), ze = n(
+  "bg-background flex flex-col h-full ease-in-out justify-between",
+  {
+    variants: {
+      collapsed: {
+        true: "w-16",
+        false: "w-56"
+      }
+    },
+    defaultVariants: {
+      collapsed: !1
+    }
+  }
+), b = n(
+  "w-full flex p-3 items-center gap-2 rounded-md hover:text-primary hover:bg-primary-soft focus:outline-none focus-visible:ring-2 focus-visible:ring-primary transition-all",
+  {
+    variants: {
+      active: {
+        true: "bg-primary/10 text-primary",
+        false: "text-ghost"
+      },
+      disabled: {
+        true: "opacity-50 pointer-events-none",
+        false: ""
+      },
+      collapsed: {
+        true: "justify-center",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      active: !1,
+      disabled: !1,
+      collapsed: !1
+    }
+  }
+), He = n("", {
+  variants: {
+    expanded: {
+      true: "bg-neutral-light",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    expanded: !1
+  }
+}), Te = n(
+  "w-full flex p-3 items-center gap-2 rounded-md hover:text-primary hover:bg-primary-soft focus:outline-none focus-visible:ring-2 focus-visible:ring-primary transition-all",
+  {
+    variants: {
+      collapsed: {
+        true: "justify-center",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      collapsed: !1
+    }
+  }
+), Pe = n("flex flex-col gap-2 ml-3"), h = n("flex items-center justify-center size-5"), R = S(null), L = () => {
+  const r = C(R);
+  if (!r)
+    throw new Error("SideBar compound components must be used within SideBar");
+  return r;
+}, Ae = l(
+  (r, t) => {
+    const { icon: e, children: a, href: o, active: i, ...c } = r, { isCollapsed: u } = L(), f = c;
+    return /* @__PURE__ */ s.jsx("li", { children: /* @__PURE__ */ s.jsxs(
+      "a",
+      {
+        ref: t,
+        href: o,
+        className: b({
+          disabled: !!r["aria-disabled"],
+          active: i,
+          collapsed: u
+        }),
+        title: u ? String(a) : void 0,
+        ...f,
+        children: [
+          e && /* @__PURE__ */ s.jsx("span", { className: d(h()), children: e }),
+          !u && /* @__PURE__ */ s.jsx(
+            x,
+            {
+              as: "span",
+              color: "inherit",
+              fontSize: "sm",
+              fontWeight: "normal",
+              className: "truncate",
+              children: a
+            }
+          )
+        ]
+      }
+    ) });
+  }
+), _e = l(
+  function({ children: t, label: e, icon: a, defaultExpanded: o = !0, ...i }, c) {
+    const { isCollapsed: u, expandSidebar: f } = L(), [p, m] = w(o), g = (y) => {
+      y.preventDefault(), m(!p);
+    }, v = (y) => {
+      y.preventDefault(), f(), m(!0);
+    };
+    return u ? /* @__PURE__ */ s.jsx("li", { children: /* @__PURE__ */ s.jsx(
+      "button",
+      {
+        type: "button",
+        className: b({
+          active: !1,
+          collapsed: !0
+        }),
+        title: String(e),
+        onClick: v,
+        children: a && /* @__PURE__ */ s.jsx("span", { className: d(h()), children: a })
+      }
+    ) }) : /* @__PURE__ */ s.jsxs(
+      "li",
+      {
+        ref: c,
+        className: He({
+          expanded: p
+        }),
+        ...i,
+        children: [
+          /* @__PURE__ */ s.jsxs(
+            "button",
+            {
+              type: "button",
+              className: Te({
+                collapsed: !1
+              }),
+              onClick: g,
+              children: [
+                a && /* @__PURE__ */ s.jsx("span", { className: d(h()), children: a }),
+                /* @__PURE__ */ s.jsx(
+                  x,
+                  {
+                    as: "span",
+                    color: "inherit",
+                    fontSize: "sm",
+                    className: "flex-1 truncate",
+                    children: e
+                  }
+                ),
+                /* @__PURE__ */ s.jsx(
+                  N,
+                  {
+                    as: p ? z : B,
+                    size: "xs",
+                    color: "inherit"
+                  }
+                )
+              ]
+            }
+          ),
+          p && /* @__PURE__ */ s.jsx("ul", { className: d(Pe()), children: t })
+        ]
+      }
+    );
+  }
+), Ie = l(
+  ({ children: r, defaultCollapsed: t = !1, onCollapseChange: e, ...a }, o) => {
+    const [i, c] = w(t), u = () => {
+      const p = !i;
+      c(p), e?.(p);
+    }, f = () => {
+      i && (c(!1), e?.(!1));
+    };
+    return /* @__PURE__ */ s.jsx(
+      R.Provider,
+      {
+        value: { isCollapsed: i, toggleCollapsed: u, expandSidebar: f },
+        children: /* @__PURE__ */ s.jsxs(
+          "nav",
+          {
+            ref: o,
+            className: ze({ collapsed: i }),
+            "aria-label": "Sidebar",
+            ...a,
+            children: [
+              /* @__PURE__ */ s.jsx("div", { className: "flex-1 overflow-y-auto scrollbar-thin scrollbar-thumb-border scrollbar-track-background py-2", children: /* @__PURE__ */ s.jsx("ul", { className: "flex flex-col gap-1 mx-2", children: r }) }),
+              /* @__PURE__ */ s.jsx("div", { className: "mx-2 mb-2", children: /* @__PURE__ */ s.jsxs(
+                "button",
+                {
+                  onClick: u,
+                  className: b({
+                    collapsed: i,
+                    active: !1,
+                    disabled: !1
+                  }),
+                  "aria-label": i ? "Expand sidebar" : "Collapse sidebar",
+                  title: i ? "Expand sidebar" : "Collapse sidebar",
+                  children: [
+                    /* @__PURE__ */ s.jsx("span", { className: d(h()), children: /* @__PURE__ */ s.jsx(
+                      N,
+                      {
+                        as: i ? B : H,
+                        size: "sm",
+                        color: "inherit"
+                      }
+                    ) }),
+                    !i && /* @__PURE__ */ s.jsx(
+                      x,
+                      {
+                        as: "span",
+                        color: "inherit",
+                        fontSize: "sm",
+                        className: "truncate",
+                        children: "Collapse"
+                      }
+                    )
+                  ]
+                }
+              ) })
+            ]
+          }
+        )
+      }
+    );
+  }
+), pa = Object.assign(Ie, {
+  Item: Ae,
+  Group: _e
+}), ke = n(
+  "w-full flex items-center px-6 py-4 bg-white",
+  {
+    variants: {},
+    defaultVariants: {}
+  }
+), Ge = n("flex items-center gap-3 min-w-0 flex-1"), Me = n("flex items-center gap-2 ml-auto"), Fe = n(
+  "px-2.5 py-1.5 rounded-md text-sm cursor-pointer transition-colors",
+  {
+    variants: {
+      active: {
+        true: "bg-primary/10 text-primary",
+        false: "hover:text-primary text-ghost"
+      }
+    },
+    defaultVariants: {
+      active: !1
+    }
+  }
+), Oe = n("flex items-center gap-2 ml-4"), Ee = n("flex items-center gap-2 mr-4"), We = l(
+  function({ children: t, className: e, ...a }, o) {
+    return /* @__PURE__ */ s.jsx("nav", { ref: o, className: Oe({ className: e }), ...a, children: t });
+  }
+), De = l(
+  function({ children: t, className: e, ...a }, o) {
+    return /* @__PURE__ */ s.jsx("div", { ref: o, className: Ee({ className: e }), ...a, children: t });
+  }
+), $e = l(
+  function({ children: t, className: e, ...a }, o) {
+    return /* @__PURE__ */ s.jsx("div", { ref: o, className: Ge({ className: e }), ...a, children: t });
+  }
+), qe = l(
+  function({ children: t, className: e, ...a }, o) {
+    return /* @__PURE__ */ s.jsx("div", { ref: o, className: Me({ className: e }), ...a, children: t });
+  }
+), Je = l(
+  function({ children: t, className: e, active: a, ...o }, i) {
+    return /* @__PURE__ */ s.jsx(
+      "div",
+      {
+        ref: i,
+        className: Fe({ active: a, className: e }),
+        "aria-current": a ? "page" : void 0,
+        ...o,
+        children: t
+      }
+    );
+  }
+), Ke = l(
+  ({ children: r, className: t, ...e }, a) => /* @__PURE__ */ s.jsx("header", { ref: a, className: ke({ className: t }), ...e, children: r })
+), fa = Object.assign(Ke, {
+  Leading: $e,
+  Trailing: qe,
+  NavItem: Je,
+  Nav: We,
+  Actions: De
+});
+export {
+  ta as A,
+  sa as B,
+  na as F,
+  ia as P,
+  pa as S,
+  fa as T,
+  ra as a,
+  oa as b,
+  la as c,
+  ca as d,
+  da as e,
+  ua as f
+};