ece-docs-components 1.0.10 → 1.0.12

package/dist/cjs/index.js

@@ -22,7 +22,7 @@ var TableOfContents = require('./components/TableOfContents.js');
 var Toggle = require('./components/Toggle.js');
 var SimpleModal = require('./components/SimpleModal.js');
 var ActionButton = require('./components/ActionButton.js');
-var DefinitionBox = require('./components/DefinitionBox.js');
+var ExpandingBox = require('./components/ExpandingBox.js');
 var Breadcrumb = require('./components/Breadcrumb.js');
 
 
@@ -51,6 +51,6 @@ exports.TableOfContents = TableOfContents.TableOfContents;
 exports.Toggle = Toggle.Toggle;
 exports.SimpleModal = SimpleModal.SimpleModal;
 exports.ActionButton = ActionButton.ActionButton;
-exports.DefinitionBox = DefinitionBox.DefinitionBox;
+exports.ExpandingBox = ExpandingBox.ExpandingBox;
 exports.Breadcrumb = Breadcrumb.Breadcrumb;
 //# sourceMappingURL=index.js.map

package/dist/esm/components/Breadcrumb.js

@@ -56,7 +56,9 @@ const StyledMenu = styled(Menu)(({ theme }) => ({
         boxShadow: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',
     },
 }));
