@pautena/react-design-system 2.0.0-alpha.1b → 2.0.0-alpha.4

package/dist/components/date-range-picker/date-range-picker.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-range-picker.mjs","sources":["../../../src/components/date-range-picker/date-range-picker.tsx"],"sourcesContent":["import { format } from \"date-fns\";\nimport { Calendar as CalendarIcon } from \"lucide-react\";\nimport { useState } from \"react\";\nimport Button from \"@/components/button\";\nimport TextField from \"@/components/forms/text-field\";\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from \"@/components/ui/popover\";\nimport DateRangeCalendar from \"../date-range-calendar\";\n\ntype DateRange = [Date, Date | undefined];\n\n/**\n * Props for the DateRangePicker component.\n */\nexport interface DateRangePickerProps {\n  /**\n   * The label for the date range picker.\n   */\n  label: string;\n\n  /**\n   * The default value for the date range picker.\n   */\n  defaultValue: DateRange;\n\n  /**\n   * The format in which the date range should be displayed.\n   */\n  format: string;\n\n  /**\n   * If true, the date range picker will take up the full width of its container.\n   * @default false\n   */\n  fullWidth?: boolean;\n\n  /**\n   * The size of the date range picker.\n   * @default \"medium\"\n   */\n  size?: \"small\" | \"medium\";\n\n  /**\n   * Callback function that is called when the value of the date range picker changes.\n   * @param value - The new date range value.\n   * @param index - The index of the date range picker.\n   */\n  onValueChange: (value: DateRange, index: number) => void;\n}\n\n/**\n * DateRangePicker component allows users to select a date range.\n */\nexport function DateRangePicker({\n  defaultValue,\n  format: fmt,\n  label,\n  fullWidth,\n  onValueChange,\n  size = \"medium\",\n}: DateRangePickerProps) {\n  const [isPopoverOpened, setIsPopoverOpened] = useState(false);\n  const [value, setValue] = useState(defaultValue);\n\n  const handleValueChange = (newValue: DateRange, index: number) => {\n    setValue(newValue);\n    onValueChange(newValue, index);\n    setIsPopoverOpened(index < 1);\n  };\n\n  return (\n    <Popover open={isPopoverOpened} onOpenChange={setIsPopoverOpened}>\n      <TextField\n        label={label}\n        fullWidth={fullWidth}\n        size={size}\n        readOnly\n        value={`${format(value[0], fmt)} - ${value[1] ? format(value[1], fmt) : fmt.toUpperCase()}`}\n        InputProps={{\n          endAdornment: (\n            <PopoverTrigger\n              render={(triggerProps) => (\n                <Button\n                  {...triggerProps}\n                  type=\"button\"\n                  variant=\"ghost\"\n                  size=\"icon-sm\"\n                  aria-label=\"open calendar\"\n                >\n                  <CalendarIcon className=\"h-4 w-4\" aria-hidden=\"true\" />\n                </Button>\n              )}\n            />\n          ),\n        }}\n      />\n      <PopoverContent className=\"w-auto p-0\" align=\"end\">\n        <DateRangeCalendar\n          defaultValue={value}\n          onValueChange={handleValueChange}\n        />\n      </PopoverContent>\n    </Popover>\n  );\n}\n\nexport default DateRangePicker;\n"],"names":["DateRangePicker","defaultValue","fmt","label","fullWidth","onValueChange","size","isPopoverOpened","setIsPopoverOpened","useState","value","setValue","handleValueChange","newValue","index","jsxs","Popover","jsx","TextField","format","PopoverTrigger","triggerProps","Button","CalendarIcon","PopoverContent","DateRangeCalendar"],"mappings":";;;;;;;;AAwDO,SAASA,EAAgB;AAAA,EAC9B,cAAAC;AAAA,EACA,QAAQC;AAAA,EACR,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,eAAAC;AAAA,EACA,MAAAC,IAAO;AACT,GAAyB;AACvB,QAAM,CAACC,GAAiBC,CAAkB,IAAIC,EAAS,EAAK,GACtD,CAACC,GAAOC,CAAQ,IAAIF,EAASR,CAAY,GAEzCW,IAAoB,CAACC,GAAqBC,MAAkB;AAChE,IAAAH,EAASE,CAAQ,GACjBR,EAAcQ,GAAUC,CAAK,GAC7BN,EAAmBM,IAAQ,CAAC;AAAA,EAC9B;AAEA,SACE,gBAAAC,EAACC,GAAA,EAAQ,MAAMT,GAAiB,cAAcC,GAC5C,UAAA;AAAA,IAAA,gBAAAS;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,OAAAf;AAAA,QACA,WAAAC;AAAA,QACA,MAAAE;AAAA,QACA,UAAQ;AAAA,QACR,OAAO,GAAGa,EAAOT,EAAM,CAAC,GAAGR,CAAG,CAAC,MAAMQ,EAAM,CAAC,IAAIS,EAAOT,EAAM,CAAC,GAAGR,CAAG,IAAIA,EAAI,aAAa;AAAA,QACzF,YAAY;AAAA,UACV,cACE,gBAAAe;AAAA,YAACG;AAAA,YAAA;AAAA,cACC,QAAQ,CAACC,MACP,gBAAAJ;AAAA,gBAACK;AAAA,gBAAA;AAAA,kBACE,GAAGD;AAAA,kBACJ,MAAK;AAAA,kBACL,SAAQ;AAAA,kBACR,MAAK;AAAA,kBACL,cAAW;AAAA,kBAEX,UAAA,gBAAAJ,EAACM,GAAA,EAAa,WAAU,WAAU,eAAY,OAAA,CAAO;AAAA,gBAAA;AAAA,cAAA;AAAA,YACvD;AAAA,UAAA;AAAA,QAEJ;AAAA,MAEJ;AAAA,IAAA;AAAA,IAEF,gBAAAN,EAACO,GAAA,EAAe,WAAU,cAAa,OAAM,OAC3C,UAAA,gBAAAP;AAAA,MAACQ;AAAA,MAAA;AAAA,QACC,cAAcf;AAAA,QACd,eAAeE;AAAA,MAAA;AAAA,IAAA,EACjB,CACF;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/date-range-picker/index.d.ts

@@ -0,0 +1,2 @@
+export type { DateRangePickerProps } from './date-range-picker';
+export { default, default as DateRangePicker } from './date-range-picker';

package/dist/components/dialog/dialog.d.ts

