@12-apps/ui 5.0.0 → 5.1.0

package/dist/layout/Accordion.js

@@ -0,0 +1,239 @@
+import "../chunk-PZ5AY32C.js";
+
+// src/components/layout/Accordion/Accordion.tsx
+import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
+import {
+  Accordion as MuiAccordion,
+  AccordionActions as MuiAccordionActions,
+  AccordionDetails as MuiAccordionDetails,
+  AccordionSummary as MuiAccordionSummary,
+  alpha as alpha2,
+  useTheme
+} from "@mui/material";
+import React from "react";
+
+// src/components/layout/Accordion/Accordion.styles.ts
+import { alpha } from "@mui/material";
+var BASE_TRANSITION = "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)";
+var accordionVariantStyles = (theme, variant) => {
+  switch (variant) {
+    case "glass":
+      return {
+        backgroundColor: alpha(theme.palette.background.paper, 0.08),
+        backdropFilter: "blur(24px) saturate(180%)",
+        border: `1px solid ${alpha(theme.palette.primary.main, 0.15)}`,
+        borderRadius: theme.spacing(1.5),
+        transition: BASE_TRANSITION,
+        "&:before": {
+          display: "none"
+        },
+        "&:hover": {
+          backgroundColor: alpha(theme.palette.background.paper, 0.12),
+          border: `1px solid ${alpha(theme.palette.primary.main, 0.25)}`,
+          transform: "translateY(-1px)",
+          boxShadow: `0 8px 32px ${alpha(theme.palette.primary.main, 0.12)}`
+        },
+        "&.Mui-expanded": {
+          backgroundColor: alpha(theme.palette.background.paper, 0.15),
+          border: `1px solid ${alpha(theme.palette.primary.main, 0.3)}`
+        }
+      };
+    case "bordered":
+      return {
+        border: `1px solid ${theme.palette.divider}`,
+        borderRadius: theme.spacing(1),
+        transition: BASE_TRANSITION,
+        "&:before": {
+          display: "none"
+        },
+        "&:not(:last-child)": {
+          marginBottom: theme.spacing(1)
+        },
+        "&:hover": {
+          borderColor: theme.palette.primary.main,
+          boxShadow: `0 0 0 1px ${alpha(theme.palette.primary.main, 0.1)}`
+        },
+        "&.Mui-expanded": {
+          borderColor: theme.palette.primary.main
+        }
+      };
+    case "separated":
+      return {
+        boxShadow: theme.shadows[2],
+        borderRadius: theme.spacing(1.5),
+        transition: BASE_TRANSITION,
+        "&:before": {
+          display: "none"
+        },
+        "&:not(:last-child)": {
+          marginBottom: theme.spacing(2)
+        },
+        "&:hover": {
+          boxShadow: theme.shadows[4],
+          transform: "translateY(-2px)"
+        },
+        "&.Mui-expanded": {
+          boxShadow: theme.shadows[6],
+          transform: "translateY(-1px)"
+        }
+      };
+    default:
+      return {
+        transition: BASE_TRANSITION,
+        "&:hover": {
+          backgroundColor: alpha(theme.palette.action.hover, 0.04)
+        }
+      };
+  }
+};
+
+// src/components/layout/Accordion/Accordion.tsx
+import { jsx } from "react/jsx-runtime";
+var Accordion = ({
+  children,
+  variant = "default",
+  disabled = false,
+  defaultExpanded = false,
+  expanded,
+  onChange,
+  sx,
+  "data-testid": testId = "accordion",
+  ...props
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    MuiAccordion,
+    {
+      disabled,
+      defaultExpanded,
+      expanded,
+      onChange,
+      "data-testid": testId,
+      sx: {
+        ...accordionVariantStyles(theme, variant),
+        ...sx
+      },
+      ...props,
+      children
+    }
+  );
+};
+var AccordionSummary = ({
+  children,
+  expandIcon = /* @__PURE__ */ jsx(ExpandMoreIcon, {}),
+  disabled = false,
+  "data-testid": testId = "accordion-summary",
+  ...props
+}) => {
+  const theme = useTheme();
+  const iconWithTestId = React.isValidElement(expandIcon) ? React.cloneElement(expandIcon, {
+    "data-testid": "accordion-icon"
+  }) : expandIcon;
+  return /* @__PURE__ */ jsx(
+    MuiAccordionSummary,
+    {
+      expandIcon: iconWithTestId,
+      disabled,
+      "data-testid": testId,
+      sx: {
+        minHeight: 56,
+        "& .MuiAccordionSummary-expandIconWrapper": {
+          transition: "transform 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
+          color: theme.palette.text.secondary
+        },
+        "& .MuiAccordionSummary-expandIconWrapper.Mui-expanded": {
+          transform: "rotate(180deg)",
+          color: theme.palette.primary.main
+        },
+        "&:hover": {
+          backgroundColor: alpha2(theme.palette.action.hover, 0.04),
+          "& .MuiAccordionSummary-expandIconWrapper": {
+            color: theme.palette.primary.main
+          }
+        },
+        "&.Mui-focusVisible": {
+          outline: `2px solid ${theme.palette.primary.main}`,
+          outlineOffset: 2
+        },
+        // Enhanced keyboard navigation styles
+        "&:focus-visible": {
+          outline: `2px solid ${theme.palette.primary.main}`,
+          outlineOffset: -2
+        }
+      },
+      ...props,
+      children
+    }
+  );
+};
+var AccordionDetails = ({
+  children,
+  "data-testid": testId = "accordion-details",
+  ...props
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    MuiAccordionDetails,
+    {
+      "data-testid": testId,
+      sx: {
+        paddingTop: theme.spacing(1),
+        paddingBottom: theme.spacing(2),
+        borderTop: `1px solid ${alpha2(theme.palette.divider, 0.08)}`,
+        // Smooth content reveal animation
+        "& > *": {
+          animation: "fadeInUp 0.4s ease-out"
+        },
+        "@keyframes fadeInUp": {
+          "0%": {
+            opacity: 0,
+            transform: "translateY(8px)"
+          },
+          "100%": {
+            opacity: 1,
+            transform: "translateY(0)"
+          }
+        }
+      },
+      ...props,
+      children
+    }
+  );
+};
+var AccordionActions = ({
+  children,
+  disableSpacing = false,
+  "data-testid": testId = "accordion-actions",
+  ...props
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    MuiAccordionActions,
+    {
+      disableSpacing,
+      "data-testid": testId,
+      sx: {
+        padding: theme.spacing(1, 2),
+        borderTop: `1px solid ${alpha2(theme.palette.divider, 0.08)}`,
+        backgroundColor: alpha2(theme.palette.background.paper, 0.5),
+        backdropFilter: "blur(8px)",
+        // Animate button entries
+        "& > *": {
+          transition: "all 0.2s ease-in-out",
+          "&:hover": {
+            transform: "translateY(-1px)"
+          }
+        }
+      },
+      ...props,
+      children
+    }
+  );
+};
+export {
+  Accordion,
+  AccordionActions,
+  AccordionDetails,
+  AccordionSummary
+};
+//# sourceMappingURL=Accordion.js.map

