ece-docs-components 1.0.0 → 1.0.2

package/dist/ThemeProvider.d.ts

@@ -1,15 +1,102 @@
+import { createTheme } from '@mui/material/styles';
 import * as React from 'react';
 import './theme-types';
-export declare const muiThemes: {
-    default: import("@mui/material").Theme;
-    school: import("@mui/material").Theme;
-    health: import("@mui/material").Theme;
+declare const themeConfigs: {
+    default: {
+        palette: {
+            primary: {
+                main: string;
+            };
+            secondary: {
+                main: string;
+            };
+            accent: {
+                main: string;
+            };
+            dark: {
+                main: string;
+            };
+            light: {
+                main: string;
+            };
+            markedRead: {
+                main: string;
+            };
+            custom: {
+                iconColor: string;
+                primaryButtonTextColor: string;
+                readByBackgroundColor: string;
+                stepIndicatorTextColor: string;
+                markAsReadBackgroundColor: string;
+                tabBackgroundColor: string;
+            };
+        };
+        appName: string;
+    };
+    school: {
+        palette: {
+            primary: {
+                main: string;
+            };
+            secondary: {
+                main: string;
+            };
+            accent: {
+                main: string;
+            };
+            dark: {
+                main: string;
+            };
+            light: {
+                main: string;
+            };
+            markedRead: {
+                main: string;
+            };
+            custom: {
+                primaryButtonTextColor: string;
+                stepIndicatorTextColor: string;
+            };
+        };
+        appName: string;
+    };
+    health: {
+        palette: {
+            primary: {
+                main: string;
+            };
+            secondary: {
+                main: string;
+            };
+            accent: {
+                main: string;
+            };
+            dark: {
+                main: string;
+            };
+            light: {
+                main: string;
+            };
+            markedRead: {
+                main: string;
+            };
+            custom: {
+                iconColor: string;
+                primaryButtonTextColor: string;
+                markAsReadBorderColor: string;
+                readByBackgroundColor: string;
+                stepIndicatorTextColor: string;
+                tabBackgroundColor: string;
+            };
+        };
+        appName: string;
+    };
 };
-export type ThemeKey = keyof typeof muiThemes;
+export type ThemeKey = keyof typeof themeConfigs;
 interface ThemeContextType {
     currentTheme: ThemeKey;
     setTheme: (theme: ThemeKey) => void;
-    theme: typeof muiThemes[ThemeKey];
+    theme: ReturnType<typeof createTheme>;
 }
 export declare const ThemeProvider: React.FC<{
     children: React.ReactNode;

package/dist/ThemeProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../src/ThemeProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,eAAe,CAAC;AAgCvB,eAAO,MAAM,SAAS;;;;CAsDrB,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAC;AAE9C,UAAU,gBAAgB;IACxB,YAAY,EAAE,QAAQ,CAAC;IACvB,QAAQ,EAAE,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,CAAC;IACpC,KAAK,EAAE,OAAO,SAAS,CAAC,QAAQ,CAAC,CAAC;CACnC;AAID,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAUjE,CAAC;AAEF,eAAO,MAAM,QAAQ,wBAMpB,CAAC"}
+{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../src/ThemeProvider.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAqC,MAAM,sBAAsB,CAAC;AAEtF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,eAAe,CAAC;AAgCvB,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsDjB,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,YAAY,CAAC;AAOjD,UAAU,gBAAgB;IACxB,YAAY,EAAE,QAAQ,CAAC;IACvB,QAAQ,EAAE,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,CAAC;IACpC,KAAK,EAAE,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;CACvC;AAID,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAajE,CAAC;AAEF,eAAO,MAAM,QAAQ,wBAMpB,CAAC"}

package/dist/components/Modal.d.ts

@@ -10,6 +10,7 @@ interface ModalProps {
     onAcceptSuggestionChange?: (checked: boolean) => void;
     onSave?: () => void;
     onSubmit?: () => void;
+    onDeclineWording?: () => void;
     onPrevious?: () => void;
     onNext?: () => void;
     currentPage?: number;

package/dist/components/Modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../src/components/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAiBxC,UAAU,UAAU;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,WAAW,GAAG,UAAU,GAAG,UAAU,GAAG,iBAAiB,GAAG,sBAAsB,GAAG,eAAe,CAAC;IAC7G,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAsBD,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAsMtC,CAAC"}
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../src/components/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAiBxC,UAAU,UAAU;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,WAAW,GAAG,UAAU,GAAG,UAAU,GAAG,iBAAiB,GAAG,sBAAsB,GAAG,eAAe,CAAC;IAC7G,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAsBD,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CA+LtC,CAAC"}

package/dist/index.d.ts

@@ -1,6 +1,5 @@
 import './theme-types';
 export { ThemeProvider, useTheme } from './ThemeProvider';
-export { muiThemes } from './ThemeProvider';
 export type { ThemeKey } from './ThemeProvider';
 export * from './components';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,CAAC;AAGvB,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAG1D,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAG5C,YAAY,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAEhD,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,CAAC;AAGvB,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAG1D,YAAY,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAEhD,cAAc,cAAc,CAAC"}

package/dist/index.esm.js

@@ -1,13 +1,4 @@
-import { createTheme, ThemeProvider as ThemeProvider$1, styled } from '@mui/material/styles';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { deepmerge } from '@mui/utils';
-import * as React from 'react';
-import React__default, { useState } from 'react';
-import { Button as Button$1, styled as styled$1, InputLabel, TextField, Box, Select as Select$1, FormControl, MenuItem, FormHelperText, FormControlLabel, Typography, FormLabel, Checkbox as Checkbox$1, LinearProgress, Alert as Alert$1, IconButton, Dialog, DialogContent, Chip, Collapse, ListItemButton, List, ListItemText, Link, DialogTitle, Menu, Breadcrumbs } from '@mui/material';
-import { ExpandMoreRounded, InfoOutlineRounded, HighlightOffRounded, ErrorOutlineRounded, TaskAltRounded, EditRounded, CloseRounded, StickyNote2Rounded, ChevronLeftRounded, ChevronRightRounded, LinkRounded, ExpandLessRounded, PieChartRounded, HomeRounded, TextSnippetRounded, HelpOutlineRounded, SchoolRounded, SearchRounded, AddRounded } from '@mui/icons-material';
-
-// Base MUI theme configuration (shared across all themes)
-const baseTheme = createTheme({
+import {createTheme,ThemeProvider as ThemeProvider$1,styled}from'@mui/material/styles';import {jsx,jsxs,Fragment}from'react/jsx-runtime';import {deepmerge}from'@mui/utils';import*as React from'react';import React__default,{useState}from'react';import {Button as Button$1,styled as styled$1,InputLabel,TextField,Box,Select as Select$1,FormControl,MenuItem,FormHelperText,FormControlLabel,Typography,FormLabel,Checkbox as Checkbox$1,LinearProgress,Alert as Alert$1,IconButton,Dialog,DialogContent,Chip,Collapse,ListItemButton,List,ListItemText,Link,DialogTitle,Menu,Breadcrumbs}from'@mui/material';import {ExpandMoreRounded,InfoOutlineRounded,HighlightOffRounded,ErrorOutlineRounded,TaskAltRounded,EditRounded,CloseRounded,StickyNote2Rounded,ChevronLeftRounded,ChevronRightRounded,LinkRounded,ExpandLessRounded,PieChartRounded,HomeRounded,TextSnippetRounded,HelpOutlineRounded,SchoolRounded,SearchRounded,AddRounded}from'@mui/icons-material';const baseTheme = createTheme({
     typography: {
         fontFamily: ['Inter', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'sans-serif'].join(','),
     },
@@ -17,7 +8,7 @@ const baseTheme = createTheme({
                 body: {
                     WebkitFontSmoothing: 'antialiased',
                     MozOsxFontSmoothing: 'grayscale',
-                    backgroundColor: '#FDFCEE', // Add background color here
+                    backgroundColor: '#FDFCEE',
                 },
                 'input[type="checkbox"], input[type="radio"]': {
                     accentColor: theme.palette.secondary.main,
@@ -35,9 +26,9 @@ const baseTheme = createTheme({
         },
     },
 });
-// Theme configurations
-const muiThemes = {
-    default: createTheme(deepmerge(baseTheme, {
+// Store only the configuration overrides, not full themes
+const themeConfigs = {
+    default: {
         palette: {
             primary: { main: '#AD46FF' },
             secondary: { main: '#D79AFC' },
@@ -54,9 +45,9 @@ const muiThemes = {
                 tabBackgroundColor: '#F8F0FC',
             },
         },
-        appName: 'ECE Docs', // Add appName
-    })),
-    school: createTheme(deepmerge(baseTheme, {
+        appName: 'ECE Docs',
+    },
+    school: {
         palette: {
             primary: { main: '#386e41' },
             secondary: { main: '#8fc790' },
@@ -69,9 +60,9 @@ const muiThemes = {
                 stepIndicatorTextColor: '#FFFFFF',
             },
         },
-        appName: 'School Docs', // Add appName
-    })),
-    health: createTheme(deepmerge(baseTheme, {
+        appName: 'School Docs',
+    },
+    health: {
         palette: {
             primary: { main: '#4871cf' },
             secondary: { main: '#a4d6ff' },
@@ -88,13 +79,19 @@ const muiThemes = {
                 tabBackgroundColor: '#a4d6ff',
             },
         },
-        appName: 'GP Docs', // Add appName
-    })),
+        appName: 'GP Docs',
+    },
+};
+// Create themes on-demand using useMemo
+const createMuiTheme = (key) => {
+    return createTheme(deepmerge(baseTheme, themeConfigs[key]));
 };
 const ThemeContext = React.createContext(undefined);
 const ThemeProvider = ({ children }) => {
     const [currentTheme, setCurrentTheme] = React.useState('default');
-    return (jsx(ThemeContext.Provider, { value: { currentTheme, setTheme: setCurrentTheme, theme: muiThemes[currentTheme] }, children: jsx(ThemeProvider$1, { theme: muiThemes[currentTheme], children: children }) }));
+    // Create theme on-demand, memoized
+    const theme = React.useMemo(() => createMuiTheme(currentTheme), [currentTheme]);
+    return (jsx(ThemeContext.Provider, { value: { currentTheme, setTheme: setCurrentTheme, theme }, children: jsx(ThemeProvider$1, { theme: theme, children: children }) }));
 };
 const useTheme = () => {
     const context = React.useContext(ThemeContext);
@@ -102,9 +99,7 @@ const useTheme = () => {
         throw new Error('useTheme must be used within a ThemeProvider');
     }
     return context;
-};
-
-const StyledButton = styled(Button$1, {
+};const StyledButton = styled(Button$1, {
     shouldForwardProp: (prop) => prop !== 'customVariant' && prop !== 'customSize',
 })(({ theme, customVariant, customSize }) => {
     const currentTheme = theme.palette;
@@ -203,9 +198,7 @@ const StyledButton = styled(Button$1, {
 });
 const Button = ({ variant = 'primary', size = 'md', children, fullWidth = false, ...props }) => {
     return (jsx(StyledButton, { customVariant: variant, customSize: size, fullWidth: fullWidth, disableRipple: true, ...props, children: children }));
-};
-
-const InputWrapper = styled$1('div')(({ theme }) => ({
+};const InputWrapper = styled$1('div')(({ theme }) => ({
     width: '100%',
 }));
 const StyledLabel$1 = styled$1(InputLabel)(({ theme }) => ({
@@ -272,9 +265,7 @@ const StyledTextField$1 = styled$1(TextField, {
 const Input = ({ error, fullWidth = false, id, label, ...props }) => {
     const inputId = id || `input-${Math.random().toString(36).substr(2, 9)}`;
     return (jsxs(InputWrapper, { sx: { ...(!fullWidth && { width: 'auto' }) }, children: [label && (jsx(StyledLabel$1, { htmlFor: inputId, children: label })), jsx(StyledTextField$1, { id: inputId, error: !!error, helperText: error || props.helperText, errorMessage: error, fullWidth: fullWidth, variant: "outlined", ...props })] }));
-};
-
-const StyledCard = styled$1(Box, {
+};const StyledCard = styled$1(Box, {
     shouldForwardProp: (prop) => prop !== 'customPadding' && prop !== 'customVariant',
 })(({ theme, customPadding, customVariant }) => {
     const paddingStyles = {
@@ -309,9 +300,7 @@ const StyledCard = styled$1(Box, {
 const Card = ({ children, className = '', padding = 'md', variant = 'default', sx, // Destructure sx prop
  }) => {
     return (jsx(StyledCard, { className: className, customPadding: padding, customVariant: variant, sx: sx, children: children }));
-};
-
-const StyledSelect = styled$1(Select$1)(({ theme, error }) => ({
+};const StyledSelect = styled$1(Select$1)(({ theme, error }) => ({
     backgroundColor: theme.palette.light.main,
     borderRadius: (typeof theme.shape.borderRadius === 'string'
         ? parseInt(theme.shape.borderRadius, 10)
@@ -395,9 +384,7 @@ const Select = ({ label, error, helperText, fullWidth = false, options, classNam
                     fontSize: '0.875rem',
                     color: `${theme.palette.dark.main}99`,
                 }, children: helperText }))] }));
-};
-
-const CustomRadioIcon = styled$1('span')(({ theme, checked }) => ({
+};const CustomRadioIcon = styled$1('span')(({ theme, checked }) => ({
     width: 20,
     height: 20,
     borderRadius: '50%',
@@ -446,9 +433,7 @@ const RadioGroup = ({ label, error, children, className = '' }) => {
                     fontSize: '0.875rem',
                     color: theme.palette.accent.main,
                 }, children: error }))] }));
-};
-
-const StyledWrapper$1 = styled$1(Box)(({ theme }) => ({
+};const StyledWrapper$1 = styled$1(Box)(({ theme }) => ({
     display: 'flex',
     alignItems: 'flex-start',
 }));
@@ -480,9 +465,7 @@ const StyledDescription = styled$1(Typography)(({ theme }) => ({
 const Checkbox = ({ label, description, className = '', id, ...props }) => {
     const checkboxId = id || `checkbox-${Math.random().toString(36).substr(2, 9)}`;
     return (jsx(StyledWrapper$1, { className: className, children: jsx(FormControlLabel, { control: jsx(StyledCheckbox, { id: checkboxId, ...props }), label: jsxs(Box, { sx: { ml: 1.5, display: 'flex', flexDirection: 'column' }, children: [jsx(StyledLabel, { children: label }), description && jsx(StyledDescription, { children: description })] }) }) }));
-};
-
-const StyledLinearProgress = styled$1(LinearProgress)(({ theme }) => ({
+};const StyledLinearProgress = styled$1(LinearProgress)(({ theme }) => ({
     height: 10,
     borderRadius: 9999,
     backgroundColor: `${theme.palette.dark.main}1A`,
@@ -552,9 +535,7 @@ const StepIndicator = ({ steps, currentStep, className = '' }) => {
                                     color: isActive ? theme.palette.primary.main : `${theme.palette.dark.main}99`,
                                 }, children: step })] }), index < steps.length - 1 && (jsx(StepLine, { isCompleted: isCompleted }))] }, index));
         }) }));
-};
-
-const StyledAlert = styled$1(Alert$1)(({ theme, customvariant }) => {
+};const StyledAlert = styled$1(Alert$1)(({ theme, customvariant }) => {
     const variants = {
         info: {
             backgroundColor: '#eff6ff',
@@ -622,9 +603,7 @@ const Alert = ({ variant = 'info', children, className = '', icon = true, sx, })
         custom: 'info',
     };
     return (jsx(StyledAlert, { customvariant: variant, severity: severityMap[variant], icon: icon ? iconMap[variant] : false, className: className, sx: sx, children: children }));
-};
-
-const NoteContainer = styled$1(Box)({
+};const NoteContainer = styled$1(Box)({
     position: 'relative',
     maxWidth: '100%',
 });
@@ -723,9 +702,7 @@ const NoteBox = ({ variant = 'default', label, children, className = '', onEditC
                                 onEditClick();
                             }
                         }, title: "Edit variable highlight", size: "small", children: jsx(EditRounded, { sx: { fontSize: 14, color: "#FFFFFF", strokeWidth: 2 } }) })] })] }));
-};
-
-const StyledDialog$1 = styled$1(Dialog)(({ theme }) => ({
+};const StyledDialog$1 = styled$1(Dialog)(({ theme }) => ({
     '& .MuiDialog-paper': {
         borderRadius: theme.shape.borderRadius,
         maxWidth: '896px',
@@ -743,13 +720,9 @@ const NavButton = styled$1(IconButton)(({ theme }) => ({
         color: theme.palette.light.main,
     },
 }));
-const Modal = ({ isOpen, onClose, status, description, defaultText, note, acceptSuggestion: initialAcceptSuggestion = true, onAcceptSuggestionChange, onSave, onSubmit, onPrevious, onNext, currentPage = 1, totalPages = 1, }) => {
+const Modal = ({ isOpen, onClose, status, description, defaultText, note, acceptSuggestion: initialAcceptSuggestion = true, onAcceptSuggestionChange, onSave, onSubmit, onDeclineWording, onPrevious, onNext, currentPage = 1, totalPages = 1, }) => {
     const [textValue, setTextValue] = useState(defaultText);
     const [acceptSuggestion, setAcceptSuggestion] = useState(initialAcceptSuggestion);
-    const handleAcceptSuggestionChange = (checked) => {
-        setAcceptSuggestion(checked);
-        onAcceptSuggestionChange?.(checked);
-    };
     const statusConfig = {
         mandatory: {
             color: '#F5A623',
@@ -815,7 +788,7 @@ const Modal = ({ isOpen, onClose, status, description, defaultText, note, accept
                             '& .MuiOutlinedInput-root': {
                                 backgroundColor: acceptSuggestion ? 'rgba(0, 0, 0, 0.05)' : '#fff',
                             },
-                        } }), jsx(FormControlLabel, { control: jsx(Checkbox$1, { checked: acceptSuggestion, onChange: (e) => handleAcceptSuggestionChange(e.target.checked) }), label: "Accept suggestion", sx: { mb: 4 } }), jsxs(Box, { sx: {
+                        } }), jsxs(Box, { sx: {
                             display: 'flex',
                             flexDirection: { xs: 'column', sm: 'row' },
                             alignItems: { xs: 'stretch', sm: 'center' },
@@ -824,15 +797,13 @@ const Modal = ({ isOpen, onClose, status, description, defaultText, note, accept
                             pt: 3,
                             borderTop: '1px solid',
                             borderColor: 'divider',
-                        }, children: [jsxs(Box, { sx: { display: 'flex', gap: 1.5 }, children: [jsx(Button, { onClick: onSave, variant: "secondary", size: "md", children: "Save" }), jsx(Button, { onClick: onSubmit, variant: "primary", size: "md", children: "Submit for review" })] }), jsxs(Box, { sx: {
+                        }, children: [jsxs(Box, { sx: { display: 'flex', gap: 1.5 }, children: [jsx(Button, { onClick: onSave, variant: "secondary", size: "md", children: "Save" }), jsx(Button, { onClick: onSubmit, variant: "primary", size: "md", children: "Submit for review" }), jsx(Button, { onClick: onDeclineWording, variant: "danger", size: "md", children: "Decline Wording" })] }), jsxs(Box, { sx: {
                                     display: 'flex',
                                     alignItems: 'center',
                                     gap: 2,
                                     justifyContent: { xs: 'space-between', sm: 'flex-end' },
                                 }, children: [jsxs(Box, { sx: { display: 'flex', gap: 1.5 }, children: [jsx(NavButton, { onClick: onPrevious, "aria-label": "Previous", children: jsx(ChevronLeftRounded, { sx: { fontSize: 20 } }) }), jsx(NavButton, { onClick: onNext, "aria-label": "Next", children: jsx(ChevronRightRounded, { sx: { fontSize: 20 } }) })] }), jsxs(Typography, { fontWeight: 500, fontSize: "1.125rem", sx: { ml: 1 }, children: [currentPage, "/", totalPages] })] })] })] })] }));
-};
-
-const StyledConcertina = styled$1(Box)(({ theme }) => ({
+};const StyledConcertina = styled$1(Box)(({ theme }) => ({
     width: '100%',
     display: 'flex',
     flexDirection: 'column',
@@ -973,9 +944,7 @@ function Concertina({ sections }) {
         setTimeout(() => setCopiedId(null), 2000);
     };
     return (jsx(StyledConcertina, { children: sections.map((section) => (jsxs(StyledSection, { id: section.id, children: [jsxs(StyledHeader$1, { onClick: () => toggleSection(section.id), onMouseEnter: () => setHoveredTitle(section.id), onMouseLeave: () => setHoveredTitle(null), children: [jsxs(StyledTitleWrapper, { children: [jsx(StyledTitle, { isHovered: hoveredTitle === section.id, variant: "h3", children: section.title }), hoveredTitle === section.id && (jsxs(Box, { sx: { position: 'relative', flexShrink: 0 }, children: [jsx(StyledLinkButton, { onClick: (e) => copyJumpLink(section.id, e), "aria-label": "Copy link", children: jsx(LinkRounded, { sx: { fontSize: 20 } }) }), copiedId === section.id && (jsx(StyledTooltip, { children: "Link copied" }))] }))] }), jsx(StyledChevron, { sx: { fontSize: 20, transform: openSections.has(section.id) ? 'rotate(180deg)' : 'none' } })] }), jsx(Collapse, { in: openSections.has(section.id), children: jsx(StyledContent, { children: jsx(StyledContentText, { children: section.content }) }) })] }, section.id))) }));
-}
-
-const ReadByContainer = styled$1(Box)(({ theme }) => ({
+}const ReadByContainer = styled$1(Box)(({ theme }) => ({
     display: 'flex',
     flexDirection: 'row',
     alignItems: 'flex-start',
@@ -1020,9 +989,7 @@ const ReadBy = ({ names }) => {
                             color: theme.palette.dark.main,
                             ml: 1,
                         }, children: displayText })] }), names.length > 5 && (jsx(ExpandButton, { onClick: () => setIsExpanded(!isExpanded), "aria-label": isExpanded ? 'Collapse' : 'Expand', size: "small", children: isExpanded ? (jsx(ExpandLessRounded, { sx: { fontSize: 16 } })) : (jsx(ExpandMoreRounded, { sx: { fontSize: 16 } })) }))] }));
-};
-
-const StatusBarContainer = styled$1(Box)(({ theme }) => ({
+};const StatusBarContainer = styled$1(Box)(({ theme }) => ({
     width: '100%',
     backgroundColor: '#F5C98E',
     padding: theme.spacing(1.5, 3),
@@ -1074,9 +1041,7 @@ const StatusBar = ({ itemCount, variant = 'actionstarted', onTailorClick, onNext
                             wordBreak: 'break-word',
                             textAlign: { xs: 'center', sm: 'left' },
                         }, children: variant === 'actionstarted' ? (jsxs(Fragment, { children: [jsx(Box, { component: "span", sx: { fontWeight: 700 }, children: "Incomplete." }), " ", message] })) : (jsxs(Fragment, { children: [jsx(Box, { component: "span", sx: { fontWeight: 700 }, children: "Not started." }), " ", message] })) })] }), variant === 'actionstarted' ? (jsx(Box, { sx: { display: 'flex', gap: 1.5, flexShrink: 0 }, children: jsx(NextButton, { onClick: onNextClick, "aria-label": "Next", children: jsx(ChevronRightRounded, { sx: { fontSize: 20 } }) }) })) : (jsx(Box, { sx: { flexShrink: 0 }, children: jsx(Button, { variant: "outline", size: "sm", onClick: onTailorClick, children: "Tailor policies" }) }))] }));
-};
-
-const TabsContainer = styled$1(Box)({
+};const TabsContainer = styled$1(Box)({
     display: 'none',
     '@media (min-width: 900px)': {
         display: 'block',
@@ -1161,9 +1126,7 @@ const Tabs = ({ tabs, defaultTab }) => {
                                         transform: mobileExpandedTab === tab.id ? 'rotate(180deg)' : 'rotate(0deg)',
                                         transition: 'transform 0.2s',
                                     } })] }), jsx(Collapse, { in: mobileExpandedTab === tab.id, children: jsx(MobileTabContent, { children: tab.content }) })] }, tab.id))) })] }));
