@prediktif/ui 0.1.8 → 0.1.9

package/dist/index.js

@@ -60,160 +60,643 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
-  HeaderTitle: () => HeaderTitle,
-  NavUser: () => NavUser
+  AppSidebar: () => AppSidebar,
+  HeaderTitle: () => HeaderTitle
 });
 module.exports = __toCommonJS(index_exports);
 
-// src/components/composed/header-title.tsx
+// src/components/composed/app-sidebar.tsx
+var import_lucide_react5 = require("lucide-react");
+var import_link = __toESM(require("next/link"));
+var import_navigation = require("next/navigation");
 var import_react = require("react");
+
+// src/components/ui/alert-dialog.tsx
+var import_alert_dialog = require("@base-ui/react/alert-dialog");
+var import_cn2 = require("cn");
+
+// src/components/ui/button.tsx
+var import_button = require("@base-ui/react/button");
+var import_class_variance_authority = require("class-variance-authority");
+var import_cn = require("cn");
 var import_jsx_runtime = require("react/jsx-runtime");
-var HeaderTitle = (0, import_react.memo)(function HeaderTitle2({
-  title,
-  subtitle,
-  children
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "w-full space-y-4", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "font-semibold", children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-muted-foreground", children: subtitle })
-    ] }),
-    children
+var buttonVariants = (0, import_class_variance_authority.cva)(
+  "group/button inline-flex shrink-0 items-center justify-center rounded-md border border-transparent bg-clip-padding text-xs/relaxed font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/30 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-2 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/80",
+        outline: "border-border hover:bg-input/50 hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:bg-input/30",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
+        ghost: "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
+        destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-7 gap-1 px-2 text-xs/relaxed has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+        xs: "h-5 gap-1 rounded-sm px-2 text-[0.625rem] has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-2.5",
+        sm: "h-6 gap-1 px-2 text-xs/relaxed has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+        lg: "h-8 gap-1 px-2.5 text-xs/relaxed has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 [&_svg:not([class*='size-'])]:size-4",
+        icon: "size-7 [&_svg:not([class*='size-'])]:size-3.5",
+        "icon-xs": "size-5 rounded-sm [&_svg:not([class*='size-'])]:size-2.5",
+        "icon-sm": "size-6 [&_svg:not([class*='size-'])]:size-3",
+        "icon-lg": "size-8 [&_svg:not([class*='size-'])]:size-4"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Button(_a) {
+  var _b = _a, {
+    className,
+    variant = "default",
+    size = "default"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "variant",
+    "size"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_button.Button,
+    __spreadValues({
+      "data-slot": "button",
+      className: (0, import_cn.cn)(buttonVariants({ variant, size, className }))
+    }, props)
+  );
+}
+
+// src/components/ui/alert-dialog.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function AlertDialog(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_alert_dialog.AlertDialog.Root, __spreadValues({ "data-slot": "alert-dialog" }, props));
+}
+function AlertDialogTrigger(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_alert_dialog.AlertDialog.Trigger, __spreadValues({ "data-slot": "alert-dialog-trigger" }, props));
+}
+function AlertDialogPortal(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_alert_dialog.AlertDialog.Portal, __spreadValues({ "data-slot": "alert-dialog-portal" }, props));
+}
+function AlertDialogOverlay(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_alert_dialog.AlertDialog.Backdrop,
+    __spreadValues({
+      "data-slot": "alert-dialog-overlay",
+      className: (0, import_cn2.cn)(
+        "fixed inset-0 isolate z-50 bg-black/80 duration-100 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0",
+        className
+      )
+    }, props)
+  );
+}
+function AlertDialogContent(_a) {
+  var _b = _a, {
+    className,
+    size = "default"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "size"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(AlertDialogPortal, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(AlertDialogOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      import_alert_dialog.AlertDialog.Popup,
+      __spreadValues({
+        "data-slot": "alert-dialog-content",
+        "data-size": size,
+        className: (0, import_cn2.cn)(
+          "group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 gap-3 rounded-xl bg-popover p-4 text-popover-foreground ring-1 ring-foreground/10 duration-100 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-64 data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
+          className
+        )
+      }, props)
+    )
   ] });