@@ -0,0 +1,53 @@
+import { ReactNode } from 'react';
+/**
+ * Supported sizes for dialog content.
+ */
+export type DialogSize = "sm" | "md" | "lg";
+/**
+ * Props for the Dialog component.
+ */
+export interface DialogProps {
+    /**
+     * Whether the dialog is open.
+     */
+    open: boolean;
+    /**
+     * Dialog title.
+     */
+    title?: ReactNode;
+    /**
+     * Optional description text rendered under the title.
+     */
+    description?: ReactNode;
+    /**
+     * Dialog body content.
+     */
+    children?: ReactNode;
+    /**
+     * Optional footer content rendered at the bottom.
+     */
+    footer?: ReactNode;
+    /**
+     * Size variant for the dialog content.
+     * @default "md"
+     */
+    size?: DialogSize;
+    /**
+     * Shows the close button in the dialog content.
+     * @default true
+     */
+    showCloseButton?: boolean;
+    /**
+     * Callback fired when the dialog requests to close.
+     */
+    onClose: () => void;
+    /**
+     * Additional class names for the dialog content.
+     */
+    className?: string;
+}
+/**
+ * Base dialog wrapper for consumer-facing usage.
+ */
+export declare function Dialog({ open, title, description, children, footer, size, showCloseButton, onClose, className, }: DialogProps): import("react/jsx-runtime").JSX.Element;
+export default Dialog;

package/dist/components/dialog/dialog.mjs

@@ -0,0 +1,49 @@
+import { jsx as l, jsxs as o } from "react/jsx-runtime";
+import { Dialog as D, DialogContent as u, DialogHeader as h, DialogTitle as t, DialogDescription as x, DialogFooter as f } from "../ui/dialog.mjs";
+import { cn as p } from "../../lib/utils.mjs";
+const w = {
+  sm: "sm:max-w-sm",
+  md: "sm:max-w-md",
+  lg: "sm:max-w-lg"
+};
+function F({
+  open: i,
+  title: a,
+  description: n,
+  children: e,
+  footer: m,
+  size: r = "md",
+  showCloseButton: s = !0,
+  onClose: g,
+  className: c
+}) {
+  return /* @__PURE__ */ l(
+    D,
+    {
+      open: i,
+      onOpenChange: (d) => {
+        d || g();
+      },
+      children: /* @__PURE__ */ o(
+        u,
+        {
+          showCloseButton: s,
+          className: p(w[r], c),
+          children: [
+            a || n ? /* @__PURE__ */ o(h, { children: [
+              a ? /* @__PURE__ */ l(t, { children: a }) : null,
+              n ? /* @__PURE__ */ l(x, { children: n }) : null
+            ] }) : null,
+            e,
+            m ? /* @__PURE__ */ l(f, { children: m }) : null
+          ]
+        }
+      )
+    }
+  );
+}
+export {
+  F as Dialog,
+  F as default
+};
+//# sourceMappingURL=dialog.mjs.map

package/dist/components/dialog/dialog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.mjs","sources":["../../../src/components/dialog/dialog.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport {\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  Dialog as DialogRoot,\n  DialogTitle,\n} from \"@/components/ui/dialog\";\nimport { cn } from \"@/lib/utils\";\n\n/**\n * Supported sizes for dialog content.\n */\nexport type DialogSize = \"sm\" | \"md\" | \"lg\";\n\n/**\n * Props for the Dialog component.\n */\nexport interface DialogProps {\n  /**\n   * Whether the dialog is open.\n   */\n  open: boolean;\n  /**\n   * Dialog title.\n   */\n  title?: ReactNode;\n  /**\n   * Optional description text rendered under the title.\n   */\n  description?: ReactNode;\n  /**\n   * Dialog body content.\n   */\n  children?: ReactNode;\n  /**\n   * Optional footer content rendered at the bottom.\n   */\n  footer?: ReactNode;\n  /**\n   * Size variant for the dialog content.\n   * @default \"md\"\n   */\n  size?: DialogSize;\n  /**\n   * Shows the close button in the dialog content.\n   * @default true\n   */\n  showCloseButton?: boolean;\n  /**\n   * Callback fired when the dialog requests to close.\n   */\n  onClose: () => void;\n  /**\n   * Additional class names for the dialog content.\n   */\n  className?: string;\n}\n\nconst sizeClasses: Record<DialogSize, string> = {\n  sm: \"sm:max-w-sm\",\n  md: \"sm:max-w-md\",\n  lg: \"sm:max-w-lg\",\n};\n\n/**\n * Base dialog wrapper for consumer-facing usage.\n */\nexport function Dialog({\n  open,\n  title,\n  description,\n  children,\n  footer,\n  size = \"md\",\n  showCloseButton = true,\n  onClose,\n  className,\n}: DialogProps) {\n  return (\n    <DialogRoot\n      open={open}\n      onOpenChange={(nextOpen) => {\n        if (!nextOpen) {\n          onClose();\n        }\n      }}\n    >\n      <DialogContent\n        showCloseButton={showCloseButton}\n        className={cn(sizeClasses[size], className)}\n      >\n        {title || description ? (\n          <DialogHeader>\n            {title ? <DialogTitle>{title}</DialogTitle> : null}\n            {description ? (\n              <DialogDescription>{description}</DialogDescription>\n            ) : null}\n          </DialogHeader>\n        ) : null}\n\n        {children}\n\n        {footer ? <DialogFooter>{footer}</DialogFooter> : null}\n      </DialogContent>\n    </DialogRoot>\n  );\n}\n\nexport default Dialog;\n"],"names":["sizeClasses","Dialog","open","title","description","children","footer","size","showCloseButton","onClose","className","jsx","DialogRoot","nextOpen","jsxs","DialogContent","cn","DialogHeader","DialogTitle","DialogDescription","DialogFooter"],"mappings":";;;AA4DA,MAAMA,IAA0C;AAAA,EAC9C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAKO,SAASC,EAAO;AAAA,EACrB,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,iBAAAC,IAAkB;AAAA,EAClB,SAAAC;AAAA,EACA,WAAAC;AACF,GAAgB;AACd,SACE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,MAAAV;AAAA,MACA,cAAc,CAACW,MAAa;AAC1B,QAAKA,KACHJ,EAAA;AAAA,MAEJ;AAAA,MAEA,UAAA,gBAAAK;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,iBAAAP;AAAA,UACA,WAAWQ,EAAGhB,EAAYO,CAAI,GAAGG,CAAS;AAAA,UAEzC,UAAA;AAAA,YAAAP,KAASC,sBACPa,GAAA,EACE,UAAA;AAAA,cAAAd,IAAQ,gBAAAQ,EAACO,GAAA,EAAa,UAAAf,EAAA,CAAM,IAAiB;AAAA,cAC7CC,IACC,gBAAAO,EAACQ,GAAA,EAAmB,UAAAf,EAAA,CAAY,IAC9B;AAAA,YAAA,EAAA,CACN,IACE;AAAA,YAEHC;AAAA,YAEAC,IAAS,gBAAAK,EAACS,GAAA,EAAc,UAAAd,EAAA,CAAO,IAAkB;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACpD;AAAA,EAAA;AAGN;"}

package/dist/components/dialog/index.d.ts

