@pautena/react-design-system 0.20.2 → 1.0.0

package/dist/Drawerx/DrawerItem/DrawerItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerItem.mjs","sources":["../../../src/Drawerx/DrawerItem/DrawerItem.tsx"],"sourcesContent":["import type { DrawerNavigationItem } from \"../Drawer.types\";\nimport { useDrawer } from \"../DrawerContext\";\nimport DrawerSubheader from \"../DrawerSubheader\";\nimport { DrawerItemLink } from \"./DrawerItemLink\";\nimport { DrawerMenuItem } from \"./DrawerMenuItem\";\n\nexport interface DrawerItemProps {\n  /**\n   * Data to be rendered\n   */\n  item: DrawerNavigationItem;\n  /**\n   * Deep level of this item inside the submenus\n   */\n  level?: number;\n}\n\n/**\n * Component representing a drawer item in the navigation drawer.\n */\nexport default function DrawerItem({ item, level = 0 }: DrawerItemProps) {\n  const { selectedItemId, state } = useDrawer();\n  if (item.kind === \"collapsable\") {\n    const { id, text, icon, items } = item;\n    const childrenSelected = items.some((item) => item.id === selectedItemId);\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  if (item.kind === \"header\") {\n    return (\n      state === \"open\" && (\n        <DrawerSubheader role=\"heading\">{item.text}</DrawerSubheader>\n      )\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    />\n  );\n}\n"],"names":["DrawerItem","item","level","selectedItemId","state","useDrawer","id","text","icon","items","childrenSelected","jsx","DrawerMenuItem","DrawerSubheader","avatar","label","bullet","href","DrawerItemLink"],"mappings":";;;;;;;AAoBA,SAAwBA,EAAW,EAAE,MAAAC,GAAM,OAAAC,IAAQ,KAAsB;AACvE,QAAM,EAAE,gBAAAC,GAAgB,OAAAC,EAAA,IAAUC,EAAA;AAClC,MAAIJ,EAAK,SAAS,eAAe;AAC/B,UAAM,EAAE,IAAAK,GAAI,MAAAC,GAAM,MAAAC,GAAM,OAAAC,MAAUR,GAC5BS,IAAmBD,EAAM,KAAK,CAACR,MAASA,EAAK,OAAOE,CAAc;AACxE,WACEQ,gBAAAA,EAAAA;AAAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAUN,MAAOH,KAAkBO;AAAA,QACnC,MAAMH;AAAAA,QACN,MAAMC;AAAAA,QACN,OAAAC;AAAA,QACA,OAAAP;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACA,MAAID,EAAK,SAAS;AAChB,WACEG,MAAU,UACRO,gBAAAA,EAAAA,IAACE,KAAgB,MAAK,WAAW,YAAK,MAAK;AAIjD,QAAM,EAAE,IAAAP,GAAI,MAAAC,GAAM,MAAAC,GAAM,QAAAM,GAAQ,OAAAC,GAAO,QAAAC,GAAQ,MAAAC,MAAShB;AACxD,SACEU,gBAAAA,EAAAA;AAAAA,IAACO;AAAA,IAAA;AAAA,MACC,UAAUZ,MAAOH;AAAA,MACjB,MAAAI;AAAA,MACA,MAAAC;AAAA,MACA,QAAAM;AAAA,MACA,OAAAC;AAAA,MACA,QAAAC;AAAA,MACA,MAAAC;AAAA,MACA,OAAAf;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/Drawerx/DrawerItem/DrawerItemLink.d.ts