-});
+}
+function AlertDialogHeader(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "alert-dialog-header",
+      className: (0, import_cn2.cn)(
+        "grid grid-rows-[auto_1fr] place-items-center gap-1 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]",
+        className
+      )
+    }, props)
+  );
+}
+function AlertDialogFooter(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "alert-dialog-footer",
+      className: (0, import_cn2.cn)(
+        "flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end",
+        className
+      )
+    }, props)
+  );
+}
+function AlertDialogTitle(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_alert_dialog.AlertDialog.Title,
+    __spreadValues({
+      "data-slot": "alert-dialog-title",
+      className: (0, import_cn2.cn)(
+        "font-heading text-sm font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2",
+        className
+      )
+    }, props)
+  );
+}
+function AlertDialogDescription(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_alert_dialog.AlertDialog.Description,
+    __spreadValues({
+      "data-slot": "alert-dialog-description",
+      className: (0, import_cn2.cn)(
+        "text-xs/relaxed text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground",
+        className
+      )
+    }, props)
+  );
+}
+function AlertDialogAction(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    Button,
+    __spreadValues({
+      "data-slot": "alert-dialog-action",
+      className: (0, import_cn2.cn)(className)
+    }, props)
+  );
+}
+function AlertDialogCancel(_a) {
+  var _b = _a, {
+    className,
+    variant = "outline",
+    size = "default"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "variant",
+    "size"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_alert_dialog.AlertDialog.Close,
+    __spreadValues({
+      "data-slot": "alert-dialog-cancel",
+      className: (0, import_cn2.cn)(className),
+      render: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Button, { variant, size })
+    }, props)
+  );
+}
+
+// src/components/ui/avatar.tsx
+var import_avatar = require("@base-ui/react/avatar");
+var import_cn3 = require("cn");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function Avatar(_a) {
+  var _b = _a, {
+    className,
+    size = "default"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "size"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_avatar.Avatar.Root,
+    __spreadValues({
+      "data-slot": "avatar",
+      "data-size": size,
+      className: (0, import_cn3.cn)(
+        "group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten",
+        className
+      )
+    }, props)
+  );
+}
+function AvatarImage(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_avatar.Avatar.Image,
+    __spreadValues({
+      "data-slot": "avatar-image",
+      className: (0, import_cn3.cn)(
+        "aspect-square size-full rounded-full object-cover",
+        className
+      )
+    }, props)
+  );
+}
+function AvatarFallback(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_avatar.Avatar.Fallback,
+    __spreadValues({
+      "data-slot": "avatar-fallback",
+      className: (0, import_cn3.cn)(
+        "flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs",
+        className
+      )
+    }, props)
+  );
+}
+
+// src/components/ui/breadcrumb.tsx
+var import_merge_props = require("@base-ui/react/merge-props");
+var import_use_render = require("@base-ui/react/use-render");
+var import_cn4 = require("cn");
+var import_lucide_react = require("lucide-react");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function Breadcrumb(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "nav",
+    __spreadValues({
+      "aria-label": "breadcrumb",
+      "data-slot": "breadcrumb",
+      className: (0, import_cn4.cn)(className)
+    }, props)
+  );
+}
+function BreadcrumbList(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "ol",
+    __spreadValues({
+      "data-slot": "breadcrumb-list",
+      className: (0, import_cn4.cn)(
+        "flex flex-wrap items-center gap-1.5 text-xs/relaxed wrap-break-word text-muted-foreground",
+        className
+      )
+    }, props)
+  );
+}
+function BreadcrumbItem(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "li",
+    __spreadValues({
+      "data-slot": "breadcrumb-item",
+      className: (0, import_cn4.cn)("inline-flex items-center gap-1", className)
+    }, props)
+  );
+}
+function BreadcrumbLink(_a) {
+  var _b = _a, {
+    className,
+    render
+  } = _b, props = __objRest(_b, [
+    "className",
+    "render"
+  ]);
+  return (0, import_use_render.useRender)({
+    defaultTagName: "a",
+    props: (0, import_merge_props.mergeProps)(
+      {
+        className: (0, import_cn4.cn)("transition-colors hover:text-foreground", className)
+      },
+      props
+    ),
+    render,
+    state: {
+      slot: "breadcrumb-link"
+    }
+  });
+}
+function BreadcrumbPage(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "span",
+    __spreadValues({
+      "data-slot": "breadcrumb-page",
+      role: "link",
+      "aria-disabled": "true",
+      "aria-current": "page",
+      className: (0, import_cn4.cn)("font-normal text-foreground", className)
+    }, props)
+  );
+}
+function BreadcrumbSeparator(_a) {
+  var _b = _a, {
+    children,
+    className
+  } = _b, props = __objRest(_b, [
+    "children",
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "li",
+    __spreadProps(__spreadValues({
+      "data-slot": "breadcrumb-separator",
+      role: "presentation",
+      "aria-hidden": "true",
+      className: (0, import_cn4.cn)("[&>svg]:size-3.5", className)
+    }, props), {
+      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react.ChevronRightIcon, {})
+    })
+  );
+}
+
+// src/components/ui/dropdown-menu.tsx
+var import_menu = require("@base-ui/react/menu");
+var import_cn5 = require("cn");
+var import_lucide_react2 = require("lucide-react");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+function DropdownMenu(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_menu.Menu.Root, __spreadValues({ "data-slot": "dropdown-menu" }, props));
+}
+function DropdownMenuTrigger(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_menu.Menu.Trigger, __spreadValues({ "data-slot": "dropdown-menu-trigger" }, props));
+}
+function DropdownMenuContent(_a) {
+  var _b = _a, {
+    align = "start",
+    alignOffset = 0,
+    side = "bottom",
+    sideOffset = 4,
+    className
+  } = _b, props = __objRest(_b, [
+    "align",
+    "alignOffset",
+    "side",
+    "sideOffset",
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_menu.Menu.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    import_menu.Menu.Positioner,
+    {
+      className: "isolate z-50 outline-none",
+      align,
+      alignOffset,
+      side,
+      sideOffset,
+      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        import_menu.Menu.Popup,
+        __spreadValues({
+          "data-slot": "dropdown-menu-content",
+          className: (0, import_cn5.cn)(
+            "z-50 max-h-(--available-height) w-(--anchor-width) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 outline-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:overflow-hidden data-closed:fade-out-0 data-closed:zoom-out-95",
+            className
+          )
+        }, props)
+      )
+    }
+  ) });
+}
+function DropdownMenuGroup(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_menu.Menu.Group, __spreadValues({ "data-slot": "dropdown-menu-group" }, props));
+}
+function DropdownMenuLabel(_a) {
+  var _b = _a, {
+    className,
+    inset
+  } = _b, props = __objRest(_b, [
+    "className",
+    "inset"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    import_menu.Menu.GroupLabel,
+    __spreadValues({
+      "data-slot": "dropdown-menu-label",
+      "data-inset": inset,
+      className: (0, import_cn5.cn)(
+        "px-2 py-1.5 text-xs text-muted-foreground data-inset:pl-7.5",
+        className
+      )
+    }, props)
+  );
+}
+function DropdownMenuItem(_a) {
+  var _b = _a, {
+    className,
+    inset,
+    variant = "default"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "inset",
+    "variant"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    import_menu.Menu.Item,
+    __spreadValues({
+      "data-slot": "dropdown-menu-item",
+      "data-inset": inset,
+      "data-variant": variant,
+      className: (0, import_cn5.cn)(
+        "group/dropdown-menu-item relative flex min-h-7 cursor-default items-center gap-2 rounded-md px-2 py-1 text-xs/relaxed outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7.5 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5 data-[variant=destructive]:*:[svg]:text-destructive",
+        className
+      )
+    }, props)
+  );
+}
+
+// src/components/ui/separator.tsx
+var import_separator = require("@base-ui/react/separator");
+var import_cn6 = require("cn");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+function Separator(_a) {
+  var _b = _a, {
+    className,
+    orientation = "horizontal"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "orientation"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    import_separator.Separator,
+    __spreadValues({
+      "data-slot": "separator",
+      orientation,
+      className: (0, import_cn6.cn)(
+        "shrink-0 bg-border data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch",
+        className
+      )
+    }, props)
+  );
+}
+
+// src/components/ui/sidebar.tsx
+var import_merge_props2 = require("@base-ui/react/merge-props");
+var import_use_render2 = require("@base-ui/react/use-render");
+var import_class_variance_authority2 = require("class-variance-authority");
+var import_cn11 = require("cn");
+var import_lucide_react4 = require("lucide-react");
+var React2 = __toESM(require("react"));
 
-// src/components/composed/nav-user.tsx
-var import_react2 = require("react");
+// src/components/ui/input.tsx
+var import_input = require("@base-ui/react/input");
+var import_cn7 = require("cn");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 
-// src/components/ui/avatar.tsx
-var import_avatar = require("@base-ui/react/avatar");
-var import_cn = require("cn");
-var import_jsx_runtime2 = require("react/jsx-runtime");
-function Avatar(_a) {
+// src/components/ui/sheet.tsx
+var import_dialog = require("@base-ui/react/dialog");
+var import_cn8 = require("cn");
+var import_lucide_react3 = require("lucide-react");
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function Sheet(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_dialog.Dialog.Root, __spreadValues({ "data-slot": "sheet" }, props));
+}
+function SheetPortal(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_dialog.Dialog.Portal, __spreadValues({ "data-slot": "sheet-portal" }, props));
+}
+function SheetOverlay(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    import_dialog.Dialog.Backdrop,
+    __spreadValues({
+      "data-slot": "sheet-overlay",
+      className: (0, import_cn8.cn)(
+        "fixed inset-0 z-50 bg-black/80 transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 supports-backdrop-filter:backdrop-blur-xs",
+        className
+      )
+    }, props)
+  );
+}
+function SheetContent(_a) {
   var _b = _a, {
     className,
-    size = "default"
+    children,
+    side = "right",
+    showCloseButton = true
   } = _b, props = __objRest(_b, [
     "className",
-    "size"
+    "children",
+    "side",
+    "showCloseButton"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    import_avatar.Avatar.Root,
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(SheetPortal, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SheetOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+      import_dialog.Dialog.Popup,
+      __spreadProps(__spreadValues({
+        "data-slot": "sheet-content",
+        "data-side": side,
+        className: (0, import_cn8.cn)(
+          "fixed z-50 flex flex-col bg-popover bg-clip-padding text-xs/relaxed text-popover-foreground shadow-lg transition duration-200 ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm",
+          className
+        )
+      }, props), {
+        children: [
+          children,
+          showCloseButton && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+            import_dialog.Dialog.Close,
+            {
+              "data-slot": "sheet-close",
+              render: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                Button,
+                {
+                  variant: "ghost",
+                  className: "absolute top-4 right-4",
+                  size: "icon-sm"
+                }
+              ),
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react3.XIcon, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "sr-only", children: "Close" })
+              ]
+            }
+          )
+        ]
+      })
+    )
+  ] });
+}
+function SheetHeader(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    "div",
     __spreadValues({
-      "data-slot": "avatar",
-      "data-size": size,
-      className: (0, import_cn.cn)(
-        "group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten",
-        className
-      )
+      "data-slot": "sheet-header",
+      className: (0, import_cn8.cn)("flex flex-col gap-1.5 p-6", className)
     }, props)
   );
 }