@@ -0,0 +1,2 @@
+export type { DialogProps, DialogSize } from './dialog';
+export { default, default as Dialog } from './dialog';

package/dist/components/drawer/drawer.d.ts

@@ -0,0 +1,5 @@
+import { DrawerProps } from '../drawerx/drawer.types';
+/**
+ * Drawer navigation container.
+ */
+export default function Drawer({ children, className, ...rest }: DrawerProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/drawer/drawer.mjs

@@ -0,0 +1,22 @@
+import { jsxs as l, jsx as r } from "react/jsx-runtime";
+import { Sidebar as o, SidebarRail as s } from "../ui/sidebar.mjs";
+import { cn as m } from "../../lib/utils.mjs";
+function n({ children: e, className: a, ...i }) {
+  return /* @__PURE__ */ l(
+    o,
+    {
+      collapsible: "icon",
+      variant: "sidebar",
+      className: m("z-40", a),
+      ...i,
+      children: [
+        /* @__PURE__ */ r("div", { role: "menu", className: "flex h-full flex-col border-r bg-sidebar", children: e }),
+        /* @__PURE__ */ r(s, {})
+      ]
+    }
+  );
+}
+export {
+  n as default
+};
+//# sourceMappingURL=drawer.mjs.map

package/dist/components/drawer/drawer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.mjs","sources":["../../../src/components/drawer/drawer.tsx"],"sourcesContent":["import type { DrawerProps } from \"@/components/drawerx/drawer.types\";\nimport { Sidebar, SidebarRail } from \"@/components/ui/sidebar\";\nimport { cn } from \"@/lib/utils\";\n\n/**\n * Drawer navigation container.\n */\nexport default function Drawer({ children, className, ...rest }: DrawerProps) {\n  return (\n    <Sidebar\n      collapsible=\"icon\"\n      variant=\"sidebar\"\n      className={cn(\"z-40\", className)}\n      {...rest}\n    >\n      <div role=\"menu\" className=\"flex h-full flex-col border-r bg-sidebar\">\n        {children}\n      </div>\n      <SidebarRail />\n    </Sidebar>\n  );\n}\n"],"names":["Drawer","children","className","rest","jsxs","Sidebar","cn","jsx","SidebarRail"],"mappings":";;;AAOA,SAAwBA,EAAO,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,KAAqB;AAC5E,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAY;AAAA,MACZ,SAAQ;AAAA,MACR,WAAWC,EAAG,QAAQJ,CAAS;AAAA,MAC9B,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAI,EAAC,OAAA,EAAI,MAAK,QAAO,WAAU,4CACxB,UAAAN,GACH;AAAA,0BACCO,GAAA,CAAA,CAAY;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGnB;"}

package/dist/components/drawer/index.d.ts

@@ -0,0 +1 @@
+export { default, default as Drawer } from './drawer';

package/dist/components/drawer-app-bar/drawer-app-bar.d.ts

@@ -0,0 +1,5 @@
+import { DrawerAppBarProps } from '../drawerx/drawer.types';
+/**
+ * Top app bar adapted for drawer layouts.
+ */
+export default function DrawerAppBar({ title, className, children, ...rest }: DrawerAppBarProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/drawer-app-bar/drawer-app-bar.mjs

@@ -0,0 +1,33 @@
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { useDrawer as i } from "../drawer-context/drawer-context.mjs";
+import "react";
+import { SidebarTrigger as s } from "../ui/sidebar.mjs";
+import { cn as n } from "../../lib/utils.mjs";
+function b({
+  title: r,
+  className: a,
+  children: o,
+  ...t
+}) {
+  const { clipped: l } = i();
+  return /* @__PURE__ */ m(
+    "header",
+    {
+      className: n(
+        "z-20 flex h-14 w-full items-center border-b bg-background px-4",
+        l && "fixed top-0",
+        a
+      ),
+      ...t,
+      children: [
+        /* @__PURE__ */ e(s, { "aria-label": "open drawer", className: "mr-2" }),
+        r ? /* @__PURE__ */ e("h1", { className: "truncate text-lg font-semibold", children: r }) : null,
+        o
+      ]
+    }
+  );
+}
+export {
+  b as default
+};
+//# sourceMappingURL=drawer-app-bar.mjs.map

package/dist/components/drawer-app-bar/drawer-app-bar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-app-bar.mjs","sources":["../../../src/components/drawer-app-bar/drawer-app-bar.tsx"],"sourcesContent":["import { useDrawer } from \"@/components/drawer-context\";\nimport type { DrawerAppBarProps } from \"@/components/drawerx/drawer.types\";\nimport { SidebarTrigger } from \"@/components/ui/sidebar\";\nimport { cn } from \"@/lib/utils\";\n\n/**\n * Top app bar adapted for drawer layouts.\n */\nexport default function DrawerAppBar({\n  title,\n  className,\n  children,\n  ...rest\n}: DrawerAppBarProps) {\n  const { clipped } = useDrawer();\n\n  return (\n    <header\n      className={cn(\n        \"z-20 flex h-14 w-full items-center border-b bg-background px-4\",\n        clipped && \"fixed top-0\",\n        className,\n      )}\n      {...rest}\n    >\n      <SidebarTrigger aria-label=\"open drawer\" className=\"mr-2\" />\n\n      {title ? (\n        <h1 className=\"truncate text-lg font-semibold\">{title}</h1>\n      ) : null}\n      {children}\n    </header>\n  );\n}\n"],"names":["DrawerAppBar","title","className","children","rest","clipped","useDrawer","jsxs","cn","jsx","SidebarTrigger"],"mappings":";;;;;AAQA,SAAwBA,EAAa;AAAA,EACnC,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GAAsB;AACpB,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA;AAEpB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAH,KAAW;AAAA,QACXH;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAK,EAACC,GAAA,EAAe,cAAW,eAAc,WAAU,QAAO;AAAA,QAEzDT,IACC,gBAAAQ,EAAC,MAAA,EAAG,WAAU,kCAAkC,aAAM,IACpD;AAAA,QACHN;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/drawer-app-bar/index.d.ts

@@ -0,0 +1,2 @@
+export type { DrawerAppBarProps } from '../drawerx/drawer.types';
+export { default, default as DrawerAppBar } from './drawer-app-bar';

package/dist/components/drawer-content/drawer-content.d.ts