@@ -0,0 +1,46 @@
+import { SxProps, Theme } from '@mui/material/styles';
+import { ReactElement } from 'react';
+import { DrawerItemAvatar, DrawerItemBullet, DrawerItemLabel } from '../Drawer.types';
+export interface DrawerItemLinkProps {
+    /**
+     * Text displayed inside the item
+     */
+    text: string;
+    /**
+     * Url where the user is going to be redirected
+     * if the item is clicked
+     */
+    href: string;
+    /**
+     * Icon displayed to the left
+     */
+    icon?: ReactElement;
+    /**
+     * Avatar displayed to the left
+     */
+    avatar?: DrawerItemAvatar;
+    /**
+     * Label with extra info displayed to the right
+     */
+    label?: DrawerItemLabel;
+    /**
+     * Bullet to attract the user attention displyed to the right
+     */
+    bullet?: DrawerItemBullet;
+    /**
+     * The item has to be marked as selected
+     */
+    selected?: boolean;
+    /**
+     * Deep level of this item inside the submenus
+     */
+    level: number;
+    /**
+     * Custom styles
+     */
+    sx?: SxProps<Theme>;
+}
+/**
+ * Clicable item inside a drawer
+ */
+export declare const DrawerItemLink: ({ text, icon, avatar, label, bullet, href, selected, level, sx, }: DrawerItemLinkProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Drawerx/DrawerItem/DrawerItemLink.mjs

@@ -0,0 +1,98 @@
+import { j as o } from "../../_virtual/jsx-runtime.mjs";
+import { Bullet as g } from "../../Bullet/Bullet.mjs";
+import { Label as I } from "../../Label/Label.mjs";
+import { getDrawerItemColors as L } from "../Drawer.types.mjs";
+import "@mui/material";
+import "react";
+import { useDrawer as l } from "../DrawerContext/DrawerContext.mjs";
+import y from "../../node_modules/@mui/material/esm/styles/useTheme.mjs";
+import w from "../../node_modules/@mui/material/esm/ListItemButton/ListItemButton.mjs";
+import C from "../../node_modules/@mui/material/esm/ListItemIcon/ListItemIcon.mjs";
+import v from "../../node_modules/@mui/material/esm/ListItemAvatar/ListItemAvatar.mjs";
+import D from "../../node_modules/@mui/material/esm/Avatar/Avatar.mjs";
+import R from "../../node_modules/@mui/material/esm/ListItemText/ListItemText.mjs";
+const h = {
+  minWidth: 0,
+  justifyContent: "center",
+  marginRight: "auto"
+}, K = ({
+  text: e,
+  icon: m,
+  avatar: s,
+  label: i,
+  bullet: n,
+  href: f,
+  selected: p,
+  level: r,
+  sx: d
+}) => {
+  const { state: t, size: a } = l(), c = y(), { color: x, fontWeight: j } = L(c, p), { LinkComponent: u } = l();
+  return /* @__PURE__ */ o.jsxs(
+    w,
+    {
+      dense: a === "small",
+      LinkComponent: u,
+      "aria-label": e,
+      href: f,
+      selected: p,
+      sx: {
+        ...d,
+        borderRadius: 2,
+        pl: t === "open" ? c.spacing(2 + 1.5 * r) : void 0,
+        ...t === "collapse" && {
+          px: 2.5,
+          justifyContent: "center"
+        }
+      },
+      children: [
+        m && /* @__PURE__ */ o.jsx(
+          C,
+          {
+            sx: {
+              color: x,
+              ...t === "collapse" && r === 0 && h
+            },
+            children: m
+          }
+        ),
+        s && /* @__PURE__ */ o.jsx(
+          v,
+          {
+            sx: {
+              ...t === "collapse" && r === 0 && h
+            },
+            children: /* @__PURE__ */ o.jsx(
+              D,
+              {
+                alt: s.alt,
+                src: s.src,
+                sx: {
+                  ...a === "small" && { width: 24, height: 24 },
+                  ...t === "collapse" && { width: 30, height: 30 }
+                }
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ o.jsx(
+          R,
+          {
+            disableTypography: !0,
+            primary: e,
+            sx: {
+              color: x,
+              fontWeight: j,
+              opacity: t === "collapse" && r === 0 ? 0 : void 0
+            }
+          }
+        ),
+        i && t === "open" && /* @__PURE__ */ o.jsx(I, { text: i.text, variant: i.variant, sx: { ml: 2 } }),
+        n && t === "open" && /* @__PURE__ */ o.jsx(g, { variant: n.variant, sx: { ml: 2 } })
+      ]
+    }
+  );
+};
+export {
+  K as DrawerItemLink
+};
+//# sourceMappingURL=DrawerItemLink.mjs.map

package/dist/Drawerx/DrawerItem/DrawerItemLink.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerItemLink.mjs","sources":["../../../src/Drawerx/DrawerItem/DrawerItemLink.tsx"],"sourcesContent":["import Avatar from \"@mui/material/Avatar\";\nimport ListItemAvatar from \"@mui/material/ListItemAvatar\";\nimport ListItemButton from \"@mui/material/ListItemButton\";\nimport ListItemIcon from \"@mui/material/ListItemIcon\";\nimport ListItemText from \"@mui/material/ListItemText\";\nimport { type SxProps, type Theme, useTheme } from \"@mui/material/styles\";\nimport type { ReactElement } from \"react\";\nimport { Bullet } from \"../../Bullet\";\nimport { Label } from \"../../Label\";\nimport {\n  type DrawerItemAvatar,\n  type DrawerItemBullet,\n  type DrawerItemLabel,\n  getDrawerItemColors,\n} from \"../Drawer.types\";\nimport { useDrawer } from \"../DrawerContext\";\n\nexport interface DrawerItemLinkProps {\n  /**\n   * Text displayed inside the item\n   */\n  text: string;\n  /**\n   * Url where the user is going to be redirected\n   * if the item is clicked\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 with extra info displayed to the right\n   */\n  label?: DrawerItemLabel;\n  /**\n   * Bullet to attract the user attention displyed to the right\n   */\n  bullet?: DrawerItemBullet;\n  /**\n   * The item has to be marked as selected\n   */\n  selected?: boolean;\n  /**\n   * Deep level of this item inside the submenus\n   */\n  level: number;\n  /**\n   * Custom styles\n   */\n  sx?: SxProps<Theme>;\n}\n\nconst sxCollapsedIcon = {\n  minWidth: 0,\n  justifyContent: \"center\",\n  marginRight: \"auto\",\n};\n\n/**\n * Clicable item inside a drawer\n */\nexport const DrawerItemLink = ({\n  text,\n  icon,\n  avatar,\n  label,\n  bullet,\n  href,\n  selected,\n  level,\n  sx,\n}: DrawerItemLinkProps) => {\n  const { state, size } = useDrawer();\n  const theme = useTheme();\n  const { color, fontWeight } = getDrawerItemColors(theme, selected);\n  const { LinkComponent } = useDrawer();\n\n  return (\n    <ListItemButton\n      dense={size === \"small\"}\n      LinkComponent={LinkComponent}\n      aria-label={text}\n      href={href}\n      selected={selected}\n      sx={{\n        ...sx,\n        borderRadius: 2,\n        pl: state === \"open\" ? theme.spacing(2 + 1.5 * level) : undefined,\n        ...(state === \"collapse\" && {\n          px: 2.5,\n          justifyContent: \"center\",\n        }),\n      }}\n    >\n      {icon && (\n        <ListItemIcon\n          sx={{\n            color,\n            ...(state === \"collapse\" && level === 0 && sxCollapsedIcon),\n          }}\n        >\n          {icon}\n        </ListItemIcon>\n      )}\n      {avatar && (\n        <ListItemAvatar\n          sx={{\n            ...(state === \"collapse\" && level === 0 && sxCollapsedIcon),\n          }}\n        >\n          <Avatar\n            alt={avatar.alt}\n            src={avatar.src}\n            sx={{\n              ...(size === \"small\" && { width: 24, height: 24 }),\n              ...(state === \"collapse\" && { width: 30, height: 30 }),\n            }}\n          />\n        </ListItemAvatar>\n      )}\n      <ListItemText\n        disableTypography\n        primary={text}\n        sx={{\n          color,\n          fontWeight,\n          opacity: state === \"collapse\" && level === 0 ? 0 : undefined,\n        }}\n      />\n      {label && state === \"open\" && (\n        <Label text={label.text} variant={label.variant} sx={{ ml: 2 }} />\n      )}\n      {bullet && state === \"open\" && (\n        <Bullet variant={bullet.variant} sx={{ ml: 2 }} />\n      )}\n    </ListItemButton>\n  );\n};\n"],"names":["sxCollapsedIcon","DrawerItemLink","text","icon","avatar","label","bullet","href","selected","level","sx","state","size","useDrawer","theme","useTheme","color","fontWeight","getDrawerItemColors","LinkComponent","jsxs","ListItemButton","jsx","ListItemIcon","ListItemAvatar","Avatar","ListItemText","Label","Bullet"],"mappings":";;;;;;;;;;;;;AAyDA,MAAMA,IAAkB;AAAA,EACtB,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,aAAa;AACf,GAKaC,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,IAAAC;AACF,MAA2B;AACzB,QAAM,EAAE,OAAAC,GAAO,MAAAC,EAAA,IAASC,EAAA,GAClBC,IAAQC,EAAA,GACR,EAAE,OAAAC,GAAO,YAAAC,EAAA,IAAeC,EAAoBJ,GAAON,CAAQ,GAC3D,EAAE,eAAAW,EAAA,IAAkBN,EAAA;AAE1B,SACEO,gBAAAA,EAAAA;AAAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAOT,MAAS;AAAA,MAChB,eAAAO;AAAA,MACA,cAAYjB;AAAA,MACZ,MAAAK;AAAA,MACA,UAAAC;AAAA,MACA,IAAI;AAAA,QACF,GAAGE;AAAA,QACH,cAAc;AAAA,QACd,IAAIC,MAAU,SAASG,EAAM,QAAQ,IAAI,MAAML,CAAK,IAAI;AAAA,QACxD,GAAIE,MAAU,cAAc;AAAA,UAC1B,IAAI;AAAA,UACJ,gBAAgB;AAAA,QAAA;AAAA,MAClB;AAAA,MAGD,UAAA;AAAA,QAAAR,KACCmB,gBAAAA,EAAAA;AAAAA,UAACC;AAAA,UAAA;AAAA,YACC,IAAI;AAAA,cACF,OAAAP;AAAA,cACA,GAAIL,MAAU,cAAcF,MAAU,KAAKT;AAAA,YAAA;AAAA,YAG5C,UAAAG;AAAA,UAAA;AAAA,QAAA;AAAA,QAGJC,KACCkB,gBAAAA,EAAAA;AAAAA,UAACE;AAAA,UAAA;AAAA,YACC,IAAI;AAAA,cACF,GAAIb,MAAU,cAAcF,MAAU,KAAKT;AAAA,YAAA;AAAA,YAG7C,UAAAsB,gBAAAA,EAAAA;AAAAA,cAACG;AAAA,cAAA;AAAA,gBACC,KAAKrB,EAAO;AAAA,gBACZ,KAAKA,EAAO;AAAA,gBACZ,IAAI;AAAA,kBACF,GAAIQ,MAAS,WAAW,EAAE,OAAO,IAAI,QAAQ,GAAA;AAAA,kBAC7C,GAAID,MAAU,cAAc,EAAE,OAAO,IAAI,QAAQ,GAAA;AAAA,gBAAG;AAAA,cACtD;AAAA,YAAA;AAAA,UACF;AAAA,QAAA;AAAA,QAGJW,gBAAAA,EAAAA;AAAAA,UAACI;AAAA,UAAA;AAAA,YACC,mBAAiB;AAAA,YACjB,SAASxB;AAAA,YACT,IAAI;AAAA,cACF,OAAAc;AAAA,cACA,YAAAC;AAAA,cACA,SAASN,MAAU,cAAcF,MAAU,IAAI,IAAI;AAAA,YAAA;AAAA,UACrD;AAAA,QAAA;AAAA,QAEDJ,KAASM,MAAU,UAClBW,gBAAAA,EAAAA,IAACK,KAAM,MAAMtB,EAAM,MAAM,SAASA,EAAM,SAAS,IAAI,EAAE,IAAI,KAAK;AAAA,QAEjEC,KAAUK,MAAU,UACnBW,gBAAAA,EAAAA,IAACM,GAAA,EAAO,SAAStB,EAAO,SAAS,IAAI,EAAE,IAAI,EAAA,EAAE,CAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIxD;"}

package/dist/Drawerx/DrawerItem/DrawerMenuItem.d.ts

@@ -0,0 +1,31 @@
+import { SxProps, Theme } from '@mui/material/styles';
+import { ReactElement } from 'react';
+import { DrawerNavigationItem } from '../Drawer.types';
+export interface DrawerMenuItemProps {
+    /**
+     * Text displayed inside the item
+     */
+    text: string;
+    /**
+     * Icon displayed to the left
+     */
+    icon?: ReactElement;
+    /**
+     * The item has to be marked as selected
+     */
+    selected?: boolean;
+    /**
+     * Items that are going to be displayed inside
+     * the collapsable
+     */
+    items: DrawerNavigationItem[];
+    /**
+     * Deep level of this item inside the submenus
+     */
+    level: number;
+    /**
+     * Custom styles
+     */
+    sx?: SxProps<Theme>;
+}
+export declare const DrawerMenuItem: ({ text, icon, selected, items, level, sx, }: DrawerMenuItemProps) => import("react/jsx-runtime").JSX.Element;

package/dist/Drawerx/DrawerItem/DrawerMenuItem.mjs

@@ -0,0 +1,115 @@
+import { j as o } from "../../_virtual/jsx-runtime.mjs";
+import E from "../../node_modules/@mui/icons-material/esm/ChevronRight.mjs";
+import O from "../../node_modules/@mui/icons-material/esm/ExpandMore.mjs";
+import { useRef as S, useState as d, useEffect as w } from "react";
+import { getDrawerItemColors as z } from "../Drawer.types.mjs";
+import "@mui/material";
+import { useDrawer as D } from "../DrawerContext/DrawerContext.mjs";
+import L from "./DrawerItem.mjs";
+import x from "../../node_modules/@mui/material/esm/styles/useTheme.mjs";
+import R from "../../node_modules/@mui/material/esm/List/List.mjs";
+import T from "../../node_modules/@mui/material/esm/ListItemButton/ListItemButton.mjs";
+import M from "../../node_modules/@mui/material/esm/ListItemIcon/ListItemIcon.mjs";
+import P from "../../node_modules/@mui/material/esm/ListItemText/ListItemText.mjs";
+import k from "../../node_modules/@mui/material/esm/Collapse/Collapse.mjs";
+import B from "../../node_modules/@mui/material/esm/Popover/Popover.mjs";
+const Z = ({
+  text: t,
+  icon: a,
+  selected: p,
+  items: h,
+  level: n,
+  sx: j = {}
+}) => {
+  const { state: e, size: g } = D(), l = S(null), { palette: b, spacing: C, transitions: v } = x(), [r, m] = d(!1), { color: s, fontWeight: I } = z(x(), p), [y, c] = d(!0);
+  w(() => {
+    r && e === "collapse" && (c(!1), setTimeout(() => {
+      c(!0);
+    }, v.duration.leavingScreen));
+  }, [e]);
+  const u = /* @__PURE__ */ o.jsx(R, { component: "div", disablePadding: !0, children: h.map((i) => /* @__PURE__ */ o.jsx(L, { level: n + 1, item: i }, i.id)) }), f = e === "collapse" && n === 0 ? {
+    position: "absolute",
+    right: -3
+  } : {};
+  return /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+    /* @__PURE__ */ o.jsxs(
+      T,
+      {
+        ref: l,
+        selected: p,
+        "aria-label": t,
+        onClick: () => m((i) => !i),
+        dense: g === "small",
+        sx: {
+          ...j,
+          borderRadius: 2,
+          pl: e === "open" ? C(2 + 1.5 * n) : void 0,
+          backgroundColor: r ? b.action.hover : void 0,
+          ...e === "collapse" && {
+            px: 2.5,
+            justifyContent: "center"
+          }
+        },
+        children: [
+          a && /* @__PURE__ */ o.jsx(M, { sx: { color: s, justifyContent: "center" }, children: a }),
+          /* @__PURE__ */ o.jsx(
+            P,
+            {
+              disableTypography: !0,
+              primary: t,
+              sx: {
+                color: s,
+                fontWeight: I,
+                opacity: e === "collapse" && n === 0 ? 0 : void 0
+              }
+            }
+          ),
+          r && e === "open" ? /* @__PURE__ */ o.jsx(
+            O,
+            {
+              sx: [{ color: s, ml: 2, fontSize: 20 }, f]
+            }
+          ) : /* @__PURE__ */ o.jsx(
+            E,
+            {
+              sx: [{ color: s, ml: 2, fontSize: 20 }, f]
+            }
+          )
+        ]
+      }
+    ),
+    e === "open" ? /* @__PURE__ */ o.jsx(
+      k,
+      {
+        in: r,
+        timeout: "auto",
+        unmountOnExit: !0,
+        "aria-label": `${t} collapse submenu`,
+        children: u
+      }
+    ) : y && /* @__PURE__ */ o.jsx(
+      B,
+      {
+        open: r,
+        slotProps: {
+          paper: {
+            elevation: 0,
+            variant: "outlined"
+          }
+        },
+        "aria-label": `${t} popover submenu`,
+        anchorEl: l.current,
+        onClose: () => m(!1),
+        anchorOrigin: {
+          vertical: "top",
+          horizontal: "right"
+        },
+        children: u
+      }
+    )
+  ] });
+};
+export {
+  Z as DrawerMenuItem
+};
+//# sourceMappingURL=DrawerMenuItem.mjs.map

