@12-apps/ui 5.0.0 → 5.0.1

package/dist/layout/Container.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/layout/Container/Container.tsx"],"sourcesContent":["import { Container as MuiContainer, useTheme } from '@mui/material';\nimport type { SxProps, Theme } from '@mui/material';\nimport React from 'react';\n\nimport type { ContainerProps } from './Container.types';\n\nexport const Container: React.FC<ContainerProps> = ({\n  children,\n  maxWidth = 'lg',\n  variant = 'default',\n  padding = 'md',\n  responsive = true,\n  dataTestId,\n  sx,\n  ...props\n}) => {\n  const theme = useTheme();\n\n  const getPadding = () => {\n    const paddingMap = {\n      none: 0,\n      xs: theme.spacing(1),\n      sm: theme.spacing(2),\n      md: theme.spacing(3),\n      lg: theme.spacing(4),\n      xl: theme.spacing(6),\n    };\n    return paddingMap[padding] || theme.spacing(3);\n  };\n\n  const getMaxWidth = (): 'xs' | 'sm' | 'md' | 'lg' | 'xl' | false => {\n    if (variant === 'fluid') return false;\n    if (variant === 'centered') return 'md';\n    if (typeof maxWidth === 'string' && ['xs', 'sm', 'md', 'lg', 'xl'].includes(maxWidth)) {\n      return maxWidth as 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n    }\n    if (maxWidth === false) return false;\n    return 'lg'; // default fallback\n  };\n\n  const containerStyles: SxProps<Theme> = {\n    ...(variant === 'centered' && {\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n      justifyContent: 'center',\n      minHeight: '100vh',\n    }),\n    ...(variant === 'padded' && {\n      paddingTop: theme.spacing(8),\n      paddingBottom: theme.spacing(8),\n    }),\n    padding: getPadding(),\n    ...(responsive && {\n      [theme.breakpoints.down('sm')]: {\n        padding: theme.spacing(2),\n      },\n    }),\n    ...(sx || {}),\n  };\n\n  return (\n    <MuiContainer\n      maxWidth={getMaxWidth()}\n      sx={containerStyles}\n      data-testid={dataTestId || 'container'}\n      {...props}\n    >\n      {children}\n    </MuiContainer>\n  );\n};\n"],"mappings":";;;AAAA,SAAS,aAAa,cAAc,gBAAgB;AA8DhD;AAxDG,IAAM,YAAsC,CAAC;AAAA,EAClD;AAAA,EACA,WAAW;AAAA,EACX,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,QAAQ,SAAS;AAEvB,QAAM,aAAa,MAAM;AACvB,UAAM,aAAa;AAAA,MACjB,MAAM;AAAA,MACN,IAAI,MAAM,QAAQ,CAAC;AAAA,MACnB,IAAI,MAAM,QAAQ,CAAC;AAAA,MACnB,IAAI,MAAM,QAAQ,CAAC;AAAA,MACnB,IAAI,MAAM,QAAQ,CAAC;AAAA,MACnB,IAAI,MAAM,QAAQ,CAAC;AAAA,IACrB;AACA,WAAO,WAAW,OAAO,KAAK,MAAM,QAAQ,CAAC;AAAA,EAC/C;AAEA,QAAM,cAAc,MAAgD;AAClE,QAAI,YAAY,QAAS,QAAO;AAChC,QAAI,YAAY,WAAY,QAAO;AACnC,QAAI,OAAO,aAAa,YAAY,CAAC,MAAM,MAAM,MAAM,MAAM,IAAI,EAAE,SAAS,QAAQ,GAAG;AACrF,aAAO;AAAA,IACT;AACA,QAAI,aAAa,MAAO,QAAO;AAC/B,WAAO;AAAA,EACT;AAEA,QAAM,kBAAkC;AAAA,IACtC,GAAI,YAAY,cAAc;AAAA,MAC5B,SAAS;AAAA,MACT,eAAe;AAAA,MACf,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,WAAW;AAAA,IACb;AAAA,IACA,GAAI,YAAY,YAAY;AAAA,MAC1B,YAAY,MAAM,QAAQ,CAAC;AAAA,MAC3B,eAAe,MAAM,QAAQ,CAAC;AAAA,IAChC;AAAA,IACA,SAAS,WAAW;AAAA,IACpB,GAAI,cAAc;AAAA,MAChB,CAAC,MAAM,YAAY,KAAK,IAAI,CAAC,GAAG;AAAA,QAC9B,SAAS,MAAM,QAAQ,CAAC;AAAA,MAC1B;AAAA,IACF;AAAA,IACA,GAAI,MAAM,CAAC;AAAA,EACb;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,YAAY;AAAA,MACtB,IAAI;AAAA,MACJ,eAAa,cAAc;AAAA,MAC1B,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/layout/ContentToolbar.js

@@ -0,0 +1,20 @@
+import {
+  ColumnsMenu,
+  ContentToolbar,
+  FilterTrigger,
+  MultiSelectDropdown,
+  SavedViewsMenu,
+  SortByDropdown,
+  ViewSelector
+} from "../chunk-JDO7W4D4.js";
+import "../chunk-PZ5AY32C.js";
+export {
+  ColumnsMenu,
+  ContentToolbar,
+  FilterTrigger,
+  MultiSelectDropdown,
+  SavedViewsMenu,
+  SortByDropdown,
+  ViewSelector
+};
+//# sourceMappingURL=ContentToolbar.js.map

package/dist/layout/ContentToolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/layout/Dashboard.js

@@ -0,0 +1,392 @@
+import {
+  HeaderButton
+} from "../chunk-U7CIYYA7.js";
+import "../chunk-PZ5AY32C.js";
+
+// src/components/layout/Dashboard/Dashboard.tsx
+import ExpandLessIcon from "@mui/icons-material/ExpandLess";
+import ExpandMoreIcon2 from "@mui/icons-material/ExpandMore";
+import FilterIcon2 from "@mui/icons-material/FilterListRounded";
+import NavigateNextIcon from "@mui/icons-material/NavigateNext";
+import {
+  Box as Box2,
+  Breadcrumbs as MuiBreadcrumbs,
+  Button,
+  Collapse,
+  Link as MuiLink,
+  Typography as Typography2
+} from "@mui/material";
+import { styled } from "@mui/material";
+import React2, { useMemo, useState as useState2 } from "react";
+
+// src/components/layout/Dashboard/DashboardContext.tsx
+import { createContext, useContext } from "react";
+var DashboardContext = createContext(null);
+function useDashboardContext() {
+  const context = useContext(DashboardContext);
+  if (!context) {
+    throw new Error("Dashboard sub-components must be used within a <Dashboard>");
+  }
+  return context;
+}
+
+// src/components/layout/Dashboard/DashboardParts.tsx
+import CloseIcon from "@mui/icons-material/Close";
+import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
+import ExportIcon from "@mui/icons-material/FileDownloadOutlined";
+import FilterIcon from "@mui/icons-material/FilterListRounded";
+import InfoIcon from "@mui/icons-material/InfoOutlined";
+import SettingsIcon from "@mui/icons-material/SettingsOutlined";
+import {
+  Badge,
+  Box,
+  Dialog,
+  DialogContent,
+  DialogTitle,
+  IconButton,
+  Menu,
+  MenuItem,
+  Popover,
+  Tooltip,
+  Typography
+} from "@mui/material";
+import { useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var DashboardSpacer = () => /* @__PURE__ */ jsx(Box, { sx: { flex: 1 }, "aria-hidden": true });
+DashboardSpacer.displayName = "Dashboard.Spacer";
+var DashboardInfo = ({
+  title = "About this page",
+  children,
+  ariaLabel = "Page information"
+}) => {
+  const { testIdPrefix } = useDashboardContext();
+  const [anchorEl, setAnchorEl] = useState(null);
+  const open = Boolean(anchorEl);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Tooltip, { title: ariaLabel, children: /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        size: "small",
+        "aria-label": ariaLabel,
+        "aria-haspopup": "dialog",
+        onClick: (e) => setAnchorEl(e.currentTarget),
+        "data-testid": `${testIdPrefix}-info-trigger`,
+        sx: { color: "text.secondary" },
+        children: /* @__PURE__ */ jsx(InfoIcon, { fontSize: "small" })
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(
+      Popover,
+      {
+        open,
+        anchorEl,
+        onClose: () => setAnchorEl(null),
+        anchorOrigin: { vertical: "bottom", horizontal: "left" },
+        slotProps: { paper: { sx: { width: 360, maxWidth: "90vw" } } },
+        "data-testid": `${testIdPrefix}-info-popover`,
+        children: [
+          /* @__PURE__ */ jsxs(Box, { sx: { px: 2, py: 1.5, borderBottom: 1, borderColor: "divider", display: "flex", gap: 1, alignItems: "center" }, children: [
+            /* @__PURE__ */ jsx(InfoIcon, { fontSize: "small", sx: { color: "text.secondary" } }),
+            /* @__PURE__ */ jsx(Typography, { sx: { fontWeight: 600 }, children: title })
+          ] }),
+          /* @__PURE__ */ jsx(Box, { sx: { px: 2, py: 1.5, fontSize: "0.875rem", color: "text.secondary" }, children })
+        ]
+      }
+    )
+  ] });
+};
+DashboardInfo.displayName = "Dashboard.Info";
+var DashboardFilterToggle = ({ ariaLabel }) => {
+  const { filtersVisible, toggleFilters, activeFilterCount, testIdPrefix } = useDashboardContext();
+  const label = ariaLabel ?? (filtersVisible ? "Hide filters" : "Show filters");
+  return /* @__PURE__ */ jsx(Tooltip, { title: label, children: /* @__PURE__ */ jsx(
+    IconButton,
+    {
+      size: "small",
+      "aria-label": label,
+      "aria-pressed": filtersVisible,
+      onClick: toggleFilters,
+      "data-testid": `${testIdPrefix}-filter-toggle`,
+      sx: { color: filtersVisible ? "primary.main" : "text.secondary", bgcolor: filtersVisible ? "action.selected" : "transparent" },
+      children: /* @__PURE__ */ jsx(Badge, { badgeContent: activeFilterCount, color: "primary", overlap: "circular", children: /* @__PURE__ */ jsx(FilterIcon, { fontSize: "small" }) })
+    }
+  ) });
+};
+DashboardFilterToggle.displayName = "Dashboard.FilterToggle";
+var DashboardSettings = ({
+  title = "Settings",
+  children,
+  ariaLabel = "Settings",
+  href,
+  linkComponent
+}) => {
+  const { testIdPrefix } = useDashboardContext();
+  const [open, setOpen] = useState(false);
+  if (href) {
+    const LinkComponent = linkComponent ?? "a";
+    return /* @__PURE__ */ jsx(Tooltip, { title: ariaLabel, children: /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        size: "small",
+        "aria-label": ariaLabel,
+        component: LinkComponent,
+        href,
+        "data-testid": `${testIdPrefix}-settings-trigger`,
+        sx: { color: "text.secondary" },
+        children: /* @__PURE__ */ jsx(SettingsIcon, { fontSize: "small" })
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Tooltip, { title: ariaLabel, children: /* @__PURE__ */ jsx(
+      IconButton,
+      {
+        size: "small",
+        "aria-label": ariaLabel,
+        "aria-haspopup": "dialog",
+        onClick: () => setOpen(true),
+        "data-testid": `${testIdPrefix}-settings-trigger`,
+        sx: { color: "text.secondary" },
+        children: /* @__PURE__ */ jsx(SettingsIcon, { fontSize: "small" })
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(Dialog, { open, onClose: () => setOpen(false), maxWidth: "sm", fullWidth: true, "data-testid": `${testIdPrefix}-settings-dialog`, children: [
+      /* @__PURE__ */ jsxs(DialogTitle, { sx: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
+        title,
+        /* @__PURE__ */ jsx(IconButton, { "aria-label": "Close", size: "small", onClick: () => setOpen(false), children: /* @__PURE__ */ jsx(CloseIcon, { fontSize: "small" }) })
+      ] }),
+      /* @__PURE__ */ jsx(DialogContent, { dividers: true, children })
+    ] })
+  ] });
+};
+DashboardSettings.displayName = "Dashboard.Settings";
+var DEFAULT_EXPORT_FORMATS = [
+  { id: "csv", label: "CSV (.csv)" },
+  { id: "xlsx", label: "Excel (.xlsx)" },
+  { id: "json", label: "JSON (.json)" }
+];
+var DashboardExport = ({
+  formats = DEFAULT_EXPORT_FORMATS,
+  onExport,
+  label = "Export"
+}) => {
+  const { testIdPrefix } = useDashboardContext();
+  const [anchorEl, setAnchorEl] = useState(null);
+  const open = Boolean(anchorEl);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      HeaderButton,
+      {
+        variant: "outlined",
+        color: "inherit",
+        text: label,
+        icon: /* @__PURE__ */ jsx(ExportIcon, { fontSize: "small" }),
+        endIcon: /* @__PURE__ */ jsx(ExpandMoreIcon, { fontSize: "small" }),
+        onClick: (e) => setAnchorEl(e.currentTarget),
+        "aria-haspopup": "menu",
+        "aria-expanded": open,
+        dataTestId: `${testIdPrefix}-export-trigger`
+      }
+    ),
+    /* @__PURE__ */ jsx(Menu, { anchorEl, open, onClose: () => setAnchorEl(null), "data-testid": `${testIdPrefix}-export-menu`, children: formats.map((format) => /* @__PURE__ */ jsx(
+      MenuItem,
+      {
+        onClick: () => {
+          onExport(format.id);
+          setAnchorEl(null);
+        },
+        "data-testid": `${testIdPrefix}-export-${format.id}`,
+        children: format.label
+      },
+      format.id
+    )) })
+  ] });
+};
+DashboardExport.displayName = "Dashboard.Export";
+var DashboardAction = ({ children }) => /* @__PURE__ */ jsx(Box, { sx: { display: "inline-flex" }, children });
+DashboardAction.displayName = "Dashboard.Action";
+
+// src/components/layout/Dashboard/Dashboard.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var SLOT_ORDER = ["breadcrumb", "header", "filters", "body"];
+function markDashboardSlot(component, slot) {
+  component.dashboardSlot = slot;
+  return component;
+}
+var Root = styled(Box2)(({ theme }) => ({
+  display: "flex",
+  flexDirection: "column",
+  gap: theme.spacing(2),
+  width: "100%"
+}));
+function slotRank(node) {
+  if (React2.isValidElement(node)) {
+    const slot = node.type.dashboardSlot;
+    if (slot) {
+      const rank = SLOT_ORDER.indexOf(slot);
+      if (rank >= 0) {
+        return rank;
+      }
+    }
+  }
+  return SLOT_ORDER.length;
+}
+var Dashboard = ({
+  children,
+  defaultFiltersVisible = true,
+  activeFilterCount = 0,
+  testIdPrefix = "dashboard",
+  className
+}) => {
+  const [filtersVisible, setFiltersVisible] = useState2(defaultFiltersVisible);
+  const [moreFiltersOpen, setMoreFiltersOpen] = useState2(false);
+  const value = useMemo(
+    () => ({
+      filtersVisible,
+      toggleFilters: () => setFiltersVisible((v) => !v),
+      moreFiltersOpen,
+      toggleMoreFilters: () => setMoreFiltersOpen((v) => !v),
+      activeFilterCount,
+      testIdPrefix
+    }),
+    [filtersVisible, moreFiltersOpen, activeFilterCount, testIdPrefix]
+  );
+  const ordered = useMemo(() => {
+    const arr = React2.Children.toArray(children);
+    return arr.map((node, index) => ({ node, index, rank: slotRank(node) })).sort((a, b) => a.rank === b.rank ? a.index - b.index : a.rank - b.rank).map((entry) => entry.node);
+  }, [children]);
+  return /* @__PURE__ */ jsx2(DashboardContext.Provider, { value, children: /* @__PURE__ */ jsx2(Root, { className, "data-testid": testIdPrefix, children: ordered }) });
+};
+Dashboard.displayName = "Dashboard";
+var DashboardBreadcrumb = ({
+  items,
+  renderLink,
+  className
+}) => {
+  const { testIdPrefix } = useDashboardContext();
+  return /* @__PURE__ */ jsx2(
+    MuiBreadcrumbs,
+    {
+      separator: /* @__PURE__ */ jsx2(NavigateNextIcon, { fontSize: "small" }),
+      className,
+      "aria-label": "breadcrumb",
+      "data-testid": `${testIdPrefix}-breadcrumb`,
+      sx: { fontSize: "0.875rem", color: "text.secondary" },
+      children: items.map((item, index) => {
+        const isLast = index === items.length - 1;
+        if (isLast || !item.href) {
+          return /* @__PURE__ */ jsx2(
+            Typography2,
+            {
+              component: "span",
+              sx: { fontSize: "0.875rem", color: isLast ? "text.primary" : "text.secondary" },
+              "aria-current": isLast ? "page" : void 0,
+              children: item.label
+            },
+            `${item.label}-${index}`
+          );
+        }
+        const linkContent = item.label;
+        if (renderLink) {
+          return /* @__PURE__ */ jsx2(React2.Fragment, { children: renderLink(item, linkContent) }, `${item.label}-${index}`);
+        }
+        return /* @__PURE__ */ jsx2(
+          MuiLink,
+          {
+            href: item.href,
+            underline: "hover",
+            color: "inherit",
+            sx: { fontSize: "0.875rem" },
+            children: linkContent
+          },
+          `${item.label}-${index}`
+        );
+      })
+    }
+  );
+};
+DashboardBreadcrumb.displayName = "Dashboard.Breadcrumb";
+DashboardBreadcrumb.dashboardSlot = "breadcrumb";
+var DashboardHeader = ({ title, children, className }) => {
+  const { testIdPrefix } = useDashboardContext();
+  return /* @__PURE__ */ jsxs2(
+    Box2,
+    {
+      className,
+      "data-testid": `${testIdPrefix}-header`,
+      sx: { display: "flex", alignItems: "center", gap: 1, flexWrap: "wrap", minHeight: 40 },
+      children: [
+        /* @__PURE__ */ jsx2(Typography2, { variant: "h5", component: "h1", sx: { fontWeight: 600, mr: 0.5 }, children: title }),
+        children
+      ]
+    }
+  );
+};
+DashboardHeader.displayName = "Dashboard.Header";
+DashboardHeader.dashboardSlot = "header";
+var DashboardFilters = ({ children, className }) => {
+  const { filtersVisible, testIdPrefix } = useDashboardContext();
+  return /* @__PURE__ */ jsx2(Collapse, { in: filtersVisible, unmountOnExit: true, "data-testid": `${testIdPrefix}-filters`, children: /* @__PURE__ */ jsx2(
+    Box2,
+    {
+      className,
+      sx: {
+        display: "flex",
+        flexDirection: "column",
+        gap: 1.5,
+        p: 2,
+        borderRadius: 1,
+        border: 1,
+        borderColor: "divider",
+        bgcolor: "action.hover"
+      },
+      children
+    }
+  ) });
+};
+DashboardFilters.displayName = "Dashboard.Filters";
+DashboardFilters.dashboardSlot = "filters";
+var DashboardMoreFilters = ({ children, label = "More filters" }) => {
+  const { moreFiltersOpen, toggleMoreFilters, testIdPrefix } = useDashboardContext();
+  return /* @__PURE__ */ jsxs2(Box2, { children: [
+    /* @__PURE__ */ jsx2(
+      Button,
+      {
+        variant: "text",
+        size: "small",
+        startIcon: /* @__PURE__ */ jsx2(FilterIcon2, { fontSize: "small" }),
+        endIcon: moreFiltersOpen ? /* @__PURE__ */ jsx2(ExpandLessIcon, { fontSize: "small" }) : /* @__PURE__ */ jsx2(ExpandMoreIcon2, { fontSize: "small" }),
+        onClick: toggleMoreFilters,
+        "aria-expanded": moreFiltersOpen,
+        "data-testid": `${testIdPrefix}-more-filters-toggle`,
+        children: label
+      }
+    ),
+    /* @__PURE__ */ jsx2(Collapse, { in: moreFiltersOpen, unmountOnExit: true, "data-testid": `${testIdPrefix}-more-filters-panel`, children: /* @__PURE__ */ jsx2(Box2, { sx: { mt: 1.5, p: 2, borderRadius: 1, border: 1, borderColor: "divider", bgcolor: "background.paper" }, children }) })
+  ] });
+};
+DashboardMoreFilters.displayName = "Dashboard.MoreFilters";
+var DashboardBody = ({ children, className }) => {
+  const { testIdPrefix } = useDashboardContext();
+  return /* @__PURE__ */ jsx2(Box2, { className, "data-testid": `${testIdPrefix}-body`, children });
+};
+DashboardBody.displayName = "Dashboard.Body";
+DashboardBody.dashboardSlot = "body";
+Dashboard.Breadcrumb = DashboardBreadcrumb;
+Dashboard.Header = DashboardHeader;
+Dashboard.Spacer = DashboardSpacer;
+Dashboard.Info = DashboardInfo;
+Dashboard.FilterToggle = DashboardFilterToggle;
+Dashboard.Settings = DashboardSettings;
+Dashboard.Export = DashboardExport;
+Dashboard.Action = DashboardAction;
+Dashboard.Filters = DashboardFilters;
+Dashboard.MoreFilters = DashboardMoreFilters;
+Dashboard.Body = DashboardBody;
+export {
+  Dashboard,
+  DashboardContext,
+  markDashboardSlot,
+  useDashboardContext
+};
+//# sourceMappingURL=Dashboard.js.map