@@ -0,0 +1,5 @@
+import { DrawerContentProps } from '../drawerx/drawer.types';
+/**
+ * Content rendered inside drawer navigation.
+ */
+export default function DrawerContent({ navigation }: DrawerContentProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/drawer-content/drawer-content.mjs

@@ -0,0 +1,84 @@
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import * as l from "react";
+import m from "../drawer-item/drawer-item.mjs";
+import "../drawer-context/drawer-context.mjs";
+import { useSidebar as c, SidebarContent as p, SidebarGroup as u, SidebarMenu as h, SidebarMenuAction as f } from "../ui/sidebar.mjs";
+import { DropdownMenu as b, DropdownMenuTrigger as w, DropdownMenuContent as g, DropdownMenuItem as a, DropdownMenuSeparator as M } from "../ui/dropdown-menu.mjs";
+import D from "../drawer-subheader/drawer-subheader.mjs";
+import S from "../../node_modules/lucide-react/dist/esm/icons/ellipsis.mjs";
+import x from "../../node_modules/lucide-react/dist/esm/icons/folder.mjs";
+import N from "../../node_modules/lucide-react/dist/esm/icons/forward.mjs";
+import k from "../../node_modules/lucide-react/dist/esm/icons/trash-2.mjs";
+function v(t) {
+  const n = [];
+  let r = {
+    id: "section-platform",
+    label: "Platform",
+    items: []
+  };
+  for (const o of t) {
+    if (o.kind === "header") {
+      r.items.length > 0 && n.push(r), r = { id: o.id, label: o.text, items: [] };
+      continue;
+    }
+    r.items.push(o);
+  }
+  return r.items.length > 0 && n.push(r), n;
+}
+const C = (t) => /* @__PURE__ */ i(b, { children: [
+  /* @__PURE__ */ i(w, { render: /* @__PURE__ */ e(f, { showOnHover: !0 }), children: [
+    /* @__PURE__ */ e(S, {}),
+    /* @__PURE__ */ e("span", { className: "sr-only", children: "More" })
+  ] }),
+  /* @__PURE__ */ i(
+    g,
+    {
+      className: "w-48 rounded-lg",
+      side: t ? "bottom" : "right",
+      align: t ? "end" : "start",
+      children: [
+        /* @__PURE__ */ i(a, { children: [
+          /* @__PURE__ */ e(x, { className: "text-muted-foreground" }),
+          /* @__PURE__ */ e("span", { children: "View item" })
+        ] }),
+        /* @__PURE__ */ i(a, { children: [
+          /* @__PURE__ */ e(N, { className: "text-muted-foreground" }),
+          /* @__PURE__ */ e("span", { children: "Share item" })
+        ] }),
+        /* @__PURE__ */ e(M, {}),
+        /* @__PURE__ */ i(a, { children: [
+          /* @__PURE__ */ e(k, { className: "text-muted-foreground" }),
+          /* @__PURE__ */ e("span", { children: "Delete item" })
+        ] })
+      ]
+    }
+  )
+] });
+function O({ navigation: t }) {
+  const { isMobile: n } = c(), r = l.useMemo(
+    () => v(t),
+    [t]
+  );
+  return /* @__PURE__ */ e(p, { children: r.map((o, s) => /* @__PURE__ */ i(
+    u,
+    {
+      className: s > 0 ? "group-data-[collapsible=icon]:hidden" : void 0,
+      children: [
+        /* @__PURE__ */ e(D, { role: "heading", "aria-level": 2, children: o.label }),
+        /* @__PURE__ */ e(h, { children: o.items.map((d) => /* @__PURE__ */ e(
+          m,
+          {
+            item: d,
+            action: s > 0 && d.kind === "link" ? C(n) : void 0
+          },
+          d.id
+        )) })
+      ]
+    },
+    o.id
+  )) });
+}
+export {
+  O as default
+};
+//# sourceMappingURL=drawer-content.mjs.map

package/dist/components/drawer-content/drawer-content.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-content.mjs","sources":["../../../src/components/drawer-content/drawer-content.tsx"],"sourcesContent":["import { Folder, Forward, MoreHorizontal, Trash2 } from \"lucide-react\";\nimport * as React from \"react\";\nimport DrawerItem from \"@/components/drawer-item\";\nimport DrawerSubheader from \"@/components/drawer-subheader\";\nimport type {\n  DrawerContentProps,\n  DrawerNavigation,\n  DrawerNavigationItem,\n} from \"@/components/drawerx/drawer.types\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport {\n  SidebarContent as SidebarContentPrimitive,\n  SidebarGroup,\n  SidebarMenu,\n  SidebarMenuAction,\n  useSidebar,\n} from \"@/components/ui/sidebar\";\n\ntype DrawerRenderableItem = Exclude<DrawerNavigationItem, { kind: \"header\" }>;\n\nfunction splitByHeaders(navigation: DrawerNavigation) {\n  const sections: {\n    id: string;\n    label: string;\n    items: DrawerRenderableItem[];\n  }[] = [];\n  let current = {\n    id: \"section-platform\",\n    label: \"Platform\",\n    items: [] as DrawerRenderableItem[],\n  };\n\n  for (const item of navigation) {\n    if (item.kind === \"header\") {\n      if (current.items.length > 0) {\n        sections.push(current);\n      }\n      current = { id: item.id, label: item.text, items: [] };\n      continue;\n    }\n    current.items.push(item);\n  }\n\n  if (current.items.length > 0) {\n    sections.push(current);\n  }\n\n  return sections;\n}\n\nconst buildActionMenu = (isMobile: boolean) => (\n  <DropdownMenu>\n    <DropdownMenuTrigger render={<SidebarMenuAction showOnHover />}>\n      <MoreHorizontal />\n      <span className=\"sr-only\">More</span>\n    </DropdownMenuTrigger>\n    <DropdownMenuContent\n      className=\"w-48 rounded-lg\"\n      side={isMobile ? \"bottom\" : \"right\"}\n      align={isMobile ? \"end\" : \"start\"}\n    >\n      <DropdownMenuItem>\n        <Folder className=\"text-muted-foreground\" />\n        <span>View item</span>\n      </DropdownMenuItem>\n      <DropdownMenuItem>\n        <Forward className=\"text-muted-foreground\" />\n        <span>Share item</span>\n      </DropdownMenuItem>\n      <DropdownMenuSeparator />\n      <DropdownMenuItem>\n        <Trash2 className=\"text-muted-foreground\" />\n        <span>Delete item</span>\n      </DropdownMenuItem>\n    </DropdownMenuContent>\n  </DropdownMenu>\n);\n\n/**\n * Content rendered inside drawer navigation.\n */\nexport default function DrawerContent({ navigation }: DrawerContentProps) {\n  const { isMobile } = useSidebar();\n  const sections = React.useMemo(\n    () => splitByHeaders(navigation),\n    [navigation],\n  );\n\n  return (\n    <SidebarContentPrimitive>\n      {sections.map((section, index) => (\n        <SidebarGroup\n          key={section.id}\n          className={\n            index > 0 ? \"group-data-[collapsible=icon]:hidden\" : undefined\n          }\n        >\n          <DrawerSubheader role=\"heading\" aria-level={2}>\n            {section.label}\n          </DrawerSubheader>\n          <SidebarMenu>\n            {section.items.map((item) => (\n              <DrawerItem\n                key={item.id}\n                item={item}\n                action={\n                  index > 0 && item.kind === \"link\"\n                    ? buildActionMenu(isMobile)\n                    : undefined\n                }\n              />\n            ))}\n          </SidebarMenu>\n        </SidebarGroup>\n      ))}\n    </SidebarContentPrimitive>\n  );\n}\n"],"names":["splitByHeaders","navigation","sections","current","item","buildActionMenu","isMobile","jsxs","DropdownMenu","DropdownMenuTrigger","jsx","SidebarMenuAction","MoreHorizontal","DropdownMenuContent","DropdownMenuItem","Folder","Forward","DropdownMenuSeparator","Trash2","DrawerContent","useSidebar","React","SidebarContentPrimitive","section","index","SidebarGroup","DrawerSubheader","SidebarMenu","DrawerItem"],"mappings":";;;;;;;;;;;AA0BA,SAASA,EAAeC,GAA8B;AACpD,QAAMC,IAIA,CAAA;AACN,MAAIC,IAAU;AAAA,IACZ,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,OAAO,CAAA;AAAA,EAAC;AAGV,aAAWC,KAAQH,GAAY;AAC7B,QAAIG,EAAK,SAAS,UAAU;AAC1B,MAAID,EAAQ,MAAM,SAAS,KACzBD,EAAS,KAAKC,CAAO,GAEvBA,IAAU,EAAE,IAAIC,EAAK,IAAI,OAAOA,EAAK,MAAM,OAAO,GAAC;AACnD;AAAA,IACF;AACA,IAAAD,EAAQ,MAAM,KAAKC,CAAI;AAAA,EACzB;AAEA,SAAID,EAAQ,MAAM,SAAS,KACzBD,EAAS,KAAKC,CAAO,GAGhBD;AACT;AAEA,MAAMG,IAAkB,CAACC,MACvB,gBAAAC,EAACC,GAAA,EACC,UAAA;AAAA,EAAA,gBAAAD,EAACE,KAAoB,QAAQ,gBAAAC,EAACC,GAAA,EAAkB,aAAW,IAAC,GAC1D,UAAA;AAAA,IAAA,gBAAAD,EAACE,GAAA,EAAe;AAAA,IAChB,gBAAAF,EAAC,QAAA,EAAK,WAAU,WAAU,UAAA,OAAA,CAAI;AAAA,EAAA,GAChC;AAAA,EACA,gBAAAH;AAAA,IAACM;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,MAAMP,IAAW,WAAW;AAAA,MAC5B,OAAOA,IAAW,QAAQ;AAAA,MAE1B,UAAA;AAAA,QAAA,gBAAAC,EAACO,GAAA,EACC,UAAA;AAAA,UAAA,gBAAAJ,EAACK,GAAA,EAAO,WAAU,wBAAA,CAAwB;AAAA,UAC1C,gBAAAL,EAAC,UAAK,UAAA,YAAA,CAAS;AAAA,QAAA,GACjB;AAAA,0BACCI,GAAA,EACC,UAAA;AAAA,UAAA,gBAAAJ,EAACM,GAAA,EAAQ,WAAU,wBAAA,CAAwB;AAAA,UAC3C,gBAAAN,EAAC,UAAK,UAAA,aAAA,CAAU;AAAA,QAAA,GAClB;AAAA,0BACCO,GAAA,EAAsB;AAAA,0BACtBH,GAAA,EACC,UAAA;AAAA,UAAA,gBAAAJ,EAACQ,GAAA,EAAO,WAAU,wBAAA,CAAwB;AAAA,UAC1C,gBAAAR,EAAC,UAAK,UAAA,cAAA,CAAW;AAAA,QAAA,EAAA,CACnB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AACF,GACF;AAMF,SAAwBS,EAAc,EAAE,YAAAlB,KAAkC;AACxE,QAAM,EAAE,UAAAK,EAAA,IAAac,EAAA,GACflB,IAAWmB,EAAM;AAAA,IACrB,MAAMrB,EAAeC,CAAU;AAAA,IAC/B,CAACA,CAAU;AAAA,EAAA;AAGb,2BACGqB,GAAA,EACE,UAAApB,EAAS,IAAI,CAACqB,GAASC,MACtB,gBAAAjB;AAAA,IAACkB;AAAA,IAAA;AAAA,MAEC,WACED,IAAQ,IAAI,yCAAyC;AAAA,MAGvD,UAAA;AAAA,QAAA,gBAAAd,EAACgB,KAAgB,MAAK,WAAU,cAAY,GACzC,YAAQ,OACX;AAAA,0BACCC,GAAA,EACE,UAAAJ,EAAQ,MAAM,IAAI,CAACnB,MAClB,gBAAAM;AAAA,UAACkB;AAAA,UAAA;AAAA,YAEC,MAAAxB;AAAA,YACA,QACEoB,IAAQ,KAAKpB,EAAK,SAAS,SACvBC,EAAgBC,CAAQ,IACxB;AAAA,UAAA;AAAA,UALDF,EAAK;AAAA,QAAA,CAQb,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,IApBKmB,EAAQ;AAAA,EAAA,CAsBhB,GACH;AAEJ;"}

