@12-apps/ui 6.11.1 → 6.12.0

package/dist/chunk-P2PDDFMM.js

@@ -0,0 +1,200 @@
+// src/components/data-display/Table/Table.styles.ts
+import { alpha, keyframes } from "@mui/material/styles/index.js";
+var pulseAnimation = keyframes`
+  0% {
+    box-shadow: 0 0 0 0 currentColor;
+    opacity: 1;
+  }
+  70% {
+    box-shadow: 0 0 0 10px currentColor;
+    opacity: 0;
+  }
+  100% {
+    box-shadow: 0 0 0 0 currentColor;
+    opacity: 0;
+  }
+`;
+var getDensityConfig = (density = "normal") => {
+  const configs = {
+    compact: {
+      rowHeight: 36,
+      cellPadding: "6px 12px",
+      fontSize: "0.8125rem",
+      headerPadding: "8px 12px"
+    },
+    normal: {
+      rowHeight: 52,
+      cellPadding: "12px 16px",
+      fontSize: "0.875rem",
+      headerPadding: "16px 16px"
+    },
+    comfortable: {
+      rowHeight: 68,
+      cellPadding: "18px 24px",
+      fontSize: "0.875rem",
+      headerPadding: "20px 24px"
+    }
+  };
+  return configs[density];
+};
+var getStripeColorFromTheme = (theme, stripeColor = "neutral") => {
+  const colorMap = {
+    primary: theme.palette.primary.main,
+    secondary: theme.palette.secondary.main,
+    info: theme.palette.info.main,
+    success: theme.palette.success.main,
+    warning: theme.palette.warning.main,
+    danger: theme.palette.error.main,
+    neutral: theme.palette.action.hover
+  };
+  return colorMap[stripeColor];
+};
+var stripeRowColor = (theme, stripeColor = "neutral") => {
+  const color = getStripeColorFromTheme(theme, stripeColor);
+  return stripeColor === "neutral" ? color : alpha(color, 0.15);
+};
+var TABLE_VARIANTS = {
+  default: ({ theme }) => ({
+    backgroundColor: theme.palette.background.paper,
+    "& .MuiTableHead-root": {
+      backgroundColor: alpha(theme.palette.primary.main, 0.1)
+    }
+  }),
+  striped: ({ theme, stripeColor }) => ({
+    backgroundColor: theme.palette.background.paper,
+    "& .MuiTableBody-root .MuiTableRow-root:nth-of-type(even)": {
+      backgroundColor: stripeRowColor(theme, stripeColor)
+    }
+  }),
+  glass: ({ theme }) => ({
+    backgroundColor: alpha(theme.palette.background.paper, 0.1),
+    backdropFilter: "blur(20px)",
+    border: `1px solid ${alpha(theme.palette.divider, 0.2)}`
+  }),
+  minimal: ({ theme }) => ({
+    backgroundColor: "transparent",
+    "& .MuiTableCell-root": {
+      borderBottom: `1px solid ${alpha(theme.palette.divider, 0.1)}`
+    }
+  }),
+  gradient: ({ theme }) => ({
+    background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.05)}, ${alpha(theme.palette.secondary.main, 0.05)})`,
+    border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,
+    "& .MuiTableHead-root": {
+      background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.15)}, ${alpha(theme.palette.secondary.main, 0.15)})`
+    },
+    "& .MuiTableCell-root": {
+      borderBottom: `1px solid ${alpha(theme.palette.divider, 0.15)}`
+    }
+  })
+};
+var tableVariantStyles = (args, customVariant) => customVariant ? TABLE_VARIANTS[customVariant]?.(args) ?? {} : {};
+var stickyHeaderStyles = (theme, densityConfig) => ({
+  "& .MuiTableHead-root": {
+    position: "sticky",
+    top: 0,
+    zIndex: 100,
+    backgroundColor: theme.palette.background.paper,
+    "& .MuiTableCell-root": {
+      borderBottom: `2px solid ${theme.palette.divider}`,
+      fontWeight: 600,
+      padding: densityConfig.headerPadding
+    }
+  }
+});
+var hoverableRowStyles = (theme) => ({
+  "& .MuiTableBody-root .MuiTableRow-root:hover": {
+    backgroundColor: alpha(theme.palette.primary.main, 0.08),
+    cursor: "pointer",
+    transition: "background-color 0.15s ease-in-out"
+  }
+});
+var emphasisStyles = (theme, glow, pulse) => {
+  if (glow && pulse) return {
+    position: "relative",
+    boxShadow: `0 0 20px 5px ${alpha(theme.palette.primary.main, 0.3)} !important`,
+    filter: "brightness(1.05)",
+    "&::after": {
+      content: '""',
+      position: "absolute",
+      top: 0,
+      left: 0,
+      right: 0,
+      bottom: 0,
+      borderRadius: "inherit",
+      backgroundColor: theme.palette.primary.main,
+      opacity: 0.1,
+      animation: `${pulseAnimation} 2s infinite`,
+      pointerEvents: "none",
+      zIndex: -1
+    }
+  };
+  if (glow) return {
+    boxShadow: `0 0 20px 5px ${alpha(theme.palette.primary.main, 0.3)} !important`,
+    filter: "brightness(1.05)"
+  };
+  if (pulse) return {
+    position: "relative",
+    "&::after": {
+      content: '""',
+      position: "absolute",
+      top: 0,
+      left: 0,
+      right: 0,
+      bottom: 0,
+      borderRadius: "inherit",
+      backgroundColor: theme.palette.primary.main,
+      opacity: 0.1,
+      animation: `${pulseAnimation} 2s infinite`,
+      pointerEvents: "none",
+      zIndex: -1
+    }
+  };
+  return {};
+};
+var tableStyles = ({
+  theme,
+  customVariant,
+  glow,
+  pulse,
+  hoverable,
+  density,
+  stickyHeader,
+  stripeColor = "neutral"
+}) => {
+  const densityConfig = getDensityConfig(density);
+  return {
+    borderRadius: theme.spacing(1),
+    overflow: "hidden",
+    transition: "all 0.3s ease",
+    position: "relative",
+    // Density styles
+    "& .MuiTableCell-root": {
+      padding: densityConfig.cellPadding,
+      fontSize: densityConfig.fontSize,
+      height: densityConfig.rowHeight
+    },
+    // Sticky header
+    ...tableVariantStyles({ theme, densityConfig, stripeColor }, customVariant),
+    ...stickyHeader ? stickyHeaderStyles(theme, densityConfig) : {},
+    ...hoverable ? hoverableRowStyles(theme) : {},
+    ...emphasisStyles(theme, glow, pulse),
+    // Variant styles
+    // Hoverable rows
+    // Selection styles
+    "& .MuiTableRow-root.selected": {
+      backgroundColor: alpha(theme.palette.primary.main, 0.12),
+      "&:hover": {
+        backgroundColor: alpha(theme.palette.primary.main, 0.16)
+      }
+    }
+    // Glow effect
+    // Pulse animation
+    // Both glow and pulse
+  };
+};
+
+export {
+  tableStyles
+};
+//# sourceMappingURL=chunk-P2PDDFMM.js.map