package/dist/Drawerx/DrawerItem/DrawerMenuItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerMenuItem.mjs","sources":["../../../src/Drawerx/DrawerItem/DrawerMenuItem.tsx"],"sourcesContent":["import ChevronRightIcon from \"@mui/icons-material/ChevronRight\";\nimport ExpandMoreIcon from \"@mui/icons-material/ExpandMore\";\nimport Collapse from \"@mui/material/Collapse\";\nimport List from \"@mui/material/List\";\nimport ListItemButton from \"@mui/material/ListItemButton\";\nimport ListItemIcon from \"@mui/material/ListItemIcon\";\nimport ListItemText from \"@mui/material/ListItemText\";\nimport Popover from \"@mui/material/Popover\";\nimport { type SxProps, type Theme, useTheme } from \"@mui/material/styles\";\nimport { type ReactElement, useEffect, useRef, useState } from \"react\";\nimport {\n  type DrawerNavigationItem,\n  getDrawerItemColors,\n} from \"../Drawer.types\";\nimport { useDrawer } from \"../DrawerContext\";\nimport DrawerItem from \"./DrawerItem\";\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   * The item has to be marked as selected\n   */\n  selected?: boolean;\n  /**\n   * Items that are going to be displayed inside\n   * the collapsable\n   */\n  items: DrawerNavigationItem[];\n  /**\n   * Deep level of this item inside the submenus\n   */\n  level: number;\n  /**\n   * Custom styles\n   */\n  sx?: SxProps<Theme>;\n}\n\nexport const DrawerMenuItem = ({\n  text,\n  icon,\n  selected,\n  items,\n  level,\n  sx = {},\n}: DrawerMenuItemProps) => {\n  const { state, size } = useDrawer();\n  const anchorEl = useRef<HTMLDivElement | null>(null);\n  const { palette, spacing, transitions } = useTheme();\n  const [menuOpen, setMenuOpen] = useState(false);\n  const { color, fontWeight } = getDrawerItemColors(useTheme(), selected);\n  const [canOpenCollapsed, setCanOpenCollapsed] = useState(true);\n\n  useEffect(() => {\n    if (menuOpen && state === \"collapse\") {\n      setCanOpenCollapsed(false);\n      setTimeout(() => {\n        setCanOpenCollapsed(true);\n      }, transitions.duration.leavingScreen);\n    }\n  }, [state]);\n\n  const submenu = (\n    <List component=\"div\" disablePadding>\n      {items.map((item) => (\n        <DrawerItem key={item.id} level={level + 1} item={item} />\n      ))}\n    </List>\n  );\n\n  const collapsedButtonSx =\n    state === \"collapse\" && level === 0\n      ? {\n          position: \"absolute\",\n          right: -3,\n        }\n      : {};\n\n  return (\n    <>\n      <ListItemButton\n        ref={anchorEl}\n        selected={selected}\n        aria-label={text}\n        onClick={() => setMenuOpen((o) => !o)}\n        dense={size === \"small\"}\n        sx={{\n          ...sx,\n          borderRadius: 2,\n          pl: state === \"open\" ? spacing(2 + 1.5 * level) : undefined,\n          backgroundColor: menuOpen ? palette.action.hover : undefined,\n          ...(state === \"collapse\" && {\n            px: 2.5,\n            justifyContent: \"center\",\n          }),\n        }}\n      >\n        {icon && (\n          <ListItemIcon sx={{ color, justifyContent: \"center\" }}>\n            {icon}\n          </ListItemIcon>\n        )}\n        <ListItemText\n          disableTypography\n          primary={text}\n          sx={{\n            color,\n            fontWeight,\n            opacity: state === \"collapse\" && level === 0 ? 0 : undefined,\n          }}\n        />\n        {menuOpen && state === \"open\" ? (\n          <ExpandMoreIcon\n            sx={[{ color, ml: 2, fontSize: 20 }, collapsedButtonSx]}\n          />\n        ) : (\n          <ChevronRightIcon\n            sx={[{ color, ml: 2, fontSize: 20 }, collapsedButtonSx]}\n          />\n        )}\n      </ListItemButton>\n      {state === \"open\" ? (\n        <Collapse\n          in={menuOpen}\n          timeout=\"auto\"\n          unmountOnExit\n          aria-label={`${text} collapse submenu`}\n        >\n          {submenu}\n        </Collapse>\n      ) : (\n        canOpenCollapsed && (\n          <Popover\n            open={menuOpen}\n            slotProps={{\n              paper: {\n                elevation: 0,\n                variant: \"outlined\",\n              },\n            }}\n            aria-label={`${text} popover submenu`}\n            anchorEl={anchorEl.current}\n            onClose={() => setMenuOpen(false)}\n            anchorOrigin={{\n              vertical: \"top\",\n              horizontal: \"right\",\n            }}\n          >\n            {submenu}\n          </Popover>\n        )\n      )}\n    </>\n  );\n};\n"],"names":["DrawerMenuItem","text","icon","selected","items","level","sx","state","size","useDrawer","anchorEl","useRef","palette","spacing","transitions","useTheme","menuOpen","setMenuOpen","useState","color","fontWeight","getDrawerItemColors","canOpenCollapsed","setCanOpenCollapsed","useEffect","submenu","List","item","jsx","DrawerItem","collapsedButtonSx","jsxs","Fragment","ListItemButton","o","ListItemIcon","ListItemText","ExpandMoreIcon","ChevronRightIcon","Collapse","Popover"],"mappings":"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"}