package/dist/layout/Dashboard.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/layout/Dashboard/Dashboard.tsx","../../src/components/layout/Dashboard/DashboardContext.tsx","../../src/components/layout/Dashboard/DashboardParts.tsx"],"sourcesContent":["'use client';\n\nimport ExpandLessIcon from '@mui/icons-material/ExpandLess';\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\nimport FilterIcon from '@mui/icons-material/FilterListRounded';\nimport NavigateNextIcon from '@mui/icons-material/NavigateNext';\nimport {\n  Box,\n  Breadcrumbs as MuiBreadcrumbs,\n  Button,\n  Collapse,\n  Link as MuiLink,\n  Typography,\n} from '@mui/material';\nimport { styled } from '@mui/material';\nimport React, { useMemo, useState } from 'react';\n\nimport { DashboardContext, useDashboardContext } from './DashboardContext';\nimport {\n  DashboardAction,\n  DashboardExport,\n  DashboardFilterToggle,\n  DashboardInfo,\n  DashboardSettings,\n  DashboardSpacer,\n} from './DashboardParts';\nimport type {\n  DashboardBodyProps,\n  DashboardBreadcrumbProps,\n  DashboardFiltersProps,\n  DashboardHeaderProps,\n  DashboardMoreFiltersProps,\n  DashboardProps,\n} from './Dashboard.types';\n\n/**\n * Ordered slot keys. The root reorders composed children into this sequence so\n * authoring order in JSX never matters — a `<Dashboard.Filters>` placed above\n * a `<Dashboard.Header>` still renders below it.\n */\nconst SLOT_ORDER = ['breadcrumb', 'header', 'filters', 'body'] as const;\n/** A slot a component can occupy in the canonical Dashboard order. */\nexport type DashboardSlot = (typeof SLOT_ORDER)[number];\n\n/** Marker attached to each sub-component so the root can rank it by slot. */\ntype SlottedComponent = { dashboardSlot?: DashboardSlot };\n\n/**\n * Tag a component with the Dashboard slot it occupies so the root ranks it in\n * canonical order. The root inspects only its DIRECT children's `type`, so a\n * page that wraps a `<Dashboard.Header>` (or any part) in its own component MUST\n * mark that wrapper — otherwise it counts as an unrecognised child and sinks\n * below the body. Returns the component for convenient inline use.\n *\n * @example\n * ```tsx\n * function ProductsHeader(props) {\n *   return <Dashboard.Header title=\"Products\">{/* … *\\/}</Dashboard.Header>;\n * }\n * markDashboardSlot(ProductsHeader, 'header');\n * ```\n */\nexport function markDashboardSlot<T>(component: T, slot: DashboardSlot): T {\n  (component as SlottedComponent).dashboardSlot = slot;\n  return component;\n}\n\nconst Root = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(2),\n  width: '100%',\n}));\n\nfunction slotRank(node: React.ReactNode): number {\n  if (React.isValidElement(node)) {\n    const slot = (node.type as SlottedComponent).dashboardSlot;\n    if (slot) {\n      const rank = SLOT_ORDER.indexOf(slot);\n      if (rank >= 0) {\n        return rank;\n      }\n    }\n  }\n  // Unknown / arbitrary children keep their relative position after the\n  // recognised slots.\n  return SLOT_ORDER.length;\n}\n\n/**\n * Composable page shell. `<Dashboard>` provides shared state through context\n * and renders whichever sub-components you compose — nothing is implied. Drop\n * in only the parts you need; omit `<Dashboard.Filters>` and there is simply no\n * filter UI.\n *\n * @example\n * ```tsx\n * <Dashboard activeFilterCount={2}>\n *   <Dashboard.Breadcrumb items={[{ label: 'Admin', href: '/admin' }, { label: 'Products' }]} />\n *   <Dashboard.Header title=\"Products\">\n *     <Dashboard.Info>What this page does…</Dashboard.Info>\n *     <Dashboard.FilterToggle />\n *     <Dashboard.Settings>In development</Dashboard.Settings>\n *     <Dashboard.Spacer />\n *     <Dashboard.Export onExport={handleExport} />\n *     <Dashboard.Action><Button variant=\"contained\">New product</Button></Dashboard.Action>\n *   </Dashboard.Header>\n *   <Dashboard.Filters>{/* search + pills *\\/}</Dashboard.Filters>\n *   <Dashboard.Body>{table}</Dashboard.Body>\n * </Dashboard>\n * ```\n */\nexport const Dashboard = ({\n  children,\n  defaultFiltersVisible = true,\n  activeFilterCount = 0,\n  testIdPrefix = 'dashboard',\n  className,\n}: DashboardProps): React.JSX.Element => {\n  const [filtersVisible, setFiltersVisible] = useState(defaultFiltersVisible);\n  const [moreFiltersOpen, setMoreFiltersOpen] = useState(false);\n\n  const value = useMemo(\n    () => ({\n      filtersVisible,\n      toggleFilters: () => setFiltersVisible((v) => !v),\n      moreFiltersOpen,\n      toggleMoreFilters: () => setMoreFiltersOpen((v) => !v),\n      activeFilterCount,\n      testIdPrefix,\n    }),\n    [filtersVisible, moreFiltersOpen, activeFilterCount, testIdPrefix],\n  );\n\n  // Stable sort recognised slots into canonical order, preserving the original\n  // order of anything unrecognised.\n  const ordered = useMemo(() => {\n    const arr = React.Children.toArray(children);\n    return arr\n      .map((node, index) => ({ node, index, rank: slotRank(node) }))\n      .sort((a, b) => (a.rank === b.rank ? a.index - b.index : a.rank - b.rank))\n      .map((entry) => entry.node);\n  }, [children]);\n\n  return (\n    <DashboardContext.Provider value={value}>\n      <Root className={className} data-testid={testIdPrefix}>\n        {ordered}\n      </Root>\n    </DashboardContext.Provider>\n  );\n};\n\nDashboard.displayName = 'Dashboard';\n\n/* -------------------------------------------------------------------------- */\n/* Breadcrumb                                                                 */\n/* -------------------------------------------------------------------------- */\n\nconst DashboardBreadcrumb = ({\n  items,\n  renderLink,\n  className,\n}: DashboardBreadcrumbProps): React.JSX.Element => {\n  const { testIdPrefix } = useDashboardContext();\n  return (\n    <MuiBreadcrumbs\n      separator={<NavigateNextIcon fontSize=\"small\" />}\n      className={className}\n      aria-label=\"breadcrumb\"\n      data-testid={`${testIdPrefix}-breadcrumb`}\n      sx={{ fontSize: '0.875rem', color: 'text.secondary' }}\n    >\n      {items.map((item, index) => {\n        const isLast = index === items.length - 1;\n        if (isLast || !item.href) {\n          return (\n            <Typography\n              key={`${item.label}-${index}`}\n              component=\"span\"\n              sx={{ fontSize: '0.875rem', color: isLast ? 'text.primary' : 'text.secondary' }}\n              aria-current={isLast ? 'page' : undefined}\n            >\n              {item.label}\n            </Typography>\n          );\n        }\n        const linkContent = item.label;\n        if (renderLink) {\n          return <React.Fragment key={`${item.label}-${index}`}>{renderLink(item, linkContent)}</React.Fragment>;\n        }\n        return (\n          <MuiLink\n            key={`${item.label}-${index}`}\n            href={item.href}\n            underline=\"hover\"\n            color=\"inherit\"\n            sx={{ fontSize: '0.875rem' }}\n          >\n            {linkContent}\n          </MuiLink>\n        );\n      })}\n    </MuiBreadcrumbs>\n  );\n};\nDashboardBreadcrumb.displayName = 'Dashboard.Breadcrumb';\n(DashboardBreadcrumb as SlottedComponent).dashboardSlot = 'breadcrumb';\n\n/* -------------------------------------------------------------------------- */\n/* Header + action parts                                                      */\n/* -------------------------------------------------------------------------- */\n\nconst DashboardHeader = ({ title, children, className }: DashboardHeaderProps): React.JSX.Element => {\n  const { testIdPrefix } = useDashboardContext();\n  return (\n    <Box\n      className={className}\n      data-testid={`${testIdPrefix}-header`}\n      sx={{ display: 'flex', alignItems: 'center', gap: 1, flexWrap: 'wrap', minHeight: 40 }}\n    >\n      <Typography variant=\"h5\" component=\"h1\" sx={{ fontWeight: 600, mr: 0.5 }}>\n        {title}\n      </Typography>\n      {children}\n    </Box>\n  );\n};\nDashboardHeader.displayName = 'Dashboard.Header';\n(DashboardHeader as SlottedComponent).dashboardSlot = 'header';\n\n/** Flexible spacer — everything composed after it is pushed to the right. */\n/* -------------------------------------------------------------------------- */\n/* Filters                                                                    */\n/* -------------------------------------------------------------------------- */\n\nconst DashboardFilters = ({ children, className }: DashboardFiltersProps): React.JSX.Element => {\n  const { filtersVisible, testIdPrefix } = useDashboardContext();\n  return (\n    <Collapse in={filtersVisible} unmountOnExit data-testid={`${testIdPrefix}-filters`}>\n      <Box\n        className={className}\n        sx={{\n          display: 'flex',\n          flexDirection: 'column',\n          gap: 1.5,\n          p: 2,\n          borderRadius: 1,\n          border: 1,\n          borderColor: 'divider',\n          bgcolor: 'action.hover',\n        }}\n      >\n        {children}\n      </Box>\n    </Collapse>\n  );\n};\nDashboardFilters.displayName = 'Dashboard.Filters';\n(DashboardFilters as SlottedComponent).dashboardSlot = 'filters';\n\nconst DashboardMoreFilters = ({ children, label = 'More filters' }: DashboardMoreFiltersProps): React.JSX.Element => {\n  const { moreFiltersOpen, toggleMoreFilters, testIdPrefix } = useDashboardContext();\n  return (\n    <Box>\n      <Button\n        variant=\"text\"\n        size=\"small\"\n        startIcon={<FilterIcon fontSize=\"small\" />}\n        endIcon={moreFiltersOpen ? <ExpandLessIcon fontSize=\"small\" /> : <ExpandMoreIcon fontSize=\"small\" />}\n        onClick={toggleMoreFilters}\n        aria-expanded={moreFiltersOpen}\n        data-testid={`${testIdPrefix}-more-filters-toggle`}\n      >\n        {label}\n      </Button>\n      <Collapse in={moreFiltersOpen} unmountOnExit data-testid={`${testIdPrefix}-more-filters-panel`}>\n        <Box sx={{ mt: 1.5, p: 2, borderRadius: 1, border: 1, borderColor: 'divider', bgcolor: 'background.paper' }}>\n          {children}\n        </Box>\n      </Collapse>\n    </Box>\n  );\n};\nDashboardMoreFilters.displayName = 'Dashboard.MoreFilters';\n\n/* -------------------------------------------------------------------------- */\n/* Body                                                                       */\n/* -------------------------------------------------------------------------- */\n\nconst DashboardBody = ({ children, className }: DashboardBodyProps): React.JSX.Element => {\n  const { testIdPrefix } = useDashboardContext();\n  return (\n    <Box className={className} data-testid={`${testIdPrefix}-body`}>\n      {children}\n    </Box>\n  );\n};\nDashboardBody.displayName = 'Dashboard.Body';\n(DashboardBody as SlottedComponent).dashboardSlot = 'body';\n\n/* -------------------------------------------------------------------------- */\n/* Attach sub-components as dot-notation parts                                */\n/* -------------------------------------------------------------------------- */\n\nDashboard.Breadcrumb = DashboardBreadcrumb;\nDashboard.Header = DashboardHeader;\nDashboard.Spacer = DashboardSpacer;\nDashboard.Info = DashboardInfo;\nDashboard.FilterToggle = DashboardFilterToggle;\nDashboard.Settings = DashboardSettings;\nDashboard.Export = DashboardExport;\nDashboard.Action = DashboardAction;\nDashboard.Filters = DashboardFilters;\nDashboard.MoreFilters = DashboardMoreFilters;\nDashboard.Body = DashboardBody;\n","'use client';\n\nimport { createContext, useContext } from 'react';\n\n/**\n * Value shared across every `Dashboard` sub-component through React context.\n *\n * The root `<Dashboard>` owns this state; opt-in parts such as\n * `<Dashboard.FilterToggle>` and `<Dashboard.Filters>` read from and write to\n * it so they stay in sync without the caller wiring anything up. Nothing here\n * is required — a `Dashboard` composed of only a `<Dashboard.Header>` simply\n * never touches the filter fields.\n */\nexport interface DashboardContextValue {\n  /** Whether the `<Dashboard.Filters>` region is currently expanded. */\n  filtersVisible: boolean;\n  /** Toggles {@link filtersVisible}. Bound to `<Dashboard.FilterToggle>`. */\n  toggleFilters: () => void;\n  /** Whether the advanced `<Dashboard.MoreFilters>` panel is expanded. */\n  moreFiltersOpen: boolean;\n  /** Toggles {@link moreFiltersOpen}. Bound to `<Dashboard.MoreFiltersToggle>`. */\n  toggleMoreFilters: () => void;\n  /**\n   * Count of active filters, surfaced as a badge on `<Dashboard.FilterToggle>`.\n   * Supplied by the caller via the `activeFilterCount` prop on `<Dashboard>`.\n   */\n  activeFilterCount: number;\n  /** Stable prefix for `data-testid` attributes across sub-components. */\n  testIdPrefix: string;\n}\n\n/** Backing context. `null` when a sub-component is used outside `<Dashboard>`. */\nexport const DashboardContext = createContext<DashboardContextValue | null>(null);\n\n/**\n * Reads the nearest {@link DashboardContext}.\n *\n * @throws If called outside a `<Dashboard>` provider.\n * @returns The current dashboard context value.\n */\nexport function useDashboardContext(): DashboardContextValue {\n  const context = useContext(DashboardContext);\n  if (!context) {\n    throw new Error('Dashboard sub-components must be used within a <Dashboard>');\n  }\n  return context;\n}\n","'use client';\n\nimport CloseIcon from '@mui/icons-material/Close';\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\nimport ExportIcon from '@mui/icons-material/FileDownloadOutlined';\nimport FilterIcon from '@mui/icons-material/FilterListRounded';\nimport InfoIcon from '@mui/icons-material/InfoOutlined';\nimport SettingsIcon from '@mui/icons-material/SettingsOutlined';\nimport {\n  Badge,\n  Box,\n  Dialog,\n  DialogContent,\n  DialogTitle,\n  IconButton,\n  Menu,\n  MenuItem,\n  Popover,\n  Tooltip,\n  Typography,\n} from '@mui/material';\nimport React, { useState } from 'react';\n\nimport { HeaderButton } from '../../form/HeaderButton';\nimport { useDashboardContext } from './DashboardContext';\nimport type {\n  DashboardActionProps,\n  DashboardExportFormat,\n  DashboardExportProps,\n  DashboardFilterToggleProps,\n  DashboardInfoProps,\n  DashboardSettingsProps,\n} from './Dashboard.types';\n\n/** Flexible spacer — everything composed after it is pushed to the right. */\nexport const DashboardSpacer = (): React.JSX.Element => <Box sx={{ flex: 1 }} aria-hidden />;\nDashboardSpacer.displayName = 'Dashboard.Spacer';\n\nexport const DashboardInfo = ({\n  title = 'About this page',\n  children,\n  ariaLabel = 'Page information',\n}: DashboardInfoProps): React.JSX.Element => {\n  const { testIdPrefix } = useDashboardContext();\n  const [anchorEl, setAnchorEl] = useState<HTMLButtonElement | null>(null);\n  const open = Boolean(anchorEl);\n  return (\n    <>\n      <Tooltip title={ariaLabel}>\n        <IconButton\n          size=\"small\"\n          aria-label={ariaLabel}\n          aria-haspopup=\"dialog\"\n          onClick={(e) => setAnchorEl(e.currentTarget)}\n          data-testid={`${testIdPrefix}-info-trigger`}\n          sx={{ color: 'text.secondary' }}\n        >\n          <InfoIcon fontSize=\"small\" />\n        </IconButton>\n      </Tooltip>\n      <Popover\n        open={open}\n        anchorEl={anchorEl}\n        onClose={() => setAnchorEl(null)}\n        anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}\n        slotProps={{ paper: { sx: { width: 360, maxWidth: '90vw' } } }}\n        data-testid={`${testIdPrefix}-info-popover`}\n      >\n        <Box sx={{ px: 2, py: 1.5, borderBottom: 1, borderColor: 'divider', display: 'flex', gap: 1, alignItems: 'center' }}>\n          <InfoIcon fontSize=\"small\" sx={{ color: 'text.secondary' }} />\n          <Typography sx={{ fontWeight: 600 }}>{title}</Typography>\n        </Box>\n        <Box sx={{ px: 2, py: 1.5, fontSize: '0.875rem', color: 'text.secondary' }}>{children}</Box>\n      </Popover>\n    </>\n  );\n};\nDashboardInfo.displayName = 'Dashboard.Info';\n\nexport const DashboardFilterToggle = ({ ariaLabel }: DashboardFilterToggleProps): React.JSX.Element => {\n  const { filtersVisible, toggleFilters, activeFilterCount, testIdPrefix } = useDashboardContext();\n  const label = ariaLabel ?? (filtersVisible ? 'Hide filters' : 'Show filters');\n  return (\n    <Tooltip title={label}>\n      <IconButton\n        size=\"small\"\n        aria-label={label}\n        aria-pressed={filtersVisible}\n        onClick={toggleFilters}\n        data-testid={`${testIdPrefix}-filter-toggle`}\n        sx={{ color: filtersVisible ? 'primary.main' : 'text.secondary', bgcolor: filtersVisible ? 'action.selected' : 'transparent' }}\n      >\n        <Badge badgeContent={activeFilterCount} color=\"primary\" overlap=\"circular\">\n          <FilterIcon fontSize=\"small\" />\n        </Badge>\n      </IconButton>\n    </Tooltip>\n  );\n};\nDashboardFilterToggle.displayName = 'Dashboard.FilterToggle';\n\nexport const DashboardSettings = ({\n  title = 'Settings',\n  children,\n  ariaLabel = 'Settings',\n  href,\n  linkComponent,\n}: DashboardSettingsProps): React.JSX.Element => {\n  const { testIdPrefix } = useDashboardContext();\n  const [open, setOpen] = useState(false);\n\n  // Link mode: the gear navigates to a settings route (e.g. the page's\n  // Configuração section) instead of opening an in-page dialog.\n  if (href) {\n    const LinkComponent = linkComponent ?? 'a';\n    return (\n      <Tooltip title={ariaLabel}>\n        <IconButton\n          size=\"small\"\n          aria-label={ariaLabel}\n          component={LinkComponent}\n          href={href}\n          data-testid={`${testIdPrefix}-settings-trigger`}\n          sx={{ color: 'text.secondary' }}\n        >\n          <SettingsIcon fontSize=\"small\" />\n        </IconButton>\n      </Tooltip>\n    );\n  }\n\n  return (\n    <>\n      <Tooltip title={ariaLabel}>\n        <IconButton\n          size=\"small\"\n          aria-label={ariaLabel}\n          aria-haspopup=\"dialog\"\n          onClick={() => setOpen(true)}\n          data-testid={`${testIdPrefix}-settings-trigger`}\n          sx={{ color: 'text.secondary' }}\n        >\n          <SettingsIcon fontSize=\"small\" />\n        </IconButton>\n      </Tooltip>\n      <Dialog open={open} onClose={() => setOpen(false)} maxWidth=\"sm\" fullWidth data-testid={`${testIdPrefix}-settings-dialog`}>\n        <DialogTitle sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n          {title}\n          <IconButton aria-label=\"Close\" size=\"small\" onClick={() => setOpen(false)}>\n            <CloseIcon fontSize=\"small\" />\n          </IconButton>\n        </DialogTitle>\n        <DialogContent dividers>{children}</DialogContent>\n      </Dialog>\n    </>\n  );\n};\nDashboardSettings.displayName = 'Dashboard.Settings';\n\nconst DEFAULT_EXPORT_FORMATS: DashboardExportFormat[] = [\n  { id: 'csv', label: 'CSV (.csv)' },\n  { id: 'xlsx', label: 'Excel (.xlsx)' },\n  { id: 'json', label: 'JSON (.json)' },\n];\n\nexport const DashboardExport = ({\n  formats = DEFAULT_EXPORT_FORMATS,\n  onExport,\n  label = 'Export',\n}: DashboardExportProps): React.JSX.Element => {\n  const { testIdPrefix } = useDashboardContext();\n  const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n  const open = Boolean(anchorEl);\n  return (\n    <>\n      <HeaderButton\n        variant=\"outlined\"\n        color=\"inherit\"\n        text={label}\n        icon={<ExportIcon fontSize=\"small\" />}\n        endIcon={<ExpandMoreIcon fontSize=\"small\" />}\n        onClick={(e) => setAnchorEl(e.currentTarget)}\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n        dataTestId={`${testIdPrefix}-export-trigger`}\n      />\n      <Menu anchorEl={anchorEl} open={open} onClose={() => setAnchorEl(null)} data-testid={`${testIdPrefix}-export-menu`}>\n        {formats.map((format) => (\n          <MenuItem\n            key={format.id}\n            onClick={() => {\n              onExport(format.id);\n              setAnchorEl(null);\n            }}\n            data-testid={`${testIdPrefix}-export-${format.id}`}\n          >\n            {format.label}\n          </MenuItem>\n        ))}\n      </Menu>\n    </>\n  );\n};\nDashboardExport.displayName = 'Dashboard.Export';\n\nexport const DashboardAction = ({ children }: DashboardActionProps): React.JSX.Element => (\n  <Box sx={{ display: 'inline-flex' }}>{children}</Box>\n);\nDashboardAction.displayName = 'Dashboard.Action';\n"],"mappings":"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","names":["ExpandMoreIcon","FilterIcon","Box","Typography","React","useState","jsx","jsxs","Box","React","useState","Typography","FilterIcon","ExpandMoreIcon"]}

package/dist/layout/Drawer.js

@@ -0,0 +1,150 @@
+import "../chunk-PZ5AY32C.js";
+
+// src/components/layout/Drawer/Drawer.tsx
+import Close from "@mui/icons-material/Close";
+import { alpha, Box, Drawer as MuiDrawer, IconButton, Typography, useTheme } from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+var resolveAnchor = (anchor, variant) => {
+  if (anchor) return anchor;
+  switch (variant) {
+    case "right":
+      return "right";
+    case "top":
+      return "top";
+    case "bottom":
+      return "bottom";
+    case "glass":
+      return "right";
+    case "left":
+    default:
+      return "left";
+  }
+};
+var buildDrawerStyles = (theme, anchor, variant, width, height, paperSx) => {
+  const baseStyles = {
+    width: ["left", "right"].includes(anchor) ? width : "100%",
+    height: ["top", "bottom"].includes(anchor) ? height : "100%",
+    flexShrink: 0
+  };
+  if (variant === "glass") {
+    return {
+      ...baseStyles,
+      "& .MuiDrawer-paper": {
+        width,
+        height: "100%",
+        backgroundColor: alpha(theme.palette.background.paper, 0.1),
+        backdropFilter: "blur(20px)",
+        border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`,
+        boxShadow: `0 8px 32px ${alpha(theme.palette.common.black, 0.1)}`,
+        ...paperSx
+      }
+    };
+  }
+  return {
+    ...baseStyles,
+    "& .MuiDrawer-paper": {
+      width: ["left", "right"].includes(anchor) ? width : "100%",
+      height: ["top", "bottom"].includes(anchor) ? height : "100%",
+      boxSizing: "border-box",
+      ...paperSx
+    }
+  };
+};
+var Drawer = ({
+  children,
+  open,
+  onClose,
+  variant = "left",
+  anchor,
+  width = 280,
+  height = "100%",
+  persistent = false,
+  backdrop = true,
+  hideBackdrop = false,
+  keepMounted = false,
+  paperSx,
+  className,
+  dataTestId,
+  ...rest
+}) => {
+  const theme = useTheme();
+  const drawerAnchor = resolveAnchor(anchor, variant);
+  return /* @__PURE__ */ jsx(
+    MuiDrawer,
+    {
+      anchor: drawerAnchor,
+      open,
+      onClose,
+      variant: persistent ? "persistent" : "temporary",
+      ModalProps: {
+        keepMounted,
+        hideBackdrop,
+        BackdropProps: {
+          invisible: !backdrop
+        }
+      },
+      sx: buildDrawerStyles(theme, drawerAnchor, variant, width, height, paperSx),
+      className,
+      "data-testid": dataTestId || "drawer",
+      ...rest,
+      children
+    }
+  );
+};
+var DrawerHeader = ({
+  children,
+  onClose,
+  showCloseButton = true,
+  closeLabel,
+  dataTestId
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      "data-testid": dataTestId || "drawer-header",
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        padding: theme.spacing(2),
+        borderBottom: `1px solid ${theme.palette.divider}`,
+        minHeight: 64,
+        justifyContent: "space-between"
+      },
+      children: [
+        /* @__PURE__ */ jsx(Box, { sx: { flex: 1 }, "data-testid": dataTestId ? `${dataTestId}-title` : "drawer-title", children: typeof children === "string" ? /* @__PURE__ */ jsx(Typography, { variant: "h6", children }) : children }),
+        showCloseButton && onClose && /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            onClick: onClose,
+            edge: "end",
+            "aria-label": closeLabel ?? "Close drawer",
+            "data-testid": dataTestId ? `${dataTestId}-close` : "drawer-close",
+            children: /* @__PURE__ */ jsx(Close, {})
+          }
+        )
+      ]
+    }
+  );
+};
+var DrawerContent = ({ children, padding = true, dataTestId }) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      "data-testid": dataTestId || "drawer-content",
+      sx: {
+        flex: 1,
+        overflow: "auto",
+        padding: padding ? theme.spacing(2) : 0
+      },
+      children
+    }
+  );
+};
+export {
+  Drawer,
+  DrawerContent,
+  DrawerHeader
+};
+//# sourceMappingURL=Drawer.js.map

package/dist/layout/Drawer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/layout/Drawer/Drawer.tsx"],"sourcesContent":["import Close from '@mui/icons-material/Close';\nimport type { Theme } from '@mui/material';\nimport { alpha,Box, Drawer as MuiDrawer, IconButton, Typography, useTheme } from '@mui/material';\nimport React from 'react';\n\nimport type { DrawerContentProps,DrawerHeaderProps, DrawerProps } from './Drawer.types';\n\ntype DrawerAnchor = 'left' | 'right' | 'top' | 'bottom';\n\n// `variant` doubles as a position preset, but an explicit `anchor` always wins.\nconst resolveAnchor = (\n  anchor: DrawerProps['anchor'],\n  variant: DrawerProps['variant'],\n): DrawerAnchor => {\n  if (anchor) return anchor;\n\n  // Map variant to anchor position\n  switch (variant) {\n    case 'right':\n      return 'right';\n    case 'top':\n      return 'top';\n    case 'bottom':\n      return 'bottom';\n    case 'glass':\n      return 'right';\n    case 'left':\n    default:\n      return 'left';\n  }\n};\n\nconst buildDrawerStyles = (\n  theme: Theme,\n  anchor: DrawerAnchor,\n  variant: DrawerProps['variant'],\n  width: DrawerProps['width'],\n  height: DrawerProps['height'],\n  // Merged LAST into the surface's own rules, so a caller can shape the sliding\n  // surface itself (rounded corners on a bottom sheet, a docked panel's offset)\n  // without reaching for the MUI paper class from outside. Undefined by default:\n  // omit it and the drawer styles exactly as it always has.\n  paperSx?: DrawerProps['paperSx'],\n) => {\n  const baseStyles = {\n    width: ['left', 'right'].includes(anchor) ? width : '100%',\n    height: ['top', 'bottom'].includes(anchor) ? height : '100%',\n    flexShrink: 0,\n  };\n\n  if (variant === 'glass') {\n    return {\n      ...baseStyles,\n      '& .MuiDrawer-paper': {\n        width,\n        height: '100%',\n        backgroundColor: alpha(theme.palette.background.paper, 0.1),\n        backdropFilter: 'blur(20px)',\n        border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`,\n        boxShadow: `0 8px 32px ${alpha(theme.palette.common.black, 0.1)}`,\n        ...paperSx,\n      },\n    };\n  }\n\n  return {\n    ...baseStyles,\n    '& .MuiDrawer-paper': {\n      width: ['left', 'right'].includes(anchor) ? width : '100%',\n      height: ['top', 'bottom'].includes(anchor) ? height : '100%',\n      boxSizing: 'border-box',\n      ...paperSx,\n    },\n  };\n};\n\nexport const Drawer: React.FC<DrawerProps> = ({\n  children,\n  open,\n  onClose,\n  variant = 'left',\n  anchor,\n  width = 280,\n  height = '100%',\n  persistent = false,\n  backdrop = true,\n  hideBackdrop = false,\n  keepMounted = false,\n  paperSx,\n  className,\n  dataTestId,\n  ...rest\n}) => {\n  const theme = useTheme();\n  const drawerAnchor = resolveAnchor(anchor, variant);\n\n  return (\n    <MuiDrawer\n      anchor={drawerAnchor}\n      open={open}\n      onClose={onClose}\n      variant={persistent ? 'persistent' : 'temporary'}\n      ModalProps={{\n        keepMounted,\n        hideBackdrop,\n        BackdropProps: {\n          invisible: !backdrop,\n        },\n      }}\n      sx={buildDrawerStyles(theme, drawerAnchor, variant, width, height, paperSx)}\n      className={className}\n      data-testid={dataTestId || 'drawer'}\n      {...rest}\n    >\n      {children}\n    </MuiDrawer>\n  );\n};\n\nexport const DrawerHeader: React.FC<DrawerHeaderProps> = ({\n  children,\n  onClose,\n  showCloseButton = true,\n  closeLabel,\n  dataTestId,\n}) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId || 'drawer-header'}\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        padding: theme.spacing(2),\n        borderBottom: `1px solid ${theme.palette.divider}`,\n        minHeight: 64,\n        justifyContent: 'space-between',\n      }}\n    >\n      <Box sx={{ flex: 1 }} data-testid={dataTestId ? `${dataTestId}-title` : 'drawer-title'}>\n        {typeof children === 'string' ? <Typography variant=\"h6\">{children}</Typography> : children}\n      </Box>\n      {showCloseButton && onClose && (\n        <IconButton\n          onClick={onClose}\n          edge=\"end\"\n          aria-label={closeLabel ?? 'Close drawer'}\n          data-testid={dataTestId ? `${dataTestId}-close` : 'drawer-close'}\n        >\n          <Close />\n        </IconButton>\n      )}\n    </Box>\n  );\n};\n\nexport const DrawerContent: React.FC<DrawerContentProps> = ({ children, padding = true, dataTestId }) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId || 'drawer-content'}\n      sx={{\n        flex: 1,\n        overflow: 'auto',\n        padding: padding ? theme.spacing(2) : 0,\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"mappings":"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","names":[]}