package/dist/chunk-P2PDDFMM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Table/Table.styles.ts"],"sourcesContent":["import { alpha, keyframes } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nimport type { TableDensity, TableStripeColor } from './Table.types';\n\nconst pulseAnimation = keyframes`\n  0% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 1;\n  }\n  70% {\n    box-shadow: 0 0 0 10px currentColor;\n    opacity: 0;\n  }\n  100% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 0;\n  }\n`;\n\n// Density configurations\nconst getDensityConfig = (density: TableDensity = 'normal') => {\n  const configs = {\n    compact: {\n      rowHeight: 36,\n      cellPadding: '6px 12px',\n      fontSize: '0.8125rem',\n      headerPadding: '8px 12px' },\n    normal: {\n      rowHeight: 52,\n      cellPadding: '12px 16px',\n      fontSize: '0.875rem',\n      headerPadding: '16px 16px' },\n    comfortable: {\n      rowHeight: 68,\n      cellPadding: '18px 24px',\n      fontSize: '0.875rem',\n      headerPadding: '20px 24px' } };\n  return configs[density];\n};\n\nconst getStripeColorFromTheme = (theme: { palette: { primary: { main: string }; secondary: { main: string }; info: { main: string }; success: { main: string }; warning: { main: string }; error: { main: string }; action: { hover: string } } }, stripeColor: TableStripeColor = 'neutral') => {\n  const colorMap: Record<TableStripeColor, string> = {\n    primary: theme.palette.primary.main,\n    secondary: theme.palette.secondary.main,\n    info: theme.palette.info.main,\n    success: theme.palette.success.main,\n    warning: theme.palette.warning.main,\n    danger: theme.palette.error.main,\n    neutral: theme.palette.action.hover };\n  return colorMap[stripeColor];\n};\n\n/**\n * The zebra stripe for one body row.\n *\n * `neutral` — the default — resolves to `palette.action.hover`, which ALREADY\n * carries its subtlety in its own alpha (`rgba(0,0,0,0.04)` in the light\n * theme). MUI's `alpha()` REPLACES that channel rather than multiplying it, so\n * re-alpha-ing it at 0.5 amplified the tint 12.5× into `rgba(0,0,0,0.5)` —\n * solid #808080 on a white card, which reads as a selected or errored row\n * rather than as a stripe (FUT-755). It is used as-is instead.\n *\n * The named colours are opaque `*.main` values with no alpha of their own, so\n * they still need one.\n */\nconst stripeRowColor = (\n  theme: Parameters<typeof getStripeColorFromTheme>[0],\n  stripeColor: TableStripeColor = 'neutral',\n): string => {\n  const color = getStripeColorFromTheme(theme, stripeColor);\n  return stripeColor === 'neutral' ? color : alpha(color, 0.15);\n};\n\n// One variant applies at a time, so a lookup replaces the mutually exclusive\n// spreads.\nconst TABLE_VARIANTS: Record<string, (args: VariantArgs) => CSSObject> = {\n  default: ({ theme }) => ({\n      backgroundColor: theme.palette.background.paper,\n      '& .MuiTableHead-root': {\n        backgroundColor: alpha(theme.palette.primary.main, 0.1) } }),\n  striped: ({ theme, stripeColor }) => ({\n      backgroundColor: theme.palette.background.paper,\n      '& .MuiTableBody-root .MuiTableRow-root:nth-of-type(even)': {\n        backgroundColor: stripeRowColor(theme, stripeColor) } }),\n  glass: ({ theme }) => ({\n      backgroundColor: alpha(theme.palette.background.paper, 0.1),\n      backdropFilter: 'blur(20px)',\n      border: `1px solid ${alpha(theme.palette.divider, 0.2)}` }),\n  minimal: ({ theme }) => ({\n      backgroundColor: 'transparent',\n      '& .MuiTableCell-root': {\n        borderBottom: `1px solid ${alpha(theme.palette.divider, 0.1)}` } }),\n  gradient: ({ theme }) => ({\n      background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.05)}, ${alpha(theme.palette.secondary.main, 0.05)})`,\n      border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,\n      '& .MuiTableHead-root': {\n        background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.15)}, ${alpha(theme.palette.secondary.main, 0.15)})` },\n      '& .MuiTableCell-root': {\n        borderBottom: `1px solid ${alpha(theme.palette.divider, 0.15)}` } }) };\n\ntype VariantArgs = {\n  theme: Theme;\n  densityConfig: ReturnType<typeof getDensityConfig>;\n  stripeColor?: TableStripeColor;\n};\n\nconst tableVariantStyles = (args: VariantArgs, customVariant?: string): CSSObject =>\n  customVariant ? (TABLE_VARIANTS[customVariant]?.(args) ?? {}) : {};\n\n// Sticky headers and row hover are independent of the variant.\nconst stickyHeaderStyles = (\n  theme: Theme,\n  densityConfig: ReturnType<typeof getDensityConfig>,\n): CSSObject => ({\n      '& .MuiTableHead-root': {\n        position: 'sticky',\n        top: 0,\n        zIndex: 100,\n        backgroundColor: theme.palette.background.paper,\n        '& .MuiTableCell-root': {\n          borderBottom: `2px solid ${theme.palette.divider}`,\n          fontWeight: 600,\n          padding: densityConfig.headerPadding } } });\n\nconst hoverableRowStyles = (theme: Theme): CSSObject => ({\n      '& .MuiTableBody-root .MuiTableRow-root:hover': {\n        backgroundColor: alpha(theme.palette.primary.main, 0.08),\n        cursor: 'pointer',\n        transition: 'background-color 0.15s ease-in-out' } });\n\n// glow and pulse combine into three distinct looks, spelled out rather than\n// layered — the glow-only shadow differs from the one used when both are on.\nconst emphasisStyles = (theme: Theme, glow?: boolean, pulse?: boolean): CSSObject => {\n  if (glow && pulse) return ({\n      position: 'relative',\n      boxShadow: `0 0 20px 5px ${alpha(theme.palette.primary.main, 0.3)} !important`,\n      filter: 'brightness(1.05)',\n      '&::after': {\n        content: '\"\"',\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        right: 0,\n        bottom: 0,\n        borderRadius: 'inherit',\n        backgroundColor: theme.palette.primary.main,\n        opacity: 0.1,\n        animation: `${pulseAnimation} 2s infinite`,\n        pointerEvents: 'none',\n        zIndex: -1 } });\n  if (glow) return ({\n      boxShadow: `0 0 20px 5px ${alpha(theme.palette.primary.main, 0.3)} !important`,\n      filter: 'brightness(1.05)' });\n  if (pulse) return ({\n      position: 'relative',\n      '&::after': {\n        content: '\"\"',\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        right: 0,\n        bottom: 0,\n        borderRadius: 'inherit',\n        backgroundColor: theme.palette.primary.main,\n        opacity: 0.1,\n        animation: `${pulseAnimation} 2s infinite`,\n        pointerEvents: 'none',\n        zIndex: -1 } });\n\n  return {};\n};\n\n// The table's own styling, lifted out so the styled() callback just forwards\n// its props.\nexport const tableStyles = ({\n  theme,\n  customVariant,\n  glow,\n  pulse,\n  hoverable,\n  density,\n  stickyHeader,\n  stripeColor = 'neutral' }: {\n  theme: Theme;\n  customVariant?: string;\n  glow?: boolean;\n  pulse?: boolean;\n  hoverable?: boolean;\n  density?: TableDensity;\n  stickyHeader?: boolean;\n  stripeColor?: TableStripeColor;\n}): CSSObject => {\n  const densityConfig = getDensityConfig(density);\n  \n  return {\n    borderRadius: theme.spacing(1),\n    overflow: 'hidden',\n    transition: 'all 0.3s ease',\n    position: 'relative',\n\n    // Density styles\n    '& .MuiTableCell-root': {\n      padding: densityConfig.cellPadding,\n      fontSize: densityConfig.fontSize,\n      height: densityConfig.rowHeight },\n\n    // Sticky header\n    ...tableVariantStyles({ theme, densityConfig, stripeColor }, customVariant),\n    ...(stickyHeader ? stickyHeaderStyles(theme, densityConfig) : {}),\n    ...(hoverable ? hoverableRowStyles(theme) : {}),\n    ...emphasisStyles(theme, glow, pulse),\n\n\n    // Variant styles\n\n\n\n\n\n\n\n\n\n\n    // Hoverable rows\n\n\n    // Selection styles\n    '& .MuiTableRow-root.selected': {\n      backgroundColor: alpha(theme.palette.primary.main, 0.12),\n      '&:hover': {\n        backgroundColor: alpha(theme.palette.primary.main, 0.16) } },\n\n    // Glow effect\n\n\n    // Pulse animation\n\n\n    // Both glow and pulse\n\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-P6TNXBDA.js