-const StyledMenuItem = styled(MenuItem)(({ theme, isActive }) => ({
+const StyledMenuItem = styled(MenuItem, {
+    shouldForwardProp: (prop) => prop !== 'isActive'
+})(({ theme, isActive }) => ({
     padding: theme.spacing(1.25, 2),
     fontSize: '0.875rem',
     color: isActive ? theme.palette.primary.main : '#4D3019',

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

@@ -1 +1 @@
-{"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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"}
+{"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,{\n  shouldForwardProp: (prop) => prop !== 'isActive'\n})<{ 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/Checkbox.js

@@ -1,5 +1,5 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { styled, Box, Checkbox as Checkbox$1, Typography, FormControlLabel } from '@mui/material';
+import { styled, Box, Checkbox as Checkbox$1, FormControlLabel } from '@mui/material';
 
 const StyledWrapper = styled(Box)(({ theme }) => ({
     display: 'flex',
@@ -19,13 +19,13 @@ const StyledCheckbox = styled(Checkbox$1)(({ theme }) => ({
     borderRadius: theme.shape.borderRadius, // Matches rounded
     cursor: 'pointer',
 }));
-const StyledLabel = styled(Typography)(({ theme }) => ({
+const StyledLabel = styled('span')(({ theme }) => ({
     fontSize: '1rem', // text-base (16px)
     fontWeight: 500, // font-medium
     color: theme.palette.dark.main, // text-dark
     cursor: 'pointer',
 }));
-const StyledDescription = styled(Typography)(({ theme }) => ({
+const StyledDescription = styled('span')(({ theme }) => ({
     fontSize: '0.875rem', // text-sm (14px)
     color: theme.palette.dark.main + '99', // dark.main with 60% opacity (text-dark/60)
     marginTop: theme.spacing(0.5), // mt-0.5

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

@@ -1 +1 @@
-{"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;;;;"}
+{"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('span')(({ 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('span')(({ 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,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;IACjD,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,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;IACvD,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,7 +1,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { useState } from 'react';
-import { styled, Box, Typography, Collapse } from '@mui/material';
-import { ExpandMoreRounded, ExpandCircleDownOutlined } from '@mui/icons-material';
+import React, { useState } from 'react';
+import { styled, Box, Typography, useMediaQuery, Collapse } from '@mui/material';
+import { ExpandCircleDownOutlined } from '@mui/icons-material';
+import { useTheme } from '../ThemeProvider.js';
 
 const StyledConcertina = styled(Box)(({ theme }) => ({
     width: '100%',
@@ -10,27 +11,21 @@ const StyledConcertina = styled(Box)(({ theme }) => ({
     gap: theme.spacing(1),
 }));
 const StyledSection = styled(Box)(({ theme }) => ({
-    borderTop: `2px solid ${theme.palette.grey[200]}`,
-    borderBottom: `2px solid ${theme.palette.grey[200]}`,
     overflow: 'hidden',
 }));
 const StyledHeader = styled(Box)(({ theme }) => ({
     display: 'flex',
     alignItems: 'center',
+    borderTop: `2px solid ${theme.palette.grey[200]}`,
+    borderBottom: `2px solid ${theme.palette.grey[200]}`,
     justifyContent: 'space-between',
-    padding: theme.spacing(3),
     cursor: 'pointer',
     transition: 'background-color 0.2s',
     gap: theme.spacing(2),
     '&:hover': {
         backgroundColor: theme.palette.background.default,
     },
-    [theme.breakpoints.up('sm')]: {
-        padding: theme.spacing(4),
-    },
-    [theme.breakpoints.up('md')]: {
-        padding: theme.spacing(6),
-    },
+    padding: theme.spacing(2),
 }));
 const StyledTitleWrapper = styled(Box)(({ theme }) => ({
     display: 'flex',
@@ -40,9 +35,9 @@ const StyledTitleWrapper = styled(Box)(({ theme }) => ({
     minWidth: 0,
 }));
 const StyledHashtag = styled('span', {
-    shouldForwardProp: (prop) => prop !== 'isVisible',
-})(({ theme, isVisible }) => ({
-    color: theme.palette.info.main,
+    shouldForwardProp: (prop) => prop !== 'isVisible' && prop !== 'color',
+})(({ theme, isVisible, color }) => ({
+    color: color || theme.palette.info.main,
     fontWeight: 700,
     fontSize: 'inherit',
     opacity: isVisible ? 1 : 0,
@@ -89,16 +84,6 @@ const StyledTooltip = styled(Box)(({ theme }) => ({
         padding: theme.spacing(1.5, 3),
     },
 }));
-styled(ExpandMoreRounded)(({ theme }) => ({
-    color: theme.palette.grey[500],
-    transition: 'transform 0.2s',
-    width: 24,
-    height: 24,
-    [theme.breakpoints.down('sm')]: {
-        width: 20,
-        height: 20,
-    },
-}));
 const StyledContent = styled(Box)(({ theme }) => ({
     padding: theme.spacing(2, 3, 3),
     [theme.breakpoints.up('sm')]: {
@@ -133,10 +118,23 @@ const StyledContentWrapper = styled(Box)(({ theme }) => ({
     },
 }));
 function Concertina({ sections }) {
-    const [openSections, setOpenSections] = useState(new Set());
     const [hoveredTitle, setHoveredTitle] = useState(null);
     const [copiedId, setCopiedId] = useState(null);
     const [tooltipPosition, setTooltipPosition] = useState(null);
+    const theme = useTheme();
+    const isDesktop = useMediaQuery(theme.breakpoints.up('md'));
+    const [openSections, setOpenSections] = useState(() => {
+        // Initialize with all sections open on desktop, closed on mobile
+        return isDesktop ? new Set(sections.map(s => s.id)) : new Set();
+    });
+    React.useEffect(() => {
+        if (isDesktop) {
+            setOpenSections(new Set(sections.map(s => s.id)));
+        }
+        else {
+            setOpenSections(new Set());
+        }
+    }, [isDesktop, sections]);
     const toggleSection = (id) => {
         const newOpenSections = new Set(openSections);
         if (newOpenSections.has(id)) {
@@ -158,7 +156,7 @@ function Concertina({ sections }) {
             setTooltipPosition(null);
         }, 2000);
     };
-    return (jsxs(StyledConcertina, { children: [sections.map((section) => (jsxs(StyledSection, { id: section.id, children: [jsxs(StyledHeader, { onClick: () => toggleSection(section.id), onMouseEnter: () => setHoveredTitle(section.id), onMouseLeave: () => setHoveredTitle(null), children: [jsx(StyledTitleWrapper, { children: jsxs(StyledTitle, { isHovered: hoveredTitle === section.id, variant: "h3", children: [jsx(StyledHashtag, { isVisible: hoveredTitle === section.id, onClick: (e) => copyJumpLink(section.id, e), children: "#" }), section.title] }) }), jsx(ExpandCircleDownOutlined, { sx: { fontSize: '1.5rem', transform: openSections.has(section.id) ? 'rotate(180deg)' : 'none' } })] }), jsx(Collapse, { in: openSections.has(section.id), children: jsx(StyledContent, { children: jsx(StyledContentWrapper, { children: section.content }) }) })] }, section.id))), copiedId && tooltipPosition && (jsx(StyledTooltip, { sx: {
+    return (jsxs(StyledConcertina, { children: [sections.map((section) => (jsxs(StyledSection, { id: section.id, children: [jsxs(StyledHeader, { onClick: () => toggleSection(section.id), onMouseEnter: () => setHoveredTitle(section.id), onMouseLeave: () => setHoveredTitle(null), children: [jsx(StyledTitleWrapper, { children: jsxs(StyledTitle, { isHovered: hoveredTitle === section.id, variant: "h3", children: [jsx(StyledHashtag, { isVisible: true, color: hoveredTitle === section.id ? theme.palette.info.main : '#00000000', onClick: (e) => copyJumpLink(section.id, e), children: "#" }), section.title] }) }), jsx(ExpandCircleDownOutlined, { sx: { fontSize: '1.5rem', transform: openSections.has(section.id) ? 'rotate(180deg)' : 'none' } })] }), jsx(Collapse, { in: openSections.has(section.id), children: jsx(StyledContent, { children: jsx(StyledContentWrapper, { children: section.content }) }) })] }, section.id))), copiedId && tooltipPosition && (jsx(StyledTooltip, { sx: {
                     left: tooltipPosition.x,
                     top: tooltipPosition.y,
                 }, children: "Link copied" }))] }));

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

@@ -1 +1 @@
-{"version":3,"file":"Concertina.js","sources":["../../../../src/components/Concertina.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Box, styled, Typography, Collapse } from '@mui/material';\nimport { ExpandCircleDown, ExpandCircleDownOutlined, ExpandMoreRounded } from '@mui/icons-material';\n\n\ninterface ConcertinaSection {\n  id: string;\n  title: string;\n  content: React.ReactNode;\n}\n\n\ninterface ConcertinaProps {\n  sections: ConcertinaSection[];\n}\n\n\nconst StyledConcertina = styled(Box)(({ theme }) => ({\n  width: '100%',\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(1),\n}));\n\n\nconst StyledSection = styled(Box)(({ theme }) => ({\n  borderTop: `2px solid ${theme.palette.grey[200]}`,\n  borderBottom: `2px solid ${theme.palette.grey[200]}`,\n  overflow: 'hidden',\n}));\n\n\nconst StyledHeader = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  padding: theme.spacing(3),\n  cursor: 'pointer',\n  transition: 'background-color 0.2s',\n  gap: theme.spacing(2),\n  '&:hover': {\n    backgroundColor: theme.palette.background.default,\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\n\nconst StyledTitleWrapper = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: 0,\n  flex: 1,\n  minWidth: 0,\n}));\n\n\nconst StyledHashtag = styled('span', {\n  shouldForwardProp: (prop) => prop !== 'isVisible',\n})<{ isVisible: boolean }>(({ theme, isVisible }) => ({\n  color: theme.palette.info.main,\n  fontWeight: 700,\n  fontSize: 'inherit',\n  opacity: isVisible ? 1 : 0,\n  transition: 'opacity 0.2s',\n  marginRight: isVisible ? '0.25em' : 0,\n  cursor: 'pointer',\n}));\n\n\nconst StyledTitle = styled(Typography, {\n  shouldForwardProp: (prop) => prop !== 'isHovered',\n})<{ isHovered: boolean }>(({ theme, isHovered }) => ({\n  fontWeight: 700,\n  fontSize: '1.75rem',\n  lineHeight: 1.2,\n  color: theme.palette.dark.main,\n  wordBreak: 'break-word',\n  display: 'inline-block',\n  position: 'relative',\n  paddingBottom: '2px',\n  borderBottom: isHovered ? `3px solid ${theme.palette.info.main}` : '3px solid transparent',\n  transition: 'border-bottom 0.2s',\n  [theme.breakpoints.down('lg')]: {\n    fontSize: '1.25rem',\n  },\n  [theme.breakpoints.down('md')]: {\n    fontSize: '1.125rem',\n  },\n  [theme.breakpoints.down('sm')]: {\n    fontSize: '1rem',\n  },\n}));\n\n\nconst StyledTooltip = styled(Box)(({ theme }) => ({\n  position: 'fixed',\n  transform: 'translate(-50%, -120%)',\n  backgroundColor: theme.palette.grey[900],\n  color: theme.palette.common.white,\n  fontSize: '0.75rem',\n  padding: theme.spacing(1, 2),\n  borderRadius: theme.shape.borderRadius,\n  whiteSpace: 'nowrap',\n  zIndex: 1000,\n  pointerEvents: 'none',\n  [theme.breakpoints.up('sm')]: {\n    fontSize: '0.875rem',\n    padding: theme.spacing(1.5, 3),\n  },\n}));\n\n\nconst StyledChevron = styled(ExpandMoreRounded)(({ theme }) => ({\n  color: theme.palette.grey[500],\n  transition: 'transform 0.2s',\n  width: 24,\n  height: 24,\n  [theme.breakpoints.down('sm')]: {\n    width: 20,\n    height: 20,\n  },\n}));\n\n\nconst StyledContent = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(2, 3, 3),\n  [theme.breakpoints.up('sm')]: {\n    padding: theme.spacing(2, 4, 4),\n  },\n  [theme.breakpoints.up('md')]: {\n    padding: theme.spacing(2, 6, 6),\n  },\n}));\n\n\nconst StyledContentWrapper = styled(Box)(({ theme }) => ({\n  color: theme.palette.dark.main,\n  lineHeight: 1.5,\n  wordBreak: 'break-word',\n  fontSize: 13,\n  '& p': {\n    margin: 0,\n    marginBottom: theme.spacing(2),\n    '&:last-child': {\n      marginBottom: 0,\n    },\n  },\n  '& ul, & ol': {\n    marginTop: theme.spacing(1),\n    marginBottom: theme.spacing(2),\n    paddingLeft: theme.spacing(3),\n    '&:last-child': {\n      marginBottom: 0,\n    },\n  },\n  '& li': {\n    marginBottom: theme.spacing(0.5),\n  },\n}));\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  const [tooltipPosition, setTooltipPosition] = useState<{ x: number; y: number } | null>(null);\n\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\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    setTooltipPosition({ x: e.clientX, y: e.clientY });\n    setTimeout(() => {\n      setCopiedId(null);\n      setTooltipPosition(null);\n    }, 2000);\n  };\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                <StyledHashtag\n                  isVisible={hoveredTitle === section.id}\n                  onClick={(e) => copyJumpLink(section.id, e as any)}\n                >\n                  #\n                </StyledHashtag>\n                {section.title}\n              </StyledTitle>\n            </StyledTitleWrapper>\n            <ExpandCircleDownOutlined\n              sx={{ fontSize: '1.5rem', transform: openSections.has(section.id) ? 'rotate(180deg)' : 'none' }}\n            />\n          </StyledHeader>\n          <Collapse in={openSections.has(section.id)}>\n            <StyledContent>\n              <StyledContentWrapper>{section.content}</StyledContentWrapper>\n            </StyledContent>\n          </Collapse>\n        </StyledSection>\n      ))}\n      {copiedId && tooltipPosition && (\n        <StyledTooltip\n          sx={{\n            left: tooltipPosition.x,\n            top: tooltipPosition.y,\n          }}\n        >\n          Link copied\n        </StyledTooltip>\n      )}\n    </StyledConcertina>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"Concertina.js","sources":["../../../../src/components/Concertina.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Box, styled, Typography, Collapse, useMediaQuery } from '@mui/material';\nimport { ExpandCircleDown, ExpandCircleDownOutlined, ExpandMoreRounded } from '@mui/icons-material';\nimport { useTheme } from '../ThemeProvider';\n\n\ninterface ConcertinaSection {\n  id: string;\n  title: string;\n  content: React.ReactNode;\n}\n\n\ninterface ConcertinaProps {\n  sections: ConcertinaSection[];\n}\n\n\nconst StyledConcertina = styled(Box)(({ theme }) => ({\n  width: '100%',\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(1),\n}));\n\n\nconst StyledSection = styled(Box)(({ theme }) => ({\n  overflow: 'hidden',\n}));\n\n\nconst StyledHeader = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  borderTop: `2px solid ${theme.palette.grey[200]}`,\n  borderBottom: `2px solid ${theme.palette.grey[200]}`,\n  justifyContent: 'space-between',\n  cursor: 'pointer',\n  transition: 'background-color 0.2s',\n  gap: theme.spacing(2),\n  '&:hover': {\n    backgroundColor: theme.palette.background.default,\n  },\n  padding: theme.spacing(2),\n}));\n\n\nconst StyledTitleWrapper = styled(Box)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  gap: 0,\n  flex: 1,\n  minWidth: 0,\n}));\n\n\nconst StyledHashtag = styled('span', {\n  shouldForwardProp: (prop) => prop !== 'isVisible' && prop !== 'color',\n})<{ isVisible: boolean; color?: string }>(({ theme, isVisible, color }) => ({\n  color: color || theme.palette.info.main,\n  fontWeight: 700,\n  fontSize: 'inherit',\n  opacity: isVisible ? 1 : 0,\n  transition: 'opacity 0.2s',\n  marginRight: isVisible ? '0.25em' : 0,\n  cursor: 'pointer',\n}));\n\n\n\nconst StyledTitle = styled(Typography, {\n  shouldForwardProp: (prop) => prop !== 'isHovered',\n})<{ isHovered: boolean }>(({ theme, isHovered }) => ({\n  fontWeight: 700,\n  fontSize: '1.75rem',\n  lineHeight: 1.2,\n  color: theme.palette.dark.main,\n  wordBreak: 'break-word',\n  display: 'inline-block',\n  position: 'relative',\n  paddingBottom: '2px',\n  borderBottom: isHovered ? `3px solid ${theme.palette.info.main}` : '3px solid transparent',\n  transition: 'border-bottom 0.2s',\n  [theme.breakpoints.down('lg')]: {\n    fontSize: '1.25rem',\n  },\n  [theme.breakpoints.down('md')]: {\n    fontSize: '1.125rem',\n  },\n  [theme.breakpoints.down('sm')]: {\n    fontSize: '1rem',\n  },\n}));\n\n\nconst StyledTooltip = styled(Box)(({ theme }) => ({\n  position: 'fixed',\n  transform: 'translate(-50%, -120%)',\n  backgroundColor: theme.palette.grey[900],\n  color: theme.palette.common.white,\n  fontSize: '0.75rem',\n  padding: theme.spacing(1, 2),\n  borderRadius: theme.shape.borderRadius,\n  whiteSpace: 'nowrap',\n  zIndex: 1000,\n  pointerEvents: 'none',\n  [theme.breakpoints.up('sm')]: {\n    fontSize: '0.875rem',\n    padding: theme.spacing(1.5, 3),\n  },\n}));\n\n\nconst StyledContent = styled(Box)(({ theme }) => ({\n  padding: theme.spacing(2, 3, 3),\n  [theme.breakpoints.up('sm')]: {\n    padding: theme.spacing(2, 4, 4),\n  },\n  [theme.breakpoints.up('md')]: {\n    padding: theme.spacing(2, 6, 6),\n  },\n}));\n\n\nconst StyledContentWrapper = styled(Box)(({ theme }) => ({\n  color: theme.palette.dark.main,\n  lineHeight: 1.5,\n  wordBreak: 'break-word',\n  fontSize: 13,\n  '& p': {\n    margin: 0,\n    marginBottom: theme.spacing(2),\n    '&:last-child': {\n      marginBottom: 0,\n    },\n  },\n  '& ul, & ol': {\n    marginTop: theme.spacing(1),\n    marginBottom: theme.spacing(2),\n    paddingLeft: theme.spacing(3),\n    '&:last-child': {\n      marginBottom: 0,\n    },\n  },\n  '& li': {\n    marginBottom: theme.spacing(0.5),\n  },\n}));\n\n\nexport function Concertina({ sections }: ConcertinaProps) {\n  const [hoveredTitle, setHoveredTitle] = useState<string | null>(null);\n  const [copiedId, setCopiedId] = useState<string | null>(null);\n  const [tooltipPosition, setTooltipPosition] = useState<{ x: number; y: number } | null>(null);\n  const theme = useTheme()\n  const isDesktop = useMediaQuery(theme.breakpoints.up('md'));\n\n  const [openSections, setOpenSections] = useState<Set<string>>(() => {\n    // Initialize with all sections open on desktop, closed on mobile\n    return isDesktop ? new Set(sections.map(s => s.id)) : new Set();\n  });\n\n\n  React.useEffect(() => {\n    if (isDesktop) {\n      setOpenSections(new Set(sections.map(s => s.id)));\n    } else {\n      setOpenSections(new Set());\n    }\n  }, [isDesktop, sections]);\n\n\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\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    setTooltipPosition({ x: e.clientX, y: e.clientY });\n    setTimeout(() => {\n      setCopiedId(null);\n      setTooltipPosition(null);\n    }, 2000);\n  };\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                <StyledHashtag\n                  isVisible={true}\n                  color={hoveredTitle === section.id ? theme.palette.info.main : '#00000000'}\n                  onClick={(e) => copyJumpLink(section.id, e as any)}\n                >\n                  #\n                </StyledHashtag>\n                {section.title}\n              </StyledTitle>\n            </StyledTitleWrapper>\n            <ExpandCircleDownOutlined\n              sx={{ fontSize: '1.5rem', transform: openSections.has(section.id) ? 'rotate(180deg)' : 'none' }}\n            />\n          </StyledHeader>\n          <Collapse in={openSections.has(section.id)}>\n            <StyledContent>\n              <StyledContentWrapper>{section.content}</StyledContentWrapper>\n            </StyledContent>\n          </Collapse>\n        </StyledSection>\n      ))}\n      {copiedId && tooltipPosition && (\n        <StyledTooltip\n          sx={{\n            left: tooltipPosition.x,\n            top: tooltipPosition.y,\n          }}\n        >\n          Link copied\n        </StyledTooltip>\n      )}\n    </StyledConcertina>\n  );\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/ExpandingBox.d.ts

@@ -0,0 +1,6 @@
+interface ExpandingBoxProps {
+    term: string;
+    content: string;
+}
+export declare function ExpandingBox({ term, content }: ExpandingBoxProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/components/ExpandingBox.js

@@ -0,0 +1,58 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { styled, Box } from '@mui/material';
+import { useTheme } from '../ThemeProvider.js';
+import { IndeterminateCheckBoxRounded, AddBoxRounded } from '@mui/icons-material';
+
+const StyledWrapper = styled(Box)(({ theme }) => ({
+// No specific wrapper styles needed, just a container
+}));
+const StyledParagraph = styled('span')(({ theme }) => ({
+    fontSize: '14px', // text-[14px]
+    color: theme.palette.dark.main, // text-[#4D3019]
+    display: 'inline-flex',
+    alignItems: 'center',
+}));
+const StyledTermWrapper = styled(Box)(({ theme, open }) => ({
+    position: 'relative',
+    display: 'inline-flex',
+    alignItems: 'center',
+    cursor: 'pointer',
+    marginLeft: theme.spacing(0.5), // ml-1
+    paddingBottom: '1px', // style={{ paddingBottom: '1px' }}
+    borderBottom: `2px solid ${theme.palette.dark.main}`, // border-b-2
+    backgroundColor: theme.palette.background.default,
+}));
+const StyledIconWrapper = styled(Box)(({ theme }) => ({
+    display: 'inline-flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    marginLeft: theme.spacing(0.5), // ml-1
+    transition: 'color 0.2s', // transition-colors
+}));
+const StyledExpandingBox = styled(Box)(({ theme }) => ({
+    marginTop: theme.spacing(2), // mt-4
+    padding: theme.spacing(2), // p-4
+    borderRadius: 4,
+    border: `1px solid ${theme.palette.dark.main}`,
+    backgroundColor: theme.palette.background.default,
+}));
+function ExpandingBox({ term, content }) {
+    const theme = useTheme();
+    const [open, setOpen] = useState(false);
+    return (jsxs(StyledWrapper, { children: [jsx(StyledParagraph, { children: jsxs(StyledTermWrapper, { onClick: () => setOpen(!open), open: open, children: [term, jsx(StyledIconWrapper, { children: open ? (jsx(IndeterminateCheckBoxRounded, { sx: {
+                                    fontSize: 16,
+                                    color: theme.palette.text.primary
+                                } })) : (jsx(AddBoxRounded, { sx: {
+                                    fontSize: 16,
+                                    color: theme.palette.text.primary,
+                                } })) })] }) }), open && (jsx(StyledExpandingBox, { children: jsx(Box, { sx: {
+                        fontSize: '14px',
+                        color: theme.palette.dark.main,
+                        lineHeight: 1.5,
+                        display: 'inline-block'
+                    }, dangerouslySetInnerHTML: { __html: content } }) }))] }));
+}
+
+export { ExpandingBox };
+//# sourceMappingURL=ExpandingBox.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ExpandingBox.js","sources":["../../../../src/components/ExpandingBox.tsx"],"sourcesContent":["\n\nimport { useState } from 'react';\nimport { Box, styled, Typography } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { AddBoxRounded, IndeterminateCheckBoxRounded } from '@mui/icons-material';\n\ninterface ExpandingBoxProps {\n  term: string;\n  content: string;\n}\n\nconst StyledWrapper = styled(Box)(({ theme }) => ({\n  // No specific wrapper styles needed, just a container\n}));\n\nconst StyledParagraph = styled('span')(({ 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)<{ open: boolean }>(({ theme, open })  => ({\n  position: 'relative',\n  display: 'inline-flex',\n  alignItems: 'center',\n  cursor: 'pointer',\n  marginLeft: theme.spacing(0.5), // ml-1\n  paddingBottom: '1px', // style={{ paddingBottom: '1px' }}\n  borderBottom: `2px solid ${theme.palette.dark.main}`, // border-b-2\n  backgroundColor: theme.palette.background.default,\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 StyledExpandingBox = styled(Box)(({ theme }) => ({\n  marginTop: theme.spacing(2), // mt-4\n  padding: theme.spacing(2), // p-4\n  borderRadius: 4,\n  border: `1px solid ${theme.palette.dark.main}`,\n  backgroundColor: theme.palette.background.default,\n}));\n\nexport function ExpandingBox({ term, content }: ExpandingBoxProps) {\n  const theme = useTheme();\n  const [open, setOpen] = useState(false);\n\n  return (\n    <StyledWrapper>\n      <StyledParagraph >\n        <StyledTermWrapper onClick={() => setOpen(!open)} open={open}>\n            {term}\n          <StyledIconWrapper>\n            {open ? (\n              <IndeterminateCheckBoxRounded\n                sx={{\n                  fontSize: 16,\n                  color: theme.palette.text.primary\n                }}\n              />\n            ) : (\n              <AddBoxRounded\n                sx={{\n                  fontSize: 16,\n                  color: theme.palette.text.primary,\n                }}\n              />\n            )}\n          </StyledIconWrapper>\n        </StyledTermWrapper>\n      </StyledParagraph>\n      {open && (\n        <StyledExpandingBox>\n          <Box\n            sx={{\n              fontSize: '14px',\n              color: theme.palette.dark.main,\n              lineHeight: 1.5,\n              display: 'inline-block'\n            }}\n            dangerouslySetInnerHTML={{ __html: content }}\n          />\n        </StyledExpandingBox>\n      )}\n    </StyledWrapper>\n  );\n}"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/NoteBox.js

@@ -7,7 +7,12 @@ const NoteContainer = styled(Box)({
     position: 'relative',
     maxWidth: '100%',
 });
-const HighlightWrapper = styled(Box)(({ isHovered, highlightColor, highlightSelectedColor, isCustom }) => ({
+const HighlightWrapper = styled(Box, {
+    shouldForwardProp: (prop) => prop !== 'isHovered' &&
+        prop !== 'highlightColor' &&
+        prop !== 'highlightSelectedColor' &&
+        prop !== 'isCustom'
+})(({ isHovered, highlightColor, highlightSelectedColor, isCustom }) => ({
     position: 'relative',
     display: 'inline-block', // Keep this as inline-block
     maxWidth: '100%',

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

@@ -1 +1 @@
-{"version":3,"file":"NoteBox.js","sources":["../../../../src/components/NoteBox.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Box, Typography, IconButton, styled } from '@mui/material';\nimport { EditRounded } from '@mui/icons-material';\n\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\n\nconst NoteContainer = styled(Box)({\n  position: 'relative',\n  maxWidth: '100%',\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', // Keep this as 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    borderBottom: '2px solid rgba(77, 48, 25, 0.3)',\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\nconst EditButton = styled(IconButton)(({ theme }) => ({\n  position: 'absolute',\n  top: 0,\n  right: 0,\n  transform: 'translate(50%, -50%)',\n  width: 20,\n  height: 20,\n  borderRadius: 4,\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: 'translate(50%, -50%) scale(1.1)',\n  },\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\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\n  const style = variants[variant];\n  const displayLabel = label || style.label;\n\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};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"NoteBox.js","sources":["../../../../src/components/NoteBox.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Box, Typography, IconButton, styled } from '@mui/material';\nimport { EditRounded } from '@mui/icons-material';\n\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\n\nconst NoteContainer = styled(Box)({\n  position: 'relative',\n  maxWidth: '100%',\n});\n\nconst HighlightWrapper = styled(Box,{\n  shouldForwardProp: (prop) => \n    prop !== 'isHovered' && \n    prop !== 'highlightColor' && \n    prop !== 'highlightSelectedColor' && \n    prop !== 'isCustom'\n})<{ \n  isHovered: boolean; \n  highlightColor: string; \n  highlightSelectedColor: string;\n  isCustom: boolean;\n}>(({ isHovered, highlightColor, highlightSelectedColor, isCustom }) => ({\n  position: 'relative',\n  display: 'inline-block', // Keep this as 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    borderBottom: '2px solid rgba(77, 48, 25, 0.3)',\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\nconst EditButton = styled(IconButton)(({ theme }) => ({\n  position: 'absolute',\n  top: 0,\n  right: 0,\n  transform: 'translate(50%, -50%)',\n  width: 20,\n  height: 20,\n  borderRadius: 4,\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: 'translate(50%, -50%) scale(1.1)',\n  },\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\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\n  const style = variants[variant];\n  const displayLabel = label || style.label;\n\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};\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;AAcA,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;AAChC,IAAA,QAAQ,EAAE,UAAU;AACpB,IAAA,QAAQ,EAAE,MAAM;AACjB,CAAA,CAAC;AAEF,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,EAAC;IAClC,iBAAiB,EAAE,CAAC,IAAI,KACtB,IAAI,KAAK,WAAW;AACpB,QAAA,IAAI,KAAK,gBAAgB;AACzB,QAAA,IAAI,KAAK,wBAAwB;AACjC,QAAA,IAAI,KAAK;AACZ,CAAA,CAAC,CAKC,CAAC,EAAE,SAAS,EAAE,cAAc,EAAE,sBAAsB,EAAE,QAAQ,EAAE,MAAM;AACvE,IAAA,QAAQ,EAAE,UAAU;IACpB,OAAO,EAAE,cAAc;AACvB,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,sBAAsB,EAAE;AACtB,QAAA,OAAO,EAAE,CAAC;AACX,KAAA;AACD,IAAA,mBAAmB,EAAE;AACnB,QAAA,UAAU,EAAE,QAAQ,GAAG,cAAc,IAAI,SAAS,GAAG,sBAAsB,GAAG,cAAc,CAAC;AAC7F,QAAA,OAAO,EAAE,SAAS;AAClB,QAAA,YAAY,EAAE,iCAAiC;AAC/C,QAAA,kBAAkB,EAAE,OAAO;AAC3B,QAAA,wBAAwB,EAAE,OAAO;QACjC,UAAU,EAAE,QAAQ,GAAG,MAAM,GAAG,sBAAsB;QACtD,MAAM,EAAE,QAAQ,GAAG,SAAS,GAAG,SAAS;AACxC,QAAA,QAAQ,EAAE,MAAM;AAChB,QAAA,QAAQ,EAAE,YAAY;AACtB,QAAA,YAAY,EAAE,YAAY;AAC1B,QAAA,OAAO,EAAE,QAAQ;AACjB,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA,CAAC,CAAC;AAEH,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AACpD,IAAA,QAAQ,EAAE,UAAU;AACpB,IAAA,GAAG,EAAE,CAAC;AACN,IAAA,KAAK,EAAE,CAAC;AACR,IAAA,SAAS,EAAE,sBAAsB;AACjC,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,YAAY,EAAE,CAAC;AACf,IAAA,eAAe,EAAE,SAAS;AAC1B,IAAA,OAAO,EAAE,CAAC;AACV,IAAA,UAAU,EAAE,eAAe;AAC3B,IAAA,SAAS,EAAE,4BAA4B;AACvC,IAAA,SAAS,EAAE;AACT,QAAA,eAAe,EAAE,SAAS;AAC1B,QAAA,SAAS,EAAE,iCAAiC;AAC7C,KAAA;AACF,CAAA,CAAC,CAAC;MAGU,OAAO,GAA2B,CAAC,EAC9C,OAAO,GAAG,SAAS,EACnB,KAAK,EACL,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,WAAW,GACZ,KAAI;IACH,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;AAGjD,IAAA,MAAM,QAAQ,GAAG;AACf,QAAA,OAAO,EAAE;AACP,YAAA,SAAS,EAAE,SAAS;AACpB,YAAA,iBAAiB,EAAE,SAAS;AAC5B,YAAA,KAAK,EAAE,EAAE;AACT,YAAA,UAAU,EAAE,EAAE;AACf,SAAA;AACD,QAAA,SAAS,EAAE;AACT,YAAA,SAAS,EAAE,SAAS;AACpB,YAAA,iBAAiB,EAAE,SAAS;AAC5B,YAAA,KAAK,EAAE,0BAA0B;AACjC,YAAA,UAAU,EAAE,wBAAwB;AACrC,SAAA;AACD,QAAA,QAAQ,EAAE;AACR,YAAA,SAAS,EAAE,SAAS;AACpB,YAAA,iBAAiB,EAAE,SAAS;AAC5B,YAAA,KAAK,EAAE,yBAAyB;AAChC,YAAA,UAAU,EAAE,wBAAwB;AACrC,SAAA;AACD,QAAA,OAAO,EAAE;AACP,YAAA,SAAS,EAAE,SAAS;AACpB,YAAA,iBAAiB,EAAE,SAAS;AAC5B,YAAA,KAAK,EAAE,SAAS;AAChB,YAAA,UAAU,EAAE,wBAAwB;AACrC,SAAA;AACD,QAAA,QAAQ,EAAE;AACR,YAAA,SAAS,EAAE,SAAS;AACpB,YAAA,iBAAiB,EAAE,SAAS;AAC5B,YAAA,KAAK,EAAE,UAAU;AACjB,YAAA,UAAU,EAAE,SAAS;AACtB,SAAA;AACD,QAAA,iBAAiB,EAAE;AACjB,YAAA,SAAS,EAAE,SAAS;AACpB,YAAA,iBAAiB,EAAE,SAAS;AAC5B,YAAA,KAAK,EAAE,iCAAiC;AACxC,YAAA,UAAU,EAAE,SAAS;AACtB,SAAA;AACD,QAAA,MAAM,EAAE;AACN,YAAA,SAAS,EAAE,SAAS;AACpB,YAAA,iBAAiB,EAAE,SAAS;AAC5B,YAAA,KAAK,EAAE,aAAa;AACpB,YAAA,UAAU,EAAE,wBAAwB;AACrC,SAAA;KACF;AAGD,IAAA,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC;AAC/B,IAAA,MAAM,YAAY,GAAG,KAAK,IAAI,KAAK,CAAC,KAAK;AAGzC,IAAA,QACEA,IAAA,CAAC,aAAa,EAAA,EAAC,SAAS,EAAE,SAAS,EAAA,QAAA,EAAA,CAChC,YAAY,KACXC,GAAA,CAAC,GAAG,EAAA,EAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAA,QAAA,EAChBA,GAAA,CAAC,UAAU,EAAA,EACT,SAAS,EAAC,MAAM,EAChB,EAAE,EAAE;AACF,wBAAA,QAAQ,EAAE,MAAM;AAChB,wBAAA,UAAU,EAAE,GAAG;AACf,wBAAA,KAAK,EAAE,KAAK,CAAC,UAAU,IAAI,oBAAoB;AAChD,qBAAA,EAAA,QAAA,EAEA,YAAY,EAAA,CACF,EAAA,CACT,CACP,EACDD,KAAC,gBAAgB,EAAA,EACf,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,KAAK,CAAC,SAAS,EAC/B,sBAAsB,EAAE,KAAK,CAAC,iBAAiB,EAC/C,QAAQ,EAAE,OAAO,KAAK,QAAQ,EAC9B,YAAY,EAAE,MAAM,OAAO,KAAK,QAAQ,IAAI,YAAY,CAAC,IAAI,CAAC,EAC9D,YAAY,EAAE,MAAM,OAAO,KAAK,QAAQ,IAAI,YAAY,CAAC,KAAK,CAAC,EAAA,QAAA,EAAA,CAE/DC,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,gBAAgB,EAAA,QAAA,EAC7B,QAAQ,EAAA,CACJ,EACPA,IAAC,UAAU,EAAA,EACT,SAAS,EAAC,aAAa,EACvB,OAAO,EAAE,CAAC,CAAC,KAAI;4BACb,CAAC,CAAC,eAAe,EAAE;4BACnB,IAAI,WAAW,EAAE;AACf,gCAAA,WAAW,EAAE;4BACf;AACF,wBAAA,CAAC,EACD,KAAK,EAAC,yBAAyB,EAC/B,IAAI,EAAC,OAAO,EAAA,QAAA,EAEZA,GAAA,CAAC,WAAW,EAAA,EAAC,EAAE,EAAE,EAAC,QAAQ,EAAC,EAAE,EAAE,KAAK,EAAC,SAAS,EAAE,WAAW,EAAC,CAAC,EAAC,EAAA,CAAI,EAAA,CACvD,CAAA,EAAA,CACI,CAAA,EAAA,CACL;AAEpB;;;;"}

package/dist/esm/components/Progress.js

@@ -17,7 +17,9 @@ const Progress = ({ current, total, showLabel = true, className = '' }) => {
     const percentage = Math.min(Math.max((current / total) * 100, 0), 100);
     return (jsxs(Box, { className: className, children: [showLabel && (jsxs(Box, { sx: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 1 }, children: [jsxs(Typography, { variant: "body2", fontWeight: 500, children: ["Step ", current, " of ", total] }), jsxs(Typography, { variant: "body2", fontWeight: 500, children: [Math.round(percentage), "%"] })] })), jsx(StyledLinearProgress, { variant: "determinate", value: percentage })] }));
 };
-const StepNumber = styled(Box)(({ theme, isActive, isCompleted }) => ({
+const StepNumber = styled(Box, {
+    shouldForwardProp: (prop) => prop !== 'isActive' && prop !== 'isCompleted'
+})(({ theme, isActive, isCompleted }) => ({
     width: 40,
     height: 40,
     borderRadius: '50%',
@@ -40,7 +42,9 @@ const StepNumber = styled(Box)(({ theme, isActive, isCompleted }) => ({
         fontSize: '0.75rem',
     },
 }));
-const StepLine = styled(Box)(({ theme, isCompleted }) => ({
+const StepLine = styled(Box, {
+    shouldForwardProp: (prop) => prop !== 'isCompleted'
+})(({ theme, isCompleted }) => ({
     flex: 1,
     height: 4,
     borderRadius: 2,

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

@@ -1 +1 @@
-{"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":"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"}
+{"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,{\n  shouldForwardProp: (prop) => prop !== 'isActive' && prop !== 'isCompleted'\n})<{ 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,{\n  shouldForwardProp: (prop) => prop !== 'isCompleted'\n})<{ 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":"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"}

package/dist/esm/components/Sidebar.d.ts

@@ -1,10 +1,18 @@
 import React from 'react';
+interface PolicyItem {
+    title: string;
+    id: number;
+    newpage: boolean;
+    url: string;
+    items?: PolicyItem[];
+}
 interface SidebarProps {
     isOpen: boolean;
     onToggle: () => void;
     centreName?: string;
     activePage?: string;
-    onPageChange?: (pageId: string) => void;
+    onNavigate?: (url: string) => void;
+    policies?: PolicyItem[];
 }
 export declare const Sidebar: React.FC<SidebarProps>;
 export {};