package/dist/layout/Accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/layout/Accordion/Accordion.tsx","../../src/components/layout/Accordion/Accordion.styles.ts"],"sourcesContent":["import ExpandMoreIcon from '@mui/icons-material/ExpandMore';\nimport { \n  Accordion as MuiAccordion,\n  AccordionActions as MuiAccordionActions,\n  AccordionDetails as MuiAccordionDetails,\n  AccordionSummary as MuiAccordionSummary,\n  alpha,\n  useTheme} from '@mui/material';\nimport React from 'react';\n\nimport { accordionVariantStyles } from './Accordion.styles';\nimport type { \n  AccordionActionsProps, \n  AccordionDetailsProps, \n  AccordionProps, \n  AccordionSummaryProps} from './Accordion.types';\n\nexport const Accordion: React.FC<AccordionProps> = ({\n  children,\n  variant = 'default',\n  disabled = false,\n  defaultExpanded = false,\n  expanded,\n  onChange,\n  sx,\n  'data-testid': testId = 'accordion',\n  ...props\n}) => {\n  const theme = useTheme();\n\n  return (\n    <MuiAccordion\n      disabled={disabled}\n      defaultExpanded={defaultExpanded}\n      expanded={expanded}\n      onChange={onChange}\n      data-testid={testId}\n      sx={{\n        ...accordionVariantStyles(theme, variant),\n        ...sx,\n      }}\n      {...props}\n    >\n      {children}\n    </MuiAccordion>\n  );\n};\n\nexport const AccordionSummary: React.FC<AccordionSummaryProps> = ({\n  children,\n  expandIcon = <ExpandMoreIcon />,\n  disabled = false,\n  'data-testid': testId = 'accordion-summary',\n  ...props\n}) => {\n  const theme = useTheme();\n\n  // Clone expandIcon to add data-testid if it's a valid React element\n  const iconWithTestId = React.isValidElement(expandIcon)\n    ? React.cloneElement(expandIcon as React.ReactElement<{ 'data-testid'?: string }>, {\n        'data-testid': 'accordion-icon',\n      })\n    : expandIcon;\n\n  return (\n    <MuiAccordionSummary\n      expandIcon={iconWithTestId}\n      disabled={disabled}\n      data-testid={testId}\n      sx={{\n        minHeight: 56,\n        '& .MuiAccordionSummary-expandIconWrapper': {\n          transition: 'transform 0.3s cubic-bezier(0.4, 0, 0.2, 1)',\n          color: theme.palette.text.secondary,\n        },\n        '& .MuiAccordionSummary-expandIconWrapper.Mui-expanded': {\n          transform: 'rotate(180deg)',\n          color: theme.palette.primary.main,\n        },\n        '&:hover': {\n          backgroundColor: alpha(theme.palette.action.hover, 0.04),\n          '& .MuiAccordionSummary-expandIconWrapper': {\n            color: theme.palette.primary.main,\n          },\n        },\n        '&.Mui-focusVisible': {\n          outline: `2px solid ${theme.palette.primary.main}`,\n          outlineOffset: 2,\n        },\n        // Enhanced keyboard navigation styles\n        '&:focus-visible': {\n          outline: `2px solid ${theme.palette.primary.main}`,\n          outlineOffset: -2,\n        },\n      }}\n      {...props}\n    >\n      {children}\n    </MuiAccordionSummary>\n  );\n};\n\nexport const AccordionDetails: React.FC<AccordionDetailsProps> = ({\n  children,\n  'data-testid': testId = 'accordion-details',\n  ...props\n}) => {\n  const theme = useTheme();\n\n  return (\n    <MuiAccordionDetails \n      data-testid={testId}\n      sx={{\n        paddingTop: theme.spacing(1),\n        paddingBottom: theme.spacing(2),\n        borderTop: `1px solid ${alpha(theme.palette.divider, 0.08)}`,\n        // Smooth content reveal animation\n        '& > *': {\n          animation: 'fadeInUp 0.4s ease-out',\n        },\n        '@keyframes fadeInUp': {\n          '0%': {\n            opacity: 0,\n            transform: 'translateY(8px)',\n          },\n          '100%': {\n            opacity: 1,\n            transform: 'translateY(0)',\n          },\n        },\n      }}\n      {...props}\n    >\n      {children}\n    </MuiAccordionDetails>\n  );\n};\n\nexport const AccordionActions: React.FC<AccordionActionsProps> = ({\n  children,\n  disableSpacing = false,\n  'data-testid': testId = 'accordion-actions',\n  ...props\n}) => {\n  const theme = useTheme();\n\n  return (\n    <MuiAccordionActions \n      disableSpacing={disableSpacing}\n      data-testid={testId}\n      sx={{\n        padding: theme.spacing(1, 2),\n        borderTop: `1px solid ${alpha(theme.palette.divider, 0.08)}`,\n        backgroundColor: alpha(theme.palette.background.paper, 0.5),\n        backdropFilter: 'blur(8px)',\n        // Animate button entries\n        '& > *': {\n          transition: 'all 0.2s ease-in-out',\n          '&:hover': {\n            transform: 'translateY(-1px)',\n          },\n        },\n      }}\n      {...props}\n    >\n      {children}\n    </MuiAccordionActions>\n  );\n};","import { alpha } from '@mui/material';\nimport type { Theme } from '@mui/material';\n\nimport type { AccordionVariant } from './Accordion.types';\n\nconst BASE_TRANSITION = 'all 0.3s cubic-bezier(0.4, 0, 0.2, 1)';\n\n// Deliberately unannotated: the inferred union of literals assigns to MUI's\n// `sx`, whereas a `CSSObject` return type does not survive being spread into it.\nexport const accordionVariantStyles = (theme: Theme, variant: AccordionVariant) => {\n  switch (variant) {\n    case 'glass':\n      return {\n        backgroundColor: alpha(theme.palette.background.paper, 0.08),\n        backdropFilter: 'blur(24px) saturate(180%)',\n        border: `1px solid ${alpha(theme.palette.primary.main, 0.15)}`,\n        borderRadius: theme.spacing(1.5),\n        transition: BASE_TRANSITION,\n        '&:before': {\n          display: 'none',\n        },\n        '&:hover': {\n          backgroundColor: alpha(theme.palette.background.paper, 0.12),\n          border: `1px solid ${alpha(theme.palette.primary.main, 0.25)}`,\n          transform: 'translateY(-1px)',\n          boxShadow: `0 8px 32px ${alpha(theme.palette.primary.main, 0.12)}`,\n        },\n        '&.Mui-expanded': {\n          backgroundColor: alpha(theme.palette.background.paper, 0.15),\n          border: `1px solid ${alpha(theme.palette.primary.main, 0.3)}`,\n        },\n      };\n    case 'bordered':\n      return {\n        border: `1px solid ${theme.palette.divider}`,\n        borderRadius: theme.spacing(1),\n        transition: BASE_TRANSITION,\n        '&:before': {\n          display: 'none',\n        },\n        '&:not(:last-child)': {\n          marginBottom: theme.spacing(1),\n        },\n        '&:hover': {\n          borderColor: theme.palette.primary.main,\n          boxShadow: `0 0 0 1px ${alpha(theme.palette.primary.main, 0.1)}`,\n        },\n        '&.Mui-expanded': {\n          borderColor: theme.palette.primary.main,\n        },\n      };\n    case 'separated':\n      return {\n        boxShadow: theme.shadows[2],\n        borderRadius: theme.spacing(1.5),\n        transition: BASE_TRANSITION,\n        '&:before': {\n          display: 'none',\n        },\n        '&:not(:last-child)': {\n          marginBottom: theme.spacing(2),\n        },\n        '&:hover': {\n          boxShadow: theme.shadows[4],\n          transform: 'translateY(-2px)',\n        },\n        '&.Mui-expanded': {\n          boxShadow: theme.shadows[6],\n          transform: 'translateY(-1px)',\n        },\n      };\n    default:\n      return {\n        transition: BASE_TRANSITION,\n        '&:hover': {\n          backgroundColor: alpha(theme.palette.action.hover, 0.04),\n        },\n      };\n  }\n};\n"],"mappings":";;;AAAA,OAAO,oBAAoB;AAC3B;AAAA,EACE,aAAa;AAAA,EACb,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,oBAAoB;AAAA,EACpB,SAAAA;AAAA,EACA;AAAA,OAAe;AACjB,OAAO,WAAW;;;ACRlB,SAAS,aAAa;AAKtB,IAAM,kBAAkB;AAIjB,IAAM,yBAAyB,CAAC,OAAc,YAA8B;AACjF,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO;AAAA,QACL,iBAAiB,MAAM,MAAM,QAAQ,WAAW,OAAO,IAAI;AAAA,QAC3D,gBAAgB;AAAA,QAChB,QAAQ,aAAa,MAAM,MAAM,QAAQ,QAAQ,MAAM,IAAI,CAAC;AAAA,QAC5D,cAAc,MAAM,QAAQ,GAAG;AAAA,QAC/B,YAAY;AAAA,QACZ,YAAY;AAAA,UACV,SAAS;AAAA,QACX;AAAA,QACA,WAAW;AAAA,UACT,iBAAiB,MAAM,MAAM,QAAQ,WAAW,OAAO,IAAI;AAAA,UAC3D,QAAQ,aAAa,MAAM,MAAM,QAAQ,QAAQ,MAAM,IAAI,CAAC;AAAA,UAC5D,WAAW;AAAA,UACX,WAAW,cAAc,MAAM,MAAM,QAAQ,QAAQ,MAAM,IAAI,CAAC;AAAA,QAClE;AAAA,QACA,kBAAkB;AAAA,UAChB,iBAAiB,MAAM,MAAM,QAAQ,WAAW,OAAO,IAAI;AAAA,UAC3D,QAAQ,aAAa,MAAM,MAAM,QAAQ,QAAQ,MAAM,GAAG,CAAC;AAAA,QAC7D;AAAA,MACF;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,QAAQ,aAAa,MAAM,QAAQ,OAAO;AAAA,QAC1C,cAAc,MAAM,QAAQ,CAAC;AAAA,QAC7B,YAAY;AAAA,QACZ,YAAY;AAAA,UACV,SAAS;AAAA,QACX;AAAA,QACA,sBAAsB;AAAA,UACpB,cAAc,MAAM,QAAQ,CAAC;AAAA,QAC/B;AAAA,QACA,WAAW;AAAA,UACT,aAAa,MAAM,QAAQ,QAAQ;AAAA,UACnC,WAAW,aAAa,MAAM,MAAM,QAAQ,QAAQ,MAAM,GAAG,CAAC;AAAA,QAChE;AAAA,QACA,kBAAkB;AAAA,UAChB,aAAa,MAAM,QAAQ,QAAQ;AAAA,QACrC;AAAA,MACF;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,WAAW,MAAM,QAAQ,CAAC;AAAA,QAC1B,cAAc,MAAM,QAAQ,GAAG;AAAA,QAC/B,YAAY;AAAA,QACZ,YAAY;AAAA,UACV,SAAS;AAAA,QACX;AAAA,QACA,sBAAsB;AAAA,UACpB,cAAc,MAAM,QAAQ,CAAC;AAAA,QAC/B;AAAA,QACA,WAAW;AAAA,UACT,WAAW,MAAM,QAAQ,CAAC;AAAA,UAC1B,WAAW;AAAA,QACb;AAAA,QACA,kBAAkB;AAAA,UAChB,WAAW,MAAM,QAAQ,CAAC;AAAA,UAC1B,WAAW;AAAA,QACb;AAAA,MACF;AAAA,IACF;AACE,aAAO;AAAA,QACL,YAAY;AAAA,QACZ,WAAW;AAAA,UACT,iBAAiB,MAAM,MAAM,QAAQ,OAAO,OAAO,IAAI;AAAA,QACzD;AAAA,MACF;AAAA,EACJ;AACF;;;ADhDI;AAdG,IAAM,YAAsC,CAAC;AAAA,EAClD;AAAA,EACA,UAAU;AAAA,EACV,WAAW;AAAA,EACX,kBAAkB;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe,SAAS;AAAA,EACxB,GAAG;AACL,MAAM;AACJ,QAAM,QAAQ,SAAS;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAa;AAAA,MACb,IAAI;AAAA,QACF,GAAG,uBAAuB,OAAO,OAAO;AAAA,QACxC,GAAG;AAAA,MACL;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;AAEO,IAAM,mBAAoD,CAAC;AAAA,EAChE;AAAA,EACA,aAAa,oBAAC,kBAAe;AAAA,EAC7B,WAAW;AAAA,EACX,eAAe,SAAS;AAAA,EACxB,GAAG;AACL,MAAM;AACJ,QAAM,QAAQ,SAAS;AAGvB,QAAM,iBAAiB,MAAM,eAAe,UAAU,IAClD,MAAM,aAAa,YAA8D;AAAA,IAC/E,eAAe;AAAA,EACjB,CAAC,IACD;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,YAAY;AAAA,MACZ;AAAA,MACA,eAAa;AAAA,MACb,IAAI;AAAA,QACF,WAAW;AAAA,QACX,4CAA4C;AAAA,UAC1C,YAAY;AAAA,UACZ,OAAO,MAAM,QAAQ,KAAK;AAAA,QAC5B;AAAA,QACA,yDAAyD;AAAA,UACvD,WAAW;AAAA,UACX,OAAO,MAAM,QAAQ,QAAQ;AAAA,QAC/B;AAAA,QACA,WAAW;AAAA,UACT,iBAAiBC,OAAM,MAAM,QAAQ,OAAO,OAAO,IAAI;AAAA,UACvD,4CAA4C;AAAA,YAC1C,OAAO,MAAM,QAAQ,QAAQ;AAAA,UAC/B;AAAA,QACF;AAAA,QACA,sBAAsB;AAAA,UACpB,SAAS,aAAa,MAAM,QAAQ,QAAQ,IAAI;AAAA,UAChD,eAAe;AAAA,QACjB;AAAA;AAAA,QAEA,mBAAmB;AAAA,UACjB,SAAS,aAAa,MAAM,QAAQ,QAAQ,IAAI;AAAA,UAChD,eAAe;AAAA,QACjB;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;AAEO,IAAM,mBAAoD,CAAC;AAAA,EAChE;AAAA,EACA,eAAe,SAAS;AAAA,EACxB,GAAG;AACL,MAAM;AACJ,QAAM,QAAQ,SAAS;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa;AAAA,MACb,IAAI;AAAA,QACF,YAAY,MAAM,QAAQ,CAAC;AAAA,QAC3B,eAAe,MAAM,QAAQ,CAAC;AAAA,QAC9B,WAAW,aAAaA,OAAM,MAAM,QAAQ,SAAS,IAAI,CAAC;AAAA;AAAA,QAE1D,SAAS;AAAA,UACP,WAAW;AAAA,QACb;AAAA,QACA,uBAAuB;AAAA,UACrB,MAAM;AAAA,YACJ,SAAS;AAAA,YACT,WAAW;AAAA,UACb;AAAA,UACA,QAAQ;AAAA,YACN,SAAS;AAAA,YACT,WAAW;AAAA,UACb;AAAA,QACF;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;AAEO,IAAM,mBAAoD,CAAC;AAAA,EAChE;AAAA,EACA,iBAAiB;AAAA,EACjB,eAAe,SAAS;AAAA,EACxB,GAAG;AACL,MAAM;AACJ,QAAM,QAAQ,SAAS;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,eAAa;AAAA,MACb,IAAI;AAAA,QACF,SAAS,MAAM,QAAQ,GAAG,CAAC;AAAA,QAC3B,WAAW,aAAaA,OAAM,MAAM,QAAQ,SAAS,IAAI,CAAC;AAAA,QAC1D,iBAAiBA,OAAM,MAAM,QAAQ,WAAW,OAAO,GAAG;AAAA,QAC1D,gBAAgB;AAAA;AAAA,QAEhB,SAAS;AAAA,UACP,YAAY;AAAA,UACZ,WAAW;AAAA,YACT,WAAW;AAAA,UACb;AAAA,QACF;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;","names":["alpha","alpha"]}

package/dist/layout/Card.js

@@ -0,0 +1,16 @@
+import {
+  Card,
+  CardActions,
+  CardContent,
+  CardHeader,
+  CardMedia
+} from "../chunk-ILXGVET4.js";
+import "../chunk-PZ5AY32C.js";
+export {
+  Card,
+  CardActions,
+  CardContent,
+  CardHeader,
+  CardMedia
+};
+//# sourceMappingURL=Card.js.map

package/dist/layout/Card.js.map

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

package/dist/layout/CardGrid.js

@@ -0,0 +1,52 @@
+import {
+  cn
+} from "../chunk-S3H5DVFY.js";
+import "../chunk-PZ5AY32C.js";
+
+// src/components/layout/CardGrid/CardGrid.tsx
+import { Children } from "react";
+import { jsx } from "react/jsx-runtime";
+var GRID_GAP = 16;
+var SCROLL_VISIBLE_CARDS = 2;
+var SCROLL_PEEK_WIDTH = 28;
+function scrollTrackWidth(count, max) {
+  const tracks = Math.max(1, Math.min(count, SCROLL_VISIBLE_CARDS));
+  const overflows = count > tracks;
+  const gaps = overflows ? tracks : tracks - 1;
+  const reserved = gaps * GRID_GAP + (overflows ? SCROLL_PEEK_WIDTH : 0);
+  return `min(${max}px, calc((100% - ${reserved}px) / ${tracks}))`;
+}
+function CardGrid({
+  cardWidth,
+  maxCardWidth,
+  variant = "fixed",
+  className,
+  gridTestId,
+  containerRef,
+  children
+}) {
+  const style = {
+    display: "grid",
+    gap: "1rem",
+    paddingBottom: "2px"
+  };
+  if (variant === "scroll") {
+    const max = maxCardWidth ?? Math.round(cardWidth * 1.6);
+    style.gridAutoFlow = "column";
+    style.gridAutoColumns = scrollTrackWidth(Children.count(children), max);
+    style.overflowX = "auto";
+    style.overflowY = "hidden";
+    style.scrollSnapType = "x mandatory";
+  } else if (variant === "fluid") {
+    style.gridTemplateColumns = `repeat(auto-fill, minmax(${cardWidth}px, 1fr))`;
+  } else {
+    style.gridTemplateColumns = `repeat(auto-fill, ${cardWidth}px)`;
+    style.justifyContent = "space-around";
+  }
+  const content = variant === "scroll" ? Children.map(children, (child) => /* @__PURE__ */ jsx("div", { style: { scrollSnapAlign: "start" }, children: child })) : children;
+  return /* @__PURE__ */ jsx("div", { ref: containerRef, className: cn(className), style, "data-testid": gridTestId, children: content });
+}
+export {
+  CardGrid
+};
+//# sourceMappingURL=CardGrid.js.map

package/dist/layout/CardGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/layout/CardGrid/CardGrid.tsx"],"sourcesContent":["import { Children, type CSSProperties, type ReactNode, type Ref } from \"react\";\n\nimport { cn } from \"../../../utils/cn\";\n\n/**\n * How the grid turns surplus row space into layout:\n *\n * - `\"fixed\"` — every column is exactly `cardWidth` px; leftover row space is\n *   spread as even gutters (`justify-content: space-around`). Cards never resize;\n *   the column count changes with the viewport. This is the original tabwoah\n *   card-grid behavior.\n * - `\"fluid\"` — every column is *at least* `cardWidth` px and stretches (`1fr`)\n *   to fill the row, so cards grow to use the whole width. A lone card stays\n *   left-aligned at a single track's width rather than stretching edge to edge.\n * - `\"scroll\"` — a single row that scrolls horizontally, with fluid-width cards\n *   sized from the container so that exactly {@link SCROLL_VISIBLE_CARDS} cards\n *   plus a {@link SCROLL_PEEK_WIDTH}px sliver of the next one fit on screen (up\n *   to `maxCardWidth`, past which more cards simply fit). The sliver is the\n *   point: it makes the rail visibly continue past the fold, so the row reads as\n *   swipeable instead of as a finished pair of cards. Wrapping is off; the row\n *   overflows on the x and scroll-snaps to each card's start so a swipe lands on\n *   a clean card boundary.\n */\nexport type CardGridVariant = \"fixed\" | \"fluid\" | \"scroll\";\n\n/** The grid gap, in px — mirrors the `gap: 1rem` below, for the scroll math. */\nconst GRID_GAP = 16;\n\n/** `scroll`: how many WHOLE cards the rail commits to showing at once. */\nconst SCROLL_VISIBLE_CARDS = 2;\n\n/**\n * `scroll`: px of the next card left visible past the last whole one — the\n * \"there's more, swipe\" hint. Wide enough to read as a clipped card (rounded\n * edge + a slice of its photo) rather than as a rendering glitch.\n */\nconst SCROLL_PEEK_WIDTH = 28;\n\n/**\n * The `scroll` track width: the widest a card can be while the container still\n * shows `SCROLL_VISIBLE_CARDS` of them plus the peek — or, when there is nothing\n * to scroll to, while the cards still divide the row evenly. Capped at `max` so\n * a desktop-width rail packs in more cards instead of inflating them.\n *\n * The container (`100%`) has to cover, in the overflow case: N cards, the N gaps\n * that follow them (one between each pair, one before the peeked card), and the\n * peek. With no overflow there are only N-1 gaps and no peek.\n */\nfunction scrollTrackWidth(count: number, max: number): string {\n  const tracks = Math.max(1, Math.min(count, SCROLL_VISIBLE_CARDS));\n  const overflows = count > tracks;\n  const gaps = overflows ? tracks : tracks - 1;\n  const reserved = gaps * GRID_GAP + (overflows ? SCROLL_PEEK_WIDTH : 0);\n  return `min(${max}px, calc((100% - ${reserved}px) / ${tracks}))`;\n}\n\ninterface CardGridProps {\n  /**\n   * `\"fixed\"`: the exact column width in px. `\"fluid\"`: the minimum column width\n   * (columns grow from here). `\"scroll\"`: only seeds the default `maxCardWidth`\n   * — a scroll track has no minimum, because a minimum is exactly what would\n   * break the \"two cards plus a peek\" promise on a narrow phone.\n   */\n  cardWidth: number;\n  /**\n   * `\"scroll\"` only: the maximum fluid card width in px. Defaults to\n   * `1.6 × cardWidth`.\n   */\n  maxCardWidth?: number;\n  /** Layout behavior — see {@link CardGridVariant}. Defaults to `\"fixed\"`. */\n  variant?: CardGridVariant;\n  /** Additional classes appended to the default grid container */\n  className?: string;\n  /** `data-testid` for the grid container */\n  gridTestId?: string;\n  /** Ref forwarded to the grid container (used by `useMaxRowsHeight` clipping). */\n  containerRef?: Ref<HTMLDivElement>;\n  children: ReactNode;\n}\n\n/**\n * Shared grid container for card layouts. Renders responsive columns via CSS\n * grid, in one of three variants (see {@link CardGridVariant}).\n *\n * Ported from the tabwoah card grid (the `\"fixed\"` variant is verbatim). The one\n * adaptation: that app is Tailwind (`className=\"grid gap-4 pb-0.5\"`); this one\n * has no Tailwind, so those three utilities (display:grid, gap 1rem,\n * padding-bottom 2px) live in `style`.\n */\nexport function CardGrid({\n  cardWidth,\n  maxCardWidth,\n  variant = \"fixed\",\n  className,\n  gridTestId,\n  containerRef,\n  children,\n}: CardGridProps) {\n  const style: CSSProperties = {\n    display: \"grid\",\n    gap: \"1rem\",\n    paddingBottom: \"2px\",\n  };\n\n  if (variant === \"scroll\") {\n    const max = maxCardWidth ?? Math.round(cardWidth * 1.6);\n    // One row, laid out as implicit columns, that scrolls sideways. Each column\n    // is derived from the container so two whole cards plus a peek of the third\n    // always fit (see `scrollTrackWidth`). Scroll-snap makes a swipe settle on a\n    // card boundary instead of drifting mid-card.\n    style.gridAutoFlow = \"column\";\n    style.gridAutoColumns = scrollTrackWidth(Children.count(children), max);\n    style.overflowX = \"auto\";\n    style.overflowY = \"hidden\";\n    style.scrollSnapType = \"x mandatory\";\n  } else if (variant === \"fluid\") {\n    style.gridTemplateColumns = `repeat(auto-fill, minmax(${cardWidth}px, 1fr))`;\n  } else {\n    style.gridTemplateColumns = `repeat(auto-fill, ${cardWidth}px)`;\n    // `space-around` only distributes leftover width in the fixed variant; the\n    // fluid variant consumes it via `1fr` and scroll overflows instead.\n    style.justifyContent = \"space-around\";\n  }\n\n  // In the scroll variant each card is a snap target, so a swipe aligns to its\n  // start. The snap-align sits on a wrapper (the grid item) so callers' children\n  // stay untouched; the other variants render children directly.\n  const content =\n    variant === \"scroll\"\n      ? Children.map(children, (child) => (\n          <div style={{ scrollSnapAlign: \"start\" }}>{child}</div>\n        ))\n      : children;\n\n  return (\n    <div ref={containerRef} className={cn(className)} style={style} data-testid={gridTestId}>\n      {content}\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAAA,SAAS,gBAA8D;AAkI7D;AAxGV,IAAM,WAAW;AAGjB,IAAM,uBAAuB;AAO7B,IAAM,oBAAoB;AAY1B,SAAS,iBAAiB,OAAe,KAAqB;AAC5D,QAAM,SAAS,KAAK,IAAI,GAAG,KAAK,IAAI,OAAO,oBAAoB,CAAC;AAChE,QAAM,YAAY,QAAQ;AAC1B,QAAM,OAAO,YAAY,SAAS,SAAS;AAC3C,QAAM,WAAW,OAAO,YAAY,YAAY,oBAAoB;AACpE,SAAO,OAAO,GAAG,oBAAoB,QAAQ,SAAS,MAAM;AAC9D;AAmCO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAkB;AAChB,QAAM,QAAuB;AAAA,IAC3B,SAAS;AAAA,IACT,KAAK;AAAA,IACL,eAAe;AAAA,EACjB;AAEA,MAAI,YAAY,UAAU;AACxB,UAAM,MAAM,gBAAgB,KAAK,MAAM,YAAY,GAAG;AAKtD,UAAM,eAAe;AACrB,UAAM,kBAAkB,iBAAiB,SAAS,MAAM,QAAQ,GAAG,GAAG;AACtE,UAAM,YAAY;AAClB,UAAM,YAAY;AAClB,UAAM,iBAAiB;AAAA,EACzB,WAAW,YAAY,SAAS;AAC9B,UAAM,sBAAsB,4BAA4B,SAAS;AAAA,EACnE,OAAO;AACL,UAAM,sBAAsB,qBAAqB,SAAS;AAG1D,UAAM,iBAAiB;AAAA,EACzB;AAKA,QAAM,UACJ,YAAY,WACR,SAAS,IAAI,UAAU,CAAC,UACtB,oBAAC,SAAI,OAAO,EAAE,iBAAiB,QAAQ,GAAI,iBAAM,CAClD,IACD;AAEN,SACE,oBAAC,SAAI,KAAK,cAAc,WAAW,GAAG,SAAS,GAAG,OAAc,eAAa,YAC1E,mBACH;AAEJ;","names":[]}