@@ -0,0 +1,51 @@
+import {
+  resizedTo
+} from "./chunk-3TDVGZZN.js";
+
+// src/components/layout/Resizable/Resizable.hooks.ts
+import React, { useCallback, useRef, useState } from "react";
+var useResize = ({ width, height, bounds, disabled, onResize }) => {
+  const [size, setSize] = useState({ width, height });
+  const [isResizing, setIsResizing] = useState(false);
+  const startPos = useRef({ x: 0, y: 0 });
+  const startSize = useRef({ width: 0, height: 0 });
+  const activeHandle = useRef(null);
+  React.useEffect(() => {
+    setSize({ width, height });
+  }, [width, height]);
+  const handleMouseDown = useCallback(
+    (e, handle) => {
+      if (disabled) return;
+      e.preventDefault();
+      e.stopPropagation();
+      setIsResizing(true);
+      activeHandle.current = handle;
+      startPos.current = { x: e.clientX, y: e.clientY };
+      startSize.current = { width: size.width, height: size.height };
+      const handleMouseMove = (move) => {
+        const delta = {
+          x: move.clientX - startPos.current.x,
+          y: move.clientY - startPos.current.y
+        };
+        const next = resizedTo(handle, delta, startSize.current, bounds);
+        setSize(next);
+        onResize?.(next.width, next.height);
+      };
+      const handleMouseUp = () => {
+        setIsResizing(false);
+        activeHandle.current = null;
+        document.removeEventListener("mousemove", handleMouseMove);
+        document.removeEventListener("mouseup", handleMouseUp);
+      };
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+    },
+    [disabled, size, bounds, onResize]
+  );
+  return { size, isResizing, activeHandle, handleMouseDown };
+};
+
+export {
+  useResize
+};
+//# sourceMappingURL=chunk-P6TNXBDA.js.map

package/dist/chunk-P7GH32WG.js