package/dist/components/drawer-content/index.d.ts

@@ -0,0 +1 @@
+export { default, default as DrawerContent } from './drawer-content';

package/dist/components/drawer-context/drawer-context.d.ts

@@ -0,0 +1,46 @@
+import { DrawerProviderProps, DrawerSize, DrawerState } from '../drawerx/drawer.types';
+export interface DrawerContextProps {
+    /**
+     * ID of selected item.
+     */
+    selectedItemId?: string;
+    /**
+     * Item size.
+     */
+    size: DrawerSize;
+    /**
+     * Current drawer state.
+     */
+    state: DrawerState;
+    /**
+     * Drawer width in pixels.
+     */
+    drawerWidth: number;
+    /**
+     * Whether drawer is clipped.
+     */
+    clipped: boolean;
+    /**
+     * Link component used for navigations.
+     */
+    LinkComponent?: DrawerProviderProps["LinkComponent"];
+    /**
+     * Toggle drawer state.
+     */
+    switchState(): void;
+    /**
+     * Close drawer.
+     */
+    close(): void;
+    /**
+     * Open drawer.
+     */
+    open(): void;
+    /**
+     * Set arbitrary drawer state.
+     */
+    setState: (state: DrawerState) => void;
+}
+export declare const DrawerContext: import('react').Context<DrawerContextProps | undefined>;
+export declare const UndefinedProvider: Error;
+export declare const useDrawer: () => DrawerContextProps;

package/dist/components/drawer-context/drawer-context.mjs

@@ -0,0 +1,17 @@
+import { createContext as r, useContext as t } from "react";
+const o = r(
+  void 0
+), n = new Error(
+  "DrawerContext.Provider is required and was undefined"
+), i = () => {
+  const e = t(o);
+  if (e === void 0)
+    throw n;
+  return e;
+};
+export {
+  o as DrawerContext,
+  n as UndefinedProvider,
+  i as useDrawer
+};
+//# sourceMappingURL=drawer-context.mjs.map