package/dist/layout/Collapsible.js

@@ -0,0 +1,218 @@
+import "../chunk-PZ5AY32C.js";
+
+// src/components/layout/Collapsible/Collapsible.tsx
+import { Box, Collapse, useTheme } from "@mui/material";
+import { useCallback, useEffect, useRef, useState } from "react";
+
+// src/components/layout/Collapsible/Collapsible.helpers.ts
+var transitionSettings = (theme, variant, duration, easing) => {
+  if (variant === "spring") {
+    return {
+      duration: duration * 1.2,
+      easing: easing || "cubic-bezier(0.34, 1.56, 0.64, 1)"
+    };
+  }
+  return { duration, easing: easing || theme.transitions.easing.easeInOut };
+};
+var regionAttrs = ({ open, disabled, dataTestId }) => ({
+  "data-disabled": disabled,
+  "data-testid": dataTestId,
+  role: "region",
+  "aria-expanded": open && !disabled,
+  "aria-hidden": disabled || !open
+});
+var dimmedStyles = (disabled) => ({
+  opacity: disabled ? 0.6 : 1,
+  pointerEvents: disabled ? "none" : "auto"
+});
+var triggerStyles = (theme, { disabled, expanded }) => {
+  const restingBackground = expanded ? theme.palette.action.selected : "transparent";
+  return {
+    width: "100%",
+    padding: theme.spacing(1, 2),
+    border: "none",
+    backgroundColor: restingBackground,
+    cursor: disabled ? "not-allowed" : "pointer",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    transition: theme.transitions.create(["background-color", "opacity"], {
+      duration: theme.transitions.duration.short
+    }),
+    opacity: disabled ? 0.6 : 1,
+    "&:hover": {
+      backgroundColor: disabled ? "transparent" : expanded ? theme.palette.action.selected : theme.palette.action.hover
+    },
+    "&:focus": {
+      outline: `2px solid ${theme.palette.primary.main}`,
+      outlineOffset: 2
+    },
+    "&:active": {
+      backgroundColor: disabled ? "transparent" : theme.palette.action.focus
+    }
+  };
+};
+
+// src/components/layout/Collapsible/Collapsible.tsx
+import { jsx } from "react/jsx-runtime";
+var useMeasuredHeight = (open, maxHeight, children) => {
+  const contentRef = useRef(null);
+  const [height, setHeight] = useState("auto");
+  const measureHeight = useCallback(() => {
+    if (contentRef.current) {
+      const scrollHeight = contentRef.current.scrollHeight;
+      setHeight(maxHeight ? Math.min(scrollHeight, maxHeight) : scrollHeight);
+    }
+  }, [maxHeight]);
+  useEffect(() => {
+    if (!open) {
+      setHeight(0);
+    } else if (contentRef.current) {
+      measureHeight();
+    }
+  }, [open, measureHeight, children]);
+  return { contentRef, height };
+};
+var DefaultCollapsible = ({
+  children,
+  open,
+  duration,
+  disabled,
+  keepMounted,
+  maxHeight,
+  sx,
+  className,
+  dataTestId,
+  transition: _transition,
+  easing: _easing,
+  ...otherProps
+}) => /* @__PURE__ */ jsx(
+  Collapse,
+  {
+    in: open && !disabled,
+    timeout: disabled ? 0 : duration,
+    sx: {
+      ...dimmedStyles(disabled),
+      ...maxHeight && { maxHeight, overflow: "hidden" },
+      ...sx
+    },
+    className,
+    unmountOnExit: !keepMounted,
+    ...regionAttrs({ open, disabled, dataTestId }),
+    ...otherProps,
+    children: /* @__PURE__ */ jsx(Box, { children })
+  }
+);
+var AnimatedCollapsible = ({
+  children,
+  open,
+  disabled,
+  keepMounted,
+  maxHeight,
+  transition,
+  sx,
+  className,
+  dataTestId,
+  duration: _duration,
+  easing: _easing,
+  ...otherProps
+}) => {
+  const { contentRef, height } = useMeasuredHeight(open, maxHeight, children);
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      component: "div",
+      sx: {
+        overflow: "hidden",
+        height: open && !disabled ? height : 0,
+        transition: disabled ? "none" : `height ${transition.duration}ms ${transition.easing}`,
+        willChange: disabled ? "auto" : "height",
+        ...dimmedStyles(disabled),
+        ...sx
+      },
+      className,
+      ...regionAttrs({ open, disabled, dataTestId }),
+      ...otherProps,
+      children: /* @__PURE__ */ jsx(Box, { ref: contentRef, children: (keepMounted || open && !disabled) && children })
+    }
+  );
+};
+var Collapsible = ({
+  variant = "default",
+  duration = 300,
+  easing,
+  onToggle,
+  disabled = false,
+  keepMounted = false,
+  ...rest
+}) => {
+  const theme = useTheme();
+  const { open } = rest;
+  useEffect(() => {
+    if (onToggle && !disabled) {
+      onToggle(open);
+    }
+  }, [open, onToggle, disabled]);
+  const variantProps = {
+    ...rest,
+    duration,
+    easing,
+    disabled,
+    keepMounted,
+    transition: transitionSettings(theme, variant, duration, easing)
+  };
+  return variant === "default" ? /* @__PURE__ */ jsx(DefaultCollapsible, { ...variantProps }) : /* @__PURE__ */ jsx(AnimatedCollapsible, { ...variantProps });
+};
+var CollapsibleTrigger = ({
+  children,
+  onClick,
+  disabled = false,
+  expanded = false,
+  className,
+  dataTestId,
+  ...otherProps
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      component: "button",
+      onClick: disabled ? void 0 : onClick,
+      disabled,
+      className,
+      "data-testid": dataTestId,
+      "aria-expanded": expanded,
+      "aria-disabled": disabled,
+      role: "button",
+      tabIndex: disabled ? -1 : 0,
+      "data-state": expanded ? "open" : "closed",
+      sx: triggerStyles(theme, { disabled, expanded }),
+      ...otherProps,
+      children
+    }
+  );
+};
+var CollapsibleContent = ({
+  children,
+  className,
+  ...otherProps
+}) => {
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      className,
+      sx: {
+        padding: theme.spacing(2)
+      },
+      ...otherProps,
+      children
+    }
+  );
+};
+export {
+  Collapsible,
+  CollapsibleContent,
+  CollapsibleTrigger
+};
+//# sourceMappingURL=Collapsible.js.map