package/dist/Drawerx/DrawerItem/index.d.ts

@@ -0,0 +1,4 @@
+export type { DrawerItemProps } from './DrawerItem';
+export { default, default as DrawerItem } from './DrawerItem';
+export * from './DrawerItemLink';
+export * from './DrawerMenuItem';

package/dist/Drawerx/DrawerLayout/DrawerLayout.d.ts

@@ -0,0 +1,67 @@
+import { JSXElementConstructor } from 'react';
+import { DrawerContentProps, DrawerNavigation, DrawerProps } from '../Drawer.types';
+import { DrawerAppBarProps } from '../DrawerAppBar';
+import { DrawerProviderProps } from '../DrawerContext';
+/**
+ * Interface representing the slots for the DrawerLayout component.
+ */
+export interface DrawerLayoutSlots {
+    /**
+     * Slot for the DrawerAppBar component.
+     * This component is responsible for rendering the app bar within the drawer layout.
+     */
+    drawerAppBar?: JSXElementConstructor<DrawerAppBarProps>;
+    /**
+     * Slot for the Drawer component.
+     * This component is responsible for rendering the drawer within the drawer layout.
+     */
+    drawer?: JSXElementConstructor<DrawerProps>;
+    /**
+     * Slot for the DrawerContent component.
+     * This component is responsible for rendering the content within the drawer layout.
+     */
+    drawerContent?: JSXElementConstructor<DrawerContentProps>;
+}
+/**
+ * Interface representing the slot properties for the DrawerLayout component.
+ */
+export interface DrawerLayoutSlotProps {
+    /**
+     * Properties for the DrawerAppBar component.
+     */
+    drawerAppBar?: DrawerAppBarProps;
+    /**
+     * Properties for the Drawer component.
+     */
+    drawer?: DrawerProps;
+    /**
+     * Properties for the DrawerContent component.
+     */
+    drawerContent?: DrawerContentProps;
+}
+/**
+ * Props for the DrawerLayout component.
+ */
+export interface DrawerLayoutProps extends DrawerProviderProps {
+    /**
+     * The title of the drawer layout.
+     */
+    title: string;
+    /**
+     * The navigation configuration for the drawer.
+     */
+    navigation: DrawerNavigation;
+    /**
+     * Optional slots for custom rendering within the drawer layout.
+     */
+    slots?: DrawerLayoutSlots;
+    /**
+     * Optional props for the slots.
+     */
+    slotsProps?: DrawerLayoutSlotProps;
+}
+/**
+ * DrawerLayout component provides a layout structure with a drawer and an app bar.
+ * It allows customization of the drawer, app bar, and drawer content through slots and slot properties.
+ */
+export default function DrawerLayout({ children, navigation, title, slots, slotsProps, ...rest }: DrawerLayoutProps): import("react/jsx-runtime").JSX.Element;