@@ -0,0 +1,124 @@
+// src/components/layout/Sidebar/Sidebar.tsx
+import Box from "@mui/material/Box/index.js";
+import { alpha, useTheme } from "@mui/material/styles/index.js";
+import { jsx } from "react/jsx-runtime";
+var Sidebar = ({
+  children,
+  variant = "fixed",
+  open = true,
+  onToggle: _onToggle,
+  width = 280,
+  collapsedWidth = 64,
+  position = "left",
+  className,
+  dataTestId = "sidebar",
+  ...rest
+}) => {
+  void _onToggle;
+  const theme = useTheme();
+  const isCollapsed = variant === "collapsible" && !open;
+  const currentWidth = isCollapsed ? collapsedWidth : width;
+  const getVariantStyles = () => {
+    switch (variant) {
+      case "floating":
+        return {
+          position: "fixed",
+          top: theme.spacing(2),
+          bottom: theme.spacing(2),
+          [position]: theme.spacing(2),
+          borderRadius: theme.spacing(2),
+          boxShadow: theme.shadows[8],
+          zIndex: theme.zIndex.drawer
+        };
+      case "glass":
+        return {
+          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)}`
+        };
+      case "collapsible":
+        return {
+          transition: theme.transitions.create("width", {
+            easing: theme.transitions.easing.sharp,
+            duration: theme.transitions.duration.leavingScreen
+          })
+        };
+      default:
+        return {
+          backgroundColor: theme.palette.background.paper,
+          borderRight: `1px solid ${theme.palette.divider}`
+        };
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      className,
+      "data-testid": dataTestId,
+      ...rest,
+      sx: {
+        width: currentWidth,
+        height: "100vh",
+        display: "flex",
+        flexDirection: "column",
+        overflow: "hidden",
+        ...getVariantStyles()
+      },
+      children
+    }
+  );
+};
+var SidebarHeader = ({ children, dataTestId = "sidebar-header", ...rest }) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      "data-testid": dataTestId,
+      ...rest,
+      sx: {
+        padding: theme.spacing(2),
+        borderBottom: `1px solid ${theme.palette.divider}`,
+        flexShrink: 0,
+        overflow: "hidden"
+      },
+      children
+    }
+  );
+};
+var SidebarContent = ({ children, dataTestId = "sidebar-content", ...rest }) => /* @__PURE__ */ jsx(
+  Box,
+  {
+    "data-testid": dataTestId,
+    ...rest,
+    sx: {
+      flex: 1,
+      overflow: "auto"
+    },
+    children
+  }
+);
+var SidebarFooter = ({ children, dataTestId = "sidebar-footer", ...rest }) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      "data-testid": dataTestId,
+      ...rest,
+      sx: {
+        padding: theme.spacing(2),
+        borderTop: `1px solid ${theme.palette.divider}`,
+        flexShrink: 0
+      },
+      children
+    }
+  );
+};
+
+export {
+  Sidebar,
+  SidebarHeader,
+  SidebarContent,
+  SidebarFooter
+};
+//# sourceMappingURL=chunk-P7GH32WG.js.map

package/dist/chunk-P7GH32WG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/layout/Sidebar/Sidebar.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport { alpha, useTheme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type {\n  SidebarContentProps,\n  SidebarFooterProps,\n  SidebarHeaderProps,\n  SidebarProps,\n} from './Sidebar.types';\n\nexport const Sidebar: React.FC<SidebarProps> = ({\n  children,\n  variant = 'fixed',\n  open = true,\n  onToggle: _onToggle,\n  width = 280,\n  collapsedWidth = 64,\n  position = 'left',\n  className,\n  dataTestId = 'sidebar',\n  ...rest\n}) => {\n  // Prevent unused variable warning for onToggle\n  void _onToggle;\n  const theme = useTheme();\n\n  const isCollapsed = variant === 'collapsible' && !open;\n  const currentWidth = isCollapsed ? collapsedWidth : width;\n\n  const getVariantStyles = () => {\n    switch (variant) {\n      case 'floating':\n        return {\n          position: 'fixed' as const,\n          top: theme.spacing(2),\n          bottom: theme.spacing(2),\n          [position]: theme.spacing(2),\n          borderRadius: theme.spacing(2),\n          boxShadow: theme.shadows[8],\n          zIndex: theme.zIndex.drawer,\n        };\n      case 'glass':\n        return {\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        };\n      case 'collapsible':\n        return {\n          transition: theme.transitions.create('width', {\n            easing: theme.transitions.easing.sharp,\n            duration: theme.transitions.duration.leavingScreen,\n          }),\n        };\n      default:\n        return {\n          backgroundColor: theme.palette.background.paper,\n          borderRight: `1px solid ${theme.palette.divider}`,\n        };\n    }\n  };\n\n  return (\n    <Box\n      className={className}\n      data-testid={dataTestId}\n      {...rest}\n      sx={{\n        width: currentWidth,\n        height: '100vh',\n        display: 'flex',\n        flexDirection: 'column',\n        overflow: 'hidden',\n        ...getVariantStyles(),\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\n\nexport const SidebarHeader: React.FC<SidebarHeaderProps> = ({ children, dataTestId = 'sidebar-header', ...rest }) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId}\n      {...rest}\n      sx={{\n        padding: theme.spacing(2),\n        borderBottom: `1px solid ${theme.palette.divider}`,\n        flexShrink: 0,\n        overflow: 'hidden',\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\n\nexport const SidebarContent: React.FC<SidebarContentProps> = ({ children, dataTestId = 'sidebar-content', ...rest }) => (\n    <Box\n      data-testid={dataTestId}\n      {...rest}\n      sx={{\n        flex: 1,\n        overflow: 'auto',\n      }}\n    >\n      {children}\n    </Box>\n  );\n\nexport const SidebarFooter: React.FC<SidebarFooterProps> = ({ children, dataTestId = 'sidebar-footer', ...rest }) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      data-testid={dataTestId}\n      {...rest}\n      sx={{\n        padding: theme.spacing(2),\n        borderTop: `1px solid ${theme.palette.divider}`,\n        flexShrink: 0,\n      }}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"mappings":";AAAA,OAAO,SAAS;AAChB,SAAS,OAAO,gBAAgB;AAgE5B;AAtDG,IAAM,UAAkC,CAAC;AAAA,EAC9C;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,iBAAiB;AAAA,EACjB,WAAW;AAAA,EACX;AAAA,EACA,aAAa;AAAA,EACb,GAAG;AACL,MAAM;AAEJ,OAAK;AACL,QAAM,QAAQ,SAAS;AAEvB,QAAM,cAAc,YAAY,iBAAiB,CAAC;AAClD,QAAM,eAAe,cAAc,iBAAiB;AAEpD,QAAM,mBAAmB,MAAM;AAC7B,YAAQ,SAAS;AAAA,MACf,KAAK;AACH,eAAO;AAAA,UACL,UAAU;AAAA,UACV,KAAK,MAAM,QAAQ,CAAC;AAAA,UACpB,QAAQ,MAAM,QAAQ,CAAC;AAAA,UACvB,CAAC,QAAQ,GAAG,MAAM,QAAQ,CAAC;AAAA,UAC3B,cAAc,MAAM,QAAQ,CAAC;AAAA,UAC7B,WAAW,MAAM,QAAQ,CAAC;AAAA,UAC1B,QAAQ,MAAM,OAAO;AAAA,QACvB;AAAA,MACF,KAAK;AACH,eAAO;AAAA,UACL,iBAAiB,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG;AAAA,UAC1D,gBAAgB;AAAA,UAChB,QAAQ,aAAa,MAAM,MAAM,QAAQ,QAAQ,MAAM,GAAG,CAAC;AAAA,UAC3D,WAAW,cAAc,MAAM,MAAM,QAAQ,OAAO,OAAO,GAAG,CAAC;AAAA,QACjE;AAAA,MACF,KAAK;AACH,eAAO;AAAA,UACL,YAAY,MAAM,YAAY,OAAO,SAAS;AAAA,YAC5C,QAAQ,MAAM,YAAY,OAAO;AAAA,YACjC,UAAU,MAAM,YAAY,SAAS;AAAA,UACvC,CAAC;AAAA,QACH;AAAA,MACF;AACE,eAAO;AAAA,UACL,iBAAiB,MAAM,QAAQ,WAAW;AAAA,UAC1C,aAAa,aAAa,MAAM,QAAQ,OAAO;AAAA,QACjD;AAAA,IACJ;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,eAAa;AAAA,MACZ,GAAG;AAAA,MACJ,IAAI;AAAA,QACF,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,eAAe;AAAA,QACf,UAAU;AAAA,QACV,GAAG,iBAAiB;AAAA,MACtB;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;AAEO,IAAM,gBAA8C,CAAC,EAAE,UAAU,aAAa,kBAAkB,GAAG,KAAK,MAAM;AACnH,QAAM,QAAQ,SAAS;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa;AAAA,MACZ,GAAG;AAAA,MACJ,IAAI;AAAA,QACF,SAAS,MAAM,QAAQ,CAAC;AAAA,QACxB,cAAc,aAAa,MAAM,QAAQ,OAAO;AAAA,QAChD,YAAY;AAAA,QACZ,UAAU;AAAA,MACZ;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;AAEO,IAAM,iBAAgD,CAAC,EAAE,UAAU,aAAa,mBAAmB,GAAG,KAAK,MAC9G;AAAA,EAAC;AAAA;AAAA,IACC,eAAa;AAAA,IACZ,GAAG;AAAA,IACJ,IAAI;AAAA,MACF,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IAEC;AAAA;AACH;AAGG,IAAM,gBAA8C,CAAC,EAAE,UAAU,aAAa,kBAAkB,GAAG,KAAK,MAAM;AACnH,QAAM,QAAQ,SAAS;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa;AAAA,MACZ,GAAG;AAAA,MACJ,IAAI;AAAA,QACF,SAAS,MAAM,QAAQ,CAAC;AAAA,QACxB,WAAW,aAAa,MAAM,QAAQ,OAAO;AAAA,QAC7C,YAAY;AAAA,MACd;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/chunk-PDLJOQO5.js

@@ -0,0 +1,62 @@
+// src/components/form/AddressAutocomplete/AddressOption.tsx
+import LocationIcon from "@mui/icons-material/LocationOn";
+import Box from "@mui/material/Box/index.js";
+import { alpha, styled } from "@mui/material/styles/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+var SuggestionItem = styled(Box)(({ theme }) => ({
+  padding: theme.spacing(1.5),
+  display: "flex",
+  alignItems: "flex-start",
+  gap: theme.spacing(1.5),
+  cursor: "pointer",
+  transition: theme.transitions.create(["background-color"]),
+  "&:hover": {
+    backgroundColor: alpha(theme.palette.primary.main, 0.08)
+  }
+}));
+var LocationIconWrapper = styled(Box)(({ theme }) => ({
+  marginTop: theme.spacing(0.5),
+  color: theme.palette.text.secondary
+}));
+var AddressText = styled(Box)(({ theme }) => ({
+  flex: 1,
+  "& .primary": {
+    fontSize: "0.9rem",
+    fontWeight: 500,
+    color: theme.palette.text.primary,
+    marginBottom: theme.spacing(0.25)
+  },
+  "& .secondary": {
+    fontSize: "0.8rem",
+    color: theme.palette.text.secondary
+  }
+}));
+var optionText = (option) => {
+  if (typeof option === "string") {
+    return {
+      testId: "address-suggestion-text",
+      primary: option.split(",")[0],
+      secondary: option.split(",").slice(1).join(",")
+    };
+  }
+  return {
+    testId: "address-prediction-text",
+    primary: option.structured_formatting?.main_text || option.description?.split(",")[0],
+    secondary: option.structured_formatting?.secondary_text || option.description?.split(",").slice(1).join(",")
+  };
+};
+var AddressOption = ({ optionProps, option, index }) => {
+  const { testId, primary, secondary } = optionText(option);
+  return /* @__PURE__ */ jsx("li", { ...optionProps, "data-testid": `address-suggestion-${index}`, children: /* @__PURE__ */ jsxs(SuggestionItem, { children: [
+    /* @__PURE__ */ jsx(LocationIconWrapper, { children: /* @__PURE__ */ jsx(LocationIcon, { fontSize: "small" }) }),
+    /* @__PURE__ */ jsxs(AddressText, { "data-testid": testId, children: [
+      /* @__PURE__ */ jsx("div", { className: "primary", children: primary }),
+      /* @__PURE__ */ jsx("div", { className: "secondary", children: secondary })
+    ] })
+  ] }) });
+};
+
+export {
+  AddressOption
+};
+//# sourceMappingURL=chunk-PDLJOQO5.js.map

package/dist/chunk-PDLJOQO5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/AddressAutocomplete/AddressOption.tsx"],"sourcesContent":["import LocationIcon from '@mui/icons-material/LocationOn';\nimport Box from '@mui/material/Box/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport type { FC, HTMLAttributes } from 'react';\nimport React from 'react';\n\nimport type { AddressOptionValue } from './AddressAutocomplete.types';\n\n// Module-local: styled() components cannot be exported across a module boundary\n// here without tripping TS2742.\nconst SuggestionItem = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(1.5),\n  display: 'flex',\n  alignItems: 'flex-start',\n  gap: theme.spacing(1.5),\n  cursor: 'pointer',\n  transition: theme.transitions.create(['background-color']),\n  '&:hover': {\n    backgroundColor: alpha(theme.palette.primary.main, 0.08),\n  },\n}));\n\nconst LocationIconWrapper = styled(Box)(({ theme }) => ({\n  marginTop: theme.spacing(0.5),\n  color: theme.palette.text.secondary,\n}));\n\nconst AddressText = styled(Box)(({ theme }) => ({\n  flex: 1,\n  '& .primary': {\n    fontSize: '0.9rem',\n    fontWeight: 500,\n    color: theme.palette.text.primary,\n    marginBottom: theme.spacing(0.25),\n  },\n  '& .secondary': {\n    fontSize: '0.8rem',\n    color: theme.palette.text.secondary,\n  },\n}));\n\n// Predictions carry the street line and the rest already split; freeSolo text has\n// to be split on the first comma to get the same two lines.\nconst optionText = (option: AddressOptionValue) => {\n  if (typeof option === 'string') {\n    return {\n      testId: 'address-suggestion-text',\n      primary: option.split(',')[0],\n      secondary: option.split(',').slice(1).join(','),\n    };\n  }\n\n  return {\n    testId: 'address-prediction-text',\n    primary: option.structured_formatting?.main_text || option.description?.split(',')[0],\n    secondary:\n      option.structured_formatting?.secondary_text ||\n      option.description?.split(',').slice(1).join(','),\n  };\n};\n\nexport interface AddressOptionProps {\n  optionProps: HTMLAttributes<HTMLLIElement>;\n  option: AddressOptionValue;\n  index: number;\n}\n\nexport const AddressOption: FC<AddressOptionProps> = ({ optionProps, option, index }) => {\n  const { testId, primary, secondary } = optionText(option);\n\n  return (\n    <li {...optionProps} data-testid={`address-suggestion-${index}`}>\n      <SuggestionItem>\n        <LocationIconWrapper>\n          <LocationIcon fontSize=\"small\" />\n        </LocationIconWrapper>\n        <AddressText data-testid={testId}>\n          <div className=\"primary\">{primary}</div>\n          <div className=\"secondary\">{secondary}</div>\n        </AddressText>\n      </SuggestionItem>\n    </li>\n  );\n};\n"],"mappings":";AAAA,OAAO,kBAAkB;AACzB,OAAO,SAAS;AAChB,SAAS,OAAO,cAAc;AAwEpB,cAEF,YAFE;AAhEV,IAAM,iBAAiB,OAAO,GAAG,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EACjD,SAAS,MAAM,QAAQ,GAAG;AAAA,EAC1B,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,KAAK,MAAM,QAAQ,GAAG;AAAA,EACtB,QAAQ;AAAA,EACR,YAAY,MAAM,YAAY,OAAO,CAAC,kBAAkB,CAAC;AAAA,EACzD,WAAW;AAAA,IACT,iBAAiB,MAAM,MAAM,QAAQ,QAAQ,MAAM,IAAI;AAAA,EACzD;AACF,EAAE;AAEF,IAAM,sBAAsB,OAAO,GAAG,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EACtD,WAAW,MAAM,QAAQ,GAAG;AAAA,EAC5B,OAAO,MAAM,QAAQ,KAAK;AAC5B,EAAE;AAEF,IAAM,cAAc,OAAO,GAAG,EAAE,CAAC,EAAE,MAAM,OAAO;AAAA,EAC9C,MAAM;AAAA,EACN,cAAc;AAAA,IACZ,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,OAAO,MAAM,QAAQ,KAAK;AAAA,IAC1B,cAAc,MAAM,QAAQ,IAAI;AAAA,EAClC;AAAA,EACA,gBAAgB;AAAA,IACd,UAAU;AAAA,IACV,OAAO,MAAM,QAAQ,KAAK;AAAA,EAC5B;AACF,EAAE;AAIF,IAAM,aAAa,CAAC,WAA+B;AACjD,MAAI,OAAO,WAAW,UAAU;AAC9B,WAAO;AAAA,MACL,QAAQ;AAAA,MACR,SAAS,OAAO,MAAM,GAAG,EAAE,CAAC;AAAA,MAC5B,WAAW,OAAO,MAAM,GAAG,EAAE,MAAM,CAAC,EAAE,KAAK,GAAG;AAAA,IAChD;AAAA,EACF;AAEA,SAAO;AAAA,IACL,QAAQ;AAAA,IACR,SAAS,OAAO,uBAAuB,aAAa,OAAO,aAAa,MAAM,GAAG,EAAE,CAAC;AAAA,IACpF,WACE,OAAO,uBAAuB,kBAC9B,OAAO,aAAa,MAAM,GAAG,EAAE,MAAM,CAAC,EAAE,KAAK,GAAG;AAAA,EACpD;AACF;AAQO,IAAM,gBAAwC,CAAC,EAAE,aAAa,QAAQ,MAAM,MAAM;AACvF,QAAM,EAAE,QAAQ,SAAS,UAAU,IAAI,WAAW,MAAM;AAExD,SACE,oBAAC,QAAI,GAAG,aAAa,eAAa,sBAAsB,KAAK,IAC3D,+BAAC,kBACC;AAAA,wBAAC,uBACC,8BAAC,gBAAa,UAAS,SAAQ,GACjC;AAAA,IACA,qBAAC,eAAY,eAAa,QACxB;AAAA,0BAAC,SAAI,WAAU,WAAW,mBAAQ;AAAA,MAClC,oBAAC,SAAI,WAAU,aAAa,qBAAU;AAAA,OACxC;AAAA,KACF,GACF;AAEJ;","names":[]}

package/dist/chunk-PEWNWKDI.js

@@ -0,0 +1,91 @@
+// src/components/feedback/Modal/Modal.styles.ts
+import { alpha, keyframes } from "@mui/material/styles/index.js";
+var pulseAnimation = keyframes`
+  0% {
+    box-shadow: 0 0 0 0 currentColor;
+    opacity: 1;
+  }
+  70% {
+    box-shadow: 0 0 0 20px currentColor;
+    opacity: 0;
+  }
+  100% {
+    box-shadow: 0 0 0 0 currentColor;
+    opacity: 0;
+  }
+`;
+var RADII = {
+  none: () => 0,
+  sm: (theme) => theme.spacing(0.5),
+  md: (theme) => theme.spacing(1),
+  lg: (theme) => theme.spacing(2),
+  xl: (theme) => theme.spacing(3)
+};
+var WIDTHS = { xs: 320, sm: 480, md: 640, lg: 800, xl: 960 };
+var PLACEMENTS = {
+  top: { top: "10%", left: "50%", transform: "translateX(-50%)", maxHeight: "80vh" },
+  bottom: { bottom: "10%", left: "50%", transform: "translateX(-50%)", maxHeight: "80vh" },
+  center: {
+    top: "50%",
+    left: "50%",
+    transform: "translate(-50%, -50%)",
+    maxHeight: "90vh"
+  }
+};
+var pulseRing = (theme) => ({
+  content: '""',
+  position: "absolute",
+  top: 0,
+  left: 0,
+  right: 0,
+  bottom: 0,
+  borderRadius: "inherit",
+  backgroundColor: theme.palette.primary.main,
+  opacity: 0.3,
+  animation: `${pulseAnimation} 2s infinite`,
+  pointerEvents: "none",
+  zIndex: -1
+});
+var surface = (theme, flags) => {
+  const { variant, glass, gradient, glow } = flags;
+  const isGlass = glass || variant === "glass";
+  const boxShadow = glow ? `0 0 40px ${alpha(theme.palette.primary.main, 0.3)}` : isGlass ? `0 8px 32px ${alpha(theme.palette.common.black, 0.1)}` : theme.shadows[8];
+  return {
+    backgroundColor: isGlass ? alpha(theme.palette.background.paper, 0.1) : theme.palette.background.paper,
+    backdropFilter: isGlass ? "blur(20px)" : gradient ? "blur(10px)" : "none",
+    border: isGlass ? `1px solid ${alpha(theme.palette.primary.main, 0.2)}` : "none",
+    boxShadow,
+    ...gradient && {
+      background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.1)}, ${alpha(theme.palette.secondary.main, 0.1)})`
+    }
+  };
+};
+var panelSx = (theme, flags) => {
+  const { variant, size, borderRadius, pulse } = flags;
+  return {
+    // A pulsing panel positions its own ring, so it becomes the containing block.
+    position: pulse ? "relative" : "absolute",
+    width: WIDTHS[size] ?? WIDTHS.md,
+    maxWidth: "90vw",
+    borderRadius: (RADII[borderRadius] ?? RADII.lg)(theme),
+    outline: 0,
+    overflowY: "auto",
+    transition: theme.transitions.create(
+      ["box-shadow", "background-color", "backdrop-filter", "transform"],
+      { duration: theme.transitions.duration.standard }
+    ),
+    ...PLACEMENTS[variant] ?? PLACEMENTS.center,
+    ...surface(theme, flags),
+    ...pulse && { "&::after": pulseRing(theme) }
+  };
+};
+var backdropSx = (theme, isGlass) => ({
+  backgroundColor: alpha(theme.palette.common.black, isGlass ? 0.2 : 0.5),
+  backdropFilter: isGlass ? "blur(8px)" : "none"
+});
+
+export {
+  panelSx,
+  backdropSx
+};
+//# sourceMappingURL=chunk-PEWNWKDI.js.map