package/dist/layout/Collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/layout/Collapsible/Collapsible.tsx","../../src/components/layout/Collapsible/Collapsible.helpers.ts"],"sourcesContent":["import { Box, Collapse,useTheme } from '@mui/material';\nimport React, { useCallback,useEffect, useRef, useState } from 'react';\n\nimport {\n  dimmedStyles,\n  regionAttrs,\n  transitionSettings,\n  triggerStyles,\n} from './Collapsible.helpers';\nimport type { CollapsibleContentProps,CollapsibleProps, CollapsibleTriggerProps } from './Collapsible.types';\n\n/**\n * The smooth and spring variants animate an explicit pixel height, so the content\n * has to be measured after every render that could have changed it.\n */\nconst useMeasuredHeight = (\n  open: boolean,\n  maxHeight: number | undefined,\n  children: React.ReactNode,\n) => {\n  const contentRef = useRef<HTMLDivElement>(null);\n  const [height, setHeight] = useState<number | 'auto'>('auto');\n\n  const measureHeight = useCallback(() => {\n    if (contentRef.current) {\n      const scrollHeight = contentRef.current.scrollHeight;\n      // Cap at maxHeight if provided\n      setHeight(maxHeight ? Math.min(scrollHeight, maxHeight) : scrollHeight);\n    }\n  }, [maxHeight]);\n\n  useEffect(() => {\n    if (!open) {\n      setHeight(0);\n    } else if (contentRef.current) {\n      measureHeight();\n    }\n  }, [open, measureHeight, children]);\n\n  return { contentRef, height };\n};\n\ntype VariantProps = Omit<CollapsibleProps, 'variant' | 'onToggle'> & {\n  duration: number;\n  disabled: boolean;\n  keepMounted: boolean;\n  transition: { duration: number; easing: string };\n};\n\n// Use MUI's built-in Collapse for the default variant.\nconst DefaultCollapsible: React.FC<VariantProps> = ({\n  children,\n  open,\n  duration,\n  disabled,\n  keepMounted,\n  maxHeight,\n  sx,\n  className,\n  dataTestId,\n  transition: _transition,\n  easing: _easing,\n  ...otherProps\n}) => (\n  <Collapse\n    in={open && !disabled}\n    timeout={disabled ? 0 : duration}\n    sx={{\n      ...dimmedStyles(disabled),\n      ...(maxHeight && { maxHeight, overflow: 'hidden' }),\n      ...sx,\n    }}\n    className={className}\n    unmountOnExit={!keepMounted}\n    {...regionAttrs({ open, disabled, dataTestId })}\n    {...otherProps}\n  >\n    <Box>{children}</Box>\n  </Collapse>\n);\n\nconst AnimatedCollapsible: React.FC<VariantProps> = ({\n  children,\n  open,\n  disabled,\n  keepMounted,\n  maxHeight,\n  transition,\n  sx,\n  className,\n  dataTestId,\n  duration: _duration,\n  easing: _easing,\n  ...otherProps\n}) => {\n  const { contentRef, height } = useMeasuredHeight(open, maxHeight, children);\n\n  return (\n    <Box\n      component=\"div\"\n      sx={{\n        overflow: 'hidden',\n        height: open && !disabled ? height : 0,\n        transition: disabled ? 'none' : `height ${transition.duration}ms ${transition.easing}`,\n        willChange: disabled ? 'auto' : 'height',\n        ...dimmedStyles(disabled),\n        ...sx,\n      }}\n      className={className}\n      {...regionAttrs({ open, disabled, dataTestId })}\n      {...otherProps}\n    >\n      <Box ref={contentRef}>{(keepMounted || (open && !disabled)) && children}</Box>\n    </Box>\n  );\n};\n\nexport const Collapsible: React.FC<CollapsibleProps> = ({\n  variant = 'default',\n  duration = 300,\n  easing,\n  onToggle,\n  disabled = false,\n  keepMounted = false,\n  ...rest\n}) => {\n  const theme = useTheme();\n  const { open } = rest;\n\n  // Trigger onToggle callback when open state changes\n  useEffect(() => {\n    if (onToggle && !disabled) {\n      onToggle(open);\n    }\n  }, [open, onToggle, disabled]);\n\n  const variantProps: VariantProps = {\n    ...rest,\n    duration,\n    easing,\n    disabled,\n    keepMounted,\n    transition: transitionSettings(theme, variant, duration, easing),\n  };\n\n  return variant === 'default' ? (\n    <DefaultCollapsible {...variantProps} />\n  ) : (\n    <AnimatedCollapsible {...variantProps} />\n  );\n};\n\nexport const CollapsibleTrigger: React.FC<CollapsibleTriggerProps> = ({\n  children,\n  onClick,\n  disabled = false,\n  expanded = false,\n  className,\n  dataTestId,\n  ...otherProps\n}) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      component=\"button\"\n      onClick={disabled ? undefined : onClick}\n      disabled={disabled}\n      className={className}\n      data-testid={dataTestId}\n      aria-expanded={expanded}\n      aria-disabled={disabled}\n      role=\"button\"\n      tabIndex={disabled ? -1 : 0}\n      data-state={expanded ? 'open' : 'closed'}\n      sx={triggerStyles(theme, { disabled, expanded })}\n      {...otherProps}\n    >\n      {children}\n    </Box>\n  );\n};\n\nexport const CollapsibleContent: React.FC<CollapsibleContentProps> = ({\n  children,\n  className,\n  ...otherProps\n}) => {\n  const theme = useTheme();\n\n  return (\n    <Box\n      className={className}\n      sx={{\n        padding: theme.spacing(2),\n      }}\n      {...otherProps}\n    >\n      {children}\n    </Box>\n  );\n};\n","import type { Theme } from '@mui/material';\n\nimport type { CollapsibleVariant } from './Collapsible.types';\n\n/**\n * `smooth` and `default` share their timing; only `spring` differs, stretching\n * the duration and overshooting past the target before settling.\n */\nexport const transitionSettings = (\n  theme: Theme,\n  variant: CollapsibleVariant,\n  duration: number,\n  easing?: string,\n): { duration: number; easing: string } => {\n  if (variant === 'spring') {\n    return {\n      duration: duration * 1.2,\n      easing: easing || 'cubic-bezier(0.34, 1.56, 0.64, 1)',\n    };\n  }\n\n  return { duration, easing: easing || theme.transitions.easing.easeInOut };\n};\n\ninterface RegionState {\n  open: boolean;\n  disabled: boolean;\n  dataTestId?: string;\n}\n\n/**\n * Shared by both implementations: a disabled collapsible reads as collapsed to\n * assistive technology whatever its `open` prop says, because it cannot be\n * operated to see the rest.\n */\nexport const regionAttrs = ({ open, disabled, dataTestId }: RegionState) => ({\n  'data-disabled': disabled,\n  'data-testid': dataTestId,\n  role: 'region',\n  'aria-expanded': open && !disabled,\n  'aria-hidden': disabled || !open,\n});\n\nexport const dimmedStyles = (disabled: boolean) => ({\n  opacity: disabled ? 0.6 : 1,\n  pointerEvents: (disabled ? 'none' : 'auto') as 'none' | 'auto',\n});\n\nexport const triggerStyles = (\n  theme: Theme,\n  { disabled, expanded }: { disabled: boolean; expanded: boolean },\n) => {\n  const restingBackground = expanded ? theme.palette.action.selected : 'transparent';\n\n  return {\n    width: '100%',\n    padding: theme.spacing(1, 2),\n    border: 'none',\n    backgroundColor: restingBackground,\n    cursor: disabled ? 'not-allowed' : 'pointer',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    transition: theme.transitions.create(['background-color', 'opacity'], {\n      duration: theme.transitions.duration.short,\n    }),\n    opacity: disabled ? 0.6 : 1,\n    '&:hover': {\n      backgroundColor: disabled\n        ? 'transparent'\n        : expanded\n          ? theme.palette.action.selected\n          : theme.palette.action.hover,\n    },\n    '&:focus': {\n      outline: `2px solid ${theme.palette.primary.main}`,\n      outlineOffset: 2,\n    },\n    '&:active': {\n      backgroundColor: disabled ? 'transparent' : theme.palette.action.focus,\n    },\n  };\n};\n"],"mappings":"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","names":[]}

package/dist/layout/Container.js

@@ -0,0 +1,71 @@
+import "../chunk-PZ5AY32C.js";
+
+// src/components/layout/Container/Container.tsx
+import { Container as MuiContainer, useTheme } from "@mui/material";
+import { jsx } from "react/jsx-runtime";
+var Container = ({
+  children,
+  maxWidth = "lg",
+  variant = "default",
+  padding = "md",
+  responsive = true,
+  dataTestId,
+  sx,
+  ...props
+}) => {
+  const theme = useTheme();
+  const getPadding = () => {
+    const paddingMap = {
+      none: 0,
+      xs: theme.spacing(1),
+      sm: theme.spacing(2),
+      md: theme.spacing(3),
+      lg: theme.spacing(4),
+      xl: theme.spacing(6)
+    };
+    return paddingMap[padding] || theme.spacing(3);
+  };
+  const getMaxWidth = () => {
+    if (variant === "fluid") return false;
+    if (variant === "centered") return "md";
+    if (typeof maxWidth === "string" && ["xs", "sm", "md", "lg", "xl"].includes(maxWidth)) {
+      return maxWidth;
+    }
+    if (maxWidth === false) return false;
+    return "lg";
+  };
+  const containerStyles = {
+    ...variant === "centered" && {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      justifyContent: "center",
+      minHeight: "100vh"
+    },
+    ...variant === "padded" && {
+      paddingTop: theme.spacing(8),
+      paddingBottom: theme.spacing(8)
+    },
+    padding: getPadding(),
+    ...responsive && {
+      [theme.breakpoints.down("sm")]: {
+        padding: theme.spacing(2)
+      }
+    },
+    ...sx || {}
+  };
+  return /* @__PURE__ */ jsx(
+    MuiContainer,
+    {
+      maxWidth: getMaxWidth(),
+      sx: containerStyles,
+      "data-testid": dataTestId || "container",
+      ...props,
+      children
+    }
+  );
+};
+export {
+  Container
+};
+//# sourceMappingURL=Container.js.map