package/dist/Drawerx/DrawerLayout/DrawerLayout.mjs

@@ -0,0 +1,39 @@
+import { j as r } from "../../_virtual/jsx-runtime.mjs";
+import d from "../Drawer/Drawer.mjs";
+import D from "../DrawerAppBar/DrawerAppBar.mjs";
+import f from "../DrawerContent/DrawerContent.mjs";
+import { DrawerProvider as x } from "../DrawerContext/Drawer.provider.mjs";
+import "../DrawerContext/DrawerContext.mjs";
+import c from "../DrawerMain/DrawerMain.mjs";
+function s({
+  children: a,
+  navigation: o,
+  title: n,
+  slots: e,
+  slotsProps: t,
+  ...i
+}) {
+  const p = e?.drawerAppBar ?? D, w = e?.drawer ?? d, m = e?.drawerContent ?? f;
+  return /* @__PURE__ */ r.jsxs(x, { ...i, children: [
+    /* @__PURE__ */ r.jsx(
+      p,
+      {
+        title: n,
+        color: "inherit",
+        ...t?.drawerAppBar
+      }
+    ),
+    /* @__PURE__ */ r.jsx(w, { ...t?.drawer, children: /* @__PURE__ */ r.jsx(
+      m,
+      {
+        navigation: o,
+        ...t?.drawerContent
+      }
+    ) }),
+    /* @__PURE__ */ r.jsx(c, { children: a })
+  ] });
+}
+export {
+  s as default
+};
+//# sourceMappingURL=DrawerLayout.mjs.map

