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

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

@@ -0,0 +1,49 @@
+import { jsx as o } from "react/jsx-runtime";
+import { useDrawer as D } from "../drawer-context/drawer-context.mjs";
+import "react";
+import { SidebarGroupLabel as I } from "../ui/sidebar.mjs";
+import { DrawerItemLink as L } from "./drawer-item-link.mjs";
+import { DrawerMenuItem as S } from "./drawer-menu-item.mjs";
+function A({
+  item: e,
+  level: i = 0,
+  action: n
+}) {
+  const { selectedItemId: r, state: d } = D();
+  if (e.kind === "collapsable") {
+    const { id: x, text: b, icon: h, items: l } = e, k = l.some((t) => t.kind === "collapsable" ? t.items.some(
+      (w) => w.id === r
+    ) : t.id === r);
+    return /* @__PURE__ */ o(
+      S,
+      {
+        selected: x === r || k,
+        text: b,
+        icon: h,
+        items: l,
+        level: i
+      }
+    );
+  }
+  if (e.kind === "header")
+    return d === "open" ? /* @__PURE__ */ o(I, { role: "heading", "aria-level": 2, children: e.text }) : null;
+  const { id: a, text: c, icon: s, avatar: m, label: u, bullet: f, href: p } = e;
+  return /* @__PURE__ */ o(
+    L,
+    {
+      selected: a === r,
+      text: c,
+      icon: s,
+      avatar: m,
+      label: u,
+      bullet: f,
+      href: p,
+      level: i,
+      action: n
+    }
+  );
+}
+export {
+  A as default
+};
+//# sourceMappingURL=drawer-item.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-item.mjs","sources":["../../../src/components/drawer-item/drawer-item.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { useDrawer } from \"@/components/drawer-context\";\nimport type { DrawerNavigationItem } from \"@/components/drawerx/drawer.types\";\nimport { SidebarGroupLabel } from \"@/components/ui/sidebar\";\nimport { DrawerItemLink } from \"./drawer-item-link\";\nimport { DrawerMenuItem } from \"./drawer-menu-item\";\n\nexport interface DrawerItemProps {\n  /**\n   * Data to render.\n   */\n  item: DrawerNavigationItem;\n  /**\n   * Nesting level inside submenus.\n   */\n  level?: number;\n  /**\n   * Optional action element displayed alongside the item.\n   */\n  action?: ReactNode;\n}\n\n/**\n * Drawer navigation item renderer.\n */\nexport default function DrawerItem({\n  item,\n  level = 0,\n  action,\n}: DrawerItemProps) {\n  const { selectedItemId, state } = useDrawer();\n  if (item.kind === \"collapsable\") {\n    const { id, text, icon, items } = item;\n    const childrenSelected = items.some((navigationItem) => {\n      if (navigationItem.kind === \"collapsable\") {\n        return navigationItem.items.some(\n          (nestedItem) => nestedItem.id === selectedItemId,\n        );\n      }\n\n      return navigationItem.id === selectedItemId;\n    });\n\n    return (\n      <DrawerMenuItem\n        selected={id === selectedItemId || childrenSelected}\n        text={text}\n        icon={icon}\n        items={items}\n        level={level}\n      />\n    );\n  }\n\n  if (item.kind === \"header\") {\n    return state === \"open\" ? (\n      <SidebarGroupLabel role=\"heading\" aria-level={2}>\n        {item.text}\n      </SidebarGroupLabel>\n    ) : null;\n  }\n\n  const { id, text, icon, avatar, label, bullet, href } = item;\n  return (\n    <DrawerItemLink\n      selected={id === selectedItemId}\n      text={text}\n      icon={icon}\n      avatar={avatar}\n      label={label}\n      bullet={bullet}\n      href={href}\n      level={level}\n      action={action}\n    />\n  );\n}\n"],"names":["DrawerItem","item","level","action","selectedItemId","state","useDrawer","id","text","icon","items","childrenSelected","navigationItem","nestedItem","jsx","DrawerMenuItem","SidebarGroupLabel","avatar","label","bullet","href","DrawerItemLink"],"mappings":";;;;;;AAyBA,SAAwBA,EAAW;AAAA,EACjC,MAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,QAAAC;AACF,GAAoB;AAClB,QAAM,EAAE,gBAAAC,GAAgB,OAAAC,EAAA,IAAUC,EAAA;AAClC,MAAIL,EAAK,SAAS,eAAe;AAC/B,UAAM,EAAE,IAAAM,GAAI,MAAAC,GAAM,MAAAC,GAAM,OAAAC,MAAUT,GAC5BU,IAAmBD,EAAM,KAAK,CAACE,MAC/BA,EAAe,SAAS,gBACnBA,EAAe,MAAM;AAAA,MAC1B,CAACC,MAAeA,EAAW,OAAOT;AAAA,IAAA,IAI/BQ,EAAe,OAAOR,CAC9B;AAED,WACE,gBAAAU;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAUR,MAAOH,KAAkBO;AAAA,QACnC,MAAMH;AAAAA,QACN,MAAMC;AAAAA,QACN,OAAAC;AAAA,QACA,OAAAR;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AAEA,MAAID,EAAK,SAAS;AAChB,WAAOI,MAAU,SACf,gBAAAS,EAACE,GAAA,EAAkB,MAAK,WAAU,cAAY,GAC3C,UAAAf,EAAK,KAAA,CACR,IACE;AAGN,QAAM,EAAE,IAAAM,GAAI,MAAAC,GAAM,MAAAC,GAAM,QAAAQ,GAAQ,OAAAC,GAAO,QAAAC,GAAQ,MAAAC,MAASnB;AACxD,SACE,gBAAAa;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,UAAUd,MAAOH;AAAA,MACjB,MAAAI;AAAA,MACA,MAAAC;AAAA,MACA,QAAAQ;AAAA,MACA,OAAAC;AAAA,MACA,QAAAC;AAAA,MACA,MAAAC;AAAA,MACA,OAAAlB;AAAA,MACA,QAAAC;AAAA,IAAA;AAAA,EAAA;AAGN;"}

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