package/dist/components/drawer-context/drawer-context.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-context.mjs","sources":["../../../src/components/drawer-context/drawer-context.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type {\n  DrawerProviderProps,\n  DrawerSize,\n  DrawerState,\n} from \"@/components/drawerx/drawer.types\";\n\nexport interface DrawerContextProps {\n  /**\n   * ID of selected item.\n   */\n  selectedItemId?: string;\n  /**\n   * Item size.\n   */\n  size: DrawerSize;\n  /**\n   * Current drawer state.\n   */\n  state: DrawerState;\n  /**\n   * Drawer width in pixels.\n   */\n  drawerWidth: number;\n  /**\n   * Whether drawer is clipped.\n   */\n  clipped: boolean;\n  /**\n   * Link component used for navigations.\n   */\n  LinkComponent?: DrawerProviderProps[\"LinkComponent\"];\n  /**\n   * Toggle drawer state.\n   */\n  switchState(): void;\n  /**\n   * Close drawer.\n   */\n  close(): void;\n  /**\n   * Open drawer.\n   */\n  open(): void;\n  /**\n   * Set arbitrary drawer state.\n   */\n  setState: (state: DrawerState) => void;\n}\n\nexport const DrawerContext = createContext<DrawerContextProps | undefined>(\n  undefined,\n);\nexport const UndefinedProvider = new Error(\n  \"DrawerContext.Provider is required and was undefined\",\n);\n\nexport const useDrawer = () => {\n  const context = useContext(DrawerContext);\n\n  if (context === undefined) {\n    throw UndefinedProvider;\n  }\n\n  return context;\n};\n"],"names":["DrawerContext","createContext","UndefinedProvider","useDrawer","context","useContext"],"mappings":";AAkDO,MAAMA,IAAgBC;AAAA,EAC3B;AACF,GACaC,IAAoB,IAAI;AAAA,EACnC;AACF,GAEaC,IAAY,MAAM;AAC7B,QAAMC,IAAUC,EAAWL,CAAa;AAExC,MAAII,MAAY;AACd,UAAMF;AAGR,SAAOE;AACT;"}

package/dist/components/drawer-context/drawer-provider.d.ts

@@ -0,0 +1,6 @@
+import { DrawerProviderProps } from '../drawerx/drawer.types';
+export declare const drawerWidth = 240;
+/**
+ * Provider for drawer state and interactions.
+ */
+export declare const DrawerProvider: ({ children, initialState, size, drawerWidth: drawerWidthProp, clipped, selectedItemId, LinkComponent, onStateChange, }: DrawerProviderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/drawer-context/drawer-provider.mjs

@@ -0,0 +1,41 @@
+import { jsx as o } from "react/jsx-runtime";
+import { useState as w } from "react";
+import { SidebarProvider as u } from "../ui/sidebar.mjs";
+import { DrawerContext as S } from "./drawer-context.mjs";
+const f = 240, W = ({
+  children: n,
+  initialState: a,
+  size: s = "medium",
+  drawerWidth: i = f,
+  clipped: d = !0,
+  selectedItemId: p,
+  LinkComponent: c = "a",
+  onStateChange: m = () => null
+}) => {
+  const [r, l] = w(a === "open"), h = r ? "open" : "close", e = (t) => {
+    m(t ? "open" : "close"), l(t);
+  };
+  return /* @__PURE__ */ o(u, { open: r, onOpenChange: e, children: /* @__PURE__ */ o(
+    S.Provider,
+    {
+      value: {
+        state: h,
+        size: s,
+        selectedItemId: p,
+        clipped: d,
+        drawerWidth: i,
+        LinkComponent: c,
+        switchState: () => e(!r),
+        close: () => e(!1),
+        open: () => e(!0),
+        setState: (t) => e(t === "open")
+      },
+      children: n
+    }
+  ) });
+};
+export {
+  W as DrawerProvider,
+  f as drawerWidth
+};
+//# sourceMappingURL=drawer-provider.mjs.map

package/dist/components/drawer-context/drawer-provider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-provider.mjs","sources":["../../../src/components/drawer-context/drawer-provider.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type {\n  DrawerProviderProps,\n  DrawerState,\n} from \"@/components/drawerx/drawer.types\";\nimport { SidebarProvider } from \"@/components/ui/sidebar\";\nimport { DrawerContext } from \"./drawer-context\";\n\nexport const drawerWidth = 240;\n\n/**\n * Provider for drawer state and interactions.\n */\nexport const DrawerProvider = ({\n  children,\n  initialState,\n  size = \"medium\",\n  drawerWidth: drawerWidthProp = drawerWidth,\n  clipped = true,\n  selectedItemId,\n  LinkComponent = \"a\",\n  onStateChange = () => null,\n}: DrawerProviderProps) => {\n  const [isOpen, setIsOpen] = useState<boolean>(initialState === \"open\");\n  const state: DrawerState = isOpen ? \"open\" : \"close\";\n\n  const handleChangeState = (open: boolean) => {\n    const newState: DrawerState = open ? \"open\" : \"close\";\n    onStateChange(newState);\n    setIsOpen(open);\n  };\n\n  return (\n    <SidebarProvider open={isOpen} onOpenChange={handleChangeState}>\n      <DrawerContext.Provider\n        value={{\n          state,\n          size,\n          selectedItemId,\n          clipped,\n          drawerWidth: drawerWidthProp,\n          LinkComponent,\n          switchState: () => handleChangeState(!isOpen),\n          close: () => handleChangeState(false),\n          open: () => handleChangeState(true),\n          setState: (newState) => handleChangeState(newState === \"open\"),\n        }}\n      >\n        {children}\n      </DrawerContext.Provider>\n    </SidebarProvider>\n  );\n};\n"],"names":["drawerWidth","DrawerProvider","children","initialState","size","drawerWidthProp","clipped","selectedItemId","LinkComponent","onStateChange","isOpen","setIsOpen","useState","state","handleChangeState","open","jsx","SidebarProvider","DrawerContext","newState"],"mappings":";;;;AAQO,MAAMA,IAAc,KAKdC,IAAiB,CAAC;AAAA,EAC7B,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,aAAaC,IAAkBL;AAAA,EAC/B,SAAAM,IAAU;AAAA,EACV,gBAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,eAAAC,IAAgB,MAAM;AACxB,MAA2B;AACzB,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAkBT,MAAiB,MAAM,GAC/DU,IAAqBH,IAAS,SAAS,SAEvCI,IAAoB,CAACC,MAAkB;AAE3C,IAAAN,EAD8BM,IAAO,SAAS,OACxB,GACtBJ,EAAUI,CAAI;AAAA,EAChB;AAEA,SACE,gBAAAC,EAACC,GAAA,EAAgB,MAAMP,GAAQ,cAAcI,GAC3C,UAAA,gBAAAE;AAAA,IAACE,EAAc;AAAA,IAAd;AAAA,MACC,OAAO;AAAA,QACL,OAAAL;AAAA,QACA,MAAAT;AAAA,QACA,gBAAAG;AAAA,QACA,SAAAD;AAAA,QACA,aAAaD;AAAA,QACb,eAAAG;AAAA,QACA,aAAa,MAAMM,EAAkB,CAACJ,CAAM;AAAA,QAC5C,OAAO,MAAMI,EAAkB,EAAK;AAAA,QACpC,MAAM,MAAMA,EAAkB,EAAI;AAAA,QAClC,UAAU,CAACK,MAAaL,EAAkBK,MAAa,MAAM;AAAA,MAAA;AAAA,MAG9D,UAAAjB;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;"}