package/dist/Drawerx/DrawerLayout/DrawerLayout.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerLayout.mjs","sources":["../../../src/Drawerx/DrawerLayout/DrawerLayout.tsx"],"sourcesContent":["import type { JSXElementConstructor } from \"react\";\nimport Drawer from \"../Drawer\";\nimport type {\n  DrawerContentProps,\n  DrawerNavigation,\n  DrawerProps,\n} from \"../Drawer.types\";\nimport DrawerAppBar, { type DrawerAppBarProps } from \"../DrawerAppBar\";\nimport DrawerContent from \"../DrawerContent\";\nimport { DrawerProvider, type DrawerProviderProps } from \"../DrawerContext\";\nimport DrawerMain from \"../DrawerMain\";\n\n/**\n * Interface representing the slots for the DrawerLayout component.\n */\nexport interface DrawerLayoutSlots {\n  /**\n   * Slot for the DrawerAppBar component.\n   * This component is responsible for rendering the app bar within the drawer layout.\n   */\n  drawerAppBar?: JSXElementConstructor<DrawerAppBarProps>;\n\n  /**\n   * Slot for the Drawer component.\n   * This component is responsible for rendering the drawer within the drawer layout.\n   */\n  drawer?: JSXElementConstructor<DrawerProps>;\n\n  /**\n   * Slot for the DrawerContent component.\n   * This component is responsible for rendering the content within the drawer layout.\n   */\n  drawerContent?: JSXElementConstructor<DrawerContentProps>;\n}\n\n/**\n * Interface representing the slot properties for the DrawerLayout component.\n */\nexport interface DrawerLayoutSlotProps {\n  /**\n   * Properties for the DrawerAppBar component.\n   */\n  drawerAppBar?: DrawerAppBarProps;\n\n  /**\n   * Properties for the Drawer component.\n   */\n  drawer?: DrawerProps;\n\n  /**\n   * Properties for the DrawerContent component.\n   */\n  drawerContent?: DrawerContentProps;\n}\n\n/**\n * Props for the DrawerLayout component.\n */\nexport interface DrawerLayoutProps extends DrawerProviderProps {\n  /**\n   * The title of the drawer layout.\n   */\n  title: string;\n\n  /**\n   * The navigation configuration for the drawer.\n   */\n  navigation: DrawerNavigation;\n\n  /**\n   * Optional slots for custom rendering within the drawer layout.\n   */\n  slots?: DrawerLayoutSlots;\n\n  /**\n   * Optional props for the slots.\n   */\n  slotsProps?: DrawerLayoutSlotProps;\n}\n\n/**\n * DrawerLayout component provides a layout structure with a drawer and an app bar.\n * It allows customization of the drawer, app bar, and drawer content through slots and slot properties.\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\n        title={title}\n        color=\"inherit\"\n        {...slotsProps?.drawerAppBar}\n      />\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":";;;;;;;AAoFA,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,SACEC,gBAAAA,EAAAA,KAACC,GAAA,EAAgB,GAAGR,GAClB,UAAA;AAAA,IAAAS,gBAAAA,EAAAA;AAAAA,MAACR;AAAA,MAAA;AAAA,QACC,OAAAJ;AAAA,QACA,OAAM;AAAA,QACL,GAAGE,GAAY;AAAA,MAAA;AAAA,IAAA;AAAA,IAElBU,gBAAAA,EAAAA,IAACN,GAAA,EAAY,GAAGJ,GAAY,QAC1B,UAAAU,gBAAAA,EAAAA;AAAAA,MAACJ;AAAA,MAAA;AAAA,QACC,YAAAT;AAAA,QACC,GAAGG,GAAY;AAAA,MAAA;AAAA,IAAA,GAEpB;AAAA,IACAU,gBAAAA,MAACC,KAAY,UAAAf,EAAA,CAAS;AAAA,EAAA,GACxB;AAEJ;"}