-};
-
-const SidebarContainer = styled$1(Box)(({ theme, isOpen }) => ({
+};const SidebarContainer = styled$1(Box)(({ theme, isOpen }) => ({
     height: '100vh',
     position: 'sticky',
     top: 0,
@@ -1356,9 +1319,7 @@ const Sidebar = ({ isOpen, onToggle, centreName = "Centre name goes here \n acro
                                                                                 fontSize: '0.875rem',
                                                                             } }) }, index));
                                                                 }) }) }))] }, subItem.id))) }) }))] }, item.id))) }) })] }) })] }));
-};
-
-const StyledHeader = styled$1(Box)(({ theme }) => ({
+};const StyledHeader = styled$1(Box)(({ theme }) => ({
     padding: theme.spacing(1.5, 4), // px-4 py-3
     display: 'flex',
     alignItems: 'center',
@@ -1523,9 +1484,7 @@ const Header = ({ userName = 'John Doe', userInitials = 'JD', }) => {
     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 })] })] }));
-};
-
-const Container = styled$1(Box)(({ theme }) => ({
+};const Container = styled$1(Box)(({ theme }) => ({
     width: '100%',
     [theme.breakpoints.up('md')]: {
         position: 'sticky',
@@ -1577,9 +1536,7 @@ const TableOfContents = ({ sections, activeSection = 'current-section', }) => {
                         const isActive = section.id === activeSection;
                         return (jsx(NavLink, { href: `#${section.id}`, isActive: isActive, children: section.title }, section.id));
                     }) })] }) }));