-function AvatarImage(_a) {
+function SheetTitle(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    import_avatar.Avatar.Image,
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    import_dialog.Dialog.Title,
     __spreadValues({
-      "data-slot": "avatar-image",
-      className: (0, import_cn.cn)(
-        "aspect-square size-full rounded-full object-cover",
+      "data-slot": "sheet-title",
+      className: (0, import_cn8.cn)(
+        "font-heading text-sm font-medium text-foreground",
         className
       )
     }, props)
   );
 }
-function AvatarFallback(_a) {
+function SheetDescription(_a) {
   var _b = _a, {
     className
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    import_avatar.Avatar.Fallback,
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    import_dialog.Dialog.Description,
     __spreadValues({
-      "data-slot": "avatar-fallback",
-      className: (0, import_cn.cn)(
-        "flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs",
-        className
-      )
+      "data-slot": "sheet-description",
+      className: (0, import_cn8.cn)("text-xs/relaxed text-muted-foreground", className)
     }, props)
   );
 }
 
-// src/components/ui/sidebar.tsx
-var import_merge_props = require("@base-ui/react/merge-props");
-var import_use_render = require("@base-ui/react/use-render");
-var import_class_variance_authority2 = require("class-variance-authority");
-var import_cn8 = require("cn");
-var import_lucide_react2 = require("lucide-react");
-var React2 = __toESM(require("react"));
-
-// src/components/ui/button.tsx
-var import_button = require("@base-ui/react/button");
-var import_class_variance_authority = require("class-variance-authority");
-var import_cn2 = require("cn");
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var buttonVariants = (0, import_class_variance_authority.cva)(
-  "group/button inline-flex shrink-0 items-center justify-center rounded-md border border-transparent bg-clip-padding text-xs/relaxed font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/30 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-2 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-  {
-    variants: {
-      variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/80",
-        outline: "border-border hover:bg-input/50 hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:bg-input/30",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
-        ghost: "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
-        destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
-        link: "text-primary underline-offset-4 hover:underline"
-      },
-      size: {
-        default: "h-7 gap-1 px-2 text-xs/relaxed has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
-        xs: "h-5 gap-1 rounded-sm px-2 text-[0.625rem] has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-2.5",
-        sm: "h-6 gap-1 px-2 text-xs/relaxed has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
-        lg: "h-8 gap-1 px-2.5 text-xs/relaxed has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2 [&_svg:not([class*='size-'])]:size-4",
-        icon: "size-7 [&_svg:not([class*='size-'])]:size-3.5",
-        "icon-xs": "size-5 rounded-sm [&_svg:not([class*='size-'])]:size-2.5",
-        "icon-sm": "size-6 [&_svg:not([class*='size-'])]:size-3",
-        "icon-lg": "size-8 [&_svg:not([class*='size-'])]:size-4"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default"
-    }
-  }
-);
-
-// src/components/ui/input.tsx
-var import_input = require("@base-ui/react/input");
-var import_cn3 = require("cn");
-var import_jsx_runtime4 = require("react/jsx-runtime");
-
-// src/components/ui/separator.tsx
-var import_separator = require("@base-ui/react/separator");
-var import_cn4 = require("cn");
-var import_jsx_runtime5 = require("react/jsx-runtime");
-
-// src/components/ui/sheet.tsx
-var import_dialog = require("@base-ui/react/dialog");
-var import_cn5 = require("cn");
-var import_lucide_react = require("lucide-react");
-var import_jsx_runtime6 = require("react/jsx-runtime");
-
 // src/components/ui/skeleton.tsx
-var import_cn6 = require("cn");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_cn9 = require("cn");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 
 // src/components/ui/tooltip.tsx
 var import_tooltip = require("@base-ui/react/tooltip");
-var import_cn7 = require("cn");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_cn10 = require("cn");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 function Tooltip(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_tooltip.Tooltip.Root, __spreadValues({ "data-slot": "tooltip" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_tooltip.Tooltip.Root, __spreadValues({ "data-slot": "tooltip" }, props));
 }
 function TooltipTrigger(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_tooltip.Tooltip.Trigger, __spreadValues({ "data-slot": "tooltip-trigger" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_tooltip.Tooltip.Trigger, __spreadValues({ "data-slot": "tooltip-trigger" }, props));
 }
 function TooltipContent(_a) {
   var _b = _a, {
@@ -231,7 +714,7 @@ function TooltipContent(_a) {
     "alignOffset",
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_tooltip.Tooltip.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_tooltip.Tooltip.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
     import_tooltip.Tooltip.Positioner,
     {
       align,
@@ -239,18 +722,18 @@ function TooltipContent(_a) {
       side,
       sideOffset,
       className: "isolate z-50",
-      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
         import_tooltip.Tooltip.Popup,
         __spreadProps(__spreadValues({
           "data-slot": "tooltip-content",
-          className: (0, import_cn7.cn)(
+          className: (0, import_cn10.cn)(
             "z-50 inline-flex w-fit max-w-xs origin-(--transform-origin) items-center gap-1.5 rounded-md bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
             className
           )
         }, props), {
           children: [
             children,
-            /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_tooltip.Tooltip.Arrow, { className: "z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-left-1 data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-right-1 data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" })
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_tooltip.Tooltip.Arrow, { className: "z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-left-1 data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-right-1 data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" })
           ]
         })
       )
@@ -260,10 +743,31 @@ function TooltipContent(_a) {
 
 // src/hooks/use-mobile.ts
 var React = __toESM(require("react"));
+var MOBILE_BREAKPOINT = 768;
+function useIsMobile() {
+  const [isMobile, setIsMobile] = React.useState(
+    void 0
+  );
+  React.useEffect(() => {
+    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
+    const onChange = () => {
+      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    };
+    mql.addEventListener("change", onChange);
+    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
+    return () => mql.removeEventListener("change", onChange);
+  }, []);
+  return !!isMobile;
+}
 
 // src/components/ui/sidebar.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var SIDEBAR_COOKIE_NAME = "sidebar_state";
 var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
+var SIDEBAR_WIDTH = "16rem";
+var SIDEBAR_WIDTH_MOBILE = "18rem";
+var SIDEBAR_WIDTH_ICON = "3rem";
+var SIDEBAR_KEYBOARD_SHORTCUT = "b";
 var SidebarContext = React2.createContext(null);
 function useSidebar() {
   const context = React2.useContext(SidebarContext);
@@ -272,36 +776,360 @@ function useSidebar() {
   }
   return context;
 }
+function SidebarProvider(_a) {
+  var _b = _a, {
+    defaultOpen = true,
+    open: openProp,
+    onOpenChange: setOpenProp,
+    className,
+    style,
+    children
+  } = _b, props = __objRest(_b, [
+    "defaultOpen",
+    "open",
+    "onOpenChange",
+    "className",
+    "style",
+    "children"
+  ]);
+  const isMobile = useIsMobile();
+  const [openMobile, setOpenMobile] = React2.useState(false);
+  const [_open, _setOpen] = React2.useState(defaultOpen);
+  const open = openProp != null ? openProp : _open;
+  const setOpen = React2.useCallback(
+    (value) => {
+      const openState = typeof value === "function" ? value(open) : value;
+      if (setOpenProp) {
+        setOpenProp(openState);
+      } else {
+        _setOpen(openState);
+      }
+      document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
+    },
+    [setOpenProp, open]
+  );
+  const toggleSidebar = React2.useCallback(() => {
+    return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
+  }, [isMobile, setOpen]);
+  React2.useEffect(() => {
+    const handleKeyDown = (event) => {
+      if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
+        event.preventDefault();
+        toggleSidebar();
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [toggleSidebar]);
+  const state = open ? "expanded" : "collapsed";
+  const contextValue = React2.useMemo(
+    () => ({
+      state,
+      open,
+      setOpen,
+      isMobile,
+      openMobile,
+      setOpenMobile,
+      toggleSidebar
+    }),
+    [state, open, setOpen, isMobile, openMobile, toggleSidebar]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    "div",
+    __spreadProps(__spreadValues({
+      "data-slot": "sidebar-wrapper",
+      style: __spreadValues({
+        "--sidebar-width": SIDEBAR_WIDTH,
+        "--sidebar-width-icon": SIDEBAR_WIDTH_ICON
+      }, style),
+      className: (0, import_cn11.cn)(
+        "group/sidebar-wrapper flex min-h-svh w-full has-data-[variant=inset]:bg-sidebar",
+        className
+      )
+    }, props), {
+      children
+    })
+  ) });
+}
+function Sidebar(_a) {
+  var _b = _a, {
+    side = "left",
+    variant = "sidebar",
+    collapsible = "offcanvas",
+    className,
+    children,
+    dir
+  } = _b, props = __objRest(_b, [
+    "side",
+    "variant",
+    "collapsible",
+    "className",
+    "children",
+    "dir"
+  ]);
+  const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
+  if (collapsible === "none") {
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      "div",
+      __spreadProps(__spreadValues({
+        "data-slot": "sidebar",
+        className: (0, import_cn11.cn)(
+          "flex h-full w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground",
+          className
+        )
+      }, props), {
+        children
+      })
+    );
+  }
+  if (isMobile) {
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Sheet, __spreadProps(__spreadValues({ open: openMobile, onOpenChange: setOpenMobile }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+      SheetContent,
+      {
+        dir,
+        "data-sidebar": "sidebar",
+        "data-slot": "sidebar",
+        "data-mobile": "true",
+        className: "w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden",
+        style: {
+          "--sidebar-width": SIDEBAR_WIDTH_MOBILE
+        },
+        side,
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(SheetHeader, { className: "sr-only", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SheetTitle, { children: "Sidebar" }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SheetDescription, { children: "Displays the mobile sidebar." })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "flex h-full w-full flex-col", children })
+        ]
+      }
+    ) }));
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+    "div",
+    {
+      className: "group peer hidden text-sidebar-foreground md:block",
+      "data-state": state,
+      "data-collapsible": state === "collapsed" ? collapsible : "",
+      "data-variant": variant,
+      "data-side": side,
+      "data-slot": "sidebar",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+          "div",
+          {
+            "data-slot": "sidebar-gap",
+            className: (0, import_cn11.cn)(
+              "relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear",
+              "group-data-[collapsible=offcanvas]:w-0",
+              "group-data-[side=right]:rotate-180",
+              variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)"
+            )
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+          "div",
+          __spreadProps(__spreadValues({
+            "data-slot": "sidebar-container",
+            "data-side": side,
+            className: (0, import_cn11.cn)(
+              "fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear data-[side=left]:left-0 data-[side=left]:group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)] data-[side=right]:right-0 data-[side=right]:group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)] md:flex",
+              // Adjust the padding for floating and inset variants.
+              variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]" : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l",
+              className
+            )
+          }, props), {
+            children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+              "div",
+              {
+                "data-sidebar": "sidebar",
+                "data-slot": "sidebar-inner",
+                className: "flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:shadow-sm group-data-[variant=floating]:ring-1 group-data-[variant=floating]:ring-sidebar-border",
+                children
+              }
+            )
+          })
+        )
+      ]
+    }
+  );
+}
+function SidebarTrigger(_a) {
+  var _b = _a, {
+    className,
+    onClick
+  } = _b, props = __objRest(_b, [
+    "className",
+    "onClick"
+  ]);
+  const { toggleSidebar } = useSidebar();
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+    Button,
+    __spreadProps(__spreadValues({
+      "data-sidebar": "trigger",
+      "data-slot": "sidebar-trigger",
+      variant: "ghost",
+      size: "icon-sm",
+      className: (0, import_cn11.cn)(className),
+      onClick: (event) => {
+        onClick == null ? void 0 : onClick(event);
+        toggleSidebar();
+      }
+    }, props), {
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_lucide_react4.PanelLeftIcon, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "sr-only", children: "Toggle Sidebar" })
+      ]
+    })
+  );
+}
+function SidebarRail(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  const { toggleSidebar } = useSidebar();
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    "button",
+    __spreadValues({
+      "data-sidebar": "rail",
+      "data-slot": "sidebar-rail",
+      "aria-label": "Toggle Sidebar",
+      tabIndex: -1,
+      onClick: toggleSidebar,
+      title: "Toggle Sidebar",
+      className: (0, import_cn11.cn)(
+        "absolute inset-y-0 z-20 hidden w-4 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:start-1/2 after:w-[2px] hover:after:bg-sidebar-border sm:flex ltr:-translate-x-1/2 rtl:-translate-x-1/2",
+        "in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize",
+        "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
+        "group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full hover:group-data-[collapsible=offcanvas]:bg-sidebar",
+        "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
+        "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
+        className
+      )
+    }, props)
+  );
+}
+function SidebarInset(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    "main",
+    __spreadValues({
+      "data-slot": "sidebar-inset",
+      className: (0, import_cn11.cn)(
+        "relative flex w-full flex-1 flex-col bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2",
+        className
+      )
+    }, props)
+  );
+}
+function SidebarHeader(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "sidebar-header",
+      "data-sidebar": "header",
+      className: (0, import_cn11.cn)("flex flex-col gap-2 p-2", className)
+    }, props)
+  );
+}
 function SidebarFooter(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     "div",
     __spreadValues({
       "data-slot": "sidebar-footer",
       "data-sidebar": "footer",
-      className: (0, import_cn8.cn)("flex flex-col gap-2 p-2", className)
+      className: (0, import_cn11.cn)("flex flex-col gap-2 p-2", className)
+    }, props)
+  );
+}
+function SidebarContent(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "sidebar-content",
+      "data-sidebar": "content",
+      className: (0, import_cn11.cn)(
+        "no-scrollbar flex min-h-0 flex-1 flex-col gap-0 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
+        className
+      )
+    }, props)
+  );
+}
+function SidebarGroup(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "sidebar-group",
+      "data-sidebar": "group",
+      className: (0, import_cn11.cn)(
+        "relative flex w-full min-w-0 flex-col px-2 py-1",
+        className
+      )
+    }, props)
+  );
+}
+function SidebarGroupLabel(_a) {
+  var _b = _a, {
+    className,
+    render
+  } = _b, props = __objRest(_b, [
+    "className",
+    "render"
+  ]);
+  return (0, import_use_render2.useRender)({
+    defaultTagName: "div",
+    props: (0, import_merge_props2.mergeProps)(
+      {
+        className: (0, import_cn11.cn)(
+          "flex h-8 shrink-0 items-center rounded-md px-2 text-xs text-sidebar-foreground/70 ring-sidebar-ring outline-hidden transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+          className
+        )
+      },
+      props
+    ),
+    render,
+    state: {
+      slot: "sidebar-group-label",
+      sidebar: "group-label"
+    }
+  });
+}
+function SidebarGroupContent(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "sidebar-group-content",
+      "data-sidebar": "group-content",
+      className: (0, import_cn11.cn)("w-full text-xs", className)
     }, props)
   );
 }
 function SidebarMenu(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     "ul",
     __spreadValues({
       "data-slot": "sidebar-menu",
       "data-sidebar": "menu",
-      className: (0, import_cn8.cn)("flex w-full min-w-0 flex-col gap-px", className)
+      className: (0, import_cn11.cn)("flex w-full min-w-0 flex-col gap-px", className)
     }, props)
   );
 }
 function SidebarMenuItem(_a) {
   var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     "li",
     __spreadValues({
       "data-slot": "sidebar-menu-item",
       "data-sidebar": "menu-item",
-      className: (0, import_cn8.cn)("group/menu-item relative", className)
+      className: (0, import_cn11.cn)("group/menu-item relative", className)
     }, props)
   );
 }