package/dist/Drawerx/DrawerLayout/index.d.ts

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

package/dist/Drawerx/DrawerMain/DrawerMain.d.ts

@@ -0,0 +1,3 @@
+import { PropsWithChildren } from 'react';
+export type DrawerMainProps = PropsWithChildren;
+export default function DrawerMain({ children }: DrawerMainProps): import("react/jsx-runtime").JSX.Element;

package/dist/Drawerx/DrawerMain/DrawerMain.mjs

@@ -0,0 +1,29 @@
+import { j as e } from "../../_virtual/jsx-runtime.mjs";
+import { DrawerHeader as s } from "../Drawer/Drawer.mjs";
+import { useDrawer as o } from "../DrawerContext/DrawerContext.mjs";
+import m from "../../node_modules/@mui/material/esm/styles/styled.mjs";
+import p from "../../node_modules/@mui/material/esm/styles/useTheme.mjs";
+const c = {
+  temporary: !1,
+  mini: !0,
+  persistent: !0
+}, d = m("div")(({ theme: r }) => {
+  const { spacing: n } = p(), { drawerWidth: i, state: t, variant: a } = o();
+  return {
+    marginLeft: c[a] ? t === "open" ? i : t === "collapse" ? n(8) : 0 : 0,
+    transition: r.transitions.create("margin", {
+      easing: r.transitions.easing.sharp,
+      duration: r.transitions.duration.leavingScreen
+    })
+  };
+});
+function j({ children: r }) {
+  return /* @__PURE__ */ e.jsxs(d, { children: [
+    /* @__PURE__ */ e.jsx(s, {}),
+    r
+  ] });
+}
+export {
+  j as default
+};
+//# sourceMappingURL=DrawerMain.mjs.map

package/dist/Drawerx/DrawerMain/DrawerMain.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerMain.mjs","sources":["../../../src/Drawerx/DrawerMain/DrawerMain.tsx"],"sourcesContent":["import { styled, useTheme } from \"@mui/material/styles\";\nimport type { PropsWithChildren } from \"react\";\nimport { DrawerHeader } from \"../Drawer/Drawer\";\nimport type { DrawerVariant } from \"../Drawer.types\";\nimport { useDrawer } from \"../DrawerContext/DrawerContext\";\n\nconst drawerSpace: Record<DrawerVariant, boolean> = {\n  temporary: false,\n  mini: true,\n  persistent: true,\n};\n\nconst StyledDiv = styled(\"div\")(({ theme }) => {\n  const { spacing } = useTheme();\n  const { drawerWidth, state, variant } = useDrawer();\n\n  const marginLeft = drawerSpace[variant]\n    ? state === \"open\"\n      ? drawerWidth\n      : state === \"collapse\"\n        ? spacing(8)\n        : 0\n    : 0;\n\n  return {\n    marginLeft,\n    transition: theme.transitions.create(\"margin\", {\n      easing: theme.transitions.easing.sharp,\n      duration: theme.transitions.duration.leavingScreen,\n    }),\n  };\n});\n\nexport type DrawerMainProps = PropsWithChildren;\n\nexport default function DrawerMain({ children }: DrawerMainProps) {\n  return (\n    <StyledDiv>\n      <DrawerHeader />\n      {children}\n    </StyledDiv>\n  );\n}\n"],"names":["drawerSpace","StyledDiv","styled","theme","spacing","useTheme","drawerWidth","state","variant","useDrawer","DrawerMain","children","jsx","DrawerHeader"],"mappings":";;;;;AAMA,MAAMA,IAA8C;AAAA,EAClD,WAAW;AAAA,EACX,MAAM;AAAA,EACN,YAAY;AACd,GAEMC,IAAYC,EAAO,KAAK,EAAE,CAAC,EAAE,OAAAC,QAAY;AAC7C,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA,GACd,EAAE,aAAAC,GAAa,OAAAC,GAAO,SAAAC,EAAA,IAAYC,EAAA;AAUxC,SAAO;AAAA,IACL,YATiBT,EAAYQ,CAAO,IAClCD,MAAU,SACRD,IACAC,MAAU,aACRH,EAAQ,CAAC,IACT,IACJ;AAAA,IAIF,YAAYD,EAAM,YAAY,OAAO,UAAU;AAAA,MAC7C,QAAQA,EAAM,YAAY,OAAO;AAAA,MACjC,UAAUA,EAAM,YAAY,SAAS;AAAA,IAAA,CACtC;AAAA,EAAA;AAEL,CAAC;AAID,SAAwBO,EAAW,EAAE,UAAAC,KAA6B;AAChE,gCACGV,GAAA,EACC,UAAA;AAAA,IAAAW,gBAAAA,EAAAA,IAACC,GAAA,EAAa;AAAA,IACbF;AAAA,EAAA,GACH;AAEJ;"}