-};
-
-const ToggleButton = styled$1(Box)(({ theme }) => ({
+};const ToggleButton = styled$1(Box)(({ theme }) => ({
     display: 'inline-flex',
     alignItems: 'center',
     gap: theme.spacing(1.5),
@@ -1628,9 +1585,7 @@ const Toggle = ({ label = 'Admin view', checked = false, onChange, }) => {
                     fontWeight: 500,
                     fontSize: '0.875rem',
                 }, children: label })] }));
-};
-
-const StyledDialog = styled$1(Dialog)(({ theme }) => ({
+};const StyledDialog = styled$1(Dialog)(({ theme }) => ({
     '& .MuiDialog-paper': {
         borderRadius: (typeof theme.shape.borderRadius === 'string'
             ? parseInt(theme.shape.borderRadius, 10)
@@ -1658,9 +1613,7 @@ const CloseButton = styled$1(IconButton)(({ theme }) => ({
 const SimpleModal = ({ isOpen, onClose, title, children, }) => {
     const { theme } = useTheme();
     return (jsxs(StyledDialog, { open: isOpen, onClose: onClose, maxWidth: "sm", fullWidth: true, children: [jsxs(StyledDialogTitle, { children: [title, jsx(CloseButton, { onClick: onClose, "aria-label": "Close", children: jsx(CloseRounded, { sx: { fontSize: 20, color: theme.palette.dark.main } }) })] }), jsx(DialogContent, { sx: { p: 3 }, children: children })] }));
-};
-
-const StyledIconButton = styled$1(IconButton)(({ theme }) => ({
+};const StyledIconButton = styled$1(IconButton)(({ theme }) => ({
     width: 48,
     height: 48,
     borderRadius: (typeof theme.shape.borderRadius === 'string'
@@ -1681,9 +1634,7 @@ const StyledIconButton = styled$1(IconButton)(({ theme }) => ({
 }));
 const ActionButton = ({ icon: Icon, onClick, label, sx, }) => {
     return (jsx(StyledIconButton, { onClick: onClick, "aria-label": label, sx: sx, children: jsx(Icon, {}) }));
-};
-
-const StyledWrapper = styled$1(Box)(({ theme }) => ({
+};const StyledWrapper = styled$1(Box)(({ theme }) => ({
 // No specific wrapper styles needed, just a container
 }));
 const StyledParagraph = styled$1(Typography)(({ theme }) => ({
@@ -1747,9 +1698,7 @@ function DefinitionBox({ term, definition, children }) {
                                             color: theme.palette.secondary.main
                                         }
                                     } })) })] })] }), isOpen && (jsx(StyledDefinitionBox, { children: jsx(StyledDefinitionText, { children: definition }) }))] }));
-}
-
-const HomeButton = styled$1(IconButton)(({ theme }) => ({
+}const HomeButton = styled$1(IconButton)(({ theme }) => ({
     width: 40,
     height: 40,
     borderRadius: (typeof theme.shape.borderRadius === 'string'
@@ -1856,7 +1805,4 @@ const Breadcrumb = ({ items, currentItem, dropdownItems = [], onItemSelect, }) =
                             vertical: 'top',
                             horizontal: 'left',
                         }, children: dropdownItems.map((item, index) => (jsx(StyledMenuItem, { onClick: () => handleItemClick(item), isActive: item === currentItem, children: item }, index))) }))] })] }));
-};
-
-export { ActionButton, Alert, Breadcrumb, Button, Card, Checkbox, Concertina, DefinitionBox, Header, Input, Modal, NoteBox, Progress, Radio, RadioGroup, ReadBy, Select, Sidebar, SimpleModal, StatusBar, StepIndicator, TableOfContents, Tabs, ThemeProvider, Toggle, muiThemes, useTheme };
-//# sourceMappingURL=index.esm.js.map
+};export{ActionButton,Alert,Breadcrumb,Button,Card,Checkbox,Concertina,DefinitionBox,Header,Input,Modal,NoteBox,Progress,Radio,RadioGroup,ReadBy,Select,Sidebar,SimpleModal,StatusBar,StepIndicator,TableOfContents,Tabs,ThemeProvider,Toggle,useTheme};//# sourceMappingURL=index.esm.js.map