package/dist/components/drawer-context/index.d.ts

@@ -0,0 +1,2 @@
+export * from './drawer-context';
+export * from './drawer-provider';

package/dist/components/drawer-item/drawer-item-link.d.ts

@@ -0,0 +1,48 @@
+import { ReactElement, ReactNode } from 'react';
+import { DrawerItemAvatar, DrawerItemBullet, DrawerItemLabel } from '../drawerx/drawer.types';
+export interface DrawerItemLinkProps {
+    /**
+     * Text displayed inside the item.
+     */
+    text: string;
+    /**
+     * Url where the user is redirected.
+     */
+    href: string;
+    /**
+     * Icon displayed to the left.
+     */
+    icon?: ReactElement;
+    /**
+     * Avatar displayed to the left.
+     */
+    avatar?: DrawerItemAvatar;
+    /**
+     * Label shown at the right.
+     */
+    label?: DrawerItemLabel;
+    /**
+     * Bullet shown at the right.
+     */
+    bullet?: DrawerItemBullet;
+    /**
+     * Selected state.
+     */
+    selected?: boolean;
+    /**
+     * Item nesting level.
+     */
+    level: number;
+    /**
+     * Additional classes.
+     */
+    className?: string;
+    /**
+     * Optional action element displayed alongside the item.
+     */
+    action?: ReactNode;
+}
+/**
+ * Clickable drawer link item.
+ */
+export declare const DrawerItemLink: ({ text, icon, avatar, label, bullet, href, selected, level, className, action, }: DrawerItemLinkProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/drawer-item/drawer-item-link.mjs

@@ -0,0 +1,80 @@
+import { jsx as r, jsxs as l } from "react/jsx-runtime";
+import { Badge as f } from "../badge/badge.mjs";
+import { Bullet as h } from "../bullet/bullet.mjs";
+import { useDrawer as j } from "../drawer-context/drawer-context.mjs";
+import "react";
+import { SidebarMenuSubItem as z, SidebarMenuSubButton as B, SidebarMenuItem as M, SidebarMenuButton as b } from "../ui/sidebar.mjs";
+import { cn as v } from "../../lib/utils.mjs";
+const T = ({
+  text: e,
+  icon: a,
+  avatar: n,
+  label: i,
+  bullet: t,
+  href: o,
+  selected: c,
+  level: S,
+  className: u,
+  action: w
+}) => {
+  const { state: N, size: s, LinkComponent: g } = j(), d = g ?? "a", m = N === "close", p = s === "small" ? "sm" : "default";
+  return S > 0 ? /* @__PURE__ */ r(z, { children: /* @__PURE__ */ l(
+    B,
+    {
+      render: /* @__PURE__ */ r(d, { href: o, "aria-label": e }),
+      isActive: c,
+      className: u,
+      size: p === "sm" ? "sm" : "md",
+      children: [
+        a,
+        n ? /* @__PURE__ */ r(
+          "img",
+          {
+            alt: n.alt,
+            src: n.src,
+            className: v(
+              "rounded-full object-cover",
+              s === "small" ? "h-5 w-5" : "h-6 w-6"
+            )
+          }
+        ) : null,
+        /* @__PURE__ */ r("span", { children: e }),
+        i ? /* @__PURE__ */ r(f, { text: i.text, variant: i.variant, className: "ml-2" }) : null,
+        t ? /* @__PURE__ */ r(h, { variant: t.variant, className: "ml-2" }) : null
+      ]
+    }
+  ) }) : /* @__PURE__ */ l(M, { children: [
+    /* @__PURE__ */ l(
+      b,
+      {
+        render: /* @__PURE__ */ r(d, { href: o, "aria-label": e }),
+        isActive: c,
+        tooltip: e,
+        size: p,
+        className: u,
+        children: [
+          a,
+          n ? /* @__PURE__ */ r(
+            "img",
+            {
+              alt: n.alt,
+              src: n.src,
+              className: v(
+                "rounded-full object-cover",
+                s === "small" ? "h-6 w-6" : "h-7 w-7"
+              )
+            }
+          ) : null,
+          m ? null : /* @__PURE__ */ r("span", { children: e }),
+          !m && i ? /* @__PURE__ */ r(f, { text: i.text, variant: i.variant, className: "ml-2" }) : null,
+          !m && t ? /* @__PURE__ */ r(h, { variant: t.variant, className: "ml-2" }) : null
+        ]
+      }
+    ),
+    w
+  ] });
+};
+export {
+  T as DrawerItemLink
+};
+//# sourceMappingURL=drawer-item-link.mjs.map

package/dist/components/drawer-item/drawer-item-link.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-item-link.mjs","sources":["../../../src/components/drawer-item/drawer-item-link.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from \"react\";\nimport Badge from \"@/components/badge\";\nimport Bullet from \"@/components/bullet\";\nimport { useDrawer } from \"@/components/drawer-context\";\nimport type {\n  DrawerItemAvatar,\n  DrawerItemBullet,\n  DrawerItemLabel,\n} from \"@/components/drawerx/drawer.types\";\nimport {\n  SidebarMenuButton,\n  SidebarMenuItem,\n  SidebarMenuSubButton,\n  SidebarMenuSubItem,\n} from \"@/components/ui/sidebar\";\nimport { cn } from \"@/lib/utils\";\n\nexport interface DrawerItemLinkProps {\n  /**\n   * Text displayed inside the item.\n   */\n  text: string;\n  /**\n   * Url where the user is redirected.\n   */\n  href: string;\n  /**\n   * Icon displayed to the left.\n   */\n  icon?: ReactElement;\n  /**\n   * Avatar displayed to the left.\n   */\n  avatar?: DrawerItemAvatar;\n  /**\n   * Label shown at the right.\n   */\n  label?: DrawerItemLabel;\n  /**\n   * Bullet shown at the right.\n   */\n  bullet?: DrawerItemBullet;\n  /**\n   * Selected state.\n   */\n  selected?: boolean;\n  /**\n   * Item nesting level.\n   */\n  level: number;\n  /**\n   * Additional classes.\n   */\n  className?: string;\n  /**\n   * Optional action element displayed alongside the item.\n   */\n  action?: ReactNode;\n}\n\n/**\n * Clickable drawer link item.\n */\nexport const DrawerItemLink = ({\n  text,\n  icon,\n  avatar,\n  label,\n  bullet,\n  href,\n  selected,\n  level,\n  className,\n  action,\n}: DrawerItemLinkProps) => {\n  const { state, size, LinkComponent } = useDrawer();\n  const LinkTag = (LinkComponent ?? \"a\") as any;\n  const mini = state === \"close\";\n  const buttonSize = size === \"small\" ? \"sm\" : \"default\";\n\n  if (level > 0) {\n    return (\n      <SidebarMenuSubItem>\n        <SidebarMenuSubButton\n          render={<LinkTag href={href} aria-label={text} />}\n          isActive={selected}\n          className={className}\n          size={buttonSize === \"sm\" ? \"sm\" : \"md\"}\n        >\n          {icon}\n          {avatar ? (\n            <img\n              alt={avatar.alt}\n              src={avatar.src}\n              className={cn(\n                \"rounded-full object-cover\",\n                size === \"small\" ? \"h-5 w-5\" : \"h-6 w-6\",\n              )}\n            />\n          ) : null}\n          <span>{text}</span>\n          {label ? (\n            <Badge text={label.text} variant={label.variant} className=\"ml-2\" />\n          ) : null}\n          {bullet ? <Bullet variant={bullet.variant} className=\"ml-2\" /> : null}\n        </SidebarMenuSubButton>\n      </SidebarMenuSubItem>\n    );\n  }\n\n  return (\n    <SidebarMenuItem>\n      <SidebarMenuButton\n        render={<LinkTag href={href} aria-label={text} />}\n        isActive={selected}\n        tooltip={text}\n        size={buttonSize}\n        className={className}\n      >\n        {icon}\n        {avatar ? (\n          <img\n            alt={avatar.alt}\n            src={avatar.src}\n            className={cn(\n              \"rounded-full object-cover\",\n              size === \"small\" ? \"h-6 w-6\" : \"h-7 w-7\",\n            )}\n          />\n        ) : null}\n        {!mini ? <span>{text}</span> : null}\n        {!mini && label ? (\n          <Badge text={label.text} variant={label.variant} className=\"ml-2\" />\n        ) : null}\n        {!mini && bullet ? (\n          <Bullet variant={bullet.variant} className=\"ml-2\" />\n        ) : null}\n      </SidebarMenuButton>\n      {action}\n    </SidebarMenuItem>\n  );\n};\n"],"names":["DrawerItemLink","text","icon","avatar","label","bullet","href","selected","level","className","action","state","size","LinkComponent","useDrawer","LinkTag","mini","buttonSize","SidebarMenuSubItem","jsxs","SidebarMenuSubButton","jsx","cn","Badge","Bullet","SidebarMenuItem","SidebarMenuButton"],"mappings":";;;;;;;AA+DO,MAAMA,IAAiB,CAAC;AAAA,EAC7B,MAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AACF,MAA2B;AACzB,QAAM,EAAE,OAAAC,GAAO,MAAAC,GAAM,eAAAC,EAAA,IAAkBC,EAAA,GACjCC,IAAWF,KAAiB,KAC5BG,IAAOL,MAAU,SACjBM,IAAaL,MAAS,UAAU,OAAO;AAE7C,SAAIJ,IAAQ,sBAEPU,GAAA,EACC,UAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAQ,gBAAAC,EAACN,GAAA,EAAQ,MAAAT,GAAY,cAAYL,GAAM;AAAA,MAC/C,UAAUM;AAAA,MACV,WAAAE;AAAA,MACA,MAAMQ,MAAe,OAAO,OAAO;AAAA,MAElC,UAAA;AAAA,QAAAf;AAAA,QACAC,IACC,gBAAAkB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAKlB,EAAO;AAAA,YACZ,KAAKA,EAAO;AAAA,YACZ,WAAWmB;AAAA,cACT;AAAA,cACAV,MAAS,UAAU,YAAY;AAAA,YAAA;AAAA,UACjC;AAAA,QAAA,IAEA;AAAA,QACJ,gBAAAS,EAAC,UAAM,UAAApB,EAAA,CAAK;AAAA,QACXG,IACC,gBAAAiB,EAACE,GAAA,EAAM,MAAMnB,EAAM,MAAM,SAASA,EAAM,SAAS,WAAU,OAAA,CAAO,IAChE;AAAA,QACHC,sBAAUmB,GAAA,EAAO,SAASnB,EAAO,SAAS,WAAU,QAAO,IAAK;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAErE,sBAKDoB,GAAA,EACC,UAAA;AAAA,IAAA,gBAAAN;AAAA,MAACO;AAAA,MAAA;AAAA,QACC,QAAQ,gBAAAL,EAACN,GAAA,EAAQ,MAAAT,GAAY,cAAYL,GAAM;AAAA,QAC/C,UAAUM;AAAA,QACV,SAASN;AAAA,QACT,MAAMgB;AAAA,QACN,WAAAR;AAAA,QAEC,UAAA;AAAA,UAAAP;AAAA,UACAC,IACC,gBAAAkB;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,KAAKlB,EAAO;AAAA,cACZ,KAAKA,EAAO;AAAA,cACZ,WAAWmB;AAAA,gBACT;AAAA,gBACAV,MAAS,UAAU,YAAY;AAAA,cAAA;AAAA,YACjC;AAAA,UAAA,IAEA;AAAA,UACFI,IAA6B,OAAtB,gBAAAK,EAAC,QAAA,EAAM,aAAK;AAAA,UACpB,CAACL,KAAQZ,IACR,gBAAAiB,EAACE,GAAA,EAAM,MAAMnB,EAAM,MAAM,SAASA,EAAM,SAAS,WAAU,QAAO,IAChE;AAAA,UACH,CAACY,KAAQX,IACR,gBAAAgB,EAACG,GAAA,EAAO,SAASnB,EAAO,SAAS,WAAU,OAAA,CAAO,IAChD;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAELK;AAAA,EAAA,GACH;AAEJ;"}

package/dist/components/drawer-item/drawer-item.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { DrawerNavigationItem } from '../drawerx/drawer.types';
+export interface DrawerItemProps {
+    /**
+     * Data to render.
+     */
+    item: DrawerNavigationItem;
+    /**
+     * Nesting level inside submenus.
+     */
+    level?: number;
+    /**
+     * Optional action element displayed alongside the item.
+     */
+    action?: ReactNode;
+}
+/**
+ * Drawer navigation item renderer.
+ */
+export default function DrawerItem({ item, level, action, }: DrawerItemProps): import("react/jsx-runtime").JSX.Element | null;