package/dist/Drawerx/DrawerMain/index.d.ts

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

package/dist/Drawerx/DrawerSubheader/DrawerSubheader.d.ts

@@ -0,0 +1,6 @@
+import { ListSubheaderProps } from '@mui/material/ListSubheader';
+export type DrawerSubheaderProps = ListSubheaderProps;
+/**
+ * A functional component that renders a `ListSubheader` with custom styles.
+ */
+export default function DrawerSubheader({ sx, ...rest }: DrawerSubheaderProps): import("react/jsx-runtime").JSX.Element;

package/dist/Drawerx/DrawerSubheader/DrawerSubheader.mjs

@@ -0,0 +1,22 @@
+import { j as m } from "../../_virtual/jsx-runtime.mjs";
+import { useTheme as s } from "@mui/material";
+import "react";
+import { useDrawer as i } from "../DrawerContext/DrawerContext.mjs";
+import p from "../../node_modules/@mui/material/esm/ListSubheader/ListSubheader.mjs";
+function h({ sx: r, ...e }) {
+  const { size: o } = i(), { typography: t } = s();
+  return /* @__PURE__ */ m.jsx(
+    p,
+    {
+      ...e,
+      sx: {
+        lineHeight: o === "small" ? t.pxToRem(40) : void 0,
+        ...r
+      }
+    }
+  );
+}
+export {
+  h as default
+};
+//# sourceMappingURL=DrawerSubheader.mjs.map

package/dist/Drawerx/DrawerSubheader/DrawerSubheader.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerSubheader.mjs","sources":["../../../src/Drawerx/DrawerSubheader/DrawerSubheader.tsx"],"sourcesContent":["import { useTheme } from \"@mui/material\";\nimport ListSubheader, {\n  type ListSubheaderProps,\n} from \"@mui/material/ListSubheader\";\nimport { useDrawer } from \"../DrawerContext\";\n\nexport type DrawerSubheaderProps = ListSubheaderProps;\n\n/**\n * A functional component that renders a `ListSubheader` with custom styles.\n */\nexport default function DrawerSubheader({ sx, ...rest }: DrawerSubheaderProps) {\n  const { size } = useDrawer();\n  const { typography } = useTheme();\n\n  return (\n    <ListSubheader\n      {...rest}\n      sx={{\n        lineHeight: size === \"small\" ? typography.pxToRem(40) : undefined,\n        ...sx,\n      }}\n    />\n  );\n}\n"],"names":["DrawerSubheader","sx","rest","size","useDrawer","typography","useTheme","jsx","ListSubheader"],"mappings":";;;;;AAWA,SAAwBA,EAAgB,EAAE,IAAAC,GAAI,GAAGC,KAA8B;AAC7E,QAAM,EAAE,MAAAC,EAAA,IAASC,EAAA,GACX,EAAE,YAAAC,EAAA,IAAeC,EAAA;AAEvB,SACEC,gBAAAA,EAAAA;AAAAA,IAACC;AAAA,IAAA;AAAA,MACE,GAAGN;AAAA,MACJ,IAAI;AAAA,QACF,YAAYC,MAAS,UAAUE,EAAW,QAAQ,EAAE,IAAI;AAAA,QACxD,GAAGJ;AAAA,MAAA;AAAA,IACL;AAAA,EAAA;AAGN;"}

package/dist/Drawerx/DrawerSubheader/index.d.ts

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

package/dist/Drawerx/index.d.ts

@@ -0,0 +1,10 @@
+export { DrawerHeader, default as Drawer } from './Drawer/Drawer';
+export * from './Drawer.types';
+export type { DrawerAppBarProps } from './DrawerAppBar';
+export { default as DrawerAppBar } from './DrawerAppBar';
+export { default as DrawerContent } from './DrawerContent/DrawerContent';
+export * from './DrawerContext/DrawerContext';
+export type { DrawerMainProps } from './DrawerMain';
+export { default as DrawerMain } from './DrawerMain/DrawerMain';
+export type { DrawerSubheaderProps } from './DrawerSubheader';
+export { default as DrawerSubheader } from './DrawerSubheader/DrawerSubheader';

package/dist/ExpandableAlert/ExpandableAlert.d.ts

@@ -0,0 +1,45 @@
+import { AlertColor } from '@mui/material/Alert';
+import { SxProps, Theme } from '@mui/material/styles';
+import { ReactElement } from 'react';
+/**
+ * Props for the ExpandableAlert component
+ */
+export interface ExpandableAlertProps {
+    /**
+     * Alert severity level
+     */
+    severity: AlertColor;
+    /**
+     * Custom icon mapping for different severity levels
+     */
+    iconMapping?: Partial<Record<AlertColor, React.ReactNode>>;
+    /**
+     * Alert title
+     */
+    title?: string;
+    /**
+     * Alert message content
+     */
+    message: string;
+    /**
+     * Additional metadata to display in expandable section
+     */
+    metadata?: string | string[];
+    /**
+     * Custom component to render in expandable section
+     */
+    metadataComponent?: ReactElement;
+    /**
+     * Callback when alert is closed
+     */
+    onClose: () => void;
+    /**
+     * Custom styles
+     */
+    sx?: SxProps<Theme>;
+}
+/**
+ * Alert component with expandable metadata section
+ */
+declare const ExpandableAlert: import('react').ForwardRefExoticComponent<ExpandableAlertProps & import('react').RefAttributes<any>>;
+export default ExpandableAlert;