package/dist/chunk-PEWNWKDI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/feedback/Modal/Modal.styles.ts"],"sourcesContent":["import { alpha, keyframes } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nimport type { ModalProps } from './Modal.types';\n\ntype Variant = NonNullable<ModalProps['variant']>;\ntype Size = NonNullable<ModalProps['size']>;\ntype Radius = NonNullable<ModalProps['borderRadius']>;\n\nconst pulseAnimation = keyframes`\n  0% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 1;\n  }\n  70% {\n    box-shadow: 0 0 0 20px currentColor;\n    opacity: 0;\n  }\n  100% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 0;\n  }\n`;\n\nconst RADII: Record<Radius, (theme: Theme) => number | string> = {\n  none: () => 0,\n  sm: (theme) => theme.spacing(0.5),\n  md: (theme) => theme.spacing(1),\n  lg: (theme) => theme.spacing(2),\n  xl: (theme) => theme.spacing(3),\n};\n\n/** Every preset is capped at 90vw so the panel never overflows a small screen. */\nconst WIDTHS: Record<Size, number> = { xs: 320, sm: 480, md: 640, lg: 800, xl: 960 };\n\n/**\n * Where the panel sits. Top and bottom are the same layout anchored to opposite\n * edges; centre is the only one that offsets on both axes.\n */\nconst PLACEMENTS: Record<string, CSSObject> = {\n  top: { top: '10%', left: '50%', transform: 'translateX(-50%)', maxHeight: '80vh' },\n  bottom: { bottom: '10%', left: '50%', transform: 'translateX(-50%)', maxHeight: '80vh' },\n  center: {\n    top: '50%',\n    left: '50%',\n    transform: 'translate(-50%, -50%)',\n    maxHeight: '90vh',\n  },\n};\n\ninterface ModalStyleFlags {\n  variant: Variant;\n  size: Size;\n  borderRadius: Radius;\n  glass: boolean;\n  gradient: boolean;\n  glow: boolean;\n  pulse: boolean;\n}\n\n/** The ring that expands out of the panel while `pulse` is set. */\nconst pulseRing = (theme: Theme): CSSObject => ({\n  content: '\"\"',\n  position: 'absolute' as const,\n  top: 0,\n  left: 0,\n  right: 0,\n  bottom: 0,\n  borderRadius: 'inherit',\n  backgroundColor: theme.palette.primary.main,\n  opacity: 0.3,\n  animation: `${pulseAnimation} 2s infinite`,\n  pointerEvents: 'none' as const,\n  zIndex: -1,\n});\n\n/** The surface: its fill, its blur and the shadow that lifts it off the backdrop. */\nconst surface = (theme: Theme, flags: ModalStyleFlags): CSSObject => {\n  const { variant, glass, gradient, glow } = flags;\n  // The glass variant is the glass flag by another name, so either turns it on.\n  const isGlass = glass || variant === 'glass';\n\n  const boxShadow = glow\n    ? `0 0 40px ${alpha(theme.palette.primary.main, 0.3)}`\n    : isGlass\n      ? `0 8px 32px ${alpha(theme.palette.common.black, 0.1)}`\n      : theme.shadows[8];\n\n  return {\n    backgroundColor: isGlass\n      ? alpha(theme.palette.background.paper, 0.1)\n      : theme.palette.background.paper,\n    backdropFilter: isGlass ? 'blur(20px)' : gradient ? 'blur(10px)' : 'none',\n    border: isGlass ? `1px solid ${alpha(theme.palette.primary.main, 0.2)}` : 'none',\n    boxShadow,\n    ...(gradient && {\n      background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.1)}, ${alpha(theme.palette.secondary.main, 0.1)})`,\n    }),\n  };\n};\n\nexport const panelSx = (theme: Theme, flags: ModalStyleFlags): CSSObject => {\n  const { variant, size, borderRadius, pulse } = flags;\n\n  return {\n    // A pulsing panel positions its own ring, so it becomes the containing block.\n    position: pulse ? ('relative' as const) : ('absolute' as const),\n    width: WIDTHS[size] ?? WIDTHS.md,\n    maxWidth: '90vw',\n    borderRadius: (RADII[borderRadius] ?? RADII.lg)(theme),\n    outline: 0,\n    overflowY: 'auto',\n    transition: theme.transitions.create(\n      ['box-shadow', 'background-color', 'backdrop-filter', 'transform'],\n      { duration: theme.transitions.duration.standard },\n    ),\n    ...(PLACEMENTS[variant] ?? PLACEMENTS.center),\n    ...surface(theme, flags),\n    ...(pulse && { '&::after': pulseRing(theme) }),\n  };\n};\n\nexport const backdropSx = (theme: Theme, isGlass: boolean): CSSObject => ({\n  backgroundColor: alpha(theme.palette.common.black, isGlass ? 0.2 : 0.5),\n  backdropFilter: isGlass ? 'blur(8px)' : 'none',\n});\n"],"mappings":"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","names":[]}

package/dist/chunk-PKJKA4CU.js

@@ -0,0 +1,68 @@
+import {
+  ErrorState
+} from "./chunk-E67PUPFJ.js";
+import {
+  LoadingState
+} from "./chunk-O6J4CKS5.js";
+import {
+  EmptyState
+} from "./chunk-7M5BACFQ.js";
+
+// src/components/data-display/AsyncStateContainer/AsyncStateContainer.tsx
+import Box from "@mui/material/Box/index.js";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+var StateBox = ({ state, className, dataTestId, children }) => /* @__PURE__ */ jsx(
+  Box,
+  {
+    className,
+    "data-testid": dataTestId || "async-state-container",
+    "data-state": state,
+    children
+  }
+);
+var errorMessageOf = (error) => {
+  if (!error) return "";
+  if (typeof error === "string") return error;
+  if (error instanceof Error) return error.message;
+  return "An unexpected error occurred";
+};
+var pickNode = (node, render, fallback) => node || render?.() || fallback;
+var AsyncStateContainer = React.memo(
+  ({
+    isLoading = false,
+    error,
+    isEmpty = false,
+    children,
+    loadingComponent,
+    renderLoading,
+    errorComponent,
+    renderError,
+    emptyComponent,
+    emptyTitle,
+    renderEmpty,
+    className,
+    dataTestId
+  }) => {
+    const box = { className, dataTestId };
+    if (isLoading) {
+      return /* @__PURE__ */ jsx(StateBox, { state: "loading", ...box, children: pickNode(loadingComponent, renderLoading, /* @__PURE__ */ jsx(LoadingState, {})) });
+    }
+    if (error) {
+      const message = errorMessageOf(error);
+      return /* @__PURE__ */ jsx(StateBox, { state: "error", ...box, children: errorComponent || renderError?.(message) || /* @__PURE__ */ jsx(ErrorState, { message }) });
+    }
+    if (isEmpty) {
+      return /* @__PURE__ */ jsx(StateBox, { state: "empty", ...box, children: pickNode(emptyComponent, renderEmpty, /* @__PURE__ */ jsx(EmptyState, { title: emptyTitle })) });
+    }
+    return /* @__PURE__ */ jsx(StateBox, { state: "success", ...box, children });
+  }
+);
+AsyncStateContainer.displayName = "AsyncStateContainer";
+var AsyncStateContainer_default = AsyncStateContainer;
+
+export {
+  AsyncStateContainer,
+  AsyncStateContainer_default
+};
+//# sourceMappingURL=chunk-PKJKA4CU.js.map