ece-docs-components 1.0.6 → 1.0.8

package/dist/esm/components/Breadcrumb.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { styled, IconButton, Menu, MenuItem, Box, Breadcrumbs, Typography } from '@mui/material';
@@ -68,7 +67,7 @@ const StyledMenuItem = styled(MenuItem)(({ theme, isActive }) => ({
     },
 }));
 const Breadcrumb = ({ items, currentItem, dropdownItems = [], onItemSelect, }) => {
-    const { theme } = useTheme();
+    const theme = useTheme();
     const [anchorEl, setAnchorEl] = useState(null);
     const isDropdownOpen = Boolean(anchorEl);
     const handleDropdownToggle = (event) => {

package/dist/esm/components/Breadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumb.js","sources":["../../../../src/components/Breadcrumb.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState } from 'react';\nimport { Box, Breadcrumbs as MuiBreadcrumbs, Typography, IconButton, Menu, MenuItem, styled } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { HomeRounded, ExpandMoreRounded } from '@mui/icons-material';\n\ninterface BreadcrumbItem {\n  label: string;\n  href?: string;\n}\n\ninterface BreadcrumbProps {\n  items: BreadcrumbItem[];\n  currentItem: string;\n  dropdownItems?: string[];\n  onItemSelect?: (item: string) => void;\n}\n\nconst HomeButton = styled(IconButton)(({ theme }) => ({\n  width: 40,\n  height: 40,\n  borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2,\n  backgroundColor: theme.palette.custom?.iconColor || theme.palette.accent.main,\n  flexShrink: 0,\n  display: 'none',\n  [theme.breakpoints.up('md')]: {\n    display: 'flex',\n  },\n  '&:hover': {\n    backgroundColor: theme.palette.custom?.iconColor || theme.palette.accent.main,\n    opacity: 0.8,\n  },\n}));\n\nconst DropdownButton = styled('button')(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(1),\n  padding: theme.spacing(0.75, 2),\n  borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2,\n  border: `1px solid ${theme.palette.dark.main}33`,\n  backgroundColor: '#fff',\n  color: theme.palette.dark.main,\n  fontWeight: 500,\n  whiteSpace: 'nowrap',\n  cursor: 'pointer',\n  transition: 'border-color 0.2s',\n  fontSize: '0.875rem',\n  '&:hover': {\n    borderColor: `${theme.palette.dark.main}4D`,\n  },\n  [theme.breakpoints.down('sm')]: {\n    padding: theme.spacing(0.75, 1),\n    gap: theme.spacing(0.5),\n  },\n}));\n\nconst StyledMenu = styled(Menu)(({ theme }) => ({\n  '& .MuiPaper-root': {\n    marginTop: theme.spacing(1),\n    width: '256px',\n    borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2,\n    border: `1px solid ${theme.palette.dark.main}33`,\n    boxShadow: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',\n  },\n}));\n\nconst StyledMenuItem = styled(MenuItem)<{ isActive?: boolean }>(({ theme, isActive }) => ({\n  padding: theme.spacing(1.25, 2),\n  fontSize: '0.875rem',\n  color: isActive ? theme.palette.primary.main : '#4D3019',\n  fontWeight: isActive ? 500 : 400,\n  backgroundColor: isActive ? '#F5F1ED' : 'transparent',\n  '&:hover': {\n    backgroundColor: '#F5F1ED',\n  },\n}));\n\nexport const Breadcrumb: React.FC<BreadcrumbProps> = ({\n  items,\n  currentItem,\n  dropdownItems = [],\n  onItemSelect,\n}) => {\n  const { theme } = useTheme();\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n  const isDropdownOpen = Boolean(anchorEl);\n\n  const handleDropdownToggle = (event: React.MouseEvent<HTMLButtonElement>) => {\n    setAnchorEl(event.currentTarget);\n  };\n\n  const handleClose = () => {\n    setAnchorEl(null);\n  };\n\n  const handleItemClick = (item: string) => {\n    onItemSelect?.(item);\n    handleClose();\n  };\n\n  return (\n    <Box\n      component=\"nav\"\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        gap: { xs: 0.5, sm: 1 },\n        fontSize: { xs: '0.75rem', sm: '0.875rem' },\n        overflow: 'visible',\n      }}\n    >\n      <HomeButton aria-label=\"Home\">\n        <HomeRounded sx={{ fontSize: 20, color:\"#4D3019\"}} />\n      </HomeButton>\n\n      <MuiBreadcrumbs\n        separator=\"/\"\n        sx={{\n          display: { xs: 'none', md: 'flex' },\n          '& .MuiBreadcrumbs-separator': {\n            color: `${theme.palette.dark.main}66`,\n          },\n        }}\n      >\n        {items.map((item, index) => (\n          <Typography\n            key={index}\n            sx={{\n              color: theme.palette.dark.main,\n              fontWeight: 500,\n              px: { xs: 0.5, sm: 1 },\n              whiteSpace: 'nowrap',\n              fontSize: 'inherit',\n            }}\n          >\n            {item.label}\n          </Typography>\n        ))}\n      </MuiBreadcrumbs>\n\n      <Typography\n        sx={{\n          display: { xs: 'none', md: 'inline' },\n          color: `${theme.palette.dark.main}66`,\n        }}\n      >\n        /\n      </Typography>\n\n      <Box sx={{ position: 'relative', flexShrink: 0 }}>\n        <DropdownButton\n          type=\"button\"\n          onClick={handleDropdownToggle}\n        >\n          <span>{currentItem}</span>\n          <ExpandMoreRounded\n            sx={{\n              fontSize: 20,\n              transition: 'transform 0.2s',\n              transform: isDropdownOpen ? 'rotate(180deg)' : 'rotate(0deg)',\n            }}\n          />\n        </DropdownButton>\n\n        {dropdownItems.length > 0 && (\n          <StyledMenu\n            anchorEl={anchorEl}\n            open={isDropdownOpen}\n            onClose={handleClose}\n            anchorOrigin={{\n              vertical: 'bottom',\n              horizontal: 'left',\n            }}\n            transformOrigin={{\n              vertical: 'top',\n              horizontal: 'left',\n            }}\n          >\n            {dropdownItems.map((item, index) => (\n              <StyledMenuItem\n                key={index}\n                onClick={() => handleItemClick(item)}\n                isActive={item === currentItem}\n              >\n                {item}\n              </StyledMenuItem>\n            ))}\n          </StyledMenu>\n        )}\n      </Box>\n    </Box>\n  );\n};"],"names":[],"mappings":";;;;;;;AAmBA;AACE;AACA;;;;AAIA;AACA;AACA;;AAEE;AACD;AACD;AACE;AACA;AACD;AACF;AAED;AACE;AACA;AACA;;;;;;AAMA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEC;;;AAGC;AACD;AACF;AAED;AACE;AACE;AACA;;;;;AAKA;AACD;AACF;AAED;;AAEE;AACA;;;AAGA;AACE;AACD;AACF;AAEM;AAML;;AAEA;AAEA;AACE;AACF;;;AAIA;AAEA;AACE;AACA;AACF;;AAMM;AACA;;;AAGA;AACD;;AAUG;;AAEC;AACF;AAMK;AACA;;AAEA;AACA;AACD;;;AAWJ;AAaK;AACA;;;AAYA;AACA;AACD;AAEC;AACA;AACD;AAgBb;;"}
+{"version":3,"file":"Breadcrumb.js","sources":["../../../../src/components/Breadcrumb.tsx"],"sourcesContent":["\n\nimport React, { useState } from 'react';\nimport { Box, Breadcrumbs as MuiBreadcrumbs, Typography, IconButton, Menu, MenuItem, styled } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { HomeRounded, ExpandMoreRounded } from '@mui/icons-material';\n\ninterface BreadcrumbItem {\n  label: string;\n  href?: string;\n}\n\ninterface BreadcrumbProps {\n  items: BreadcrumbItem[];\n  currentItem: string;\n  dropdownItems?: string[];\n  onItemSelect?: (item: string) => void;\n}\n\nconst HomeButton = styled(IconButton)(({ theme }) => ({\n  width: 40,\n  height: 40,\n  borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2,\n  backgroundColor: theme.palette.custom?.iconColor || theme.palette.accent.main,\n  flexShrink: 0,\n  display: 'none',\n  [theme.breakpoints.up('md')]: {\n    display: 'flex',\n  },\n  '&:hover': {\n    backgroundColor: theme.palette.custom?.iconColor || theme.palette.accent.main,\n    opacity: 0.8,\n  },\n}));\n\nconst DropdownButton = styled('button')(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(1),\n  padding: theme.spacing(0.75, 2),\n  borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2,\n  border: `1px solid ${theme.palette.dark.main}33`,\n  backgroundColor: '#fff',\n  color: theme.palette.dark.main,\n  fontWeight: 500,\n  whiteSpace: 'nowrap',\n  cursor: 'pointer',\n  transition: 'border-color 0.2s',\n  fontSize: '0.875rem',\n  '&:hover': {\n    borderColor: `${theme.palette.dark.main}4D`,\n  },\n  [theme.breakpoints.down('sm')]: {\n    padding: theme.spacing(0.75, 1),\n    gap: theme.spacing(0.5),\n  },\n}));\n\nconst StyledMenu = styled(Menu)(({ theme }) => ({\n  '& .MuiPaper-root': {\n    marginTop: theme.spacing(1),\n    width: '256px',\n    borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2,\n    border: `1px solid ${theme.palette.dark.main}33`,\n    boxShadow: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',\n  },\n}));\n\nconst StyledMenuItem = styled(MenuItem)<{ isActive?: boolean }>(({ theme, isActive }) => ({\n  padding: theme.spacing(1.25, 2),\n  fontSize: '0.875rem',\n  color: isActive ? theme.palette.primary.main : '#4D3019',\n  fontWeight: isActive ? 500 : 400,\n  backgroundColor: isActive ? '#F5F1ED' : 'transparent',\n  '&:hover': {\n    backgroundColor: '#F5F1ED',\n  },\n}));\n\nexport const Breadcrumb: React.FC<BreadcrumbProps> = ({\n  items,\n  currentItem,\n  dropdownItems = [],\n  onItemSelect,\n}) => {\n  const theme = useTheme();\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n  const isDropdownOpen = Boolean(anchorEl);\n\n  const handleDropdownToggle = (event: React.MouseEvent<HTMLButtonElement>) => {\n    setAnchorEl(event.currentTarget);\n  };\n\n  const handleClose = () => {\n    setAnchorEl(null);\n  };\n\n  const handleItemClick = (item: string) => {\n    onItemSelect?.(item);\n    handleClose();\n  };\n\n  return (\n    <Box\n      component=\"nav\"\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        gap: { xs: 0.5, sm: 1 },\n        fontSize: { xs: '0.75rem', sm: '0.875rem' },\n        overflow: 'visible',\n      }}\n    >\n      <HomeButton aria-label=\"Home\">\n        <HomeRounded sx={{ fontSize: 20, color:\"#4D3019\"}} />\n      </HomeButton>\n\n      <MuiBreadcrumbs\n        separator=\"/\"\n        sx={{\n          display: { xs: 'none', md: 'flex' },\n          '& .MuiBreadcrumbs-separator': {\n            color: `${theme.palette.dark.main}66`,\n          },\n        }}\n      >\n        {items.map((item, index) => (\n          <Typography\n            key={index}\n            sx={{\n              color: theme.palette.dark.main,\n              fontWeight: 500,\n              px: { xs: 0.5, sm: 1 },\n              whiteSpace: 'nowrap',\n              fontSize: 'inherit',\n            }}\n          >\n            {item.label}\n          </Typography>\n        ))}\n      </MuiBreadcrumbs>\n\n      <Typography\n        sx={{\n          display: { xs: 'none', md: 'inline' },\n          color: `${theme.palette.dark.main}66`,\n        }}\n      >\n        /\n      </Typography>\n\n      <Box sx={{ position: 'relative', flexShrink: 0 }}>\n        <DropdownButton\n          type=\"button\"\n          onClick={handleDropdownToggle}\n        >\n          <span>{currentItem}</span>\n          <ExpandMoreRounded\n            sx={{\n              fontSize: 20,\n              transition: 'transform 0.2s',\n              transform: isDropdownOpen ? 'rotate(180deg)' : 'rotate(0deg)',\n            }}\n          />\n        </DropdownButton>\n\n        {dropdownItems.length > 0 && (\n          <StyledMenu\n            anchorEl={anchorEl}\n            open={isDropdownOpen}\n            onClose={handleClose}\n            anchorOrigin={{\n              vertical: 'bottom',\n              horizontal: 'left',\n            }}\n            transformOrigin={{\n              vertical: 'top',\n              horizontal: 'left',\n            }}\n          >\n            {dropdownItems.map((item, index) => (\n              <StyledMenuItem\n                key={index}\n                onClick={() => handleItemClick(item)}\n                isActive={item === currentItem}\n              >\n                {item}\n              </StyledMenuItem>\n            ))}\n          </StyledMenu>\n        )}\n      </Box>\n    </Box>\n  );\n};"],"names":["_jsxs","_jsx","MuiBreadcrumbs"],"mappings":"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"}

package/dist/esm/components/Card.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsx } from 'react/jsx-runtime';
 import { styled, Box } from '@mui/material';
 

package/dist/esm/components/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sources":["../../../../src/components/Card.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { Box, styled, SxProps, Theme } from '@mui/material';\n\ninterface CardProps {\n  children: React.ReactNode;\n  className?: string;\n  padding?: 'none' | 'sm' | 'md' | 'lg';\n  variant?: 'default' | 'bordered' | 'elevated';\n  sx?: SxProps<Theme>; // Add sx prop to support Material-UI styling\n}\n\nconst StyledCard = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'customPadding' && prop !== 'customVariant',\n})<{ customPadding: string; customVariant: string }>(({ theme, customPadding, customVariant }) => {\n  const paddingStyles = {\n    none: { padding: 0 },\n    sm: { padding: theme.spacing(2) }, // 16px\n    md: { padding: theme.spacing(3) }, // 24px\n    lg: { padding: theme.spacing(4) }, // 32px\n  };\n\n  const variantStyles = {\n    default: {\n      border: `1px solid ${theme.palette.dark.main}10`, // dark.main with 10% opacity\n    },\n    bordered: {\n      border: `2px solid ${theme.palette.dark.main}20`, // dark.main with 20% opacity\n    },\n    elevated: {\n      border: `1px solid ${theme.palette.dark.main}05`, // dark.main with 5% opacity\n      boxShadow: theme.shadows[4], // MUI shadow level 4 for \"elevated\"\n    },\n  };\n\n  const borderRadiusValue = typeof theme.shape.borderRadius === 'string'\n    ? parseInt(theme.shape.borderRadius, 10)\n    : theme.shape.borderRadius || 4;\n\n  return {\n    borderRadius: borderRadiusValue * 2, // Matches rounded-xl (approx 12px)\n    overflow: 'visible',\n    backgroundColor: theme.palette.light.main, // Matches #FEFDF7\n    ...paddingStyles[customPadding as keyof typeof paddingStyles],\n    ...variantStyles[customVariant as keyof typeof variantStyles],\n  };\n});\n\nexport const Card: React.FC<CardProps> = ({\n  children,\n  className = '',\n  padding = 'md',\n  variant = 'default',\n  sx, // Destructure sx prop\n}) => {\n  return (\n    <StyledCard\n      className={className}\n      customPadding={padding}\n      customVariant={variant}\n      sx={sx} // Pass sx prop to StyledCard\n    >\n      {children}\n    </StyledCard>\n  );\n};"],"names":[],"mappings":";;;;AAaA;AACE;;AAEA;AACE;AACA;AACA;AACA;;AAGF;AACE;;AAEC;AACD;;AAEC;AACD;;;AAGC;;;;;;AAQD;AACA;;;;;AAKJ;;AAQC;;AAWD;;"}
+{"version":3,"file":"Card.js","sources":["../../../../src/components/Card.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { Box, styled, SxProps, Theme } from '@mui/material';\n\ninterface CardProps {\n  children: React.ReactNode;\n  className?: string;\n  padding?: 'none' | 'sm' | 'md' | 'lg';\n  variant?: 'default' | 'bordered' | 'elevated';\n  sx?: SxProps<Theme>; // Add sx prop to support Material-UI styling\n}\n\nconst StyledCard = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'customPadding' && prop !== 'customVariant',\n})<{ customPadding: string; customVariant: string }>(({ theme, customPadding, customVariant }) => {\n  const paddingStyles = {\n    none: { padding: 0 },\n    sm: { padding: theme.spacing(2) }, // 16px\n    md: { padding: theme.spacing(3) }, // 24px\n    lg: { padding: theme.spacing(4) }, // 32px\n  };\n\n  const variantStyles = {\n    default: {\n      border: `1px solid ${theme.palette.dark.main}10`, // dark.main with 10% opacity\n    },\n    bordered: {\n      border: `2px solid ${theme.palette.dark.main}20`, // dark.main with 20% opacity\n    },\n    elevated: {\n      border: `1px solid ${theme.palette.dark.main}05`, // dark.main with 5% opacity\n      boxShadow: theme.shadows[4], // MUI shadow level 4 for \"elevated\"\n    },\n  };\n\n  const borderRadiusValue = typeof theme.shape.borderRadius === 'string'\n    ? parseInt(theme.shape.borderRadius, 10)\n    : theme.shape.borderRadius || 4;\n\n  return {\n    borderRadius: borderRadiusValue * 2, // Matches rounded-xl (approx 12px)\n    overflow: 'visible',\n    backgroundColor: theme.palette.light.main, // Matches #FEFDF7\n    ...paddingStyles[customPadding as keyof typeof paddingStyles],\n    ...variantStyles[customVariant as keyof typeof variantStyles],\n  };\n});\n\nexport const Card: React.FC<CardProps> = ({\n  children,\n  className = '',\n  padding = 'md',\n  variant = 'default',\n  sx, // Destructure sx prop\n}) => {\n  return (\n    <StyledCard\n      className={className}\n      customPadding={padding}\n      customVariant={variant}\n      sx={sx} // Pass sx prop to StyledCard\n    >\n      {children}\n    </StyledCard>\n  );\n};"],"names":["_jsx"],"mappings":";;;AAaA,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,EAAE;AAC7B,IAAA,iBAAiB,EAAE,CAAC,IAAI,KAAK,IAAI,KAAK,eAAe,IAAI,IAAI,KAAK,eAAe;CAClF,CAAC,CAAmD,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,KAAI;AAC/F,IAAA,MAAM,aAAa,GAAG;AACpB,QAAA,IAAI,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE;AACpB,QAAA,EAAE,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE;AACjC,QAAA,EAAE,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE;AACjC,QAAA,EAAE,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE;KAClC;AAED,IAAA,MAAM,aAAa,GAAG;AACpB,QAAA,OAAO,EAAE;YACP,MAAM,EAAE,CAAA,UAAA,EAAa,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AACjD,SAAA;AACD,QAAA,QAAQ,EAAE;YACR,MAAM,EAAE,CAAA,UAAA,EAAa,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AACjD,SAAA;AACD,QAAA,QAAQ,EAAE;YACR,MAAM,EAAE,CAAA,UAAA,EAAa,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;YAChD,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC5B,SAAA;KACF;IAED,MAAM,iBAAiB,GAAG,OAAO,KAAK,CAAC,KAAK,CAAC,YAAY,KAAK;UAC1D,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY,EAAE,EAAE;UACrC,KAAK,CAAC,KAAK,CAAC,YAAY,IAAI,CAAC;IAEjC,OAAO;AACL,QAAA,YAAY,EAAE,iBAAiB,GAAG,CAAC;AACnC,QAAA,QAAQ,EAAE,SAAS;QACnB,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI;QACzC,GAAG,aAAa,CAAC,aAA2C,CAAC;QAC7D,GAAG,aAAa,CAAC,aAA2C,CAAC;KAC9D;AACH,CAAC,CAAC;MAEW,IAAI,GAAwB,CAAC,EACxC,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,OAAO,GAAG,IAAI,EACd,OAAO,GAAG,SAAS,EACnB,EAAE;AACH,EAAA,KAAI;IACH,QACEA,IAAC,UAAU,EAAA,EACT,SAAS,EAAE,SAAS,EACpB,aAAa,EAAE,OAAO,EACtB,aAAa,EAAE,OAAO,EACtB,EAAE,EAAE,EAAE,EAAA,QAAA,EAEL,QAAQ,EAAA,CACE;AAEjB;;;;"}

package/dist/esm/components/Checkbox.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { styled, Box, Checkbox as Checkbox$1, Typography, FormControlLabel } from '@mui/material';
 

package/dist/esm/components/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":["../../../../src/components/Checkbox.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { Box, Checkbox as MuiCheckbox, CheckboxProps, FormControlLabel, styled, Typography } from '@mui/material';\n\ninterface CustomCheckboxProps extends CheckboxProps {\n  label: string;\n  description?: string;\n}\n\nconst StyledWrapper = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'flex-start',\n}));\n\nconst StyledCheckbox = styled(MuiCheckbox)(({ theme }) => ({\n  width: 16, // Matches Tailwind's w-4 (16px)\n  height: 16, // Matches Tailwind's h-4 (16px)\n  color: theme.palette.dark.main + '33', // dark.main with 20% opacity (border-dark/20)\n  '&.Mui-checked': {\n    color: theme.palette.primary.main, // text-primary\n  },\n  '&:focus': {\n    outline: `2px solid ${theme.palette.primary.main}`, // focus:ring-2 focus:ring-primary\n    outlineOffset: 2,\n  },\n  borderRadius: theme.shape.borderRadius, // Matches rounded\n  cursor: 'pointer',\n}));\n\nconst StyledLabel = styled(Typography)(({ theme }) => ({\n  fontSize: '1rem', // text-base (16px)\n  fontWeight: 500, // font-medium\n  color: theme.palette.dark.main, // text-dark\n  cursor: 'pointer',\n}));\n\nconst StyledDescription = styled(Typography)(({ theme }) => ({\n  fontSize: '0.875rem', // text-sm (14px)\n  color: theme.palette.dark.main + '99', // dark.main with 60% opacity (text-dark/60)\n  marginTop: theme.spacing(0.5), // mt-0.5\n}));\n\nexport const Checkbox: React.FC<CustomCheckboxProps> = ({\n  label,\n  description,\n  className = '',\n  id,\n  ...props\n}) => {\n  const checkboxId = id || `checkbox-${Math.random().toString(36).substr(2, 9)}`;\n\n  return (\n    <StyledWrapper className={className}>\n      <FormControlLabel\n        control={\n          <StyledCheckbox\n            id={checkboxId}\n            {...props}\n          />\n        }\n        label={\n          <Box sx={{ ml: 1.5, display: 'flex', flexDirection: 'column' }}>\n            <StyledLabel>{label}</StyledLabel>\n            {description && <StyledDescription>{description}</StyledDescription>}\n          </Box>\n        }\n      />\n    </StyledWrapper>\n  );\n};"],"names":[],"mappings":";;;;AAUA;AACE;AACA;AACD;AAED;;;;AAIE;;AAEC;AACD;;AAEE;AACD;AACD;AACA;AACD;AAED;;;;AAIE;AACD;AAED;;;;AAIC;;;AAWC;AAkBF;;"}
+{"version":3,"file":"Checkbox.js","sources":["../../../../src/components/Checkbox.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { Box, Checkbox as MuiCheckbox, CheckboxProps, FormControlLabel, styled, Typography } from '@mui/material';\n\ninterface CustomCheckboxProps extends CheckboxProps {\n  label: string;\n  description?: string;\n}\n\nconst StyledWrapper = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'flex-start',\n}));\n\nconst StyledCheckbox = styled(MuiCheckbox)(({ theme }) => ({\n  width: 16, // Matches Tailwind's w-4 (16px)\n  height: 16, // Matches Tailwind's h-4 (16px)\n  color: theme.palette.dark.main + '33', // dark.main with 20% opacity (border-dark/20)\n  '&.Mui-checked': {\n    color: theme.palette.primary.main, // text-primary\n  },\n  '&:focus': {\n    outline: `2px solid ${theme.palette.primary.main}`, // focus:ring-2 focus:ring-primary\n    outlineOffset: 2,\n  },\n  borderRadius: theme.shape.borderRadius, // Matches rounded\n  cursor: 'pointer',\n}));\n\nconst StyledLabel = styled(Typography)(({ theme }) => ({\n  fontSize: '1rem', // text-base (16px)\n  fontWeight: 500, // font-medium\n  color: theme.palette.dark.main, // text-dark\n  cursor: 'pointer',\n}));\n\nconst StyledDescription = styled(Typography)(({ theme }) => ({\n  fontSize: '0.875rem', // text-sm (14px)\n  color: theme.palette.dark.main + '99', // dark.main with 60% opacity (text-dark/60)\n  marginTop: theme.spacing(0.5), // mt-0.5\n}));\n\nexport const Checkbox: React.FC<CustomCheckboxProps> = ({\n  label,\n  description,\n  className = '',\n  id,\n  ...props\n}) => {\n  const checkboxId = id || `checkbox-${Math.random().toString(36).substr(2, 9)}`;\n\n  return (\n    <StyledWrapper className={className}>\n      <FormControlLabel\n        control={\n          <StyledCheckbox\n            id={checkboxId}\n            {...props}\n          />\n        }\n        label={\n          <Box sx={{ ml: 1.5, display: 'flex', flexDirection: 'column' }}>\n            <StyledLabel>{label}</StyledLabel>\n            {description && <StyledDescription>{description}</StyledDescription>}\n          </Box>\n        }\n      />\n    </StyledWrapper>\n  );\n};"],"names":["MuiCheckbox","_jsx","_jsxs"],"mappings":";;;AAUA,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AAChD,IAAA,OAAO,EAAE,MAAM;AACf,IAAA,UAAU,EAAE,YAAY;AACzB,CAAA,CAAC,CAAC;AAEH,MAAM,cAAc,GAAG,MAAM,CAACA,UAAW,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;IACzD,KAAK,EAAE,EAAE;IACT,MAAM,EAAE,EAAE;IACV,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI;AACrC,IAAA,eAAe,EAAE;QACf,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI;AAClC,KAAA;AACD,IAAA,SAAS,EAAE;QACT,OAAO,EAAE,CAAA,UAAA,EAAa,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAA,CAAE;AAClD,QAAA,aAAa,EAAE,CAAC;AACjB,KAAA;AACD,IAAA,YAAY,EAAE,KAAK,CAAC,KAAK,CAAC,YAAY;AACtC,IAAA,MAAM,EAAE,SAAS;AAClB,CAAA,CAAC,CAAC;AAEH,MAAM,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;IACrD,QAAQ,EAAE,MAAM;IAChB,UAAU,EAAE,GAAG;IACf,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;AAC9B,IAAA,MAAM,EAAE,SAAS;AAClB,CAAA,CAAC,CAAC;AAEH,MAAM,iBAAiB,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;IAC3D,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI;IACrC,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;AAC9B,CAAA,CAAC,CAAC;MAEU,QAAQ,GAAkC,CAAC,EACtD,KAAK,EACL,WAAW,EACX,SAAS,GAAG,EAAE,EACd,EAAE,EACF,GAAG,KAAK,EACT,KAAI;IACH,MAAM,UAAU,GAAG,EAAE,IAAI,YAAY,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA,CAAE;AAE9E,IAAA,QACEC,GAAA,CAAC,aAAa,EAAA,EAAC,SAAS,EAAE,SAAS,EAAA,QAAA,EACjCA,GAAA,CAAC,gBAAgB,EAAA,EACf,OAAO,EACLA,GAAA,CAAC,cAAc,EAAA,EACb,EAAE,EAAE,UAAU,EAAA,GACV,KAAK,EAAA,CACT,EAEJ,KAAK,EACHC,IAAA,CAAC,GAAG,EAAA,EAAC,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,EAAA,QAAA,EAAA,CAC5DD,GAAA,CAAC,WAAW,EAAA,EAAA,QAAA,EAAE,KAAK,EAAA,CAAe,EACjC,WAAW,IAAIA,GAAA,CAAC,iBAAiB,EAAA,EAAA,QAAA,EAAE,WAAW,EAAA,CAAqB,CAAA,EAAA,CAChE,EAAA,CAER,EAAA,CACY;AAEpB;;;;"}

package/dist/esm/components/Concertina.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { styled, Box, Typography, IconButton, Collapse } from '@mui/material';

package/dist/esm/components/Concertina.js.map

@@ -1 +1 @@
-{"version":3,"file":"Concertina.js","sources":["../../../../src/components/Concertina.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState } from 'react';\nimport { Box, styled, Typography, IconButton, Collapse } from '@mui/material';\nimport { ExpandMoreRounded, LinkRounded } from '@mui/icons-material';\n\ninterface ConcertinaSection {\n  id: string;\n  title: string;\n  content: string;\n}\n\ninterface ConcertinaProps {\n  sections: ConcertinaSection[];\n}\n\nconst StyledConcertina = styled(Box)(({ theme }) => ({\n  width: '100%',\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(1), // space-y-2\n}));\n\nconst StyledSection = styled(Box)(({ theme }) => ({\n  border: `1px solid ${theme.palette.grey[200]}`, // border-gray-200\n  borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2, // rounded-lg\n  overflow: 'hidden',\n}));\n\nconst StyledHeader = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  padding: theme.spacing(3), // p-3 sm:p-4 md:p-6\n  cursor: 'pointer',\n  transition: 'background-color 0.2s',\n  gap: theme.spacing(2), // gap-2\n  '&:hover': {\n    backgroundColor: theme.palette.light.main, // hover:bg-[#FDFCEE]\n  },\n  [theme.breakpoints.up('sm')]: {\n    padding: theme.spacing(4),\n  },\n  [theme.breakpoints.up('md')]: {\n    padding: theme.spacing(6),\n  },\n}));\n\nconst StyledTitleWrapper = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(3), // sm:gap-3\n  flex: 1,\n  minWidth: 0,\n  [theme.breakpoints.down('sm')]: {\n    gap: theme.spacing(2), // gap-2\n  },\n}));\n\nconst StyledTitle = styled(Typography, {\n  shouldForwardProp: (prop) => prop !== 'isHovered',\n})<{ isHovered: boolean }>(({ theme, isHovered }) => ({\n  fontWeight: 700, // font-bold\n  fontSize: '1.5rem', // text-2xl\n  lineHeight: 1.2, // leading-tight\n  color: theme.palette.dark.main, // text-[#4D3019]\n  wordBreak: 'break-word', // break-words\n  position: 'relative',\n  '&:after': {\n    content: '\"\"',\n    position: 'absolute',\n    bottom: 0,\n    left: 0,\n    width: '100%',\n    height: 1,\n    backgroundColor: theme.palette.accent.main, // bg-orange-500\n    display: isHovered ? 'block' : 'none',\n  },\n  [theme.breakpoints.down('lg')]: {\n    fontSize: '1.25rem', // lg:text-[28px]\n  },\n  [theme.breakpoints.down('md')]: {\n    fontSize: '1.125rem', // md:text-xl\n  },\n  [theme.breakpoints.down('sm')]: {\n    fontSize: '1rem', // sm:text-lg\n  },\n}));\n\nconst StyledLinkButton = styled(IconButton)(({ theme }) => ({\n  color: theme.palette.accent.main, // text-orange-500\n  '&:hover': {\n    color: theme.palette.accent.dark || theme.palette.accent.main, // hover:text-orange-600\n  },\n  padding: 0,\n}));\n\nconst StyledTooltip = styled(Box)(({ theme }) => ({\n  position: 'absolute',\n  top: -40, // -top-10\n  left: '50%',\n  transform: 'translateX(-50%)',\n  backgroundColor: theme.palette.grey[900], // bg-gray-900\n  color: theme.palette.common.white, // text-white\n  fontSize: '0.75rem', // text-xs\n  padding: theme.spacing(1, 2), // px-2 py-1\n  borderRadius: theme.shape.borderRadius, // rounded\n  whiteSpace: 'nowrap',\n  zIndex: 10,\n  [theme.breakpoints.up('sm')]: {\n    fontSize: '0.875rem', // sm:text-sm\n    padding: theme.spacing(1.5, 3), // sm:px-3 sm:py-1.5\n  },\n}));\n\nconst StyledChevron = styled(ExpandMoreRounded)(({ theme }) => ({\n  color: theme.palette.grey[500], // text-gray-500\n  transition: 'transform 0.2s', // transition-transform duration-200\n  width: 24, // sm:w-6\n  height: 24, // sm:h-6\n  [theme.breakpoints.down('sm')]: {\n    width: 20,\n    height: 20,\n  },\n}));\n\nconst StyledContent = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(2, 3, 3), // px-3 pb-3 pt-2\n  [theme.breakpoints.up('sm')]: {\n    padding: theme.spacing(2, 4, 4), // sm:px-4 sm:pb-4\n  },\n  [theme.breakpoints.up('md')]: {\n    padding: theme.spacing(2, 6, 6), // md:px-6 md:pb-6\n  },\n}));\n\nconst StyledContentText = styled(Typography)(({ theme }) => ({\n  color: theme.palette.dark.main, // text-[#4D3019]\n  lineHeight: 1.5, // leading-relaxed\n  wordBreak: 'break-word', // break-words\n  fontSize: 13, // style={{ fontSize: '13px' }}\n}));\n\nexport function Concertina({ sections }: ConcertinaProps) {\n  const [openSections, setOpenSections] = useState<Set<string>>(new Set());\n  const [hoveredTitle, setHoveredTitle] = useState<string | null>(null);\n  const [copiedId, setCopiedId] = useState<string | null>(null);\n\n  const toggleSection = (id: string) => {\n    const newOpenSections = new Set(openSections);\n    if (newOpenSections.has(id)) {\n      newOpenSections.delete(id);\n    } else {\n      newOpenSections.add(id);\n    }\n    setOpenSections(newOpenSections);\n  };\n\n  const copyJumpLink = (id: string, e: React.MouseEvent) => {\n    e.stopPropagation();\n    const url = `${window.location.origin}${window.location.pathname}#${id}`;\n    navigator.clipboard.writeText(url);\n    setCopiedId(id);\n    setTimeout(() => setCopiedId(null), 2000);\n  };\n\n  return (\n    <StyledConcertina>\n      {sections.map((section) => (\n        <StyledSection key={section.id} id={section.id}>\n          <StyledHeader\n            onClick={() => toggleSection(section.id)}\n            onMouseEnter={() => setHoveredTitle(section.id)}\n            onMouseLeave={() => setHoveredTitle(null)}\n          >\n            <StyledTitleWrapper>\n              <StyledTitle isHovered={hoveredTitle === section.id} variant=\"h3\">\n                {section.title}\n              </StyledTitle>\n              {hoveredTitle === section.id && (\n                <Box sx={{ position: 'relative', flexShrink: 0 }}>\n                  <StyledLinkButton\n                    onClick={(e) => copyJumpLink(section.id, e)}\n                    aria-label=\"Copy link\"\n                  >\n                    <LinkRounded sx={{fontSize: 20}} />\n                  </StyledLinkButton>\n                  {copiedId === section.id && (\n                    <StyledTooltip>\n                      Link copied\n                    </StyledTooltip>\n                  )}\n                </Box>\n              )}\n            </StyledTitleWrapper>\n            <StyledChevron\n              sx={{ fontSize:20, transform: openSections.has(section.id) ? 'rotate(180deg)' : 'none' }}\n            />\n          </StyledHeader>\n          <Collapse in={openSections.has(section.id)}>\n            <StyledContent>\n              <StyledContentText>{section.content}</StyledContentText>\n            </StyledContent>\n          </Collapse>\n        </StyledSection>\n      ))}\n    </StyledConcertina>\n  );\n}"],"names":[],"mappings":";;;;;;AAgBA;AACE;AACA;AACA;;AAED;AAED;AACE;;;AAGA;AACA;AACD;AAED;AACE;AACA;AACA;;AAEA;AACA;;AAEA;;AAEC;;AAEC;AACD;;AAEC;AACD;AACF;AAED;AACE;AACA;;AAEA;AACA;;;AAGC;AACF;AAED;;;;;;;;AAQE;AACA;AACE;AACA;AACA;AACA;AACA;AACA;;;AAGD;;;AAGA;;;AAGA;;;AAGA;AACF;AAED;;AAEE;AACE;AACD;AACD;AACD;AAED;AACE;AACA;AACA;AACA;;;;;AAKA;AACA;AACA;;;;AAIC;AACF;AAED;;;;;;AAMI;AACA;AACD;AACF;AAED;AACE;;AAEE;AACD;;AAEC;AACD;AACF;AAED;;;;;AAKC;AAEK;AACJ;;;AAIA;AACE;AACA;AACE;;;AAEA;;;AAGJ;AAEA;;AAEE;AACA;;;AAGF;;AA4CF;;"}
+{"version":3,"file":"Concertina.js","sources":["../../../../src/components/Concertina.tsx"],"sourcesContent":["\n\nimport React, { useState } from 'react';\nimport { Box, styled, Typography, IconButton, Collapse } from '@mui/material';\nimport { ExpandMoreRounded, LinkRounded } from '@mui/icons-material';\n\ninterface ConcertinaSection {\n  id: string;\n  title: string;\n  content: string;\n}\n\ninterface ConcertinaProps {\n  sections: ConcertinaSection[];\n}\n\nconst StyledConcertina = styled(Box)(({ theme }) => ({\n  width: '100%',\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(1), // space-y-2\n}));\n\nconst StyledSection = styled(Box)(({ theme }) => ({\n  border: `1px solid ${theme.palette.grey[200]}`, // border-gray-200\n  borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2, // rounded-lg\n  overflow: 'hidden',\n}));\n\nconst StyledHeader = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  padding: theme.spacing(3), // p-3 sm:p-4 md:p-6\n  cursor: 'pointer',\n  transition: 'background-color 0.2s',\n  gap: theme.spacing(2), // gap-2\n  '&:hover': {\n    backgroundColor: theme.palette.light.main, // hover:bg-[#FDFCEE]\n  },\n  [theme.breakpoints.up('sm')]: {\n    padding: theme.spacing(4),\n  },\n  [theme.breakpoints.up('md')]: {\n    padding: theme.spacing(6),\n  },\n}));\n\nconst StyledTitleWrapper = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(3), // sm:gap-3\n  flex: 1,\n  minWidth: 0,\n  [theme.breakpoints.down('sm')]: {\n    gap: theme.spacing(2), // gap-2\n  },\n}));\n\nconst StyledTitle = styled(Typography, {\n  shouldForwardProp: (prop) => prop !== 'isHovered',\n})<{ isHovered: boolean }>(({ theme, isHovered }) => ({\n  fontWeight: 700, // font-bold\n  fontSize: '1.5rem', // text-2xl\n  lineHeight: 1.2, // leading-tight\n  color: theme.palette.dark.main, // text-[#4D3019]\n  wordBreak: 'break-word', // break-words\n  position: 'relative',\n  '&:after': {\n    content: '\"\"',\n    position: 'absolute',\n    bottom: 0,\n    left: 0,\n    width: '100%',\n    height: 1,\n    backgroundColor: theme.palette.accent.main, // bg-orange-500\n    display: isHovered ? 'block' : 'none',\n  },\n  [theme.breakpoints.down('lg')]: {\n    fontSize: '1.25rem', // lg:text-[28px]\n  },\n  [theme.breakpoints.down('md')]: {\n    fontSize: '1.125rem', // md:text-xl\n  },\n  [theme.breakpoints.down('sm')]: {\n    fontSize: '1rem', // sm:text-lg\n  },\n}));\n\nconst StyledLinkButton = styled(IconButton)(({ theme }) => ({\n  color: theme.palette.accent.main, // text-orange-500\n  '&:hover': {\n    color: theme.palette.accent.dark || theme.palette.accent.main, // hover:text-orange-600\n  },\n  padding: 0,\n}));\n\nconst StyledTooltip = styled(Box)(({ theme }) => ({\n  position: 'absolute',\n  top: -40, // -top-10\n  left: '50%',\n  transform: 'translateX(-50%)',\n  backgroundColor: theme.palette.grey[900], // bg-gray-900\n  color: theme.palette.common.white, // text-white\n  fontSize: '0.75rem', // text-xs\n  padding: theme.spacing(1, 2), // px-2 py-1\n  borderRadius: theme.shape.borderRadius, // rounded\n  whiteSpace: 'nowrap',\n  zIndex: 10,\n  [theme.breakpoints.up('sm')]: {\n    fontSize: '0.875rem', // sm:text-sm\n    padding: theme.spacing(1.5, 3), // sm:px-3 sm:py-1.5\n  },\n}));\n\nconst StyledChevron = styled(ExpandMoreRounded)(({ theme }) => ({\n  color: theme.palette.grey[500], // text-gray-500\n  transition: 'transform 0.2s', // transition-transform duration-200\n  width: 24, // sm:w-6\n  height: 24, // sm:h-6\n  [theme.breakpoints.down('sm')]: {\n    width: 20,\n    height: 20,\n  },\n}));\n\nconst StyledContent = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(2, 3, 3), // px-3 pb-3 pt-2\n  [theme.breakpoints.up('sm')]: {\n    padding: theme.spacing(2, 4, 4), // sm:px-4 sm:pb-4\n  },\n  [theme.breakpoints.up('md')]: {\n    padding: theme.spacing(2, 6, 6), // md:px-6 md:pb-6\n  },\n}));\n\nconst StyledContentText = styled(Typography)(({ theme }) => ({\n  color: theme.palette.dark.main, // text-[#4D3019]\n  lineHeight: 1.5, // leading-relaxed\n  wordBreak: 'break-word', // break-words\n  fontSize: 13, // style={{ fontSize: '13px' }}\n}));\n\nexport function Concertina({ sections }: ConcertinaProps) {\n  const [openSections, setOpenSections] = useState<Set<string>>(new Set());\n  const [hoveredTitle, setHoveredTitle] = useState<string | null>(null);\n  const [copiedId, setCopiedId] = useState<string | null>(null);\n\n  const toggleSection = (id: string) => {\n    const newOpenSections = new Set(openSections);\n    if (newOpenSections.has(id)) {\n      newOpenSections.delete(id);\n    } else {\n      newOpenSections.add(id);\n    }\n    setOpenSections(newOpenSections);\n  };\n\n  const copyJumpLink = (id: string, e: React.MouseEvent) => {\n    e.stopPropagation();\n    const url = `${window.location.origin}${window.location.pathname}#${id}`;\n    navigator.clipboard.writeText(url);\n    setCopiedId(id);\n    setTimeout(() => setCopiedId(null), 2000);\n  };\n\n  return (\n    <StyledConcertina>\n      {sections.map((section) => (\n        <StyledSection key={section.id} id={section.id}>\n          <StyledHeader\n            onClick={() => toggleSection(section.id)}\n            onMouseEnter={() => setHoveredTitle(section.id)}\n            onMouseLeave={() => setHoveredTitle(null)}\n          >\n            <StyledTitleWrapper>\n              <StyledTitle isHovered={hoveredTitle === section.id} variant=\"h3\">\n                {section.title}\n              </StyledTitle>\n              {hoveredTitle === section.id && (\n                <Box sx={{ position: 'relative', flexShrink: 0 }}>\n                  <StyledLinkButton\n                    onClick={(e) => copyJumpLink(section.id, e)}\n                    aria-label=\"Copy link\"\n                  >\n                    <LinkRounded sx={{fontSize: 20}} />\n                  </StyledLinkButton>\n                  {copiedId === section.id && (\n                    <StyledTooltip>\n                      Link copied\n                    </StyledTooltip>\n                  )}\n                </Box>\n              )}\n            </StyledTitleWrapper>\n            <StyledChevron\n              sx={{ fontSize:20, transform: openSections.has(section.id) ? 'rotate(180deg)' : 'none' }}\n            />\n          </StyledHeader>\n          <Collapse in={openSections.has(section.id)}>\n            <StyledContent>\n              <StyledContentText>{section.content}</StyledContentText>\n            </StyledContent>\n          </Collapse>\n        </StyledSection>\n      ))}\n    </StyledConcertina>\n  );\n}"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/esm/components/DefinitionBox.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { styled, Box, Typography } from '@mui/material';
@@ -54,7 +53,7 @@ const StyledDefinitionText = styled(Typography)(({ theme }) => ({
     lineHeight: 1.5, // leading-relaxed
 }));
 function DefinitionBox({ term, definition, children }) {
-    const { theme } = useTheme();
+    const theme = useTheme();
     const [isOpen, setIsOpen] = useState(false);
     return (jsxs(StyledWrapper, { children: [jsxs(StyledParagraph, { children: [children, jsxs(StyledTermWrapper, { onClick: () => setIsOpen(!isOpen), children: [jsx(StyledTerm, { isOpen: isOpen, onMouseEnter: (e) => (e.currentTarget.style.borderBottomColor = theme.palette.secondary.main), onMouseLeave: (e) => (e.currentTarget.style.borderBottomColor = isOpen ? theme.palette.secondary.main : theme.palette.dark.main), children: term }), jsx(StyledIconWrapper, { children: isOpen ? (jsx(CloseRounded, { sx: {
                                         fontSize: 16,

package/dist/esm/components/DefinitionBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"DefinitionBox.js","sources":["../../../../src/components/DefinitionBox.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState } from 'react';\nimport { Box, styled, Typography } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { AddRounded, CloseRounded } from '@mui/icons-material';\n\ninterface DefinitionBoxProps {\n  term: string;\n  definition: string;\n  children: React.ReactNode;\n}\n\nconst StyledWrapper = styled(Box)(({ theme }) => ({\n  // No specific wrapper styles needed, just a container\n}));\n\nconst StyledParagraph = styled(Typography)(({ theme }) => ({\n  fontSize: '14px', // text-[14px]\n  color: theme.palette.dark.main, // text-[#4D3019]\n  display: 'inline-flex',\n  alignItems: 'center',\n}));\n\nconst StyledTermWrapper = styled(Box)(({ theme }) => ({\n  position: 'relative',\n  display: 'inline-flex',\n  alignItems: 'center',\n  cursor: 'pointer',\n  marginLeft: theme.spacing(0.5), // ml-1\n}));\n\nconst StyledTerm = styled('span', {\n  shouldForwardProp: (prop) => prop !== 'isOpen',\n})<{ isOpen: boolean }>(({ theme, isOpen }) => ({\n  paddingBottom: '1px', // style={{ paddingBottom: '1px' }}\n  borderBottom: `2px solid ${isOpen ? theme.palette.secondary.main : theme.palette.dark.main}`, // border-b-2\n  transition: 'border-bottom-color 0.2s', // transition-colors\n  '&:hover': {\n    borderBottomColor: theme.palette.secondary.main, // hover effect\n  },\n}));\n\nconst StyledIconWrapper = styled(Box)(({ theme }) => ({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  marginLeft: theme.spacing(0.5), // ml-1\n  transition: 'color 0.2s', // transition-colors\n}));\n\nconst StyledDefinitionBox = styled(Box)(({ theme }) => ({\n  marginTop: theme.spacing(2), // mt-4\n  padding: theme.spacing(2), // p-4\n  borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2, // rounded-lg\n  border: `1px solid ${theme.palette.dark.main}33`, // border-[#4D3019]/20\n  borderRight: `4px solid ${theme.palette.dark.main}33`, // border-r-4\n  backgroundColor: theme.palette.light.main, // style={{ backgroundColor: '#FDFCEE' }}\n}));\n\nconst StyledDefinitionText = styled(Typography)(({ theme }) => ({\n  fontSize: '14px', // text-[14px]\n  color: theme.palette.dark.main, // text-[#4D3019]\n  lineHeight: 1.5, // leading-relaxed\n}));\n\nexport function DefinitionBox({ term, definition, children }: DefinitionBoxProps) {\n  const { theme } = useTheme();\n  const [isOpen, setIsOpen] = useState(false);\n\n  return (\n    <StyledWrapper>\n      <StyledParagraph>\n        {children}\n        <StyledTermWrapper onClick={() => setIsOpen(!isOpen)}>\n          <StyledTerm\n            isOpen={isOpen}\n            onMouseEnter={(e) => (e.currentTarget.style.borderBottomColor = theme.palette.secondary.main)}\n            onMouseLeave={(e) => (e.currentTarget.style.borderBottomColor = isOpen ? theme.palette.secondary.main : theme.palette.dark.main)}\n          >\n            {term}\n          </StyledTerm>\n          <StyledIconWrapper>\n            {isOpen ? (\n              <CloseRounded\n                sx={{\n                  fontSize: 16,\n                  color: isOpen ? theme.palette.secondary.main : theme.palette.dark.main,\n                  '&:hover': {\n                    color: theme.palette.secondary.main\n                  }\n                }}\n              />\n            ) : (\n              <AddRounded\n                sx={{\n                  fontSize: 16,\n                  color: theme.palette.dark.main,\n                  '&:hover': {\n                    color: theme.palette.secondary.main\n                  }\n                }}\n              />\n            )}\n          </StyledIconWrapper>\n        </StyledTermWrapper>\n      </StyledParagraph>\n      {isOpen && (\n        <StyledDefinitionBox>\n          <StyledDefinitionText>{definition}</StyledDefinitionText>\n        </StyledDefinitionBox>\n      )}\n    </StyledWrapper>\n  );\n}"],"names":[],"mappings":";;;;;;;AAaA;AACE;AACD;AAED;;;AAGE;AACA;AACD;AAED;AACE;AACA;AACA;AACA;;AAED;AAED;;;;;;AAME;;AAEC;AACF;AAED;AACE;AACA;AACA;;;AAGD;AAED;;;;;AAKE;;;;AAID;AAED;;;;AAIC;AAEK;AACJ;;;AAmBgB;;AAEA;AACE;AACD;;AAMD;AACA;AACA;AACE;AACD;;AAcnB;;"}
+{"version":3,"file":"DefinitionBox.js","sources":["../../../../src/components/DefinitionBox.tsx"],"sourcesContent":["\n\nimport React, { useState } from 'react';\nimport { Box, styled, Typography } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { AddRounded, CloseRounded } from '@mui/icons-material';\n\ninterface DefinitionBoxProps {\n  term: string;\n  definition: string;\n  children: React.ReactNode;\n}\n\nconst StyledWrapper = styled(Box)(({ theme }) => ({\n  // No specific wrapper styles needed, just a container\n}));\n\nconst StyledParagraph = styled(Typography)(({ theme }) => ({\n  fontSize: '14px', // text-[14px]\n  color: theme.palette.dark.main, // text-[#4D3019]\n  display: 'inline-flex',\n  alignItems: 'center',\n}));\n\nconst StyledTermWrapper = styled(Box)(({ theme }) => ({\n  position: 'relative',\n  display: 'inline-flex',\n  alignItems: 'center',\n  cursor: 'pointer',\n  marginLeft: theme.spacing(0.5), // ml-1\n}));\n\nconst StyledTerm = styled('span', {\n  shouldForwardProp: (prop) => prop !== 'isOpen',\n})<{ isOpen: boolean }>(({ theme, isOpen }) => ({\n  paddingBottom: '1px', // style={{ paddingBottom: '1px' }}\n  borderBottom: `2px solid ${isOpen ? theme.palette.secondary.main : theme.palette.dark.main}`, // border-b-2\n  transition: 'border-bottom-color 0.2s', // transition-colors\n  '&:hover': {\n    borderBottomColor: theme.palette.secondary.main, // hover effect\n  },\n}));\n\nconst StyledIconWrapper = styled(Box)(({ theme }) => ({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  marginLeft: theme.spacing(0.5), // ml-1\n  transition: 'color 0.2s', // transition-colors\n}));\n\nconst StyledDefinitionBox = styled(Box)(({ theme }) => ({\n  marginTop: theme.spacing(2), // mt-4\n  padding: theme.spacing(2), // p-4\n  borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2, // rounded-lg\n  border: `1px solid ${theme.palette.dark.main}33`, // border-[#4D3019]/20\n  borderRight: `4px solid ${theme.palette.dark.main}33`, // border-r-4\n  backgroundColor: theme.palette.light.main, // style={{ backgroundColor: '#FDFCEE' }}\n}));\n\nconst StyledDefinitionText = styled(Typography)(({ theme }) => ({\n  fontSize: '14px', // text-[14px]\n  color: theme.palette.dark.main, // text-[#4D3019]\n  lineHeight: 1.5, // leading-relaxed\n}));\n\nexport function DefinitionBox({ term, definition, children }: DefinitionBoxProps) {\n  const theme = useTheme();\n  const [isOpen, setIsOpen] = useState(false);\n\n  return (\n    <StyledWrapper>\n      <StyledParagraph>\n        {children}\n        <StyledTermWrapper onClick={() => setIsOpen(!isOpen)}>\n          <StyledTerm\n            isOpen={isOpen}\n            onMouseEnter={(e) => (e.currentTarget.style.borderBottomColor = theme.palette.secondary.main)}\n            onMouseLeave={(e) => (e.currentTarget.style.borderBottomColor = isOpen ? theme.palette.secondary.main : theme.palette.dark.main)}\n          >\n            {term}\n          </StyledTerm>\n          <StyledIconWrapper>\n            {isOpen ? (\n              <CloseRounded\n                sx={{\n                  fontSize: 16,\n                  color: isOpen ? theme.palette.secondary.main : theme.palette.dark.main,\n                  '&:hover': {\n                    color: theme.palette.secondary.main\n                  }\n                }}\n              />\n            ) : (\n              <AddRounded\n                sx={{\n                  fontSize: 16,\n                  color: theme.palette.dark.main,\n                  '&:hover': {\n                    color: theme.palette.secondary.main\n                  }\n                }}\n              />\n            )}\n          </StyledIconWrapper>\n        </StyledTermWrapper>\n      </StyledParagraph>\n      {isOpen && (\n        <StyledDefinitionBox>\n          <StyledDefinitionText>{definition}</StyledDefinitionText>\n        </StyledDefinitionBox>\n      )}\n    </StyledWrapper>\n  );\n}"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/Header.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { styled, Box, Typography, TextField, IconButton } from '@mui/material';
 import { useTheme } from '../ThemeProvider.js';
@@ -165,7 +164,7 @@ const StyledUserName = styled(Typography)(({ theme }) => ({
     },
 }));
 const Header = ({ userName = 'John Doe', userInitials = 'JD', }) => {
-    const { theme } = useTheme();
+    const theme = useTheme();
     return (jsxs(StyledHeader, { children: [jsxs(StyledLogoWrapper, { children: [jsx(StyledLogoIcon, { children: jsx(SchoolRounded, { sx: { fontSize: 32, color: 'currentColor' } }) }), jsx(StyledLogoText, { variant: "h1", children: theme.appName })] }), jsx(StyledSearchContainer, { children: jsx(StyledTextField, { placeholder: "Search for a policy", variant: "outlined", fullWidth: true, InputProps: {
                         endAdornment: (jsx(StyledSearchButton, { children: jsx(StyledSearchIcon, { children: jsx(SearchRounded, { sx: { fontSize: 20 } }) }) })),
                     } }) }), jsxs(StyledUserContainer, { children: [jsx(StyledAvatar, { children: jsx(StyledAvatarText, { children: userInitials }) }), jsx(StyledUserName, { children: userName })] })] }));

package/dist/esm/components/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../../../src/components/Header.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { Box, styled, Typography, TextField, IconButton } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { SchoolRounded, SearchRounded } from '@mui/icons-material';\n\ninterface HeaderProps {\n  userName?: string;\n  userInitials?: string;\n}\n\nconst StyledHeader = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(1.5, 4), // px-4 py-3\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  gap: theme.spacing(2), // gap-2\n  backgroundColor: theme.palette.primary.main, // var(--color-primary)\n  [theme.breakpoints.up('sm')]: {\n    padding: theme.spacing(2, 6), // sm:px-6\n  },\n  [theme.breakpoints.up('md')]: {\n    padding: theme.spacing(2, 8), // md:px-8\n    gap: theme.spacing(4), // md:gap-4\n  },\n}));\n\nconst StyledLogoWrapper = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(2), // md:gap-2\n  [theme.breakpoints.down('md')]: {\n    gap: theme.spacing(1.5), // gap-1.5\n  },\n}));\n\nconst StyledLogoIcon = styled(Box)(({ theme }) => ({\n  width: 32, // md:w-8 md:h-8\n  height: 32,\n  color: theme.palette.light.main, // text-[#FDFCEE]\n  [theme.breakpoints.down('md')]: {\n    width: 24, // w-6\n    height: 24, // h-6\n  },\n}));\n\nconst StyledLogoText = styled(Typography)(({ theme }) => ({\n  color: theme.palette.light.main, // text-[#FDFCEE]\n  fontWeight: 700, // font-bold\n  letterSpacing: '0.05em', // tracking-wide\n  fontSize: '1.5rem', // text-2xl\n  [theme.breakpoints.down('md')]: {\n    fontSize: '1.25rem', // sm:text-xl\n  },\n  [theme.breakpoints.down('sm')]: {\n    fontSize: '1.125rem', // text-lg\n  },\n}));\n\nconst StyledSearchContainer = styled(Box)(({ theme }) => ({\n  flex: 1,\n  maxWidth: '32rem', // max-w-2xl\n  margin: theme.spacing(0, 8), // mx-8\n  position: 'relative',\n  [theme.breakpoints.down('md')]: {\n    margin: theme.spacing(0, 4), // sm:mx-4\n  },\n  [theme.breakpoints.down('sm')]: {\n    margin: theme.spacing(0, 2), // mx-2\n  },\n}));\n\nconst StyledTextField = styled(TextField)(({ theme }) => ({\n  '& .MuiInputBase-root': {\n    backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n    color: theme.palette.dark.main, // text-[#4D3019]\n    borderRadius: '9999px', // rounded-full\n    paddingRight: theme.spacing(6), // pr-12\n    fontSize: '1rem', // text-base\n    [theme.breakpoints.down('md')]: {\n      paddingRight: theme.spacing(5), // sm:pr-10\n      fontSize: '0.875rem', // text-sm\n    },\n  },\n  '& .MuiInputBase-input': {\n    padding: theme.spacing(1.5, 3), // px-4 py-2\n    [theme.breakpoints.up('md')]: {\n      padding: theme.spacing(1.5, 4), // md:px-6 md:py-3\n    },\n    [theme.breakpoints.down('sm')]: {\n      padding: theme.spacing(1.5, 2.5), // sm:px-5\n    },\n  },\n  '& .MuiInputBase-input::placeholder': {\n    color: `${theme.palette.dark.main}99`, // placeholder-[#4D3019]/60\n    opacity: 1,\n  },\n  '& .MuiInputBase-root:focus-within': {\n    outline: `2px solid ${theme.palette.light.main}`, // focus:ring-2 focus:ring-[#FDFCEE]\n    outlineOffset: 0,\n  },\n}));\n\nconst StyledSearchButton = styled(IconButton)(({ theme }) => ({\n  position: 'absolute',\n  right: theme.spacing(2), // md:right-2\n  top: '50%',\n  transform: 'translateY(-50%)',\n  width: theme.spacing(5), // md:w-10\n  height: theme.spacing(5), // md:h-10\n  borderRadius: '50%', // rounded-full\n  backgroundColor: theme.palette.primary.main, // var(--color-primary)\n  '&:hover': {\n    opacity: 0.9, // hover:opacity-90\n    backgroundColor: theme.palette.primary.main,\n  },\n  [theme.breakpoints.down('md')]: {\n    right: theme.spacing(1), // right-1\n    width: theme.spacing(4), // w-8\n    height: theme.spacing(4), // h-8\n  },\n}));\n\nconst StyledSearchIcon = styled(Box)(({ theme }) => ({\n  width: 20, // md:w-5 md:h-5\n  height: 20,\n  color: theme.palette.light.main, // text-[#FDFCEE]\n  [theme.breakpoints.down('md')]: {\n    width: 16, // w-4\n    height: 16, // h-4\n  },\n}));\n\nconst StyledUserContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(3), // md:gap-3\n  [theme.breakpoints.down('md')]: {\n    gap: theme.spacing(2), // gap-2\n  },\n}));\n\nconst StyledAvatar = styled(Box)(({ theme }) => ({\n  width: theme.spacing(6), // md:w-12\n  height: theme.spacing(6), // md:h-12\n  borderRadius: '50%', // rounded-full\n  backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  flexShrink: 0,\n  [theme.breakpoints.down('md')]: {\n    width: theme.spacing(5), // sm:w-10\n    height: theme.spacing(5), // sm:h-10\n  },\n  [theme.breakpoints.down('sm')]: {\n    width: theme.spacing(4), // w-8\n    height: theme.spacing(4), // h-8\n  },\n}));\n\nconst StyledAvatarText = styled(Typography)(({ theme }) => ({\n  color: theme.palette.dark.main, // text-[#4D3019]\n  fontWeight: 700, // font-bold\n  fontSize: '1.125rem', // text-lg\n  [theme.breakpoints.down('md')]: {\n    fontSize: '0.875rem', // text-sm\n  },\n}));\n\nconst StyledUserName = styled(Typography)(({ theme }) => ({\n  color: theme.palette.light.main, // text-[#FDFCEE]\n  fontWeight: 500, // font-medium\n  fontSize: '1.125rem', // text-lg\n  display: 'none', // hidden\n  [theme.breakpoints.up('sm')]: {\n    display: 'inline', // sm:inline\n  },\n  [theme.breakpoints.down('md')]: {\n    fontSize: '0.875rem', // text-sm\n  },\n}));\n\nexport const Header: React.FC<HeaderProps> = ({\n  userName = 'John Doe',\n  userInitials = 'JD',\n}) => {\n  const { theme } = useTheme();\n\n  return (\n    <StyledHeader>\n      <StyledLogoWrapper>\n        <StyledLogoIcon>\n          <SchoolRounded sx={{fontSize:32, color: 'currentColor'}} />\n        </StyledLogoIcon>\n        <StyledLogoText variant=\"h1\">{theme.appName}</StyledLogoText>\n      </StyledLogoWrapper>\n\n      <StyledSearchContainer>\n        <StyledTextField\n          placeholder=\"Search for a policy\"\n          variant=\"outlined\"\n          fullWidth\n          InputProps={{\n            endAdornment: (\n              <StyledSearchButton>\n                <StyledSearchIcon>\n                  <SearchRounded sx={{fontSize: 20}} />\n                </StyledSearchIcon>\n              </StyledSearchButton>\n            ),\n          }}\n        />\n      </StyledSearchContainer>\n\n      <StyledUserContainer>\n        <StyledAvatar>\n          <StyledAvatarText>{userInitials}</StyledAvatarText>\n        </StyledAvatar>\n        <StyledUserName>{userName}</StyledUserName>\n      </StyledUserContainer>\n    </StyledHeader>\n  );\n};"],"names":[],"mappings":";;;;;;AAYA;;AAEE;AACA;AACA;;;;;AAKC;;;;AAIA;AACF;AAED;AACE;AACA;;;;AAIC;AACF;AAED;;AAEE;;;;;AAKC;AACF;AAED;;;;;;;AAOG;;;AAGA;AACF;AAED;AACE;;;AAGA;;;AAGC;;;AAGA;AACF;AAED;AACE;;;;;;;;;AASG;AACF;AACD;;;;AAIG;;;AAGA;AACF;AACD;;AAEE;AACD;AACD;;AAEE;AACD;AACF;AAED;AACE;;AAEA;AACA;;;;;AAKA;;AAEE;AACD;;;;;AAKA;AACF;AAED;;AAEE;;;;;AAKC;AACF;AAED;AACE;AACA;;;;AAIC;AACF;AAED;;;;;AAKE;AACA;AACA;AACA;;;;AAIC;;;;AAIA;AACF;AAED;;;;;;AAMG;AACF;AAED;;;;;;;AAOG;;;AAGA;AACF;AAEM;AAIL;;;;AAoCF;;"}
+{"version":3,"file":"Header.js","sources":["../../../../src/components/Header.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { Box, styled, Typography, TextField, IconButton } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { SchoolRounded, SearchRounded } from '@mui/icons-material';\n\ninterface HeaderProps {\n  userName?: string;\n  userInitials?: string;\n}\n\nconst StyledHeader = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(1.5, 4), // px-4 py-3\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  gap: theme.spacing(2), // gap-2\n  backgroundColor: theme.palette.primary.main, // var(--color-primary)\n  [theme.breakpoints.up('sm')]: {\n    padding: theme.spacing(2, 6), // sm:px-6\n  },\n  [theme.breakpoints.up('md')]: {\n    padding: theme.spacing(2, 8), // md:px-8\n    gap: theme.spacing(4), // md:gap-4\n  },\n}));\n\nconst StyledLogoWrapper = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(2), // md:gap-2\n  [theme.breakpoints.down('md')]: {\n    gap: theme.spacing(1.5), // gap-1.5\n  },\n}));\n\nconst StyledLogoIcon = styled(Box)(({ theme }) => ({\n  width: 32, // md:w-8 md:h-8\n  height: 32,\n  color: theme.palette.light.main, // text-[#FDFCEE]\n  [theme.breakpoints.down('md')]: {\n    width: 24, // w-6\n    height: 24, // h-6\n  },\n}));\n\nconst StyledLogoText = styled(Typography)(({ theme }) => ({\n  color: theme.palette.light.main, // text-[#FDFCEE]\n  fontWeight: 700, // font-bold\n  letterSpacing: '0.05em', // tracking-wide\n  fontSize: '1.5rem', // text-2xl\n  [theme.breakpoints.down('md')]: {\n    fontSize: '1.25rem', // sm:text-xl\n  },\n  [theme.breakpoints.down('sm')]: {\n    fontSize: '1.125rem', // text-lg\n  },\n}));\n\nconst StyledSearchContainer = styled(Box)(({ theme }) => ({\n  flex: 1,\n  maxWidth: '32rem', // max-w-2xl\n  margin: theme.spacing(0, 8), // mx-8\n  position: 'relative',\n  [theme.breakpoints.down('md')]: {\n    margin: theme.spacing(0, 4), // sm:mx-4\n  },\n  [theme.breakpoints.down('sm')]: {\n    margin: theme.spacing(0, 2), // mx-2\n  },\n}));\n\nconst StyledTextField = styled(TextField)(({ theme }) => ({\n  '& .MuiInputBase-root': {\n    backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n    color: theme.palette.dark.main, // text-[#4D3019]\n    borderRadius: '9999px', // rounded-full\n    paddingRight: theme.spacing(6), // pr-12\n    fontSize: '1rem', // text-base\n    [theme.breakpoints.down('md')]: {\n      paddingRight: theme.spacing(5), // sm:pr-10\n      fontSize: '0.875rem', // text-sm\n    },\n  },\n  '& .MuiInputBase-input': {\n    padding: theme.spacing(1.5, 3), // px-4 py-2\n    [theme.breakpoints.up('md')]: {\n      padding: theme.spacing(1.5, 4), // md:px-6 md:py-3\n    },\n    [theme.breakpoints.down('sm')]: {\n      padding: theme.spacing(1.5, 2.5), // sm:px-5\n    },\n  },\n  '& .MuiInputBase-input::placeholder': {\n    color: `${theme.palette.dark.main}99`, // placeholder-[#4D3019]/60\n    opacity: 1,\n  },\n  '& .MuiInputBase-root:focus-within': {\n    outline: `2px solid ${theme.palette.light.main}`, // focus:ring-2 focus:ring-[#FDFCEE]\n    outlineOffset: 0,\n  },\n}));\n\nconst StyledSearchButton = styled(IconButton)(({ theme }) => ({\n  position: 'absolute',\n  right: theme.spacing(2), // md:right-2\n  top: '50%',\n  transform: 'translateY(-50%)',\n  width: theme.spacing(5), // md:w-10\n  height: theme.spacing(5), // md:h-10\n  borderRadius: '50%', // rounded-full\n  backgroundColor: theme.palette.primary.main, // var(--color-primary)\n  '&:hover': {\n    opacity: 0.9, // hover:opacity-90\n    backgroundColor: theme.palette.primary.main,\n  },\n  [theme.breakpoints.down('md')]: {\n    right: theme.spacing(1), // right-1\n    width: theme.spacing(4), // w-8\n    height: theme.spacing(4), // h-8\n  },\n}));\n\nconst StyledSearchIcon = styled(Box)(({ theme }) => ({\n  width: 20, // md:w-5 md:h-5\n  height: 20,\n  color: theme.palette.light.main, // text-[#FDFCEE]\n  [theme.breakpoints.down('md')]: {\n    width: 16, // w-4\n    height: 16, // h-4\n  },\n}));\n\nconst StyledUserContainer = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: theme.spacing(3), // md:gap-3\n  [theme.breakpoints.down('md')]: {\n    gap: theme.spacing(2), // gap-2\n  },\n}));\n\nconst StyledAvatar = styled(Box)(({ theme }) => ({\n  width: theme.spacing(6), // md:w-12\n  height: theme.spacing(6), // md:h-12\n  borderRadius: '50%', // rounded-full\n  backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  flexShrink: 0,\n  [theme.breakpoints.down('md')]: {\n    width: theme.spacing(5), // sm:w-10\n    height: theme.spacing(5), // sm:h-10\n  },\n  [theme.breakpoints.down('sm')]: {\n    width: theme.spacing(4), // w-8\n    height: theme.spacing(4), // h-8\n  },\n}));\n\nconst StyledAvatarText = styled(Typography)(({ theme }) => ({\n  color: theme.palette.dark.main, // text-[#4D3019]\n  fontWeight: 700, // font-bold\n  fontSize: '1.125rem', // text-lg\n  [theme.breakpoints.down('md')]: {\n    fontSize: '0.875rem', // text-sm\n  },\n}));\n\nconst StyledUserName = styled(Typography)(({ theme }) => ({\n  color: theme.palette.light.main, // text-[#FDFCEE]\n  fontWeight: 500, // font-medium\n  fontSize: '1.125rem', // text-lg\n  display: 'none', // hidden\n  [theme.breakpoints.up('sm')]: {\n    display: 'inline', // sm:inline\n  },\n  [theme.breakpoints.down('md')]: {\n    fontSize: '0.875rem', // text-sm\n  },\n}));\n\nexport const Header: React.FC<HeaderProps> = ({\n  userName = 'John Doe',\n  userInitials = 'JD',\n}) => {\n  const theme = useTheme();\n\n  return (\n    <StyledHeader>\n      <StyledLogoWrapper>\n        <StyledLogoIcon>\n          <SchoolRounded sx={{fontSize:32, color: 'currentColor'}} />\n        </StyledLogoIcon>\n        <StyledLogoText variant=\"h1\">{theme.appName}</StyledLogoText>\n      </StyledLogoWrapper>\n\n      <StyledSearchContainer>\n        <StyledTextField\n          placeholder=\"Search for a policy\"\n          variant=\"outlined\"\n          fullWidth\n          InputProps={{\n            endAdornment: (\n              <StyledSearchButton>\n                <StyledSearchIcon>\n                  <SearchRounded sx={{fontSize: 20}} />\n                </StyledSearchIcon>\n              </StyledSearchButton>\n            ),\n          }}\n        />\n      </StyledSearchContainer>\n\n      <StyledUserContainer>\n        <StyledAvatar>\n          <StyledAvatarText>{userInitials}</StyledAvatarText>\n        </StyledAvatar>\n        <StyledUserName>{userName}</StyledUserName>\n      </StyledUserContainer>\n    </StyledHeader>\n  );\n};"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/Input.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { styled, InputLabel, TextField } from '@mui/material';
 

package/dist/esm/components/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sources":["../../../../src/components/Input.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { styled, TextField, TextFieldProps, InputLabel } from '@mui/material';\n\ninterface InputProps extends Omit<TextFieldProps, 'variant' | 'error'> {\n  error?: string;\n}\n\nconst InputWrapper = styled('div')(({ theme }) => ({\n  width: '100%',\n}));\n\nconst StyledLabel = styled(InputLabel)(({ theme }) => ({\n  fontSize: '0.875rem',\n  fontWeight: 500,\n  color: theme.palette.dark.main,\n  marginBottom: theme.spacing(0.75),\n  display: 'block',\n  position: 'static',\n  transform: 'none',\n  '&.Mui-focused': {\n    color: theme.palette.dark.main,\n  },\n}));\n\nconst StyledTextField = styled(TextField, {\n  shouldForwardProp: (prop) => !['errorMessage'].includes(prop as string),\n})<{ errorMessage?: string }>(({ theme, errorMessage }) => ({\n  width: '100%',\n  '& .MuiInputBase-root': {\n    backgroundColor: theme.palette.light.main,\n    borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2,\n    fontSize: '1rem',\n    color: theme.palette.dark.main,\n    minWidth: 0,\n    padding: theme.spacing(0, 3),\n    [theme.breakpoints.up('sm')]: {\n      padding: theme.spacing(0, 4),\n    },\n    '& .MuiInputBase-input': {\n      padding: theme.spacing(1, 0),\n      [theme.breakpoints.up('sm')]: {\n        padding: theme.spacing(1.25, 0),\n      },\n    },\n    '&:focus-within': {\n      outline: `2px solid ${errorMessage ? theme.palette.accent.main : theme.palette.primary.main}`,\n      outlineOffset: 0,\n    },\n    '& .MuiOutlinedInput-notchedOutline': {\n      borderColor: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}33`,\n    },\n    '&:hover .MuiOutlinedInput-notchedOutline': {\n      borderColor: errorMessage ? theme.palette.accent.main : theme.palette.primary.main,\n    },\n    '&.Mui-disabled': {\n      backgroundColor: `${theme.palette.dark.main}0D`,\n      '& .MuiInputBase-input': {\n        color: `${theme.palette.dark.main}80`,\n        cursor: 'not-allowed',\n      },\n      '& .MuiOutlinedInput-notchedOutline': {\n        borderColor: `${theme.palette.dark.main}33`,\n      },\n    },\n  },\n  '& .MuiFormHelperText-root': {\n    marginTop: theme.spacing(0.75),\n    fontSize: '0.875rem',\n    color: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}99`,\n  },\n}));\n\nexport const Input: React.FC<InputProps> = ({\n  error,\n  fullWidth = false,\n  id,\n  label,\n  ...props\n}) => {\n  const inputId = id || `input-${Math.random().toString(36).substr(2, 9)}`;\n\n  return (\n    <InputWrapper sx={{ ...(!fullWidth && { width: 'auto' }) }}>\n      {label && (\n        <StyledLabel htmlFor={inputId}>\n          {label}\n        </StyledLabel>\n      )}\n      <StyledTextField\n        id={inputId}\n        error={!!error}\n        helperText={error || props.helperText}\n        errorMessage={error}\n        fullWidth={fullWidth}\n        variant=\"outlined\"\n        {...props}\n      />\n    </InputWrapper>\n  );\n};"],"names":[],"mappings":";;;;AASA;AACE;AACD;AAED;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACE;AACD;AACF;AAED;AACE;;AAEA;AACA;AACE;;;;AAIA;AACA;AACA;;;;AAIC;AACD;;;;AAIG;AACF;AACD;;AAEE;AACD;AACD;;AAEC;AACD;;AAEC;AACD;;AAEE;;AAEE;AACD;AACD;;AAEC;AACF;AACF;AACD;AACE;AACA;;AAED;AACF;;;AAWC;AAkBF;;"}
+{"version":3,"file":"Input.js","sources":["../../../../src/components/Input.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { styled, TextField, TextFieldProps, InputLabel } from '@mui/material';\n\ninterface InputProps extends Omit<TextFieldProps, 'variant' | 'error'> {\n  error?: string;\n}\n\nconst InputWrapper = styled('div')(({ theme }) => ({\n  width: '100%',\n}));\n\nconst StyledLabel = styled(InputLabel)(({ theme }) => ({\n  fontSize: '0.875rem',\n  fontWeight: 500,\n  color: theme.palette.dark.main,\n  marginBottom: theme.spacing(0.75),\n  display: 'block',\n  position: 'static',\n  transform: 'none',\n  '&.Mui-focused': {\n    color: theme.palette.dark.main,\n  },\n}));\n\nconst StyledTextField = styled(TextField, {\n  shouldForwardProp: (prop) => !['errorMessage'].includes(prop as string),\n})<{ errorMessage?: string }>(({ theme, errorMessage }) => ({\n  width: '100%',\n  '& .MuiInputBase-root': {\n    backgroundColor: theme.palette.light.main,\n    borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2,\n    fontSize: '1rem',\n    color: theme.palette.dark.main,\n    minWidth: 0,\n    padding: theme.spacing(0, 3),\n    [theme.breakpoints.up('sm')]: {\n      padding: theme.spacing(0, 4),\n    },\n    '& .MuiInputBase-input': {\n      padding: theme.spacing(1, 0),\n      [theme.breakpoints.up('sm')]: {\n        padding: theme.spacing(1.25, 0),\n      },\n    },\n    '&:focus-within': {\n      outline: `2px solid ${errorMessage ? theme.palette.accent.main : theme.palette.primary.main}`,\n      outlineOffset: 0,\n    },\n    '& .MuiOutlinedInput-notchedOutline': {\n      borderColor: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}33`,\n    },\n    '&:hover .MuiOutlinedInput-notchedOutline': {\n      borderColor: errorMessage ? theme.palette.accent.main : theme.palette.primary.main,\n    },\n    '&.Mui-disabled': {\n      backgroundColor: `${theme.palette.dark.main}0D`,\n      '& .MuiInputBase-input': {\n        color: `${theme.palette.dark.main}80`,\n        cursor: 'not-allowed',\n      },\n      '& .MuiOutlinedInput-notchedOutline': {\n        borderColor: `${theme.palette.dark.main}33`,\n      },\n    },\n  },\n  '& .MuiFormHelperText-root': {\n    marginTop: theme.spacing(0.75),\n    fontSize: '0.875rem',\n    color: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}99`,\n  },\n}));\n\nexport const Input: React.FC<InputProps> = ({\n  error,\n  fullWidth = false,\n  id,\n  label,\n  ...props\n}) => {\n  const inputId = id || `input-${Math.random().toString(36).substr(2, 9)}`;\n\n  return (\n    <InputWrapper sx={{ ...(!fullWidth && { width: 'auto' }) }}>\n      {label && (\n        <StyledLabel htmlFor={inputId}>\n          {label}\n        </StyledLabel>\n      )}\n      <StyledTextField\n        id={inputId}\n        error={!!error}\n        helperText={error || props.helperText}\n        errorMessage={error}\n        fullWidth={fullWidth}\n        variant=\"outlined\"\n        {...props}\n      />\n    </InputWrapper>\n  );\n};"],"names":["_jsxs","_jsx"],"mappings":";;;AASA,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AACjD,IAAA,KAAK,EAAE,MAAM;AACd,CAAA,CAAC,CAAC;AAEH,MAAM,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AACrD,IAAA,QAAQ,EAAE,UAAU;AACpB,IAAA,UAAU,EAAE,GAAG;AACf,IAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;AAC9B,IAAA,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;AACjC,IAAA,OAAO,EAAE,OAAO;AAChB,IAAA,QAAQ,EAAE,QAAQ;AAClB,IAAA,SAAS,EAAE,MAAM;AACjB,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;AAC/B,KAAA;AACF,CAAA,CAAC,CAAC;AAEH,MAAM,eAAe,GAAG,MAAM,CAAC,SAAS,EAAE;AACxC,IAAA,iBAAiB,EAAE,CAAC,IAAI,KAAK,CAAC,CAAC,cAAc,CAAC,CAAC,QAAQ,CAAC,IAAc,CAAC;CACxE,CAAC,CAA4B,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM;AAC1D,IAAA,KAAK,EAAE,MAAM;AACb,IAAA,sBAAsB,EAAE;AACtB,QAAA,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI;QACzC,YAAY,EAAE,CAAC,OAAO,KAAK,CAAC,KAAK,CAAC,YAAY,KAAK;cACnD,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY,EAAE,EAAE;cACrC,KAAK,CAAC,KAAK,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC;AAClC,QAAA,QAAQ,EAAE,MAAM;AAChB,QAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;AAC9B,QAAA,QAAQ,EAAE,CAAC;QACX,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;QAC5B,CAAC,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;YAC5B,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;AAC7B,SAAA;AACD,QAAA,uBAAuB,EAAE;YACvB,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;YAC5B,CAAC,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;gBAC5B,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,CAAC;AAChC,aAAA;AACF,SAAA;AACD,QAAA,gBAAgB,EAAE;YAChB,OAAO,EAAE,aAAa,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAA,CAAE;AAC7F,YAAA,aAAa,EAAE,CAAC;AACjB,SAAA;AACD,QAAA,oCAAoC,EAAE;YACpC,WAAW,EAAE,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,GAAG,CAAA,EAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AACvF,SAAA;AACD,QAAA,0CAA0C,EAAE;YAC1C,WAAW,EAAE,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI;AACnF,SAAA;AACD,QAAA,gBAAgB,EAAE;YAChB,eAAe,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AAC/C,YAAA,uBAAuB,EAAE;gBACvB,KAAK,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AACrC,gBAAA,MAAM,EAAE,aAAa;AACtB,aAAA;AACD,YAAA,oCAAoC,EAAE;gBACpC,WAAW,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AAC5C,aAAA;AACF,SAAA;AACF,KAAA;AACD,IAAA,2BAA2B,EAAE;AAC3B,QAAA,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;AAC9B,QAAA,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,GAAG,CAAA,EAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AACjF,KAAA;AACF,CAAA,CAAC,CAAC;MAEU,KAAK,GAAyB,CAAC,EAC1C,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,EAAE,EACF,KAAK,EACL,GAAG,KAAK,EACT,KAAI;IACH,MAAM,OAAO,GAAG,EAAE,IAAI,SAAS,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA,CAAE;AAExE,IAAA,QACEA,IAAA,CAAC,YAAY,EAAA,EAAC,EAAE,EAAE,EAAE,IAAI,CAAC,SAAS,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,EAAA,QAAA,EAAA,CACvD,KAAK,KACJC,GAAA,CAAC,WAAW,EAAA,EAAC,OAAO,EAAE,OAAO,EAAA,QAAA,EAC1B,KAAK,EAAA,CACM,CACf,EACDA,GAAA,CAAC,eAAe,EAAA,EACd,EAAE,EAAE,OAAO,EACX,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,UAAU,EAAE,KAAK,IAAI,KAAK,CAAC,UAAU,EACrC,YAAY,EAAE,KAAK,EACnB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAC,UAAU,EAAA,GACd,KAAK,EAAA,CACT,CAAA,EAAA,CACW;AAEnB;;;;"}

package/dist/esm/components/Modal.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { styled, Dialog, IconButton, DialogContent, Box, Chip, Typography, Alert, TextField } from '@mui/material';

package/dist/esm/components/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sources":["../../../../src/components/Modal.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState } from 'react';\nimport {\n  Dialog,\n  DialogContent,\n  IconButton,\n  Box,\n  Typography,\n  TextField,\n  Checkbox,\n  FormControlLabel,\n  Alert as MuiAlert,\n  Chip,\n  styled,\n} from '@mui/material';\nimport { Button } from './Button';\nimport { ChevronLeftRounded, ChevronRightRounded, CloseRounded, ErrorOutlineRounded, StickyNote2Rounded } from '@mui/icons-material';\n\ninterface ModalProps {\n  isOpen: boolean;\n  onClose: () => void;\n  status: 'mandatory' | 'optional' | 'accepted' | 'action-required' | 'action-required-note' | 'accepted-note';\n  description: string;\n  defaultText: string;\n  note?: string;\n  acceptSuggestion?: boolean;\n  onAcceptSuggestionChange?: (checked: boolean) => void;\n  onSave?: () => void;\n  onSubmit?: () => void;\n  onDeclineWording?: () => void;\n  onPrevious?: () => void;\n  onNext?: () => void;\n  currentPage?: number;\n  totalPages?: number;\n}\n\nconst StyledDialog = styled(Dialog)(({ theme }) => ({\n  '& .MuiDialog-paper': {\n    borderRadius: theme.shape.borderRadius,\n    maxWidth: '896px',\n    width: '100%',\n    maxHeight: '90vh',\n  },\n}));\n\nconst NavButton = styled(IconButton)(({ theme }) => ({\n  width: '40px',\n  height: '40px',\n  border: `2px solid ${theme.palette.dark.main}`,\n  backgroundColor: theme.palette.light.main,\n  '&:hover': {\n    backgroundColor: theme.palette.dark.main,\n    color: theme.palette.light.main,\n  },\n}));\n\nexport const Modal: React.FC<ModalProps> = ({\n  isOpen,\n  onClose,\n  status,\n  description,\n  defaultText,\n  note,\n  acceptSuggestion: initialAcceptSuggestion = true,\n  onAcceptSuggestionChange,\n  onSave,\n  onSubmit,\n  onDeclineWording,\n  onPrevious,\n  onNext,\n  currentPage = 1,\n  totalPages = 1,\n}) => {\n  const [textValue, setTextValue] = useState(defaultText);\n  const [acceptSuggestion, setAcceptSuggestion] = useState(initialAcceptSuggestion);\n\n  const handleAcceptSuggestionChange = (checked: boolean) => {\n    setAcceptSuggestion(checked);\n    onAcceptSuggestionChange?.(checked);\n  };\n\n  const statusConfig = {\n    mandatory: {\n      color: '#F5A623',\n      label: 'Mandatory',\n    },\n    optional: {\n      color: '#F5D76E',\n      label: 'Optional',\n    },\n    accepted: {\n      color: '#A3D977',\n      label: 'Accepted',\n    },\n    'action-required': {\n      color: '#F56B6B',\n      label: 'Action Required',\n    },\n    'action-required-note': {\n      color: '#F56B6B',\n      label: 'Action Required',\n    },\n    'accepted-note': {\n      color: '#A3D977',\n      label: 'Accepted',\n    },\n  };\n\n  const statusStyle = statusConfig[status];\n\n  return (\n    <StyledDialog open={isOpen} onClose={onClose} maxWidth=\"md\" fullWidth>\n      <IconButton\n        onClick={onClose}\n        sx={{\n          position: 'absolute',\n          top: 16,\n          right: 16,\n          zIndex: 1,\n        }}\n      >\n        <CloseRounded sx={{fontSize:24}} />\n      </IconButton>\n\n      <DialogContent sx={{ p: { xs: 3, sm: 4, md: 6 } }}>\n        <Box sx={{ mb: 3 }}>\n          <Chip\n            label={statusStyle.label}\n            sx={{\n              backgroundColor: statusStyle.color,\n              color: status === 'optional' ? '#4D3019' : '#fff',\n              fontWeight: 600,\n              fontSize: '0.875rem',\n              height: 'auto',\n              py: 1,\n              px: 2,\n            }}\n          />\n        </Box>\n\n        <Typography sx={{ mb: 3, lineHeight: 1.6 }}>\n          {description}\n        </Typography>\n\n        {status === 'action-required-note' && note && (\n          <MuiAlert\n            icon={<ErrorOutlineRounded sx={{fontSize:20}} />}\n            severity=\"error\"\n            sx={{\n              mb: 2,\n              backgroundColor: '#FFE6E6',\n              borderLeft: '4px solid #F56B6B',\n              '& .MuiAlert-icon': {\n                color: '#F56B6B',\n              },\n              '& .MuiAlert-message': {\n                color: '#4D3019',\n              },\n            }}\n          >\n            {note}\n          </MuiAlert>\n        )}\n\n        {status === 'accepted-note' && note && (\n          <MuiAlert\n            icon={<StickyNote2Rounded sx={{fontSize:20}} />}\n            severity=\"warning\"\n            sx={{\n              mb: 2,\n              backgroundColor: '#FFF9E6',\n              borderLeft: '4px solid #F5D76E',\n              '& .MuiAlert-icon': {\n                color: '#F5A623',\n              },\n              '& .MuiAlert-message': {\n                color: '#4D3019',\n              },\n            }}\n          >\n            {note}\n          </MuiAlert>\n        )}\n\n        <TextField\n          multiline\n          rows={4}\n          fullWidth\n          value={textValue}\n          onChange={(e) => setTextValue(e.target.value)}\n          disabled={acceptSuggestion}\n          sx={{\n            mb: 2,\n            '& .MuiOutlinedInput-root': {\n              backgroundColor: acceptSuggestion ? 'rgba(0, 0, 0, 0.05)' : '#fff',\n            },\n          }}\n        />\n\n        <Box\n          sx={{\n            display: 'flex',\n            flexDirection: { xs: 'column', sm: 'row' },\n            alignItems: { xs: 'stretch', sm: 'center' },\n            justifyContent: 'space-between',\n            gap: 2,\n            pt: 3,\n            borderTop: '1px solid',\n            borderColor: 'divider',\n          }}\n        >\n          <Box sx={{ display: 'flex', gap: 1.5 }}>\n            <Button onClick={onSave} variant=\"secondary\" size=\"md\">\n              Save\n            </Button>\n            <Button onClick={onSubmit} variant=\"primary\" size=\"md\">\n              Submit for review\n            </Button>\n            <Button onClick={onDeclineWording} variant=\"danger\" size=\"md\">\n              Decline Wording\n            </Button>\n          </Box>\n\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              gap: 2,\n              justifyContent: { xs: 'space-between', sm: 'flex-end' },\n            }}\n          >\n            <Box sx={{ display: 'flex', gap: 1.5 }}>\n              <NavButton onClick={onPrevious} aria-label=\"Previous\">\n                <ChevronLeftRounded sx={{fontSize:20}} />\n              </NavButton>\n              <NavButton onClick={onNext} aria-label=\"Next\">\n                <ChevronRightRounded sx={{fontSize:20}} />\n              </NavButton>\n            </Box>\n            <Typography fontWeight={500} fontSize=\"1.125rem\" sx={{ ml: 1 }}>\n              {currentPage}/{totalPages}\n            </Typography>\n          </Box>\n        </Box>\n      </DialogContent>\n    </StyledDialog>\n  );\n};"],"names":[],"mappings":";;;;;;;AAqCA;AACE;AACE;AACA;AACA;AACA;AACD;AACF;AAED;AACE;AACA;;AAEA;AACA;AACE;AACA;AACD;AACF;;;;AA2BC;AACE;AACE;AACA;AACD;AACD;AACE;AACA;AACD;AACD;AACE;AACA;AACD;AACD;AACE;AACA;AACD;AACD;AACE;AACA;AACD;AACD;AACE;AACA;AACD;;AAGH;;AAOQ;AACA;AACA;AACA;;;;AAaI;AACA;AACA;AACA;AACA;;AAcA;AACA;AACA;AACA;AACE;AACD;AACD;AACE;AACD;AACF;AAWC;AACA;AACA;AACA;AACE;AACD;AACD;AACE;AACD;AACF;AAcD;AACA;;AAEC;AACF;AAKC;;;AAGA;AACA;AACA;AACA;AACA;AACD;AAgBG;AACA;AACA;;AAED;AAkBb;;"}
+{"version":3,"file":"Modal.js","sources":["../../../../src/components/Modal.tsx"],"sourcesContent":["\n\nimport React, { useState } from 'react';\nimport {\n  Dialog,\n  DialogContent,\n  IconButton,\n  Box,\n  Typography,\n  TextField,\n  Checkbox,\n  FormControlLabel,\n  Alert as MuiAlert,\n  Chip,\n  styled,\n} from '@mui/material';\nimport { Button } from './Button';\nimport { ChevronLeftRounded, ChevronRightRounded, CloseRounded, ErrorOutlineRounded, StickyNote2Rounded } from '@mui/icons-material';\n\ninterface ModalProps {\n  isOpen: boolean;\n  onClose: () => void;\n  status: 'mandatory' | 'optional' | 'accepted' | 'action-required' | 'action-required-note' | 'accepted-note';\n  description: string;\n  defaultText: string;\n  note?: string;\n  acceptSuggestion?: boolean;\n  onAcceptSuggestionChange?: (checked: boolean) => void;\n  onSave?: () => void;\n  onSubmit?: () => void;\n  onDeclineWording?: () => void;\n  onPrevious?: () => void;\n  onNext?: () => void;\n  currentPage?: number;\n  totalPages?: number;\n}\n\nconst StyledDialog = styled(Dialog)(({ theme }) => ({\n  '& .MuiDialog-paper': {\n    borderRadius: theme.shape.borderRadius,\n    maxWidth: '896px',\n    width: '100%',\n    maxHeight: '90vh',\n  },\n}));\n\nconst NavButton = styled(IconButton)(({ theme }) => ({\n  width: '40px',\n  height: '40px',\n  border: `2px solid ${theme.palette.dark.main}`,\n  backgroundColor: theme.palette.light.main,\n  '&:hover': {\n    backgroundColor: theme.palette.dark.main,\n    color: theme.palette.light.main,\n  },\n}));\n\nexport const Modal: React.FC<ModalProps> = ({\n  isOpen,\n  onClose,\n  status,\n  description,\n  defaultText,\n  note,\n  acceptSuggestion: initialAcceptSuggestion = true,\n  onAcceptSuggestionChange,\n  onSave,\n  onSubmit,\n  onDeclineWording,\n  onPrevious,\n  onNext,\n  currentPage = 1,\n  totalPages = 1,\n}) => {\n  const [textValue, setTextValue] = useState(defaultText);\n  const [acceptSuggestion, setAcceptSuggestion] = useState(initialAcceptSuggestion);\n\n  const handleAcceptSuggestionChange = (checked: boolean) => {\n    setAcceptSuggestion(checked);\n    onAcceptSuggestionChange?.(checked);\n  };\n\n  const statusConfig = {\n    mandatory: {\n      color: '#F5A623',\n      label: 'Mandatory',\n    },\n    optional: {\n      color: '#F5D76E',\n      label: 'Optional',\n    },\n    accepted: {\n      color: '#A3D977',\n      label: 'Accepted',\n    },\n    'action-required': {\n      color: '#F56B6B',\n      label: 'Action Required',\n    },\n    'action-required-note': {\n      color: '#F56B6B',\n      label: 'Action Required',\n    },\n    'accepted-note': {\n      color: '#A3D977',\n      label: 'Accepted',\n    },\n  };\n\n  const statusStyle = statusConfig[status];\n\n  return (\n    <StyledDialog open={isOpen} onClose={onClose} maxWidth=\"md\" fullWidth>\n      <IconButton\n        onClick={onClose}\n        sx={{\n          position: 'absolute',\n          top: 16,\n          right: 16,\n          zIndex: 1,\n        }}\n      >\n        <CloseRounded sx={{fontSize:24}} />\n      </IconButton>\n\n      <DialogContent sx={{ p: { xs: 3, sm: 4, md: 6 } }}>\n        <Box sx={{ mb: 3 }}>\n          <Chip\n            label={statusStyle.label}\n            sx={{\n              backgroundColor: statusStyle.color,\n              color: status === 'optional' ? '#4D3019' : '#fff',\n              fontWeight: 600,\n              fontSize: '0.875rem',\n              height: 'auto',\n              py: 1,\n              px: 2,\n            }}\n          />\n        </Box>\n\n        <Typography sx={{ mb: 3, lineHeight: 1.6 }}>\n          {description}\n        </Typography>\n\n        {status === 'action-required-note' && note && (\n          <MuiAlert\n            icon={<ErrorOutlineRounded sx={{fontSize:20}} />}\n            severity=\"error\"\n            sx={{\n              mb: 2,\n              backgroundColor: '#FFE6E6',\n              borderLeft: '4px solid #F56B6B',\n              '& .MuiAlert-icon': {\n                color: '#F56B6B',\n              },\n              '& .MuiAlert-message': {\n                color: '#4D3019',\n              },\n            }}\n          >\n            {note}\n          </MuiAlert>\n        )}\n\n        {status === 'accepted-note' && note && (\n          <MuiAlert\n            icon={<StickyNote2Rounded sx={{fontSize:20}} />}\n            severity=\"warning\"\n            sx={{\n              mb: 2,\n              backgroundColor: '#FFF9E6',\n              borderLeft: '4px solid #F5D76E',\n              '& .MuiAlert-icon': {\n                color: '#F5A623',\n              },\n              '& .MuiAlert-message': {\n                color: '#4D3019',\n              },\n            }}\n          >\n            {note}\n          </MuiAlert>\n        )}\n\n        <TextField\n          multiline\n          rows={4}\n          fullWidth\n          value={textValue}\n          onChange={(e) => setTextValue(e.target.value)}\n          disabled={acceptSuggestion}\n          sx={{\n            mb: 2,\n            '& .MuiOutlinedInput-root': {\n              backgroundColor: acceptSuggestion ? 'rgba(0, 0, 0, 0.05)' : '#fff',\n            },\n          }}\n        />\n\n        <Box\n          sx={{\n            display: 'flex',\n            flexDirection: { xs: 'column', sm: 'row' },\n            alignItems: { xs: 'stretch', sm: 'center' },\n            justifyContent: 'space-between',\n            gap: 2,\n            pt: 3,\n            borderTop: '1px solid',\n            borderColor: 'divider',\n          }}\n        >\n          <Box sx={{ display: 'flex', gap: 1.5 }}>\n            <Button onClick={onSave} variant=\"secondary\" size=\"md\">\n              Save\n            </Button>\n            <Button onClick={onSubmit} variant=\"primary\" size=\"md\">\n              Submit for review\n            </Button>\n            <Button onClick={onDeclineWording} variant=\"danger\" size=\"md\">\n              Decline Wording\n            </Button>\n          </Box>\n\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              gap: 2,\n              justifyContent: { xs: 'space-between', sm: 'flex-end' },\n            }}\n          >\n            <Box sx={{ display: 'flex', gap: 1.5 }}>\n              <NavButton onClick={onPrevious} aria-label=\"Previous\">\n                <ChevronLeftRounded sx={{fontSize:20}} />\n              </NavButton>\n              <NavButton onClick={onNext} aria-label=\"Next\">\n                <ChevronRightRounded sx={{fontSize:20}} />\n              </NavButton>\n            </Box>\n            <Typography fontWeight={500} fontSize=\"1.125rem\" sx={{ ml: 1 }}>\n              {currentPage}/{totalPages}\n            </Typography>\n          </Box>\n        </Box>\n      </DialogContent>\n    </StyledDialog>\n  );\n};"],"names":["_jsxs","_jsx","MuiAlert"],"mappings":"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"}

package/dist/esm/components/NoteBox.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { styled, Box, IconButton, Typography } from '@mui/material';

package/dist/esm/components/NoteBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"NoteBox.js","sources":["../../../../src/components/NoteBox.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState } from 'react';\nimport { Box, Typography, IconButton, styled } from '@mui/material';\nimport { EditRounded } from '@mui/icons-material';\n\ninterface NoteBoxProps {\n  variant?: 'default' | 'mandatory' | 'optional' | 'pending' | 'accepted' | 'action-required' | 'custom';\n  label?: string;\n  children: React.ReactNode;\n  className?: string;\n  onEditClick?: () => void;\n}\n\nconst NoteContainer = styled(Box)({\n  position: 'relative',\n  maxWidth: '100%',\n});\n\nconst EditButton = styled(IconButton)(({ theme }) => ({\n  position: 'absolute',\n  right: -4,\n  top: '50%',\n  transform: 'translateY(-50%)',\n  width: 24,\n  height: 24,\n  backgroundColor: '#4D3019',\n  opacity: 0,\n  transition: 'all 0.2s ease',\n  boxShadow: '0 1px 3px rgba(0,0,0,0.12)',\n  '&:hover': {\n    backgroundColor: '#4D3019',\n    transform: 'translateY(-50%) scale(1.1)',\n  },\n}));\n\nconst HighlightWrapper = styled(Box)<{ \n  isHovered: boolean; \n  highlightColor: string; \n  highlightSelectedColor: string;\n  isCustom: boolean;\n}>(({ isHovered, highlightColor, highlightSelectedColor, isCustom }) => ({\n  position: 'relative',\n  display: 'inline-block',\n  maxWidth: '100%',\n  '&:hover .edit-button': {\n    opacity: 1,\n  },\n  '& .highlight-span': {\n    background: isCustom ? highlightColor : (isHovered ? highlightSelectedColor : highlightColor),\n    padding: '2px 4px',\n    boxDecorationBreak: 'clone',\n    WebkitBoxDecorationBreak: 'clone',\n    transition: isCustom ? 'none' : 'background 0.2s ease',\n    cursor: isCustom ? 'default' : 'pointer',\n    fontSize: '13px',\n    wordWrap: 'break-word',\n    overflowWrap: 'break-word',\n    display: 'inline',\n    color: '#4D3019',\n  },\n}));\n\nexport const NoteBox: React.FC<NoteBoxProps> = ({\n  variant = 'default',\n  label,\n  children,\n  className = '',\n  onEditClick,\n}) => {\n  const [isHovered, setIsHovered] = useState(false);\n\n  const variants = {\n    default: {\n      highlight: '#FFEACD',\n      highlightSelected: '#FFC365',\n      label: '',\n      labelColor: '',\n    },\n    mandatory: {\n      highlight: '#FFEACD',\n      highlightSelected: '#FFC365',\n      label: 'Not Answered (Mandatory)',\n      labelColor: 'var(--color-secondary)',\n    },\n    optional: {\n      highlight: '#FFF6D1',\n      highlightSelected: '#FDE58E',\n      label: 'Not Answered (Optional)',\n      labelColor: 'var(--color-secondary)',\n    },\n    pending: {\n      highlight: '#F5E2FF',\n      highlightSelected: '#EBC7FF',\n      label: 'Pending',\n      labelColor: 'var(--color-secondary)',\n    },\n    accepted: {\n      highlight: '#EDF9CD',\n      highlightSelected: '#DBF59A',\n      label: 'Accepted',\n      labelColor: '#2D5016',\n    },\n    'action-required': {\n      highlight: '#FBEEEE',\n      highlightSelected: '#FFBCB3',\n      label: 'Action required before approval',\n      labelColor: '#CC0000',\n    },\n    custom: {\n      highlight: '#D9EDF8',\n      highlightSelected: '#B3E0F2',\n      label: 'Custom Text',\n      labelColor: 'var(--color-secondary)',\n    },\n  };\n\n  const style = variants[variant];\n  const displayLabel = label || style.label;\n\n  return (\n    <NoteContainer className={className}>\n      {displayLabel && (\n        <Box sx={{ mb: 1 }}>\n          <Typography\n            component=\"span\"\n            sx={{\n              fontSize: '13px',\n              fontWeight: 500,\n              color: style.labelColor || 'rgba(0, 0, 0, 0.6)',\n            }}\n          >\n            {displayLabel}\n          </Typography>\n        </Box>\n      )}\n      <HighlightWrapper\n        isHovered={isHovered}\n        highlightColor={style.highlight}\n        highlightSelectedColor={style.highlightSelected}\n        isCustom={variant === 'custom'}\n        onMouseEnter={() => variant !== 'custom' && setIsHovered(true)}\n        onMouseLeave={() => variant !== 'custom' && setIsHovered(false)}\n      >\n        <span className=\"highlight-span\">\n          {children}\n        </span>\n        <EditButton\n          className=\"edit-button\"\n          onClick={(e) => {\n            e.stopPropagation();\n            if (onEditClick) {\n              onEditClick();\n            }\n          }}\n          title=\"Edit variable highlight\"\n          size=\"small\"\n        >\n          <EditRounded sx={{fontSize:14, color:\"#FFFFFF\", strokeWidth:2}} />\n        </EditButton>\n      </HighlightWrapper>\n    </NoteContainer>\n  );\n};"],"names":[],"mappings":";;;;;;AAcA;AACE;AACA;AACD;AAED;AACE;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACE;AACA;AACD;AACF;AAED;AAME;AACA;AACA;AACA;AACE;AACD;AACD;AACE;AACA;AACA;AACA;;;AAGA;AACA;AACA;AACA;AACA;AACD;AACF;;;AAWC;AACE;AACE;AACA;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACA;AACD;;AAGH;AACA;AAEA;AAOY;AACA;AACA;AACD;;;AAsBC;;AAEJ;AASV;;"}
+{"version":3,"file":"NoteBox.js","sources":["../../../../src/components/NoteBox.tsx"],"sourcesContent":["\n\nimport React, { useState } from 'react';\nimport { Box, Typography, IconButton, styled } from '@mui/material';\nimport { EditRounded } from '@mui/icons-material';\n\ninterface NoteBoxProps {\n  variant?: 'default' | 'mandatory' | 'optional' | 'pending' | 'accepted' | 'action-required' | 'custom';\n  label?: string;\n  children: React.ReactNode;\n  className?: string;\n  onEditClick?: () => void;\n}\n\nconst NoteContainer = styled(Box)({\n  position: 'relative',\n  maxWidth: '100%',\n});\n\nconst EditButton = styled(IconButton)(({ theme }) => ({\n  position: 'absolute',\n  right: -4,\n  top: '50%',\n  transform: 'translateY(-50%)',\n  width: 24,\n  height: 24,\n  backgroundColor: '#4D3019',\n  opacity: 0,\n  transition: 'all 0.2s ease',\n  boxShadow: '0 1px 3px rgba(0,0,0,0.12)',\n  '&:hover': {\n    backgroundColor: '#4D3019',\n    transform: 'translateY(-50%) scale(1.1)',\n  },\n}));\n\nconst HighlightWrapper = styled(Box)<{ \n  isHovered: boolean; \n  highlightColor: string; \n  highlightSelectedColor: string;\n  isCustom: boolean;\n}>(({ isHovered, highlightColor, highlightSelectedColor, isCustom }) => ({\n  position: 'relative',\n  display: 'inline-block',\n  maxWidth: '100%',\n  '&:hover .edit-button': {\n    opacity: 1,\n  },\n  '& .highlight-span': {\n    background: isCustom ? highlightColor : (isHovered ? highlightSelectedColor : highlightColor),\n    padding: '2px 4px',\n    boxDecorationBreak: 'clone',\n    WebkitBoxDecorationBreak: 'clone',\n    transition: isCustom ? 'none' : 'background 0.2s ease',\n    cursor: isCustom ? 'default' : 'pointer',\n    fontSize: '13px',\n    wordWrap: 'break-word',\n    overflowWrap: 'break-word',\n    display: 'inline',\n    color: '#4D3019',\n  },\n}));\n\nexport const NoteBox: React.FC<NoteBoxProps> = ({\n  variant = 'default',\n  label,\n  children,\n  className = '',\n  onEditClick,\n}) => {\n  const [isHovered, setIsHovered] = useState(false);\n\n  const variants = {\n    default: {\n      highlight: '#FFEACD',\n      highlightSelected: '#FFC365',\n      label: '',\n      labelColor: '',\n    },\n    mandatory: {\n      highlight: '#FFEACD',\n      highlightSelected: '#FFC365',\n      label: 'Not Answered (Mandatory)',\n      labelColor: 'var(--color-secondary)',\n    },\n    optional: {\n      highlight: '#FFF6D1',\n      highlightSelected: '#FDE58E',\n      label: 'Not Answered (Optional)',\n      labelColor: 'var(--color-secondary)',\n    },\n    pending: {\n      highlight: '#F5E2FF',\n      highlightSelected: '#EBC7FF',\n      label: 'Pending',\n      labelColor: 'var(--color-secondary)',\n    },\n    accepted: {\n      highlight: '#EDF9CD',\n      highlightSelected: '#DBF59A',\n      label: 'Accepted',\n      labelColor: '#2D5016',\n    },\n    'action-required': {\n      highlight: '#FBEEEE',\n      highlightSelected: '#FFBCB3',\n      label: 'Action required before approval',\n      labelColor: '#CC0000',\n    },\n    custom: {\n      highlight: '#D9EDF8',\n      highlightSelected: '#B3E0F2',\n      label: 'Custom Text',\n      labelColor: 'var(--color-secondary)',\n    },\n  };\n\n  const style = variants[variant];\n  const displayLabel = label || style.label;\n\n  return (\n    <NoteContainer className={className}>\n      {displayLabel && (\n        <Box sx={{ mb: 1 }}>\n          <Typography\n            component=\"span\"\n            sx={{\n              fontSize: '13px',\n              fontWeight: 500,\n              color: style.labelColor || 'rgba(0, 0, 0, 0.6)',\n            }}\n          >\n            {displayLabel}\n          </Typography>\n        </Box>\n      )}\n      <HighlightWrapper\n        isHovered={isHovered}\n        highlightColor={style.highlight}\n        highlightSelectedColor={style.highlightSelected}\n        isCustom={variant === 'custom'}\n        onMouseEnter={() => variant !== 'custom' && setIsHovered(true)}\n        onMouseLeave={() => variant !== 'custom' && setIsHovered(false)}\n      >\n        <span className=\"highlight-span\">\n          {children}\n        </span>\n        <EditButton\n          className=\"edit-button\"\n          onClick={(e) => {\n            e.stopPropagation();\n            if (onEditClick) {\n              onEditClick();\n            }\n          }}\n          title=\"Edit variable highlight\"\n          size=\"small\"\n        >\n          <EditRounded sx={{fontSize:14, color:\"#FFFFFF\", strokeWidth:2}} />\n        </EditButton>\n      </HighlightWrapper>\n    </NoteContainer>\n  );\n};"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/Progress.js

@@ -1,6 +1,5 @@
-"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
-import React__default from 'react';
+import React from 'react';
 import { styled, LinearProgress, Box, Typography } from '@mui/material';
 import { useTheme } from '../ThemeProvider.js';
 
@@ -55,7 +54,7 @@ const StepLine = styled(Box)(({ theme, isCompleted }) => ({
     },
 }));
 const StepIndicator = ({ steps, currentStep, className = '' }) => {
-    const { theme } = useTheme();
+    const theme = useTheme();
     return (jsx(Box, { className: className, sx: {
             display: 'flex',
             alignItems: 'center',
@@ -66,7 +65,7 @@ const StepIndicator = ({ steps, currentStep, className = '' }) => {
             const stepNumber = index + 1;
             const isActive = stepNumber === currentStep;
             const isCompleted = stepNumber < currentStep;
-            return (jsxs(React__default.Fragment, { children: [jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', alignItems: 'center', flexShrink: 0 }, children: [jsx(StepNumber, { isActive: isActive, isCompleted: isCompleted, children: stepNumber }), jsx(Typography, { sx: {
+            return (jsxs(React.Fragment, { children: [jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', alignItems: 'center', flexShrink: 0 }, children: [jsx(StepNumber, { isActive: isActive, isCompleted: isCompleted, children: stepNumber }), jsx(Typography, { sx: {
                                     mt: { xs: 0.5, sm: 1 },
                                     fontSize: { xs: '10px', sm: '12px' },
                                     fontWeight: 500,

package/dist/esm/components/Progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"Progress.js","sources":["../../../../src/components/Progress.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { Box, Typography, LinearProgress, styled } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\n\ninterface ProgressProps {\n  current: number;\n  total: number;\n  showLabel?: boolean;\n  className?: string;\n}\n\nconst StyledLinearProgress = styled(LinearProgress)(({ theme }) => ({\n  height: 10,\n  borderRadius: 9999,\n  backgroundColor: `${theme.palette.dark.main}1A`,\n  '& .MuiLinearProgress-bar': {\n    borderRadius: 9999,\n    backgroundColor: theme.palette.primary.main,\n    transition: 'transform 0.3s ease-out',\n  },\n}));\n\nexport const Progress: React.FC<ProgressProps> = ({\n  current,\n  total,\n  showLabel = true,\n  className = ''\n}) => {\n  const percentage = Math.min(Math.max((current / total) * 100, 0), 100);\n\n  return (\n    <Box className={className}>\n      {showLabel && (\n        <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 1 }}>\n          <Typography variant=\"body2\" fontWeight={500}>\n            Step {current} of {total}\n          </Typography>\n          <Typography variant=\"body2\" fontWeight={500}>\n            {Math.round(percentage)}%\n          </Typography>\n        </Box>\n      )}\n      <StyledLinearProgress variant=\"determinate\" value={percentage} />\n    </Box>\n  );\n};\n\ninterface StepIndicatorProps {\n  steps: string[];\n  currentStep: number;\n  className?: string;\n}\n\nconst StepNumber = styled(Box)<{ isActive: boolean; isCompleted: boolean }>(\n  ({ theme, isActive, isCompleted }) => ({\n    width: 40,\n    height: 40,\n    borderRadius: '50%',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    fontWeight: 600,\n    fontSize: '0.875rem',\n    transition: 'all 0.2s',\n    backgroundColor: isCompleted || isActive \n      ? theme.palette.primary.main \n      : `${theme.palette.dark.main}1A`,\n    color: isCompleted || isActive \n      ? (theme.palette.custom?.stepIndicatorTextColor || theme.palette.dark.main)\n      : `${theme.palette.dark.main}99`,\n    boxShadow: isActive ? `0 0 0 4px ${theme.palette.primary.main}33` : 'none',\n    [theme.breakpoints.down('sm')]: {\n      width: 32,\n      height: 32,\n      fontSize: '0.75rem',\n    },\n  })\n);\n\nconst StepLine = styled(Box)<{ isCompleted: boolean }>(({ theme, isCompleted }) => ({\n  flex: 1,\n  height: 4,\n  borderRadius: 2,\n  margin: '0 8px',\n  minWidth: '1rem',\n  transition: 'background-color 0.2s',\n  backgroundColor: isCompleted ? theme.palette.primary.main : `${theme.palette.dark.main}1A`,\n  [theme.breakpoints.down('sm')]: {\n    height: 2,\n    margin: '0 4px',\n  },\n}));\n\nexport const StepIndicator: React.FC<StepIndicatorProps> = ({\n  steps,\n  currentStep,\n  className = ''\n}) => {\n  const { theme } = useTheme();\n\n  return (\n    <Box \n      className={className}\n      sx={{ \n        display: 'flex', \n        alignItems: 'center', \n        justifyContent: 'space-between',\n        overflowX: 'auto',\n        pb: 1,\n      }}\n    >\n      {steps.map((step, index) => {\n        const stepNumber = index + 1;\n        const isActive = stepNumber === currentStep;\n        const isCompleted = stepNumber < currentStep;\n\n        return (\n          <React.Fragment key={index}>\n            <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', flexShrink: 0 }}>\n              <StepNumber isActive={isActive} isCompleted={isCompleted}>\n                {stepNumber}\n              </StepNumber>\n              <Typography\n                sx={{\n                  mt: { xs: 0.5, sm: 1 },\n                  fontSize: { xs: '10px', sm: '12px' },\n                  fontWeight: 500,\n                  whiteSpace: 'nowrap',\n                  color: isActive ? theme.palette.primary.main : `${theme.palette.dark.main}99`,\n                }}\n              >\n                {step}\n              </Typography>\n            </Box>\n            {index < steps.length - 1 && (\n              <StepLine isCompleted={isCompleted} />\n            )}\n          </React.Fragment>\n        );\n      })}\n    </Box>\n  );\n};"],"names":[],"mappings":";;;;;;AAaA;AACE;AACA;;AAEA;AACE;AACA;AACA;AACD;AACF;AAEM;;AAQL;AAeF;AAQA;AAEI;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEE;;;AAGA;;AAEF;;AAEE;AACA;AACA;AACD;AACF;AAGH;AACE;AACA;AACA;AACA;AACA;AACA;;;AAGE;AACA;AACD;AACF;AAEM;AAKL;;AAMM;AACA;AACA;AACA;AACA;;AAIA;AACA;AACA;;;;AAYU;AACA;;;;AAelB;;"}
+{"version":3,"file":"Progress.js","sources":["../../../../src/components/Progress.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { Box, Typography, LinearProgress, styled } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\n\ninterface ProgressProps {\n  current: number;\n  total: number;\n  showLabel?: boolean;\n  className?: string;\n}\n\nconst StyledLinearProgress = styled(LinearProgress)(({ theme }) => ({\n  height: 10,\n  borderRadius: 9999,\n  backgroundColor: `${theme.palette.dark.main}1A`,\n  '& .MuiLinearProgress-bar': {\n    borderRadius: 9999,\n    backgroundColor: theme.palette.primary.main,\n    transition: 'transform 0.3s ease-out',\n  },\n}));\n\nexport const Progress: React.FC<ProgressProps> = ({\n  current,\n  total,\n  showLabel = true,\n  className = ''\n}) => {\n  const percentage = Math.min(Math.max((current / total) * 100, 0), 100);\n\n  return (\n    <Box className={className}>\n      {showLabel && (\n        <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 1 }}>\n          <Typography variant=\"body2\" fontWeight={500}>\n            Step {current} of {total}\n          </Typography>\n          <Typography variant=\"body2\" fontWeight={500}>\n            {Math.round(percentage)}%\n          </Typography>\n        </Box>\n      )}\n      <StyledLinearProgress variant=\"determinate\" value={percentage} />\n    </Box>\n  );\n};\n\ninterface StepIndicatorProps {\n  steps: string[];\n  currentStep: number;\n  className?: string;\n}\n\nconst StepNumber = styled(Box)<{ isActive: boolean; isCompleted: boolean }>(\n  ({ theme, isActive, isCompleted }) => ({\n    width: 40,\n    height: 40,\n    borderRadius: '50%',\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    fontWeight: 600,\n    fontSize: '0.875rem',\n    transition: 'all 0.2s',\n    backgroundColor: isCompleted || isActive \n      ? theme.palette.primary.main \n      : `${theme.palette.dark.main}1A`,\n    color: isCompleted || isActive \n      ? (theme.palette.custom?.stepIndicatorTextColor || theme.palette.dark.main)\n      : `${theme.palette.dark.main}99`,\n    boxShadow: isActive ? `0 0 0 4px ${theme.palette.primary.main}33` : 'none',\n    [theme.breakpoints.down('sm')]: {\n      width: 32,\n      height: 32,\n      fontSize: '0.75rem',\n    },\n  })\n);\n\nconst StepLine = styled(Box)<{ isCompleted: boolean }>(({ theme, isCompleted }) => ({\n  flex: 1,\n  height: 4,\n  borderRadius: 2,\n  margin: '0 8px',\n  minWidth: '1rem',\n  transition: 'background-color 0.2s',\n  backgroundColor: isCompleted ? theme.palette.primary.main : `${theme.palette.dark.main}1A`,\n  [theme.breakpoints.down('sm')]: {\n    height: 2,\n    margin: '0 4px',\n  },\n}));\n\nexport const StepIndicator: React.FC<StepIndicatorProps> = ({\n  steps,\n  currentStep,\n  className = ''\n}) => {\n  const theme = useTheme();\n\n  return (\n    <Box \n      className={className}\n      sx={{ \n        display: 'flex', \n        alignItems: 'center', \n        justifyContent: 'space-between',\n        overflowX: 'auto',\n        pb: 1,\n      }}\n    >\n      {steps.map((step, index) => {\n        const stepNumber = index + 1;\n        const isActive = stepNumber === currentStep;\n        const isCompleted = stepNumber < currentStep;\n\n        return (\n          <React.Fragment key={index}>\n            <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', flexShrink: 0 }}>\n              <StepNumber isActive={isActive} isCompleted={isCompleted}>\n                {stepNumber}\n              </StepNumber>\n              <Typography\n                sx={{\n                  mt: { xs: 0.5, sm: 1 },\n                  fontSize: { xs: '10px', sm: '12px' },\n                  fontWeight: 500,\n                  whiteSpace: 'nowrap',\n                  color: isActive ? theme.palette.primary.main : `${theme.palette.dark.main}99`,\n                }}\n              >\n                {step}\n              </Typography>\n            </Box>\n            {index < steps.length - 1 && (\n              <StepLine isCompleted={isCompleted} />\n            )}\n          </React.Fragment>\n        );\n      })}\n    </Box>\n  );\n};"],"names":["_jsxs","_jsx"],"mappings":";;;;;AAaA,MAAM,oBAAoB,GAAG,MAAM,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AAClE,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,YAAY,EAAE,IAAI;IAClB,eAAe,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AAC/C,IAAA,0BAA0B,EAAE;AAC1B,QAAA,YAAY,EAAE,IAAI;AAClB,QAAA,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI;AAC3C,QAAA,UAAU,EAAE,yBAAyB;AACtC,KAAA;AACF,CAAA,CAAC,CAAC;AAEI,MAAM,QAAQ,GAA4B,CAAC,EAChD,OAAO,EACP,KAAK,EACL,SAAS,GAAG,IAAI,EAChB,SAAS,GAAG,EAAE,EACf,KAAI;IACH,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,GAAG,KAAK,IAAI,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC;AAEtE,IAAA,QACEA,IAAA,CAAC,GAAG,IAAC,SAAS,EAAE,SAAS,EAAA,QAAA,EAAA,CACtB,SAAS,KACRA,KAAC,GAAG,EAAA,EAAC,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,eAAe,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,EAAE,aACxFA,IAAA,CAAC,UAAU,IAAC,OAAO,EAAC,OAAO,EAAC,UAAU,EAAE,GAAG,sBACnC,OAAO,EAAA,MAAA,EAAM,KAAK,CAAA,EAAA,CACb,EACbA,KAAC,UAAU,EAAA,EAAC,OAAO,EAAC,OAAO,EAAC,UAAU,EAAE,GAAG,EAAA,QAAA,EAAA,CACxC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,EAAA,GAAA,CAAA,EAAA,CACZ,CAAA,EAAA,CACT,CACP,EACDC,GAAA,CAAC,oBAAoB,EAAA,EAAC,OAAO,EAAC,aAAa,EAAC,KAAK,EAAE,UAAU,EAAA,CAAI,CAAA,EAAA,CAC7D;AAEV;AAQA,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAC,CAC5B,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM;AACrC,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,YAAY,EAAE,KAAK;AACnB,IAAA,OAAO,EAAE,MAAM;AACf,IAAA,UAAU,EAAE,QAAQ;AACpB,IAAA,cAAc,EAAE,QAAQ;AACxB,IAAA,UAAU,EAAE,GAAG;AACf,IAAA,QAAQ,EAAE,UAAU;AACpB,IAAA,UAAU,EAAE,UAAU;IACtB,eAAe,EAAE,WAAW,IAAI;AAC9B,UAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC;UACtB,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;IAClC,KAAK,EAAE,WAAW,IAAI;AACpB,WAAG,KAAK,CAAC,OAAO,CAAC,MAAM,EAAE,sBAAsB,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;UACxE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AAClC,IAAA,SAAS,EAAE,QAAQ,GAAG,aAAa,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,IAAI,GAAG,MAAM;IAC1E,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG;AAC9B,QAAA,KAAK,EAAE,EAAE;AACT,QAAA,MAAM,EAAE,EAAE;AACV,QAAA,QAAQ,EAAE,SAAS;AACpB,KAAA;AACF,CAAA,CAAC,CACH;AAED,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAC,CAA2B,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM;AAClF,IAAA,IAAI,EAAE,CAAC;AACP,IAAA,MAAM,EAAE,CAAC;AACT,IAAA,YAAY,EAAE,CAAC;AACf,IAAA,MAAM,EAAE,OAAO;AACf,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,UAAU,EAAE,uBAAuB;IACnC,eAAe,EAAE,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,GAAG,CAAA,EAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;IAC1F,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG;AAC9B,QAAA,MAAM,EAAE,CAAC;AACT,QAAA,MAAM,EAAE,OAAO;AAChB,KAAA;AACF,CAAA,CAAC,CAAC;AAEI,MAAM,aAAa,GAAiC,CAAC,EAC1D,KAAK,EACL,WAAW,EACX,SAAS,GAAG,EAAE,EACf,KAAI;AACH,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;IAExB,QACEA,IAAC,GAAG,EAAA,EACF,SAAS,EAAE,SAAS,EACpB,EAAE,EAAE;AACF,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,UAAU,EAAE,QAAQ;AACpB,YAAA,cAAc,EAAE,eAAe;AAC/B,YAAA,SAAS,EAAE,MAAM;AACjB,YAAA,EAAE,EAAE,CAAC;SACN,EAAA,QAAA,EAEA,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;AACzB,YAAA,MAAM,UAAU,GAAG,KAAK,GAAG,CAAC;AAC5B,YAAA,MAAM,QAAQ,GAAG,UAAU,KAAK,WAAW;AAC3C,YAAA,MAAM,WAAW,GAAG,UAAU,GAAG,WAAW;YAE5C,QACED,KAAC,KAAK,CAAC,QAAQ,EAAA,EAAA,QAAA,EAAA,CACbA,IAAA,CAAC,GAAG,EAAA,EAAC,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC,EAAE,EAAA,QAAA,EAAA,CACxFC,IAAC,UAAU,EAAA,EAAC,QAAQ,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,YACrD,UAAU,EAAA,CACA,EACbA,GAAA,CAAC,UAAU,EAAA,EACT,EAAE,EAAE;oCACF,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,EAAE,EAAE,CAAC,EAAE;oCACtB,QAAQ,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,MAAM,EAAE;AACpC,oCAAA,UAAU,EAAE,GAAG;AACf,oCAAA,UAAU,EAAE,QAAQ;oCACpB,KAAK,EAAE,QAAQ,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,GAAG,CAAA,EAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;iCAC9E,EAAA,QAAA,EAEA,IAAI,EAAA,CACM,CAAA,EAAA,CACT,EACL,KAAK,GAAG,KAAK,CAAC,MAAM,GAAG,CAAC,KACvBA,GAAA,CAAC,QAAQ,EAAA,EAAC,WAAW,EAAE,WAAW,EAAA,CAAI,CACvC,CAAA,EAAA,EAnBkB,KAAK,CAoBT;QAErB,CAAC,CAAC,EAAA,CACE;AAEV;;;;"}

package/dist/esm/components/Radio.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { styled, FormControlLabel, Box, Typography, FormControl, FormLabel, FormHelperText } from '@mui/material';
 import { useTheme } from '../ThemeProvider.js';
@@ -16,7 +15,7 @@ const CustomRadioIcon = styled('span')(({ theme, checked }) => ({
 }));
 const Radio = ({ label, description, className = '', id, checked, ...props }) => {
     const radioId = id || `radio-${Math.random().toString(36).substr(2, 9)}`;
-    const { theme } = useTheme();
+    const theme = useTheme();
     return (jsx(FormControlLabel, { className: className, control: jsxs(Box, { sx: { display: 'flex', alignItems: 'center', height: 24, mr: 1.5 }, children: [jsx("input", { id: radioId, type: "radio", style: { display: 'none' }, checked: checked, ...props }), jsx(CustomRadioIcon, { checked: checked, onClick: (e) => {
                         const input = document.getElementById(radioId);
                         if (input && !props.disabled) {
@@ -38,7 +37,7 @@ const Radio = ({ label, description, className = '', id, checked, ...props }) =>
                     }, children: description }))] }), sx: { alignItems: 'flex-start', ml: 0 } }));
 };
 const RadioGroup = ({ label, error, children, className = '' }) => {
-    const { theme } = useTheme();
+    const theme = useTheme();
     return (jsxs(FormControl, { component: "fieldset", className: className, error: !!error, fullWidth: true, children: [label && (jsx(FormLabel, { component: "legend", sx: {
                     fontSize: '0.875rem',
                     fontWeight: 500,

package/dist/esm/components/Radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.js","sources":["../../../../src/components/Radio.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { Box, FormControl, FormLabel, FormHelperText, FormControlLabel, styled, Typography } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\n\ninterface RadioProps extends React.InputHTMLAttributes<HTMLInputElement> {\n  label: string;\n  description?: string;\n}\n\nconst CustomRadioIcon = styled('span')<{ checked?: boolean }>(({ theme, checked }) => ({\n  width: 20,\n  height: 20,\n  borderRadius: '50%',\n  border: checked ? `5px solid ${theme.palette.secondary.main}` : `2px solid ${theme.palette.dark.main}4D`,\n  transition: 'all 0.2s',\n  backgroundColor: 'transparent',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n}));\n\nexport const Radio: React.FC<RadioProps> = ({\n  label,\n  description,\n  className = '',\n  id,\n  checked,\n  ...props\n}) => {\n  const radioId = id || `radio-${Math.random().toString(36).substr(2, 9)}`;\n  const { theme } = useTheme();\n\n  return (\n    <FormControlLabel\n      className={className}\n      control={\n        <Box sx={{ display: 'flex', alignItems: 'center', height: 24, mr: 1.5 }}>\n          <input\n            id={radioId}\n            type=\"radio\"\n            style={{ display: 'none' }}\n            checked={checked}\n            {...props}\n          />\n          <CustomRadioIcon \n            checked={checked}\n            onClick={(e) => {\n              const input = document.getElementById(radioId) as HTMLInputElement;\n              if (input && !props.disabled) {\n                input.click();\n              }\n            }}\n            sx={{\n              cursor: props.disabled ? 'not-allowed' : 'pointer',\n              opacity: props.disabled ? 0.5 : 1,\n            }}\n          />\n        </Box>\n      }\n      label={\n        <Box sx={{ ml: 0 }}>\n          <Typography\n            component=\"label\"\n            htmlFor={radioId}\n            sx={{\n              fontSize: '1rem',\n              fontWeight: 500,\n              color: theme.palette.dark.main,\n              cursor: props.disabled ? 'not-allowed' : 'pointer',\n              opacity: props.disabled ? 0.5 : 1,\n            }}\n          >\n            {label}\n          </Typography>\n          {description && (\n            <Typography\n              variant=\"body2\"\n              sx={{\n                fontSize: '0.875rem',\n                color: `${theme.palette.dark.main}99`,\n                mt: 0.25,\n              }}\n            >\n              {description}\n            </Typography>\n          )}\n        </Box>\n      }\n      sx={{ alignItems: 'flex-start', ml: 0 }}\n    />\n  );\n};\n\ninterface RadioGroupProps {\n  label?: string;\n  error?: string;\n  children: React.ReactNode;\n  className?: string;\n}\n\nexport const RadioGroup: React.FC<RadioGroupProps> = ({\n  label,\n  error,\n  children,\n  className = ''\n}) => {\n  const { theme } = useTheme();\n\n  return (\n    <FormControl component=\"fieldset\" className={className} error={!!error} fullWidth>\n      {label && (\n        <FormLabel\n          component=\"legend\"\n          sx={{\n            fontSize: '0.875rem',\n            fontWeight: 500,\n            color: theme.palette.dark.main,\n            mb: 1.5,\n            '&.Mui-focused': {\n              color: theme.palette.dark.main,\n            },\n          }}\n        >\n          {label}\n        </FormLabel>\n      )}\n      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>\n        {children}\n      </Box>\n      {error && (\n        <FormHelperText\n          sx={{\n            mt: 1,\n            fontSize: '0.875rem',\n            color: theme.palette.accent.main,\n          }}\n        >\n          {error}\n        </FormHelperText>\n      )}\n    </FormControl>\n  );\n};"],"names":[],"mappings":";;;;;AAWA;AACE;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACD;;;AAWC;AAEA;;AAgBY;;;;;;;AAiBA;AACA;AACA;;;AAGD;AAQG;;AAEA;AACD;AAUf;AASO;AAML;AAEA;AAMU;AACA;AACA;AACA;AACA;AACE;AACD;AACF;AAWC;AACA;AACA;AACD;AAOX;;"}
+{"version":3,"file":"Radio.js","sources":["../../../../src/components/Radio.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { Box, FormControl, FormLabel, FormHelperText, FormControlLabel, styled, Typography } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\n\ninterface RadioProps extends React.InputHTMLAttributes<HTMLInputElement> {\n  label: string;\n  description?: string;\n}\n\nconst CustomRadioIcon = styled('span')<{ checked?: boolean }>(({ theme, checked }) => ({\n  width: 20,\n  height: 20,\n  borderRadius: '50%',\n  border: checked ? `5px solid ${theme.palette.secondary.main}` : `2px solid ${theme.palette.dark.main}4D`,\n  transition: 'all 0.2s',\n  backgroundColor: 'transparent',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n}));\n\nexport const Radio: React.FC<RadioProps> = ({\n  label,\n  description,\n  className = '',\n  id,\n  checked,\n  ...props\n}) => {\n  const radioId = id || `radio-${Math.random().toString(36).substr(2, 9)}`;\n  const theme = useTheme();\n\n  return (\n    <FormControlLabel\n      className={className}\n      control={\n        <Box sx={{ display: 'flex', alignItems: 'center', height: 24, mr: 1.5 }}>\n          <input\n            id={radioId}\n            type=\"radio\"\n            style={{ display: 'none' }}\n            checked={checked}\n            {...props}\n          />\n          <CustomRadioIcon \n            checked={checked}\n            onClick={(e) => {\n              const input = document.getElementById(radioId) as HTMLInputElement;\n              if (input && !props.disabled) {\n                input.click();\n              }\n            }}\n            sx={{\n              cursor: props.disabled ? 'not-allowed' : 'pointer',\n              opacity: props.disabled ? 0.5 : 1,\n            }}\n          />\n        </Box>\n      }\n      label={\n        <Box sx={{ ml: 0 }}>\n          <Typography\n            component=\"label\"\n            htmlFor={radioId}\n            sx={{\n              fontSize: '1rem',\n              fontWeight: 500,\n              color: theme.palette.dark.main,\n              cursor: props.disabled ? 'not-allowed' : 'pointer',\n              opacity: props.disabled ? 0.5 : 1,\n            }}\n          >\n            {label}\n          </Typography>\n          {description && (\n            <Typography\n              variant=\"body2\"\n              sx={{\n                fontSize: '0.875rem',\n                color: `${theme.palette.dark.main}99`,\n                mt: 0.25,\n              }}\n            >\n              {description}\n            </Typography>\n          )}\n        </Box>\n      }\n      sx={{ alignItems: 'flex-start', ml: 0 }}\n    />\n  );\n};\n\ninterface RadioGroupProps {\n  label?: string;\n  error?: string;\n  children: React.ReactNode;\n  className?: string;\n}\n\nexport const RadioGroup: React.FC<RadioGroupProps> = ({\n  label,\n  error,\n  children,\n  className = ''\n}) => {\n  const theme = useTheme();\n\n  return (\n    <FormControl component=\"fieldset\" className={className} error={!!error} fullWidth>\n      {label && (\n        <FormLabel\n          component=\"legend\"\n          sx={{\n            fontSize: '0.875rem',\n            fontWeight: 500,\n            color: theme.palette.dark.main,\n            mb: 1.5,\n            '&.Mui-focused': {\n              color: theme.palette.dark.main,\n            },\n          }}\n        >\n          {label}\n        </FormLabel>\n      )}\n      <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>\n        {children}\n      </Box>\n      {error && (\n        <FormHelperText\n          sx={{\n            mt: 1,\n            fontSize: '0.875rem',\n            color: theme.palette.accent.main,\n          }}\n        >\n          {error}\n        </FormHelperText>\n      )}\n    </FormControl>\n  );\n};"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/esm/components/ReadBy.js

@@ -1,4 +1,3 @@
-"use client";
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { styled, Box, IconButton, Typography } from '@mui/material';
@@ -34,7 +33,7 @@ const ExpandButton = styled(IconButton)(({ theme }) => ({
     },
 }));
 const ReadBy = ({ names }) => {
-    const { theme } = useTheme();
+    const theme = useTheme();
     const [isExpanded, setIsExpanded] = useState(false);
     const displayText = isExpanded
         ? names.join(', ')