@@ -0,0 +1,32 @@
+import { ReactElement } from 'react';
+import { DrawerNavigationItem } from '../drawerx/drawer.types';
+export interface DrawerMenuItemProps {
+    /**
+     * Text displayed inside the item.
+     */
+    text: string;
+    /**
+     * Icon displayed to the left.
+     */
+    icon?: ReactElement;
+    /**
+     * Selected state.
+     */
+    selected?: boolean;
+    /**
+     * Nested items rendered inside submenu.
+     */
+    items: DrawerNavigationItem[];
+    /**
+     * Item nesting level.
+     */
+    level: number;
+    /**
+     * Additional classes.
+     */
+    className?: string;
+}
+/**
+ * Collapsible drawer menu item.
+ */
+export declare const DrawerMenuItem: ({ text, icon, selected, items, level, className, }: DrawerMenuItemProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,156 @@
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+import { useState as b, useEffect as B, useMemo as x } from "react";
+import { Badge as A } from "../badge/badge.mjs";
+import { Bullet as T } from "../bullet/bullet.mjs";
+import { useDrawer as j } from "../drawer-context/drawer-context.mjs";
+import { SidebarMenuSub as k, SidebarMenuItem as f, SidebarMenuButton as g, SidebarMenuSubItem as y, SidebarMenuSubButton as E } from "../ui/sidebar.mjs";
+import { Collapsible as R, CollapsibleTrigger as v, CollapsibleContent as w } from "../ui/collapsible.mjs";
+import { DropdownMenu as $, DropdownMenuTrigger as L, DropdownMenuContent as q, DropdownMenuSub as F, DropdownMenuSubTrigger as G, DropdownMenuSubContent as H, DropdownMenuItem as J } from "../ui/dropdown-menu.mjs";
+import K from "./drawer-item.mjs";
+import M from "../../node_modules/lucide-react/dist/esm/icons/chevron-down.mjs";
+import C from "../../node_modules/lucide-react/dist/esm/icons/chevron-right.mjs";
+const D = (n, l, o) => n.filter((r) => r.kind !== "header").map((r) => {
+  if (r.kind === "collapsable")
+    return /* @__PURE__ */ a(F, { children: [
+      /* @__PURE__ */ a(G, { children: [
+        r.icon,
+        /* @__PURE__ */ e("span", { children: r.text })
+      ] }),
+      /* @__PURE__ */ e(H, { children: D(r.items, l, o) })
+    ] }, r.id);
+  const i = o ?? "a", t = r.id === l;
+  return /* @__PURE__ */ e(
+    J,
+    {
+      className: t ? "font-medium text-primary" : void 0,
+      children: /* @__PURE__ */ a(i, { href: r.href, className: "flex w-full items-center gap-2", children: [
+        r.icon,
+        r.avatar ? /* @__PURE__ */ e(
+          "img",
+          {
+            alt: r.avatar.alt,
+            src: r.avatar.src,
+            className: "h-5 w-5 rounded-full object-cover"
+          }
+        ) : null,
+        /* @__PURE__ */ e("span", { children: r.text }),
+        r.label ? /* @__PURE__ */ e(
+          A,
+          {
+            text: r.label.text,
+            variant: r.label.variant,
+            className: "ml-auto"
+          }
+        ) : null,
+        r.bullet ? /* @__PURE__ */ e(T, { variant: r.bullet.variant, className: "ml-auto" }) : null
+      ] })
+    },
+    r.id
+  );
+}), ne = ({
+  text: n,
+  icon: l,
+  selected: o,
+  items: r,
+  level: i,
+  className: t
+}) => {
+  const { state: S, size: I, selectedItemId: N, LinkComponent: O } = j(), s = S === "close", [d, c] = b(
+    () => !!o
+  ), [z, p] = b(!1);
+  B(() => {
+    if (s) {
+      p(!1);
+      return;
+    }
+    o && c(!0);
+  }, [s, o]);
+  const u = I === "small" ? "sm" : "default", m = x(
+    () => /* @__PURE__ */ e(k, { children: r.map((h) => /* @__PURE__ */ e(K, { level: i + 1, item: h }, h.id)) }),
+    [r, i]
+  );
+  return s && i === 0 ? /* @__PURE__ */ e(f, { className: t, children: /* @__PURE__ */ a($, { open: z, onOpenChange: p, children: [
+    /* @__PURE__ */ a(
+      L,
+      {
+        render: /* @__PURE__ */ e(
+          g,
+          {
+            tooltip: n,
+            size: u,
+            isActive: o
+          }
+        ),
+        children: [
+          l,
+          /* @__PURE__ */ e("span", { className: "sr-only", children: n })
+        ]
+      }
+    ),
+    /* @__PURE__ */ e(q, { side: "right", align: "start", className: "w-56", children: /* @__PURE__ */ e("div", { role: "region", "aria-label": `${n} popover submenu`, children: D(r, N, O) }) })
+  ] }) }) : /* @__PURE__ */ e(
+    R,
+    {
+      open: d,
+      className: "group/collapsible",
+      onOpenChange: c,
+      children: i > 0 ? /* @__PURE__ */ a(y, { className: t, children: [
+        /* @__PURE__ */ a(
+          v,
+          {
+            render: /* @__PURE__ */ e(
+              E,
+              {
+                render: /* @__PURE__ */ e("button", { type: "button" }),
+                size: u === "sm" ? "sm" : "md",
+                isActive: o
+              }
+            ),
+            children: [
+              l,
+              /* @__PURE__ */ e("span", { children: n }),
+              d ? /* @__PURE__ */ e(M, { "data-testid": "ExpandMoreIcon", className: "ml-auto" }) : /* @__PURE__ */ e(
+                C,
+                {
+                  "data-testid": "ChevronRightIcon",
+                  className: "ml-auto"
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(w, { children: /* @__PURE__ */ e("div", { role: "region", "aria-label": `${n} collapse submenu`, children: m }) })
+      ] }) : /* @__PURE__ */ a(f, { className: t, children: [
+        /* @__PURE__ */ a(
+          v,
+          {
+            render: /* @__PURE__ */ e(
+              g,
+              {
+                tooltip: n,
+                size: u,
+                isActive: o
+              }
+            ),
+            children: [
+              l,
+              s ? null : /* @__PURE__ */ e("span", { children: n }),
+              s ? null : d ? /* @__PURE__ */ e(M, { "data-testid": "ExpandMoreIcon", className: "ml-auto" }) : /* @__PURE__ */ e(
+                C,
+                {
+                  "data-testid": "ChevronRightIcon",
+                  className: "ml-auto"
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(w, { children: /* @__PURE__ */ e("div", { role: "region", "aria-label": `${n} collapse submenu`, children: m }) })
+      ] })
+    }
+  );
+};
+export {
+  ne as DrawerMenuItem
+};
+//# sourceMappingURL=drawer-menu-item.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-menu-item.mjs","sources":["../../../src/components/drawer-item/drawer-menu-item.tsx"],"sourcesContent":["import { ChevronDown, ChevronRight } from \"lucide-react\";\nimport { type ReactElement, useEffect, useMemo, useState } from \"react\";\nimport Badge from \"@/components/badge\";\nimport Bullet from \"@/components/bullet\";\nimport { useDrawer } from \"@/components/drawer-context\";\nimport type { DrawerNavigationItem } from \"@/components/drawerx/drawer.types\";\nimport {\n  Collapsible,\n  CollapsibleContent,\n  CollapsibleTrigger,\n} from \"@/components/ui/collapsible\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport {\n  SidebarMenuButton,\n  SidebarMenuItem,\n  SidebarMenuSub,\n  SidebarMenuSubButton,\n  SidebarMenuSubItem,\n} from \"@/components/ui/sidebar\";\nimport DrawerItem from \"./drawer-item\";\n\nexport interface DrawerMenuItemProps {\n  /**\n   * Text displayed inside the item.\n   */\n  text: string;\n  /**\n   * Icon displayed to the left.\n   */\n  icon?: ReactElement;\n  /**\n   * Selected state.\n   */\n  selected?: boolean;\n  /**\n   * Nested items rendered inside submenu.\n   */\n  items: DrawerNavigationItem[];\n  /**\n   * Item nesting level.\n   */\n  level: number;\n  /**\n   * Additional classes.\n   */\n  className?: string;\n}\n\nconst renderDropdownItems = (\n  items: DrawerNavigationItem[],\n  selectedItemId?: string,\n  LinkComponent?: React.ComponentType<any> | string,\n) =>\n  items\n    .filter((item) => item.kind !== \"header\")\n    .map((item) => {\n      if (item.kind === \"collapsable\") {\n        return (\n          <DropdownMenuSub key={item.id}>\n            <DropdownMenuSubTrigger>\n              {item.icon}\n              <span>{item.text}</span>\n            </DropdownMenuSubTrigger>\n            <DropdownMenuSubContent>\n              {renderDropdownItems(item.items, selectedItemId, LinkComponent)}\n            </DropdownMenuSubContent>\n          </DropdownMenuSub>\n        );\n      }\n\n      const LinkTag = (LinkComponent ?? \"a\") as any;\n      const isActive = item.id === selectedItemId;\n\n      return (\n        <DropdownMenuItem\n          key={item.id}\n          className={isActive ? \"font-medium text-primary\" : undefined}\n        >\n          <LinkTag href={item.href} className=\"flex w-full items-center gap-2\">\n            {item.icon}\n            {item.avatar ? (\n              <img\n                alt={item.avatar.alt}\n                src={item.avatar.src}\n                className=\"h-5 w-5 rounded-full object-cover\"\n              />\n            ) : null}\n            <span>{item.text}</span>\n            {item.label ? (\n              <Badge\n                text={item.label.text}\n                variant={item.label.variant}\n                className=\"ml-auto\"\n              />\n            ) : null}\n            {item.bullet ? (\n              <Bullet variant={item.bullet.variant} className=\"ml-auto\" />\n            ) : null}\n          </LinkTag>\n        </DropdownMenuItem>\n      );\n    });\n\n/**\n * Collapsible drawer menu item.\n */\nexport const DrawerMenuItem = ({\n  text,\n  icon,\n  selected,\n  items,\n  level,\n  className,\n}: DrawerMenuItemProps) => {\n  const { state, size, selectedItemId, LinkComponent } = useDrawer();\n  const mini = state === \"close\";\n  const [collapsibleOpen, setCollapsibleOpen] = useState(() =>\n    Boolean(selected),\n  );\n  const [dropdownOpen, setDropdownOpen] = useState(false);\n\n  useEffect(() => {\n    if (mini) {\n      setDropdownOpen(false);\n      return;\n    }\n\n    if (selected) {\n      setCollapsibleOpen(true);\n    }\n  }, [mini, selected]);\n  const buttonSize = size === \"small\" ? \"sm\" : \"default\";\n\n  const submenu = useMemo(\n    () => (\n      <SidebarMenuSub>\n        {items.map((item) => (\n          <DrawerItem key={item.id} level={level + 1} item={item} />\n        ))}\n      </SidebarMenuSub>\n    ),\n    [items, level],\n  );\n\n  if (mini && level === 0) {\n    return (\n      <SidebarMenuItem className={className}>\n        <DropdownMenu open={dropdownOpen} onOpenChange={setDropdownOpen}>\n          <DropdownMenuTrigger\n            render={\n              <SidebarMenuButton\n                tooltip={text}\n                size={buttonSize}\n                isActive={selected}\n              />\n            }\n          >\n            {icon}\n            <span className=\"sr-only\">{text}</span>\n          </DropdownMenuTrigger>\n          <DropdownMenuContent side=\"right\" align=\"start\" className=\"w-56\">\n            <div role=\"region\" aria-label={`${text} popover submenu`}>\n              {renderDropdownItems(items, selectedItemId, LinkComponent)}\n            </div>\n          </DropdownMenuContent>\n        </DropdownMenu>\n      </SidebarMenuItem>\n    );\n  }\n\n  return (\n    <Collapsible\n      open={collapsibleOpen}\n      className=\"group/collapsible\"\n      onOpenChange={setCollapsibleOpen}\n    >\n      {level > 0 ? (\n        <SidebarMenuSubItem className={className}>\n          <CollapsibleTrigger\n            render={\n              <SidebarMenuSubButton\n                render={<button type=\"button\" />}\n                size={buttonSize === \"sm\" ? \"sm\" : \"md\"}\n                isActive={selected}\n              />\n            }\n          >\n            {icon}\n            <span>{text}</span>\n            {collapsibleOpen ? (\n              <ChevronDown data-testid=\"ExpandMoreIcon\" className=\"ml-auto\" />\n            ) : (\n              <ChevronRight\n                data-testid=\"ChevronRightIcon\"\n                className=\"ml-auto\"\n              />\n            )}\n          </CollapsibleTrigger>\n          <CollapsibleContent>\n            <div role=\"region\" aria-label={`${text} collapse submenu`}>\n              {submenu}\n            </div>\n          </CollapsibleContent>\n        </SidebarMenuSubItem>\n      ) : (\n        <SidebarMenuItem className={className}>\n          <CollapsibleTrigger\n            render={\n              <SidebarMenuButton\n                tooltip={text}\n                size={buttonSize}\n                isActive={selected}\n              />\n            }\n          >\n            {icon}\n            {!mini ? <span>{text}</span> : null}\n            {!mini ? (\n              collapsibleOpen ? (\n                <ChevronDown data-testid=\"ExpandMoreIcon\" className=\"ml-auto\" />\n              ) : (\n                <ChevronRight\n                  data-testid=\"ChevronRightIcon\"\n                  className=\"ml-auto\"\n                />\n              )\n            ) : null}\n          </CollapsibleTrigger>\n          <CollapsibleContent>\n            <div role=\"region\" aria-label={`${text} collapse submenu`}>\n              {submenu}\n            </div>\n          </CollapsibleContent>\n        </SidebarMenuItem>\n      )}\n    </Collapsible>\n  );\n};\n"],"names":["renderDropdownItems","items","selectedItemId","LinkComponent","item","DropdownMenuSub","jsxs","DropdownMenuSubTrigger","jsx","DropdownMenuSubContent","LinkTag","isActive","DropdownMenuItem","Badge","Bullet","DrawerMenuItem","text","icon","selected","level","className","state","size","useDrawer","mini","collapsibleOpen","setCollapsibleOpen","useState","dropdownOpen","setDropdownOpen","useEffect","buttonSize","submenu","useMemo","SidebarMenuSub","DrawerItem","SidebarMenuItem","DropdownMenu","DropdownMenuTrigger","SidebarMenuButton","DropdownMenuContent","Collapsible","SidebarMenuSubItem","CollapsibleTrigger","SidebarMenuSubButton","ChevronDown","ChevronRight","CollapsibleContent"],"mappings":"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"}

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

@@ -0,0 +1,4 @@
+export type { DrawerItemProps } from './drawer-item';
+export { default, default as DrawerItem } from './drawer-item';
+export * from './drawer-item-link';
+export * from './drawer-menu-item';

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

@@ -0,0 +1,62 @@
+import { JSXElementConstructor } from 'react';
+import { DrawerAppBarProps } from '../drawer-app-bar';
+import { DrawerContentProps, DrawerNavigation, DrawerProps, DrawerProviderProps } from '../drawerx/drawer.types';
+/**
+ * Slots for DrawerLayout.
+ */
+export interface DrawerLayoutSlots {
+    /**
+     * Slot for DrawerAppBar.
+     */
+    drawerAppBar?: JSXElementConstructor<DrawerAppBarProps>;
+    /**
+     * Slot for Drawer.
+     */
+    drawer?: JSXElementConstructor<DrawerProps>;
+    /**
+     * Slot for DrawerContent.
+     */
+    drawerContent?: JSXElementConstructor<DrawerContentProps>;
+}
+/**
+ * Slot props for DrawerLayout.
+ */
+export interface DrawerLayoutSlotProps {
+    /**
+     * Props for DrawerAppBar slot.
+     */
+    drawerAppBar?: DrawerAppBarProps;
+    /**
+     * Props for Drawer slot.
+     */
+    drawer?: DrawerProps;
+    /**
+     * Props for DrawerContent slot.
+     */
+    drawerContent?: DrawerContentProps;
+}
+/**
+ * Props for DrawerLayout.
+ */
+export interface DrawerLayoutProps extends DrawerProviderProps {
+    /**
+     * Title of the drawer layout.
+     */
+    title: string;
+    /**
+     * Navigation tree.
+     */
+    navigation: DrawerNavigation;
+    /**
+     * Optional slots.
+     */
+    slots?: DrawerLayoutSlots;
+    /**
+     * Optional slot props.
+     */
+    slotsProps?: DrawerLayoutSlotProps;
+}
+/**
+ * Layout structure with drawer and app bar.
+ */
+export default function DrawerLayout({ children, navigation, title, slots, slotsProps, ...rest }: DrawerLayoutProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,32 @@
+import { jsxs as d, jsx as r } from "react/jsx-runtime";
+import D from "../drawer/drawer.mjs";
+import f from "../drawer-app-bar/drawer-app-bar.mjs";
+import c from "../drawer-content/drawer-content.mjs";
+import "../drawer-context/drawer-context.mjs";
+import { DrawerProvider as u } from "../drawer-context/drawer-provider.mjs";
+import A from "../drawer-main/drawer-main.mjs";
+function v({
+  children: t,
+  navigation: o,
+  title: n,
+  slots: e,
+  slotsProps: a,
+  ...w
+}) {
+  const p = e?.drawerAppBar ?? f, m = e?.drawer ?? D, i = e?.drawerContent ?? c;
+  return /* @__PURE__ */ d(u, { ...w, children: [
+    /* @__PURE__ */ r(p, { title: n, ...a?.drawerAppBar }),
+    /* @__PURE__ */ r(m, { ...a?.drawer, children: /* @__PURE__ */ r(
+      i,
+      {
+        navigation: o,
+        ...a?.drawerContent
+      }
+    ) }),
+    /* @__PURE__ */ r(A, { children: t })
+  ] });
+}
+export {
+  v as default
+};
+//# sourceMappingURL=drawer-layout.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-layout.mjs","sources":["../../../src/components/drawer-layout/drawer-layout.tsx"],"sourcesContent":["import type { JSXElementConstructor } from \"react\";\nimport Drawer from \"@/components/drawer\";\nimport DrawerAppBar, {\n  type DrawerAppBarProps,\n} from \"@/components/drawer-app-bar\";\nimport DrawerContent from \"@/components/drawer-content\";\nimport { DrawerProvider } from \"@/components/drawer-context\";\nimport DrawerMain from \"@/components/drawer-main\";\nimport type {\n  DrawerContentProps,\n  DrawerNavigation,\n  DrawerProps,\n  DrawerProviderProps,\n} from \"@/components/drawerx/drawer.types\";\n\n/**\n * Slots for DrawerLayout.\n */\nexport interface DrawerLayoutSlots {\n  /**\n   * Slot for DrawerAppBar.\n   */\n  drawerAppBar?: JSXElementConstructor<DrawerAppBarProps>;\n  /**\n   * Slot for Drawer.\n   */\n  drawer?: JSXElementConstructor<DrawerProps>;\n  /**\n   * Slot for DrawerContent.\n   */\n  drawerContent?: JSXElementConstructor<DrawerContentProps>;\n}\n\n/**\n * Slot props for DrawerLayout.\n */\nexport interface DrawerLayoutSlotProps {\n  /**\n   * Props for DrawerAppBar slot.\n   */\n  drawerAppBar?: DrawerAppBarProps;\n  /**\n   * Props for Drawer slot.\n   */\n  drawer?: DrawerProps;\n  /**\n   * Props for DrawerContent slot.\n   */\n  drawerContent?: DrawerContentProps;\n}\n\n/**\n * Props for DrawerLayout.\n */\nexport interface DrawerLayoutProps extends DrawerProviderProps {\n  /**\n   * Title of the drawer layout.\n   */\n  title: string;\n  /**\n   * Navigation tree.\n   */\n  navigation: DrawerNavigation;\n  /**\n   * Optional slots.\n   */\n  slots?: DrawerLayoutSlots;\n  /**\n   * Optional slot props.\n   */\n  slotsProps?: DrawerLayoutSlotProps;\n}\n\n/**\n * Layout structure with drawer and app bar.\n */\nexport default function DrawerLayout({\n  children,\n  navigation,\n  title,\n  slots,\n  slotsProps,\n  ...rest\n}: DrawerLayoutProps) {\n  const DrawerAppBarSlot = slots?.drawerAppBar ?? DrawerAppBar;\n  const DrawerSlot = slots?.drawer ?? Drawer;\n  const DrawerContentSlot = slots?.drawerContent ?? DrawerContent;\n\n  return (\n    <DrawerProvider {...rest}>\n      <DrawerAppBarSlot title={title} {...slotsProps?.drawerAppBar} />\n      <DrawerSlot {...slotsProps?.drawer}>\n        <DrawerContentSlot\n          navigation={navigation}\n          {...slotsProps?.drawerContent}\n        />\n      </DrawerSlot>\n      <DrawerMain>{children}</DrawerMain>\n    </DrawerProvider>\n  );\n}\n"],"names":["DrawerLayout","children","navigation","title","slots","slotsProps","rest","DrawerAppBarSlot","DrawerAppBar","DrawerSlot","Drawer","DrawerContentSlot","DrawerContent","jsxs","DrawerProvider","jsx","DrawerMain"],"mappings":";;;;;;;AA4EA,SAAwBA,EAAa;AAAA,EACnC,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,YAAAC;AAAA,EACA,GAAGC;AACL,GAAsB;AACpB,QAAMC,IAAmBH,GAAO,gBAAgBI,GAC1CC,IAAaL,GAAO,UAAUM,GAC9BC,IAAoBP,GAAO,iBAAiBQ;AAElD,SACE,gBAAAC,EAACC,GAAA,EAAgB,GAAGR,GAClB,UAAA;AAAA,IAAA,gBAAAS,EAACR,GAAA,EAAiB,OAAAJ,GAAe,GAAGE,GAAY,aAAA,CAAc;AAAA,IAC9D,gBAAAU,EAACN,GAAA,EAAY,GAAGJ,GAAY,QAC1B,UAAA,gBAAAU;AAAA,MAACJ;AAAA,MAAA;AAAA,QACC,YAAAT;AAAA,QACC,GAAGG,GAAY;AAAA,MAAA;AAAA,IAAA,GAEpB;AAAA,IACA,gBAAAU,EAACC,KAAY,UAAAf,EAAA,CAAS;AAAA,EAAA,GACxB;AAEJ;"}

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

@@ -0,0 +1,2 @@
+export type { DrawerLayoutProps, DrawerLayoutSlotProps, DrawerLayoutSlots, } from './drawer-layout';
+export { default, default as DrawerLayout } from './drawer-layout';

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

@@ -0,0 +1,6 @@
+import { PropsWithChildren } from 'react';
+export type DrawerMainProps = PropsWithChildren;
+/**
+ * Main content area that shifts with drawer state.
+ */
+export default function DrawerMain({ children }: DrawerMainProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,9 @@
+import { jsx as t } from "react/jsx-runtime";
+import { SidebarInset as e } from "../ui/sidebar.mjs";
+function i({ children: r }) {
+  return /* @__PURE__ */ t(e, { children: r });
+}
+export {
+  i as default
+};
+//# sourceMappingURL=drawer-main.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-main.mjs","sources":["../../../src/components/drawer-main/drawer-main.tsx"],"sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport { SidebarInset } from \"@/components/ui/sidebar\";\n\nexport type DrawerMainProps = PropsWithChildren;\n\n/**\n * Main content area that shifts with drawer state.\n */\nexport default function DrawerMain({ children }: DrawerMainProps) {\n  return <SidebarInset>{children}</SidebarInset>;\n}\n"],"names":["DrawerMain","children","jsx","SidebarInset"],"mappings":";;AAQA,SAAwBA,EAAW,EAAE,UAAAC,KAA6B;AAChE,SAAO,gBAAAC,EAACC,KAAc,UAAAF,GAAS;AACjC;"}

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

@@ -0,0 +1,2 @@
+export type { DrawerMainProps } from './drawer-main';
+export { default, default as DrawerMain } from './drawer-main';

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

@@ -0,0 +1,6 @@
+import { HTMLAttributes } from 'react';
+export type DrawerSubheaderProps = HTMLAttributes<HTMLDivElement>;
+/**
+ * Section subheader rendered inside drawer navigation.
+ */
+export default function DrawerSubheader({ className, children, ...rest }: DrawerSubheaderProps): import("react/jsx-runtime").JSX.Element | null;

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

@@ -0,0 +1,17 @@
+import { jsx as a } from "react/jsx-runtime";
+import { useDrawer as m } from "../drawer-context/drawer-context.mjs";
+import "react";
+import { SidebarGroupLabel as p } from "../ui/sidebar.mjs";
+import { cn as s } from "../../lib/utils.mjs";
+function l({
+  className: r,
+  children: e,
+  ...o
+}) {
+  const { state: t } = m();
+  return t === "close" ? null : /* @__PURE__ */ a(p, { className: s("uppercase", r), ...o, children: e });
+}
+export {
+  l as default
+};
+//# sourceMappingURL=drawer-subheader.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawer-subheader.mjs","sources":["../../../src/components/drawer-subheader/drawer-subheader.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport { useDrawer } from \"@/components/drawer-context\";\nimport { SidebarGroupLabel } from \"@/components/ui/sidebar\";\nimport { cn } from \"@/lib/utils\";\n\nexport type DrawerSubheaderProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * Section subheader rendered inside drawer navigation.\n */\nexport default function DrawerSubheader({\n  className,\n  children,\n  ...rest\n}: DrawerSubheaderProps) {\n  const { state } = useDrawer();\n\n  if (state === \"close\") {\n    return null;\n  }\n\n  return (\n    <SidebarGroupLabel className={cn(\"uppercase\", className)} {...rest}>\n      {children}\n    </SidebarGroupLabel>\n  );\n}\n"],"names":["DrawerSubheader","className","children","rest","state","useDrawer","jsx","SidebarGroupLabel","cn"],"mappings":";;;;;AAUA,SAAwBA,EAAgB;AAAA,EACtC,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GAAyB;AACvB,QAAM,EAAE,OAAAC,EAAA,IAAUC,EAAA;AAElB,SAAID,MAAU,UACL,OAIP,gBAAAE,EAACC,KAAkB,WAAWC,EAAG,aAAaP,CAAS,GAAI,GAAGE,GAC3D,UAAAD,GACH;AAEJ;"}

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

@@ -0,0 +1,2 @@
+export type { DrawerSubheaderProps } from './drawer-subheader';
+export { default, default as DrawerSubheader } from './drawer-subheader';

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

@@ -0,0 +1,11 @@
+import { DrawerNavigation, DrawerNavigationCollapsable, DrawerNavigationItem, DrawerNavigationLink } from './drawer.types';
+export declare const mockLinkDrawerNavigationItem: DrawerNavigationLink;
+export declare const mockLinkNoIconDrawerNavigationItem: DrawerNavigationLink;
+export declare const mockLinkBulletDrawerNavigationItem: DrawerNavigationItem;
+export declare const mockLinkLabelDrawerNavigationItem: DrawerNavigationItem;
+export declare const mockLinkAvatarDrawerNavigationItem: DrawerNavigationItem;
+export declare const mockListDrawerNavigationItems: DrawerNavigationItem[];
+export declare const mockMenuDrawerNavigationItem: DrawerNavigationCollapsable;
+export declare const mockMenuInsideMenuDrawerNavigationItem: DrawerNavigationItem;
+export declare const mockListDrawerNavigationItems2: DrawerNavigationItem[];
+export declare const mockDrawerNavigation: DrawerNavigation;

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

@@ -0,0 +1,189 @@
+import { ComponentType, CSSProperties, HTMLAttributes, PropsWithChildren, ReactElement } from 'react';
+import { BadgeVariant } from '../badge';
+import { BulletVariant } from '../bullet';
+/**
+ * Drawer states.
+ * - open: expanded drawer with labels
+ * - close: mini drawer with icons only
+ */
+export type DrawerState = "open" | "close";
+/**
+ * Drawer size variants.
+ */
+export type DrawerSize = "small" | "medium";
+/**
+ * Avatar configuration for drawer items.
+ */
+export interface DrawerItemAvatar {
+    /**
+     * Avatar image source URL.
+     */
+    src: string;
+    /**
+     * Alt text for the avatar image.
+     */
+    alt: string;
+}
+/**
+ * Label configuration for drawer items.
+ */
+export interface DrawerItemLabel {
+    /**
+     * Label text content.
+     */
+    text: string;
+    /**
+     * Label color variant.
+     */
+    variant: BadgeVariant;
+}
+/**
+ * Bullet indicator configuration for drawer items.
+ */
+export interface DrawerItemBullet {
+    /**
+     * Bullet color variant.
+     */
+    variant: BulletVariant;
+}
+/**
+ * Navigation link item in the drawer.
+ */
+export interface DrawerNavigationLink {
+    /**
+     * Item type discriminator.
+     */
+    kind: "link";
+    /**
+     * Unique identifier.
+     */
+    id: string;
+    /**
+     * Display text.
+     */
+    text: string;
+    /**
+     * Navigation URL.
+     */
+    href: string;
+    /**
+     * Optional icon element.
+     */
+    icon?: ReactElement;
+    /**
+     * Optional avatar configuration.
+     */
+    avatar?: DrawerItemAvatar;
+    /**
+     * Optional label badge.
+     */
+    label?: DrawerItemLabel;
+    /**
+     * Optional bullet indicator.
+     */
+    bullet?: DrawerItemBullet;
+}
+/**
+ * Collapsible navigation group with nested items.
+ */
+export type DrawerNavigationCollapsable = Pick<DrawerNavigationLink, "id" | "text" | "icon"> & {
+    /**
+     * Item type discriminator.
+     */
+    kind: "collapsable";
+    /**
+     * Nested navigation items.
+     */
+    items: DrawerNavigationItem[];
+};
+/**
+ * Section header in the drawer navigation.
+ */
+export interface DrawerNavigationHeader {
+    /**
+     * Item type discriminator.
+     */
+    kind: "header";
+    /**
+     * Unique identifier.
+     */
+    id: string;
+    /**
+     * Header text.
+     */
+    text: string;
+}
+/**
+ * Union of all possible drawer navigation item types.
+ */
+export type DrawerNavigationItem = DrawerNavigationLink | DrawerNavigationCollapsable | DrawerNavigationHeader;
+/**
+ * Complete navigation structure for the drawer.
+ */
+export type DrawerNavigation = DrawerNavigationItem[];
+/**
+ * Props for DrawerContent.
+ */
+export interface DrawerContentProps {
+    /**
+     * Navigation items to render.
+     */
+    navigation: DrawerNavigation;
+}
+/**
+ * Props for Drawer component.
+ */
+export type DrawerProps = PropsWithChildren<HTMLAttributes<HTMLElement>>;
+/**
+ * Shared item colors returned from drawer selection state.
+ */
+export declare const getDrawerItemColors: (selected: boolean | undefined) => {
+    colorClass: string;
+    fontWeight: CSSProperties["fontWeight"];
+};
+/**
+ * Props for DrawerAppBar.
+ */
+export interface DrawerAppBarProps extends PropsWithChildren<HTMLAttributes<HTMLElement>> {
+    /**
+     * Title to display in the app bar.
+     */
+    title?: string;
+}
+/**
+ * Props for DrawerProvider.
+ */
+export interface DrawerProviderProps extends PropsWithChildren {
+    /**
+     * Initial state of the drawer.
+     */
+    initialState?: DrawerState;
+    /**
+     * Size of the drawer.
+     * @default "medium"
+     */
+    size?: DrawerSize;
+    /**
+     * Whether the drawer is clipped under the app bar.
+     * @default true
+     */
+    clipped?: boolean;
+    /**
+     * Width of the drawer in pixels.
+     */
+    drawerWidth?: number;
+    /**
+     * ID of currently selected navigation item.
+     */
+    selectedItemId?: string;
+    /**
+     * Component used to render links.
+     * @default "a"
+     */
+    LinkComponent?: ComponentType<any> | string;
+    /**
+     * Callback fired when drawer state changes.
+     * @param newState - The new drawer state.
+     */
+    onStateChange?: (newState: DrawerState) => void;
+}

package/dist/components/drawerx/drawer.types.mjs

@@ -0,0 +1,8 @@
+const r = (o) => ({
+  colorClass: o ? "text-primary" : "text-foreground",
+  fontWeight: o ? 700 : 500
+});
+export {
+  r as getDrawerItemColors
+};
+//# sourceMappingURL=drawer.types.mjs.map