@@ -342,15 +1170,15 @@ function SidebarMenuButton(_a) {
     "className"
   ]);
   const { isMobile, state } = useSidebar();
-  const comp = (0, import_use_render.useRender)({
+  const comp = (0, import_use_render2.useRender)({
     defaultTagName: "button",
-    props: (0, import_merge_props.mergeProps)(
+    props: (0, import_merge_props2.mergeProps)(
       {
-        className: (0, import_cn8.cn)(sidebarMenuButtonVariants({ variant, size }), className)
+        className: (0, import_cn11.cn)(sidebarMenuButtonVariants({ variant, size }), className)
       },
       props
     ),
-    render: !tooltip ? render : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(TooltipTrigger, { render }),
+    render: !tooltip ? render : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(TooltipTrigger, { render }),
     state: {
       slot: "sidebar-menu-button",
       sidebar: "menu-button",
@@ -366,9 +1194,9 @@ function SidebarMenuButton(_a) {
       children: tooltip
     };
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Tooltip, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(Tooltip, { children: [
     comp,
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
       TooltipContent,
       __spreadValues({
         side: "right",
@@ -378,29 +1206,250 @@ function SidebarMenuButton(_a) {
     )
   ] });
 }
+function SidebarMenuBadge(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "sidebar-menu-badge",
+      "data-sidebar": "menu-badge",
+      className: (0, import_cn11.cn)(
+        "pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-[calc(var(--radius-sm)-2px)] px-1 text-xs font-medium text-sidebar-foreground tabular-nums select-none group-data-[collapsible=icon]:hidden peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 peer-data-active/menu-button:text-sidebar-accent-foreground",
+        className
+      )
+    }, props)
+  );
+}
 
-// src/components/composed/nav-user.tsx
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var NavUser = (0, import_react2.memo)(function NavUser2({
+// src/components/composed/app-sidebar.tsx
+var import_jsx_runtime12 = require("react/jsx-runtime");
+function formatSegment(segment, subHref, navMainItems = [], navSecondaryItems = []) {
+  if (subHref) {
+    const matched = [...navMainItems, ...navSecondaryItems].find(
+      (item) => item.url === subHref
+    );
+    if (matched) return matched.title;
+  }
+  return segment.split("-").map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(" ");
+}
+function isRouteActive(url, pathname) {
+  if (!pathname) return false;
+  if (url === "/") return pathname === "/";
+  const rootPrefix = `/${url.split("/")[1]}`;
+  return pathname === url || pathname.startsWith(rootPrefix);
+}
+var AppSidebar = (0, import_react.memo)(function AppSidebar2({
   name,
   email,
+  orgRole,
+  brand = "Prediktif",
+  href,
+  confirmDialog = false,
+  headerDropdown = false,
   image,
-  render
+  defaultOpen = true,
+  navMainItems,
+  navSecondaryItems = [],
+  organizations,
+  activeOrg,
+  setActiveOrg,
+  children
 }) {
+  const _isMobile = useIsMobile();
+  const pathname = (0, import_navigation.usePathname)();
+  const segments = pathname ? pathname.split("/").filter(Boolean) : [];
   const initials = name ? name.trim().split(" ").map((n) => n[0]).join("").substring(0, 2).toUpperCase() : "U";
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SidebarFooter, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(SidebarMenuButton, { size: "lg", render, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(Avatar, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AvatarImage, { src: image || "", alt: name || "" }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AvatarFallback, { children: initials })
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarProvider, { defaultOpen, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(Sidebar, { collapsible: "icon", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarHeader, { children: headerDropdown ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(DropdownMenu, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          DropdownMenuTrigger,
+          {
+            render: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+              SidebarMenuButton,
+              {
+                size: "lg",
+                className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.Command, { className: "size-4" }) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate font-medium", children: (activeOrg == null ? void 0 : activeOrg.name) || brand }),
+                    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate text-xs", children: (activeOrg == null ? void 0 : activeOrg.plan) || orgRole })
+                  ] }),
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.ChevronsUpDown, { className: "ml-auto" })
+                ]
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          DropdownMenuContent,
+          {
+            className: "w-(--radix-dropdown-menu-trigger-width) min-w-60 rounded-lg",
+            align: "start",
+            side: "bottom",
+            sideOffset: 4,
+            children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(DropdownMenuGroup, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownMenuLabel, { className: "text-xs text-muted-foreground", children: "Organizations" }),
+              (organizations || []).map((org) => {
+                return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+                  DropdownMenuItem,
+                  {
+                    onClick: () => setActiveOrg == null ? void 0 : setActiveOrg(org),
+                    className: "gap-2 p-2",
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex size-6 items-center justify-center rounded-md border", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.Command, { className: "size-3.5 shrink-0" }) }),
+                      org.name
+                    ]
+                  },
+                  org.name
+                );
+              })
+            ] })
+          }
+        )
+      ] }) }) }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenuItem, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarMenuButton, { size: "lg", render: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_link.default, { href: "/" }), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.Command, { className: "size-4" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate font-medium", children: brand }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate text-xs", children: orgRole })
+        ] })
+      ] }) }) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarContent, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarGroup, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarGroupLabel, { children: "Platform" }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenu, { children: navMainItems.map(({ title, url, icon: Icon, locked }) => {
+            const isActive = isRouteActive(url, pathname);
+            return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarMenuItem, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+                SidebarMenuButton,
+                {
+                  isActive,
+                  tooltip: title,
+                  render: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_link.default, { href: url }),
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, {}),
+                    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { children: title })
+                  ]
+                }
+              ),
+              locked && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenuBadge, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.LockIcon, { size: 12 }) })
+            ] }, title);
+          }) })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarGroup, { className: "mt-auto", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarGroupContent, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenu, { children: navSecondaryItems.map(({ title, url, icon: Icon, locked }) => {
+          const isActive = isRouteActive(url, pathname);
+          return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarMenuItem, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+              SidebarMenuButton,
+              {
+                size: "sm",
+                isActive,
+                tooltip: title,
+                render: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_link.default, { href: url }),
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, {}),
+                  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { children: title })
+                ]
+              }
+            ),
+            locked && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenuBadge, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_lucide_react5.LockIcon, { size: 12 }) })
+          ] }, title);
+        }) }) }) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarFooter, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenu, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarMenuItem, { children: confirmDialog ? /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(AlertDialog, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          AlertDialogTrigger,
+          {
+            render: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarMenuButton, { size: "lg", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(Avatar, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(AvatarImage, { src: image || "", alt: name || "" }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(AvatarFallback, { children: initials })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate font-medium", children: name }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate text-xs text-muted-foreground", children: email })
+              ] })
+            ] })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(AlertDialogContent, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(AlertDialogHeader, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(AlertDialogTitle, { children: "Manage Account in Identity" }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(AlertDialogDescription, { children: "You will be redirected to the Identity website to manage your profile, account, and settings." })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(AlertDialogFooter, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(AlertDialogCancel, { children: "Cancel" }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+              AlertDialogAction,
+              {
+                nativeButton: false,
+                render: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_link.default, { href, target: "_blank" }),
+                children: "Continue"
+              }
+            )
+          ] })
+        ] })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarMenuButton, { size: "lg", render: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_link.default, { href }), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(Avatar, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(AvatarImage, { src: image || "", alt: name || "" }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(AvatarFallback, { children: initials })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate font-medium", children: name }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "truncate text-xs text-muted-foreground", children: email })
+        ] })
+      ] }) }) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarRail, {})
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "truncate font-medium", children: name }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "truncate text-xs text-muted-foreground", children: email })
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SidebarInset, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("header", { className: "flex h-16 shrink-0 items-center gap-2 transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-12", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex items-center gap-2 px-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidebarTrigger, { className: "-ml-1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+          Separator,
+          {
+            orientation: "vertical",
+            className: "mr-2 data-vertical:h-4 data-vertical:self-auto"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Breadcrumb, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(BreadcrumbList, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(BreadcrumbItem, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(BreadcrumbLink, { render: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_link.default, { href: "/" }), children: "Platform" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(BreadcrumbSeparator, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(BreadcrumbItem, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(BreadcrumbPage, { children: segments.length === 0 ? "Overview" : formatSegment(
+            segments[segments.length - 1],
+            `/${segments.join("/")}`,
+            navMainItems,
+            navSecondaryItems
+          ) }) })
+        ] }) })
+      ] }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "p-4 pt-0", children })
     ] })
-  ] }) }) }) });
+  ] });
+});
+
+// src/components/composed/header-title.tsx
+var import_react2 = require("react");
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var HeaderTitle = (0, import_react2.memo)(function HeaderTitle2({
+  title,
+  subtitle,
+  children
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "w-full space-y-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("h1", { className: "font-semibold", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-xs text-muted-foreground", children: subtitle })
+    ] }),
+    children
+  ] });
 });
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  HeaderTitle,
-  NavUser
+  AppSidebar,
+  HeaderTitle
 });