npm - ece-docs-components - Versions diffs - 1.0.16 → 1.0.18 - Mend

ece-docs-components 1.0.16 → 1.0.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (16) hide show

package/dist/cjs/components/Header.js +56 -48
package/dist/cjs/components/Header.js.map +1 -1
package/dist/cjs/components/Modal.js +30 -7
package/dist/cjs/components/Modal.js.map +1 -1
package/dist/cjs/components/PopoverMenu.js +25 -0
package/dist/cjs/components/PopoverMenu.js.map +1 -0
package/dist/esm/components/Header.d.ts +3 -0
package/dist/esm/components/Header.js +58 -50
package/dist/esm/components/Header.js.map +1 -1
package/dist/esm/components/Modal.d.ts +2 -4
package/dist/esm/components/Modal.js +32 -9
package/dist/esm/components/Modal.js.map +1 -1
package/dist/esm/components/PopoverMenu.d.ts +7 -0
package/dist/esm/components/PopoverMenu.js +21 -0
package/dist/esm/components/PopoverMenu.js.map +1 -0
package/package.json +1 -1

package/dist/cjs/components/Header.js CHANGED Viewed

@@ -1,28 +1,29 @@
 'use strict';
 var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
 var material = require('@mui/material');
 var ThemeProvider = require('../ThemeProvider.js');
 var iconsMaterial = require('@mui/icons-material');
+var PopoverMenu = require('./PopoverMenu.js');
 const StyledHeader = material.styled(material.Box)(({ theme }) => ({
-    padding: theme.spacing(1.5, 4), // px-4 py-3
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'space-between',
-    gap: theme.spacing(2), // gap-2
     backgroundColor: theme.palette.primary.main, // var(--color-primary)
-    [theme.breakpoints.up('sm')]: {
-        padding: theme.spacing(2, 6), // sm:px-6
-    },
     [theme.breakpoints.up('md')]: {
-        padding: theme.spacing(2, 8), // md:px-8
         gap: theme.spacing(4), // md:gap-4
+        padding: theme.spacing(1.5, 1.5), // px-4 py-3
+    },
+    [theme.breakpoints.down('md')]: {
+        padding: 0, // px-4 py-3
     },
 }));
 const StyledLogoWrapper = material.styled(material.Box)(({ theme }) => ({
     display: 'flex',
     alignItems: 'center',
+    padding: theme.spacing(1.5),
     gap: theme.spacing(2), // md:gap-2
     [theme.breakpoints.down('md')]: {
         gap: theme.spacing(1.5), // gap-1.5
@@ -32,10 +33,6 @@ const StyledLogoIcon = material.styled(material.Box)(({ theme }) => ({
     width: 32, // md:w-8 md:h-8
     height: 32,
     color: theme.palette.light.main, // text-[#FDFCEE]
-    [theme.breakpoints.down('md')]: {
-        width: 24, // w-6
-        height: 24, // h-6
-    },
 }));
 const StyledLogoText = material.styled(material.Typography)(({ theme }) => ({
     color: theme.palette.light.main, // text-[#FDFCEE]
@@ -52,21 +49,14 @@ const StyledLogoText = material.styled(material.Typography)(({ theme }) => ({
 const StyledSearchContainer = material.styled(material.Box)(({ theme }) => ({
     flex: 1,
     maxWidth: '32rem', // max-w-2xl
-    margin: theme.spacing(0, 8), // mx-8
+    margin: theme.spacing(0, 2), // mx-8
     position: 'relative',
-    [theme.breakpoints.down('md')]: {
-        margin: theme.spacing(0, 4), // sm:mx-4
-    },
-    [theme.breakpoints.down('sm')]: {
-        margin: theme.spacing(0, 2), // mx-2
-    },
 }));
 const StyledTextField = material.styled(material.TextField)(({ theme }) => ({
     '& .MuiInputBase-root': {
         backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]
         color: theme.palette.dark.main, // text-[#4D3019]
         borderRadius: '9999px', // rounded-full
-        paddingRight: theme.spacing(6), // pr-12
         fontSize: '1rem', // text-base
         [theme.breakpoints.down('md')]: {
             paddingRight: theme.spacing(5), // sm:pr-10
@@ -92,31 +82,39 @@ const StyledTextField = material.styled(material.TextField)(({ theme }) => ({
     },
 }));
 const StyledSearchButton = material.styled(material.IconButton)(({ theme }) => ({
-    position: 'absolute',
-    right: theme.spacing(2), // md:right-2
-    top: '50%',
-    transform: 'translateY(-50%)',
-    width: theme.spacing(5), // md:w-10
-    height: theme.spacing(5), // md:h-10
-    borderRadius: '50%', // rounded-full
-    backgroundColor: theme.palette.primary.main, // var(--color-primary)
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    position: 'static',
+    borderRadius: '50%',
+    backgroundColor: theme.palette.primary.main,
+    width: theme.spacing(5),
+    height: theme.spacing(5),
+    [theme.breakpoints.down('md')]: {
+        width: theme.spacing(5),
+        height: theme.spacing(5),
+        marginRight: theme.spacing(1),
+    },
+    [theme.breakpoints.down('sm')]: {
+        marginRight: theme.spacing(0.5),
+    },
     '&:hover': {
-        opacity: 0.9, // hover:opacity-90
+        opacity: 0.9,
         backgroundColor: theme.palette.primary.main,
     },
-    [theme.breakpoints.down('md')]: {
-        right: theme.spacing(1), // right-1
-        width: theme.spacing(4), // w-8
-        height: theme.spacing(4), // h-8
-    },
 }));
 const StyledSearchIcon = material.styled(material.Box)(({ theme }) => ({
-    width: 20, // md:w-5 md:h-5
-    height: 20,
-    color: theme.palette.light.main, // text-[#FDFCEE]
-    [theme.breakpoints.down('md')]: {
-        width: 16, // w-4
-        height: 16, // h-4
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    color: theme.palette.light.main,
+    width: '100%',
+    height: '100%',
+    '& svg': {
+        fontSize: '1.5rem',
+        [theme.breakpoints.down('sm')]: {
+            fontSize: '1.25rem',
+        },
     },
 }));
 const StyledUserContainer = material.styled(material.Box)(({ theme }) => ({
@@ -124,7 +122,7 @@ const StyledUserContainer = material.styled(material.Box)(({ theme }) => ({
     alignItems: 'center',
     gap: theme.spacing(3), // md:gap-3
     [theme.breakpoints.down('md')]: {
-        gap: theme.spacing(2), // gap-2
+        gap: 0,
     },
 }));
 const StyledAvatar = material.styled(material.Box)(({ theme }) => ({
@@ -139,11 +137,7 @@ const StyledAvatar = material.styled(material.Box)(({ theme }) => ({
     [theme.breakpoints.down('md')]: {
         width: theme.spacing(5), // sm:w-10
         height: theme.spacing(5), // sm:h-10
-    },
-    [theme.breakpoints.down('sm')]: {
-        width: theme.spacing(4), // w-8
-        height: theme.spacing(4), // h-8
-    },
+    }
 }));
 const StyledAvatarText = material.styled(material.Typography)(({ theme }) => ({
     color: theme.palette.dark.main, // text-[#4D3019]
@@ -156,6 +150,7 @@ const StyledAvatarText = material.styled(material.Typography)(({ theme }) => ({
 const StyledUserName = material.styled(material.Typography)(({ theme }) => ({
     color: theme.palette.light.main, // text-[#FDFCEE]
     fontWeight: 500, // font-medium
+    marginLeft: theme.spacing(1),
     fontSize: '1.125rem', // text-lg
     display: 'none', // hidden
     [theme.breakpoints.up('sm')]: {
@@ -163,13 +158,26 @@ const StyledUserName = material.styled(material.Typography)(({ theme }) => ({
     },
     [theme.breakpoints.down('md')]: {
         fontSize: '0.875rem', // text-sm
+        display: 'none'
     },
 }));
-const Header = ({ userName = 'John Doe', userInitials = 'JD', }) => {
+const Header = ({ userName = 'John Doe', userInitials = 'JD', toggleMenu, signOut, search }) => {
     const theme = ThemeProvider.useTheme();
-    return (jsxRuntime.jsxs(StyledHeader, { children: [jsxRuntime.jsxs(StyledLogoWrapper, { children: [jsxRuntime.jsx(StyledLogoIcon, { children: jsxRuntime.jsx(iconsMaterial.SchoolRounded, { sx: { fontSize: 32, color: 'currentColor' } }) }), jsxRuntime.jsx(StyledLogoText, { variant: "h1", children: theme.appName })] }), jsxRuntime.jsx(StyledSearchContainer, { children: jsxRuntime.jsx(StyledTextField, { placeholder: "Search for a policy", variant: "outlined", fullWidth: true, InputProps: {
-                        endAdornment: (jsxRuntime.jsx(StyledSearchButton, { children: jsxRuntime.jsx(StyledSearchIcon, { children: jsxRuntime.jsx(iconsMaterial.SearchRounded, { sx: { fontSize: 20 } }) }) })),
-                    } }) }), jsxRuntime.jsxs(StyledUserContainer, { children: [jsxRuntime.jsx(StyledAvatar, { children: jsxRuntime.jsx(StyledAvatarText, { children: userInitials }) }), jsxRuntime.jsx(StyledUserName, { children: userName })] })] }));
+    const [anchorEl, setAnchorEl] = React.useState(null);
+    const handleOpen = (event) => {
+        setAnchorEl(event.currentTarget);
+    };
+    const handleClose = () => {
+        setAnchorEl(null);
+    };
+    return (jsxRuntime.jsxs(StyledHeader, { children: [jsxRuntime.jsx(material.IconButton, { disableRipple: true, onClick: toggleMenu, sx: {
+                    display: { xs: 'block', md: 'none' }
+                }, children: jsxRuntime.jsx(iconsMaterial.MenuRounded, { sx: { fontSize: 32, color: 'white' } }) }), jsxRuntime.jsx(material.Divider, { orientation: 'vertical', sx: { color: '#FFFFFF', borderRightWidth: 2, display: { xs: 'block', md: 'none' } } }), jsxRuntime.jsxs(StyledLogoWrapper, { children: [jsxRuntime.jsx(StyledLogoIcon, { children: jsxRuntime.jsx(iconsMaterial.SchoolRounded, { sx: { fontSize: 32, color: 'currentColor' } }) }), jsxRuntime.jsx(StyledLogoText, { variant: "h1", children: theme.appName })] }), jsxRuntime.jsx(StyledSearchContainer, { children: jsxRuntime.jsx(StyledTextField, { placeholder: "Search for a policy", variant: "outlined", fullWidth: true, sx: { display: { xs: 'none', sm: 'none', md: 'block' } }, InputProps: {
+                        endAdornment: (jsxRuntime.jsx(StyledSearchButton, { children: jsxRuntime.jsx(StyledSearchIcon, { children: jsxRuntime.jsx(iconsMaterial.SearchRounded, {}) }) })),
+                    } }) }), jsxRuntime.jsxs(StyledUserContainer, { children: [jsxRuntime.jsx(StyledSearchButton, { disableRipple: true, onClick: search, sx: {
+                            display: { xs: 'flex', md: 'none' },
+                            backgroundColor: '#ffffff83'
+                        }, children: jsxRuntime.jsx(StyledSearchIcon, { children: jsxRuntime.jsx(iconsMaterial.SearchRounded, {}) }) }), jsxRuntime.jsxs(material.IconButton, { onClick: handleOpen, disableRipple: true, children: [jsxRuntime.jsx(StyledAvatar, { children: jsxRuntime.jsx(StyledAvatarText, { children: userInitials }) }), jsxRuntime.jsx(StyledUserName, { children: userName })] })] }), jsxRuntime.jsx(PopoverMenu.default, { anchorEl: anchorEl, onClose: handleClose, signOut: () => { signOut(); handleClose(); } })] }));
 };
 exports.Header = Header;

package/dist/cjs/components/Header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.js","sources":["../../../../src/components/Header.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { Box, styled, Typography, TextField, IconButton } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { SchoolRounded, SearchRounded } from '@mui/icons-material';\n\ninterface HeaderProps {\n userName?: string;\n userInitials?: string;\n}\n\nconst StyledHeader = styled(Box)(({ theme }) => ({\n padding: theme.spacing(1.5, 4), // px-4 py-3\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n gap: theme.spacing(2), // gap-2\n backgroundColor: theme.palette.primary.main, // var(--color-primary)\n [theme.breakpoints.up('sm')]: {\n padding: theme.spacing(2, 6), // sm:px-6\n },\n [theme.breakpoints.up('md')]: {\n padding: theme.spacing(2, 8), // md:px-8\n gap: theme.spacing(4), // md:gap-4\n },\n}));\n\nconst StyledLogoWrapper = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(2), // md:gap-2\n [theme.breakpoints.down('md')]: {\n gap: theme.spacing(1.5), // gap-1.5\n },\n}));\n\nconst StyledLogoIcon = styled(Box)(({ theme }) => ({\n width: 32, // md:w-8 md:h-8\n height: 32,\n color: theme.palette.light.main, // text-[#FDFCEE]\n [theme.breakpoints.down('md')]: {\n width: 24, // w-6\n height: 24, // h-6\n },\n}));\n\nconst StyledLogoText = styled(Typography)(({ theme }) => ({\n color: theme.palette.light.main, // text-[#FDFCEE]\n fontWeight: 700, // font-bold\n letterSpacing: '0.05em', // tracking-wide\n fontSize: '1.5rem', // text-2xl\n [theme.breakpoints.down('md')]: {\n fontSize: '1.25rem', // sm:text-xl\n },\n [theme.breakpoints.down('sm')]: {\n fontSize: '1.125rem', // text-lg\n },\n}));\n\nconst StyledSearchContainer = styled(Box)(({ theme }) => ({\n flex: 1,\n maxWidth: '32rem', // max-w-2xl\n margin: theme.spacing(0, 8), // mx-8\n position: 'relative',\n [theme.breakpoints.down('md')]: {\n margin: theme.spacing(0, 4), // sm:mx-4\n },\n [theme.breakpoints.down('sm')]: {\n margin: theme.spacing(0, 2), // mx-2\n },\n}));\n\nconst StyledTextField = styled(TextField)(({ theme }) => ({\n '& .MuiInputBase-root': {\n backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n color: theme.palette.dark.main, // text-[#4D3019]\n borderRadius: '9999px', // rounded-full\n paddingRight: theme.spacing(6), // pr-12\n fontSize: '1rem', // text-base\n [theme.breakpoints.down('md')]: {\n paddingRight: theme.spacing(5), // sm:pr-10\n fontSize: '0.875rem', // text-sm\n },\n },\n '& .MuiInputBase-input': {\n padding: theme.spacing(1.5, 3), // px-4 py-2\n [theme.breakpoints.up('md')]: {\n padding: theme.spacing(1.5, 4), // md:px-6 md:py-3\n },\n [theme.breakpoints.down('sm')]: {\n padding: theme.spacing(1.5, 2.5), // sm:px-5\n },\n },\n '& .MuiInputBase-input::placeholder': {\n color: `${theme.palette.dark.main}99`, // placeholder-[#4D3019]/60\n opacity: 1,\n },\n '& .MuiInputBase-root:focus-within': {\n outline: `2px solid ${theme.palette.light.main}`, // focus:ring-2 focus:ring-[#FDFCEE]\n outlineOffset: 0,\n },\n}));\n\nconst StyledSearchButton = styled(IconButton)(({ theme }) => ({\n position: 'absolute',\n right: theme.spacing(2), // md:right-2\n top: '50%',\n transform: 'translateY(-50%)',\n width: theme.spacing(5), // md:w-10\n height: theme.spacing(5), // md:h-10\n borderRadius: '50%', // rounded-full\n backgroundColor: theme.palette.primary.main, // var(--color-primary)\n '&:hover': {\n opacity: 0.9, // hover:opacity-90\n backgroundColor: theme.palette.primary.main,\n },\n [theme.breakpoints.down('md')]: {\n right: theme.spacing(1), // right-1\n width: theme.spacing(4), // w-8\n height: theme.spacing(4), // h-8\n },\n}));\n\nconst StyledSearchIcon = styled(Box)(({ theme }) => ({\n width: 20, // md:w-5 md:h-5\n height: 20,\n color: theme.palette.light.main, // text-[#FDFCEE]\n [theme.breakpoints.down('md')]: {\n width: 16, // w-4\n height: 16, // h-4\n },\n}));\n\nconst StyledUserContainer = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(3), // md:gap-3\n [theme.breakpoints.down('md')]: {\n gap: theme.spacing(2), // gap-2\n },\n}));\n\nconst StyledAvatar = styled(Box)(({ theme }) => ({\n width: theme.spacing(6), // md:w-12\n height: theme.spacing(6), // md:h-12\n borderRadius: '50%', // rounded-full\n backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n [theme.breakpoints.down('md')]: {\n width: theme.spacing(5), // sm:w-10\n height: theme.spacing(5), // sm:h-10\n },\n [theme.breakpoints.down('sm')]: {\n width: theme.spacing(4), // w-8\n height: theme.spacing(4), // h-8\n },\n}));\n\nconst StyledAvatarText = styled(Typography)(({ theme }) => ({\n color: theme.palette.dark.main, // text-[#4D3019]\n fontWeight: 700, // font-bold\n fontSize: '1.125rem', // text-lg\n [theme.breakpoints.down('md')]: {\n fontSize: '0.875rem', // text-sm\n },\n}));\n\nconst StyledUserName = styled(Typography)(({ theme }) => ({\n color: theme.palette.light.main, // text-[#FDFCEE]\n fontWeight: 500, // font-medium\n fontSize: '1.125rem', // text-lg\n display: 'none', // hidden\n [theme.breakpoints.up('sm')]: {\n display: 'inline', // sm:inline\n },\n [theme.breakpoints.down('md')]: {\n fontSize: '0.875rem', // text-sm\n },\n}));\n\nexport const Header: React.FC<HeaderProps> = ({\n userName = 'John Doe',\n userInitials = 'JD',\n}) => {\n const theme = useTheme();\n\n return (\n <StyledHeader>\n <StyledLogoWrapper>\n <StyledLogoIcon>\n <SchoolRounded sx={{fontSize:32, color: 'currentColor'}} />\n </StyledLogoIcon>\n <StyledLogoText variant=\"h1\">{theme.appName}</StyledLogoText>\n </StyledLogoWrapper>\n\n <StyledSearchContainer>\n <StyledTextField\n placeholder=\"Search for a policy\"\n variant=\"outlined\"\n fullWidth\n InputProps={{\n endAdornment: (\n <StyledSearchButton>\n <StyledSearchIcon>\n <SearchRounded sx={{fontSize: 20}} />\n </StyledSearchIcon>\n </StyledSearchButton>\n ),\n }}\n />\n </StyledSearchContainer>\n\n <StyledUserContainer>\n <StyledAvatar>\n <StyledAvatarText>{userInitials}</StyledAvatarText>\n </StyledAvatar>\n <StyledUserName>{userName}</StyledUserName>\n </StyledUserContainer>\n </StyledHeader>\n );\n};"],"names":["styled","Box","Typography","TextField","IconButton","useTheme","_jsxs","_jsx","SchoolRounded","SearchRounded"],"mappings":"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"}
1	+ {"version":3,"file":"Header.js","sources":["../../../../src/components/Header.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { Box, styled, Typography, TextField, IconButton, Divider } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { MenuRounded, SchoolRounded, SearchRounded } from '@mui/icons-material';\nimport PopoverMenu from './PopoverMenu';\n\ninterface HeaderProps {\n userName?: string;\n userInitials?: string;\n toggleMenu: () => void;\n signOut: () => void;\n search?: () => void;\n}\n\nconst StyledHeader = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n backgroundColor: theme.palette.primary.main, // var(--color-primary)\n [theme.breakpoints.up('md')]: {\n gap: theme.spacing(4), // md:gap-4\n padding: theme.spacing(1.5, 1.5), // px-4 py-3\n },\n [theme.breakpoints.down('md')]: {\n padding: 0, // px-4 py-3\n },\n}));\n\nconst StyledLogoWrapper = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n padding: theme.spacing(1.5),\n gap: theme.spacing(2), // md:gap-2\n [theme.breakpoints.down('md')]: {\n gap: theme.spacing(1.5), // gap-1.5\n },\n}));\n\nconst StyledLogoIcon = styled(Box)(({ theme }) => ({\n width: 32, // md:w-8 md:h-8\n height: 32,\n color: theme.palette.light.main, // text-[#FDFCEE]\n}));\n\nconst StyledLogoText = styled(Typography)(({ theme }) => ({\n color: theme.palette.light.main, // text-[#FDFCEE]\n fontWeight: 700, // font-bold\n letterSpacing: '0.05em', // tracking-wide\n fontSize: '1.5rem', // text-2xl\n [theme.breakpoints.down('md')]: {\n fontSize: '1.25rem', // sm:text-xl\n },\n [theme.breakpoints.down('sm')]: {\n fontSize: '1.125rem', // text-lg\n },\n}));\n\nconst StyledSearchContainer = styled(Box)(({ theme }) => ({\n flex: 1,\n maxWidth: '32rem', // max-w-2xl\n margin: theme.spacing(0, 2), // mx-8\n position: 'relative',\n}));\n\nconst StyledTextField = styled(TextField)(({ theme }) => ({\n '& .MuiInputBase-root': {\n backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n color: theme.palette.dark.main, // text-[#4D3019]\n borderRadius: '9999px', // rounded-full\n fontSize: '1rem', // text-base\n [theme.breakpoints.down('md')]: {\n paddingRight: theme.spacing(5), // sm:pr-10\n fontSize: '0.875rem', // text-sm\n },\n },\n '& .MuiInputBase-input': {\n padding: theme.spacing(1.5, 3), // px-4 py-2\n [theme.breakpoints.up('md')]: {\n padding: theme.spacing(1.5, 4), // md:px-6 md:py-3\n },\n [theme.breakpoints.down('sm')]: {\n padding: theme.spacing(1.5, 2.5), // sm:px-5\n },\n },\n '& .MuiInputBase-input::placeholder': {\n color: `${theme.palette.dark.main}99`, // placeholder-[#4D3019]/60\n opacity: 1,\n },\n '& .MuiInputBase-root:focus-within': {\n outline: `2px solid ${theme.palette.light.main}`, // focus:ring-2 focus:ring-[#FDFCEE]\n outlineOffset: 0,\n },\n}));\n\nconst StyledSearchButton = styled(IconButton)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'static',\n borderRadius: '50%',\n backgroundColor: theme.palette.primary.main,\n width: theme.spacing(5),\n height: theme.spacing(5),\n [theme.breakpoints.down('md')]: {\n width: theme.spacing(5),\n height: theme.spacing(5),\n marginRight: theme.spacing(1),\n },\n [theme.breakpoints.down('sm')]: {\n marginRight: theme.spacing(0.5),\n },\n '&:hover': {\n opacity: 0.9,\n backgroundColor: theme.palette.primary.main,\n },\n}));\n\nconst StyledSearchIcon = styled(Box)(({ theme }) => ({\n display: 'flex', \n alignItems: 'center',\n justifyContent: 'center',\n color: theme.palette.light.main,\n width: '100%',\n height: '100%',\n '& svg': {\n fontSize: '1.5rem',\n [theme.breakpoints.down('sm')]: {\n fontSize: '1.25rem',\n },\n },\n}));\n\nconst StyledUserContainer = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(3), // md:gap-3\n [theme.breakpoints.down('md')]: {\n gap: 0,\n },\n}));\n\nconst StyledAvatar = styled(Box)(({ theme }) => ({\n width: theme.spacing(6), // md:w-12\n height: theme.spacing(6), // md:h-12\n borderRadius: '50%', // rounded-full\n backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n [theme.breakpoints.down('md')]: {\n width: theme.spacing(5), // sm:w-10\n height: theme.spacing(5), // sm:h-10\n }\n}));\n\nconst StyledAvatarText = styled(Typography)(({ theme }) => ({\n color: theme.palette.dark.main, // text-[#4D3019]\n fontWeight: 700, // font-bold\n fontSize: '1.125rem', // text-lg\n [theme.breakpoints.down('md')]: {\n fontSize: '0.875rem', // text-sm\n },\n}));\n\nconst StyledUserName = styled(Typography)(({ theme }) => ({\n color: theme.palette.light.main, // text-[#FDFCEE]\n fontWeight: 500, // font-medium\n marginLeft: theme.spacing(1),\n fontSize: '1.125rem', // text-lg\n display: 'none', // hidden\n [theme.breakpoints.up('sm')]: {\n display: 'inline', // sm:inline\n },\n [theme.breakpoints.down('md')]: {\n fontSize: '0.875rem', // text-sm\n display: 'none'\n },\n}));\n\nexport const Header: React.FC<HeaderProps> = ({\n userName = 'John Doe',\n userInitials = 'JD',\n toggleMenu,\n signOut,\n search\n}) => {\n const theme = useTheme();\n const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement \| null>(null);\n\n const handleOpen = (event: React.MouseEvent<HTMLButtonElement>) => {\n setAnchorEl(event.currentTarget);\n };\n\n const handleClose = () => {\n setAnchorEl(null);\n };\n\n\n return (\n <StyledHeader>\n <IconButton disableRipple onClick={toggleMenu} sx={{\n display: {xs: 'block', md: 'none'}\n }}>\n <MenuRounded sx={{fontSize: 32, color: 'white'}}/>\n </IconButton>\n <Divider orientation='vertical' sx={{color: '#FFFFFF',borderRightWidth: 2,display: {xs: 'block', md: 'none'}}}/>\n <StyledLogoWrapper>\n <StyledLogoIcon>\n <SchoolRounded sx={{fontSize:32, color: 'currentColor'}} />\n </StyledLogoIcon>\n <StyledLogoText variant=\"h1\">{theme.appName}</StyledLogoText>\n </StyledLogoWrapper>\n\n {/* Search input for md+ screens /}\n <StyledSearchContainer >\n <StyledTextField\n placeholder=\"Search for a policy\"\n variant=\"outlined\"\n fullWidth\n sx={{ display: { xs: 'none', sm: 'none', md: 'block' } }}\n InputProps={{\n endAdornment: (\n <StyledSearchButton>\n <StyledSearchIcon>\n <SearchRounded />\n </StyledSearchIcon>\n </StyledSearchButton>\n ),\n }}\n />\n </StyledSearchContainer>\n\n <StyledUserContainer>\n {/ Search button only visible on XS screens */}\n <StyledSearchButton\n disableRipple\n onClick={search}\n sx={{\n display: { xs: 'flex', md: 'none' },\n backgroundColor: '#ffffff83'\n }}\n >\n <StyledSearchIcon>\n <SearchRounded />\n </StyledSearchIcon>\n </StyledSearchButton>\n <IconButton onClick={handleOpen} disableRipple>\n <StyledAvatar>\n <StyledAvatarText>{userInitials}</StyledAvatarText>\n </StyledAvatar>\n <StyledUserName>{userName}</StyledUserName>\n </IconButton>\n </StyledUserContainer>\n\n <PopoverMenu\n anchorEl={anchorEl}\n onClose={handleClose}\n signOut={()=>{signOut(); handleClose();}}\n />\n </StyledHeader>\n );\n};"],"names":["styled","Box","Typography","TextField","IconButton","useTheme","_jsxs","_jsx","MenuRounded","Divider","SchoolRounded","SearchRounded","PopoverMenu"],"mappings":"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"}

package/dist/cjs/components/Modal.js CHANGED Viewed

@@ -30,9 +30,12 @@ const NavButton = material.styled(material.IconButton)(({ theme }) => ({
         borderColor: theme.palette.dark.main, // Keep border dark
     },
 }));
-const Modal = ({ isOpen, onClose, status, description, defaultText, note, acceptSuggestion: initialAcceptSuggestion = true, onAcceptSuggestionChange, onSave, onSubmit, onDeclineWording, onPrevious, onNext, currentPage = 1, totalPages = 1, }) => {
+const Modal = ({ isOpen, onClose, status, description, defaultText, note, onSave, onSubmit, onDeclineWording, onPrevious, onNext, currentPage = 1, totalPages = 1, }) => {
     const [textValue, setTextValue] = React.useState(defaultText);
     const [useDefaultValue, setUseDefaultValue] = React.useState(true);
+    const [isLoading, setIsLoading] = React.useState(false);
+    const [isSubmitting, setIsSubmitting] = React.useState(false);
+    const [isSaving, setIsSaving] = React.useState(false);
     const handleUseDefaultValueChange = (event) => {
         setUseDefaultValue(event.target.checked);
     };
@@ -63,6 +66,26 @@ const Modal = ({ isOpen, onClose, status, description, defaultText, note, accept
         },
     };
     const statusStyle = statusConfig[status];
+    const handleSave = () => {
+        setIsLoading(true);
+        setIsSaving(true);
+        onSave?.(textValue, useDefaultValue);
+        setTimeout(() => {
+            setIsSaving(false);
+            setIsLoading(false);
+            onClose();
+        }, 1000);
+    };
+    const handleSubmit = () => {
+        setIsLoading(true);
+        setIsSubmitting(true);
+        onSubmit?.(textValue, useDefaultValue);
+        setTimeout(() => {
+            setIsSubmitting(false);
+            setIsLoading(false);
+            onClose();
+        }, 1000);
+    };
     return (jsxRuntime.jsxs(StyledDialog, { open: isOpen, onClose: onClose, maxWidth: "md", fullWidth: true, children: [jsxRuntime.jsx(material.IconButton, { onClick: onClose, sx: {
                     position: 'absolute',
                     top: 16,
@@ -117,22 +140,22 @@ const Modal = ({ isOpen, onClose, status, description, defaultText, note, accept
                             pt: 3,
                             borderTop: '1px solid',
                             borderColor: 'divider',
-                        }, children: [jsxRuntime.jsxs(material.Box, { sx: { display: 'flex', gap: 1.5, flexWrap: 'wrap' }, children: [jsxRuntime.jsx(Button.Button, { onClick: onSave, variant: "outline", size: "md", children: "Save" }), jsxRuntime.jsx(Button.Button, { onClick: onSubmit, variant: "outline", size: "md", sx: {
+                        }, children: [jsxRuntime.jsxs(material.Box, { sx: { display: 'flex', gap: 1.5, flexWrap: 'wrap' }, children: [jsxRuntime.jsx(Button.Button, { onClick: handleSave, variant: "outline", size: "md", disabled: isLoading, children: isSaving ? jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(material.CircularProgress, { size: 20 }), jsxRuntime.jsx(material.Typography, { sx: { paddingLeft: 2 }, children: "Saving..." })] }) : "Save" }), jsxRuntime.jsx(Button.Button, { onClick: handleSubmit, variant: "outline", size: "md", disabled: isLoading, sx: {
                                             backgroundColor: '#ac46ff52',
                                             '&:hover': {
-                                                backgroundColor: '#ac46ff80', // Darker purple on hover
-                                            }
-                                        }, children: "Submit for review" }), jsxRuntime.jsx(Button.Button, { onClick: onDeclineWording, variant: "outline", size: "md", sx: {
+                                                backgroundColor: '#ac46ff80',
+                                            },
+                                        }, children: isSubmitting ? jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(material.CircularProgress, { size: 20 }), jsxRuntime.jsx(material.Typography, { sx: { paddingLeft: 2 }, children: "Submitting..." })] }) : "Submit for review" }), jsxRuntime.jsx(Button.Button, { onClick: onDeclineWording, variant: "outline", size: "md", sx: {
                                             backgroundColor: '#ff464652',
                                             '&:hover': {
                                                 backgroundColor: '#ff464680', // Darker purple on hover
                                             }
-                                        }, children: "Decline wording" })] }), jsxRuntime.jsxs(material.Box, { sx: {
+                                        }, disabled: isLoading, children: "Decline wording" })] }), jsxRuntime.jsxs(material.Box, { sx: {
                                     display: 'flex',
                                     alignItems: 'center',
                                     gap: 1.5,
                                     justifyContent: { xs: 'space-between', sm: 'flex-end' },
-                                }, children: [jsxRuntime.jsxs(material.Typography, { fontWeight: 500, fontSize: "1.125rem", children: [currentPage, "/", totalPages] }), jsxRuntime.jsx(NavButton, { onClick: onPrevious, "aria-label": "Previous", children: jsxRuntime.jsx(material.Typography, { sx: { fontSize: 16, fontWeight: 500 }, children: "Previous" }) }), jsxRuntime.jsx(NavButton, { onClick: onNext, "aria-label": "Next", children: jsxRuntime.jsx(material.Typography, { sx: { fontSize: 16, fontWeight: 500 }, children: "Next" }) })] })] })] })] }));
+                                }, children: [jsxRuntime.jsxs(material.Typography, { fontWeight: 500, fontSize: "1.125rem", children: [currentPage, "/", totalPages] }), jsxRuntime.jsx(NavButton, { onClick: onPrevious, "aria-label": "Previous", disabled: isLoading, children: jsxRuntime.jsx(material.Typography, { sx: { fontSize: 16, fontWeight: 500 }, children: "Previous" }) }), jsxRuntime.jsx(NavButton, { onClick: onNext, "aria-label": "Next", disabled: isLoading, children: jsxRuntime.jsx(material.Typography, { sx: { fontSize: 16, fontWeight: 500 }, children: "Next" }) })] })] })] })] }));
 };
 exports.Modal = Modal;

package/dist/cjs/components/Modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.js","sources":["../../../../src/components/Modal.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n Dialog,\n DialogContent,\n IconButton,\n Box,\n Typography,\n TextField,\n Checkbox,\n FormControlLabel,\n Alert as MuiAlert,\n Chip,\n styled,\n} from '@mui/material';\nimport { Button } from './Button';\nimport { CloseRounded, ErrorOutlineRounded, StickyNote2Rounded } from '@mui/icons-material';\n\n\ninterface ModalProps {\n isOpen: boolean;\n onClose: () => void;\n status: 'mandatory' \| 'optional' \| 'accepted' \| 'action-required' \| 'action-required-note' \| 'accepted-note';\n description: string;\n defaultText: string;\n note?: string;\n acceptSuggestion?: boolean;\n onAcceptSuggestionChange?: (checked: boolean) => void;\n onSave?: () => void;\n onSubmit?: () => void;\n onDeclineWording?: () => void;\n onPrevious?: () => void;\n onNext?: () => void;\n currentPage?: number;\n totalPages?: number;\n}\n\n\nconst StyledDialog = styled(Dialog)(({ theme }) => ({\n '& .MuiDialog-paper': {\n color: theme.palette.background.default,\n borderRadius: theme.shape.borderRadius,\n maxWidth: '896px',\n width: '100%',\n maxHeight: '90vh',\n },\n}));\n\n\nconst NavButton = styled(IconButton)(({ theme }) => ({\n width: 'auto',\n height: '40px',\n borderRadius: (typeof theme.shape.borderRadius === 'string'\n ? parseInt(theme.shape.borderRadius, 10)\n : theme.shape.borderRadius \|\| 4) * 2,\n border: `2px solid ${theme.palette.dark.main}`,\n backgroundColor: theme.palette.light.main,\n padding: theme.spacing(1, 2),\n '&:hover': {\n backgroundColor: theme.palette.grey[100], // Changed from dark.main to grey[100]\n color: theme.palette.dark.main, // Keep text dark instead of light\n borderColor: theme.palette.dark.main, // Keep border dark\n },\n}));\n\n\n\nexport const Modal: React.FC<ModalProps> = ({\n isOpen,\n onClose,\n status,\n description,\n defaultText,\n note,\n acceptSuggestion: initialAcceptSuggestion = true,\n onAcceptSuggestionChange,\n onSave,\n onSubmit,\n onDeclineWording,\n onPrevious,\n onNext,\n currentPage = 1,\n totalPages = 1,\n}) => {\n const [textValue, setTextValue] = useState(defaultText);\n const [useDefaultValue, setUseDefaultValue] = useState(true);\n\n\n const handleUseDefaultValueChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n setUseDefaultValue(event.target.checked);\n };\n\n\n const statusConfig = {\n mandatory: {\n color: '#F5A623',\n label: 'Mandatory',\n },\n optional: {\n color: '#F5D76E',\n label: 'Optional',\n },\n accepted: {\n color: '#A3D977',\n label: 'Accepted',\n },\n 'action-required': {\n color: '#F56B6B',\n label: 'Action Required',\n },\n 'action-required-note': {\n color: '#F56B6B',\n label: 'Action Required',\n },\n 'accepted-note': {\n color: '#A3D977',\n label: 'Accepted',\n },\n };\n\n\n const statusStyle = statusConfig[status];\n\n\n return (\n <StyledDialog open={isOpen} onClose={onClose} maxWidth=\"md\" fullWidth>\n <IconButton\n onClick={onClose}\n sx={{\n position: 'absolute',\n top: 16,\n right: 16,\n zIndex: 1,\n }}\n >\n <CloseRounded sx={{ fontSize: 24 }} />\n </IconButton>\n\n\n <DialogContent sx={{ p: { xs: 3, sm: 4, md: 6 } }}>\n {/* Status Chip /}\n <Box sx={{ mb: 3 }}>\n <Chip\n label={statusStyle.label.toUpperCase()}\n sx={{\n backgroundColor: statusStyle.color,\n color: status === 'optional' \|\| status === 'mandatory' ? '#4D3019' : '#fff',\n fontWeight: 600,\n fontSize: '0.875rem',\n height: 'auto',\n py: 1,\n borderRadius: 0,\n px: 2,\n }}\n />\n </Box>\n\n\n {/ Description /}\n <Typography sx={{ mb: 3, lineHeight: 1.6, whiteSpace: 'pre-line' }}>\n {description}\n </Typography>\n\n\n {/ Alerts /}\n {status === 'action-required-note' && note && (\n <MuiAlert\n icon={<ErrorOutlineRounded sx={{ fontSize: 20 }} />}\n severity=\"error\"\n sx={{\n mb: 2,\n backgroundColor: '#FDFCEE',\n borderLeft: '4px solid #F56B6B',\n '& .MuiAlert-icon': {\n color: '#F56B6B',\n },\n '& .MuiAlert-message': {\n color: '#4D3019',\n },\n }}\n >\n {note}\n </MuiAlert>\n )}\n\n\n {status === 'accepted-note' && note && (\n <MuiAlert\n icon={<StickyNote2Rounded sx={{ fontSize: 20 }} />}\n severity=\"warning\"\n sx={{\n mb: 2,\n backgroundColor: '#FDFCEE',\n borderLeft: '4px solid #F5D76E',\n '& .MuiAlert-icon': {\n color: '#F5A623',\n },\n '& .MuiAlert-message': {\n color: '#4D3019',\n },\n }}\n >\n {note}\n </MuiAlert>\n )}\n\n\n {/ Text Field /}\n <TextField\n multiline\n rows={6}\n fullWidth\n value={textValue}\n onChange={(e) => setTextValue(e.target.value)}\n disabled={useDefaultValue}\n sx={{\n mb: 2,\n '& .MuiOutlinedInput-root': {\n backgroundColor: useDefaultValue ? 'rgba(0, 0, 0, 0.05)' : '#fff',\n borderRadius: 2,\n },\n }}\n />\n\n\n {/ Checkbox /}\n <FormControlLabel\n control={\n <Checkbox\n checked={useDefaultValue}\n onChange={handleUseDefaultValueChange}\n sx={{\n color: '#AC46FF',\n '&.Mui-checked': {\n color: '#AC46FF',\n },\n }}\n />\n }\n label=\"Use Default Value\"\n sx={{ mb: 3 }}\n />\n\n\n {/ Footer with Buttons and Navigation /}\n <Box\n sx={{\n display: 'flex',\n flexDirection: { xs: 'column', sm: 'row' },\n alignItems: { xs: 'stretch', sm: 'center' },\n justifyContent: 'space-between',\n gap: 2,\n pt: 3,\n borderTop: '1px solid',\n borderColor: 'divider',\n }}\n >\n {/ Action Buttons /}\n <Box sx={{ display: 'flex', gap: 1.5, flexWrap: 'wrap' }}>\n <Button onClick={onSave} variant=\"outline\" size=\"md\">\n Save\n </Button>\n <Button onClick={onSubmit} variant=\"outline\" size=\"md\" sx={{\n backgroundColor: '#ac46ff52',\n '&:hover': {\n backgroundColor: '#ac46ff80', // Darker purple on hover\n }\n }}>\n Submit for review\n </Button>\n <Button onClick={onDeclineWording} variant=\"outline\" size=\"md\" sx={{\n backgroundColor: '#ff464652',\n '&:hover': {\n backgroundColor: '#ff464680', // Darker purple on hover\n }\n }}>\n Decline wording\n </Button>\n </Box>\n\n\n {/ Navigation */}\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n gap: 1.5,\n justifyContent: { xs: 'space-between', sm: 'flex-end' },\n }}\n >\n <Typography fontWeight={500} fontSize=\"1.125rem\">\n {currentPage}/{totalPages}\n </Typography>\n <NavButton onClick={onPrevious} aria-label=\"Previous\">\n <Typography sx={{ fontSize: 16, fontWeight: 500 }}>Previous</Typography>\n </NavButton>\n <NavButton onClick={onNext} aria-label=\"Next\">\n <Typography sx={{ fontSize: 16, fontWeight: 500 }}>Next</Typography>\n </NavButton>\n </Box>\n </Box>\n </DialogContent>\n </StyledDialog>\n );\n};\n"],"names":["styled","Dialog","IconButton","useState","_jsxs","_jsx","CloseRounded","DialogContent","Box","Chip","Typography","MuiAlert","ErrorOutlineRounded","StickyNote2Rounded","TextField","FormControlLabel","Checkbox","Button"],"mappings":";;;;;;;;AAqCA,MAAM,YAAY,GAAGA,eAAM,CAACC,eAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AAClD,IAAA,oBAAoB,EAAE;AACpB,QAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO;AACvC,QAAA,YAAY,EAAE,KAAK,CAAC,KAAK,CAAC,YAAY;AACtC,QAAA,QAAQ,EAAE,OAAO;AACjB,QAAA,KAAK,EAAE,MAAM;AACb,QAAA,SAAS,EAAE,MAAM;AAClB,KAAA;AACF,CAAA,CAAC,CAAC;AAGH,MAAM,SAAS,GAAGD,eAAM,CAACE,mBAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AACnD,IAAA,KAAK,EAAE,MAAM;AACb,IAAA,MAAM,EAAE,MAAM;IACd,YAAY,EAAE,CAAC,OAAO,KAAK,CAAC,KAAK,CAAC,YAAY,KAAK;UAC/C,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY,EAAE,EAAE;UACrC,KAAK,CAAC,KAAK,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC;IACtC,MAAM,EAAE,aAAa,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,CAAE;AAC9C,IAAA,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI;IACzC,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;AAC5B,IAAA,SAAS,EAAE;QACT,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;QACxC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;QAC9B,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;AACrC,KAAA;AACF,CAAA,CAAC,CAAC;MAIU,KAAK,GAAyB,CAAC,EAC1C,MAAM,EACN,OAAO,EACP,MAAM,EACN,WAAW,EACX,WAAW,EACX,IAAI,EACJ,gBAAgB,EAAE,uBAAuB,GAAG,IAAI,EAChD,wBAAwB,EACxB,MAAM,EACN,QAAQ,EACR,gBAAgB,EAChB,UAAU,EACV,MAAM,EACN,WAAW,GAAG,CAAC,EACf,UAAU,GAAG,CAAC,GACf,KAAI;IACH,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAGC,cAAQ,CAAC,WAAW,CAAC;IACvD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAGA,cAAQ,CAAC,IAAI,CAAC;AAG5D,IAAA,MAAM,2BAA2B,GAAG,CAAC,KAA0C,KAAI;AACjF,QAAA,kBAAkB,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC;AAC1C,IAAA,CAAC;AAGD,IAAA,MAAM,YAAY,GAAG;AACnB,QAAA,SAAS,EAAE;AACT,YAAA,KAAK,EAAE,SAAS;AAChB,YAAA,KAAK,EAAE,WAAW;AACnB,SAAA;AACD,QAAA,QAAQ,EAAE;AACR,YAAA,KAAK,EAAE,SAAS;AAChB,YAAA,KAAK,EAAE,UAAU;AAClB,SAAA;AACD,QAAA,QAAQ,EAAE;AACR,YAAA,KAAK,EAAE,SAAS;AAChB,YAAA,KAAK,EAAE,UAAU;AAClB,SAAA;AACD,QAAA,iBAAiB,EAAE;AACjB,YAAA,KAAK,EAAE,SAAS;AAChB,YAAA,KAAK,EAAE,iBAAiB;AACzB,SAAA;AACD,QAAA,sBAAsB,EAAE;AACtB,YAAA,KAAK,EAAE,SAAS;AAChB,YAAA,KAAK,EAAE,iBAAiB;AACzB,SAAA;AACD,QAAA,eAAe,EAAE;AACf,YAAA,KAAK,EAAE,SAAS;AAChB,YAAA,KAAK,EAAE,UAAU;AAClB,SAAA;KACF;AAGD,IAAA,MAAM,WAAW,GAAG,YAAY,CAAC,MAAM,CAAC;IAGxC,QACEC,eAAA,CAAC,YAAY,EAAA,EAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAC,IAAI,EAAC,SAAS,EAAA,IAAA,EAAA,QAAA,EAAA,CACnEC,cAAA,CAACH,mBAAU,EAAA,EACT,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE;AACF,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,GAAG,EAAE,EAAE;AACP,oBAAA,KAAK,EAAE,EAAE;AACT,oBAAA,MAAM,EAAE,CAAC;AACV,iBAAA,EAAA,QAAA,EAEDG,cAAA,CAACC,0BAAY,EAAA,EAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAA,CAAI,EAAA,CAC3B,EAGbF,eAAA,CAACG,sBAAa,EAAA,EAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAA,QAAA,EAAA,CAE/CF,cAAA,CAACG,YAAG,EAAA,EAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAA,QAAA,EAChBH,cAAA,CAACI,aAAI,EAAA,EACH,KAAK,EAAE,WAAW,CAAC,KAAK,CAAC,WAAW,EAAE,EACtC,EAAE,EAAE;gCACF,eAAe,EAAE,WAAW,CAAC,KAAK;AAClC,gCAAA,KAAK,EAAE,MAAM,KAAK,UAAU,IAAI,MAAM,KAAK,WAAW,GAAG,SAAS,GAAG,MAAM;AAC3E,gCAAA,UAAU,EAAE,GAAG;AACf,gCAAA,QAAQ,EAAE,UAAU;AACpB,gCAAA,MAAM,EAAE,MAAM;AACd,gCAAA,EAAE,EAAE,CAAC;AACL,gCAAA,YAAY,EAAE,CAAC;AACf,gCAAA,EAAE,EAAE,CAAC;6BACN,EAAA,CACD,EAAA,CACE,EAINJ,cAAA,CAACK,mBAAU,EAAA,EAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,UAAU,EAAE,GAAG,EAAE,UAAU,EAAE,UAAU,EAAE,EAAA,QAAA,EAC/D,WAAW,EAAA,CACD,EAIZ,MAAM,KAAK,sBAAsB,IAAI,IAAI,KACxCL,cAAA,CAACM,cAAQ,IACP,IAAI,EAAEN,cAAA,CAACO,iCAAmB,EAAA,EAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAA,CAAI,EACnD,QAAQ,EAAC,OAAO,EAChB,EAAE,EAAE;AACF,4BAAA,EAAE,EAAE,CAAC;AACL,4BAAA,eAAe,EAAE,SAAS;AAC1B,4BAAA,UAAU,EAAE,mBAAmB;AAC/B,4BAAA,kBAAkB,EAAE;AAClB,gCAAA,KAAK,EAAE,SAAS;AACjB,6BAAA;AACD,4BAAA,qBAAqB,EAAE;AACrB,gCAAA,KAAK,EAAE,SAAS;AACjB,6BAAA;AACF,yBAAA,EAAA,QAAA,EAEA,IAAI,EAAA,CACI,CACZ,EAGA,MAAM,KAAK,eAAe,IAAI,IAAI,KACjCP,cAAA,CAACM,cAAQ,IACP,IAAI,EAAEN,cAAA,CAACQ,gCAAkB,EAAA,EAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAA,CAAI,EAClD,QAAQ,EAAC,SAAS,EAClB,EAAE,EAAE;AACF,4BAAA,EAAE,EAAE,CAAC;AACL,4BAAA,eAAe,EAAE,SAAS;AAC1B,4BAAA,UAAU,EAAE,mBAAmB;AAC/B,4BAAA,kBAAkB,EAAE;AAClB,gCAAA,KAAK,EAAE,SAAS;AACjB,6BAAA;AACD,4BAAA,qBAAqB,EAAE;AACrB,gCAAA,KAAK,EAAE,SAAS;AACjB,6BAAA;AACF,yBAAA,EAAA,QAAA,EAEA,IAAI,EAAA,CACI,CACZ,EAIDR,cAAA,CAACS,kBAAS,IACR,SAAS,EAAA,IAAA,EACT,IAAI,EAAE,CAAC,EACP,SAAS,QACT,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,CAAC,CAAC,KAAK,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAC7C,QAAQ,EAAE,eAAe,EACzB,EAAE,EAAE;AACF,4BAAA,EAAE,EAAE,CAAC;AACL,4BAAA,0BAA0B,EAAE;gCAC1B,eAAe,EAAE,eAAe,GAAG,qBAAqB,GAAG,MAAM;AACjE,gCAAA,YAAY,EAAE,CAAC;AAChB,6BAAA;AACF,yBAAA,EAAA,CACD,EAIFT,cAAA,CAACU,yBAAgB,IACf,OAAO,EACLV,eAACW,iBAAQ,EAAA,EACP,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAE,2BAA2B,EACrC,EAAE,EAAE;AACF,gCAAA,KAAK,EAAE,SAAS;AAChB,gCAAA,eAAe,EAAE;AACf,oCAAA,KAAK,EAAE,SAAS;AACjB,iCAAA;AACF,6BAAA,EAAA,CACD,EAEJ,KAAK,EAAC,mBAAmB,EACzB,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAA,CACb,EAIFZ,gBAACI,YAAG,EAAA,EACF,EAAE,EAAE;AACF,4BAAA,OAAO,EAAE,MAAM;4BACf,aAAa,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE;4BAC1C,UAAU,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,QAAQ,EAAE;AAC3C,4BAAA,cAAc,EAAE,eAAe;AAC/B,4BAAA,GAAG,EAAE,CAAC;AACN,4BAAA,EAAE,EAAE,CAAC;AACL,4BAAA,SAAS,EAAE,WAAW;AACtB,4BAAA,WAAW,EAAE,SAAS;yBACvB,EAAA,QAAA,EAAA,CAGDJ,eAAA,CAACI,YAAG,EAAA,EAAC,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAE,aACtDH,cAAA,CAACY,aAAM,EAAA,EAAC,OAAO,EAAE,MAAM,EAAE,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,EAAA,QAAA,EAAA,MAAA,EAAA,CAE3C,EACTZ,cAAA,CAACY,aAAM,EAAA,EAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,EAAC,EAAE,EAAE;AACvD,4CAAA,eAAe,EAAE,WAAW;AAC5B,4CAAA,SAAS,EAAE;gDACT,eAAe,EAAE,WAAW;AAC7B;AACF,yCAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,CAEM,EACTZ,cAAA,CAACY,aAAM,EAAA,EAAC,OAAO,EAAE,gBAAgB,EAAE,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,EAAC,EAAE,EAAE;AAC/D,4CAAA,eAAe,EAAE,WAAW;AAC5B,4CAAA,SAAS,EAAE;gDACT,eAAe,EAAE,WAAW;AAC7B;AACF,yCAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,CAEM,IACL,EAINb,eAAA,CAACI,YAAG,EAAA,EACF,EAAE,EAAE;AACF,oCAAA,OAAO,EAAE,MAAM;AACf,oCAAA,UAAU,EAAE,QAAQ;AACpB,oCAAA,GAAG,EAAE,GAAG;oCACR,cAAc,EAAE,EAAE,EAAE,EAAE,eAAe,EAAE,EAAE,EAAE,UAAU,EAAE;AACxD,iCAAA,EAAA,QAAA,EAAA,CAEDJ,eAAA,CAACM,mBAAU,EAAA,EAAC,UAAU,EAAE,GAAG,EAAE,QAAQ,EAAC,UAAU,EAAA,QAAA,EAAA,CAC7C,WAAW,EAAA,GAAA,EAAG,UAAU,IACd,EACbL,cAAA,CAAC,SAAS,EAAA,EAAC,OAAO,EAAE,UAAU,EAAA,YAAA,EAAa,UAAU,EAAA,QAAA,EACnDA,cAAA,CAACK,mBAAU,EAAA,EAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,EAAA,QAAA,EAAA,UAAA,EAAA,CAAuB,EAAA,CAC9D,EACZL,eAAC,SAAS,EAAA,EAAC,OAAO,EAAE,MAAM,EAAA,YAAA,EAAa,MAAM,EAAA,QAAA,EAC3CA,cAAA,CAACK,mBAAU,EAAA,EAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,EAAA,QAAA,EAAA,MAAA,EAAA,CAAmB,GAC1D,CAAA,EAAA,CACR,CAAA,EAAA,CACF,CAAA,EAAA,CACQ,CAAA,EAAA,CACH;AAEnB;;;;"}
1	+ {"version":3,"file":"Modal.js","sources":["../../../../src/components/Modal.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n Dialog,\n DialogContent,\n IconButton,\n Box,\n Typography,\n TextField,\n Checkbox,\n FormControlLabel,\n Alert as MuiAlert,\n Chip,\n styled,\n CircularProgress,\n} from '@mui/material';\nimport { Button } from './Button';\nimport { CloseRounded, ErrorOutlineRounded, StickyNote2Rounded } from '@mui/icons-material';\n\n\ninterface ModalProps {\n isOpen: boolean;\n onClose: () => void;\n status: 'mandatory' \| 'optional' \| 'accepted' \| 'action-required' \| 'action-required-note' \| 'accepted-note';\n description: string;\n defaultText: string;\n note?: string;\n onSave?: (fieldValue: string, defaultChecked: boolean) => void;\n onSubmit?: (fieldValue: string, defaultChecked: boolean) => void;\n onDeclineWording?: () => void;\n onPrevious?: () => void;\n onNext?: () => void;\n currentPage?: number;\n totalPages?: number;\n}\n\n\nconst StyledDialog = styled(Dialog)(({ theme }) => ({\n '& .MuiDialog-paper': {\n color: theme.palette.background.default,\n borderRadius: theme.shape.borderRadius,\n maxWidth: '896px',\n width: '100%',\n maxHeight: '90vh',\n },\n}));\n\n\nconst NavButton = styled(IconButton)(({ theme }) => ({\n width: 'auto',\n height: '40px',\n borderRadius: (typeof theme.shape.borderRadius === 'string'\n ? parseInt(theme.shape.borderRadius, 10)\n : theme.shape.borderRadius \|\| 4) * 2,\n border: `2px solid ${theme.palette.dark.main}`,\n backgroundColor: theme.palette.light.main,\n padding: theme.spacing(1, 2),\n '&:hover': {\n backgroundColor: theme.palette.grey[100], // Changed from dark.main to grey[100]\n color: theme.palette.dark.main, // Keep text dark instead of light\n borderColor: theme.palette.dark.main, // Keep border dark\n },\n}));\n\n\n\nexport const Modal: React.FC<ModalProps> = ({\n isOpen,\n onClose,\n status,\n description,\n defaultText,\n note,\n onSave,\n onSubmit,\n onDeclineWording,\n onPrevious,\n onNext,\n currentPage = 1,\n totalPages = 1,\n}) => {\n const [textValue, setTextValue] = useState(defaultText);\n const [useDefaultValue, setUseDefaultValue] = useState(true);\n const [isLoading, setIsLoading] = useState(false);\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [isSaving, setIsSaving] = useState(false);\n\n\n const handleUseDefaultValueChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n setUseDefaultValue(event.target.checked);\n };\n\n\n const statusConfig = {\n mandatory: {\n color: '#F5A623',\n label: 'Mandatory',\n },\n optional: {\n color: '#F5D76E',\n label: 'Optional',\n },\n accepted: {\n color: '#A3D977',\n label: 'Accepted',\n },\n 'action-required': {\n color: '#F56B6B',\n label: 'Action Required',\n },\n 'action-required-note': {\n color: '#F56B6B',\n label: 'Action Required',\n },\n 'accepted-note': {\n color: '#A3D977',\n label: 'Accepted',\n },\n };\n\n\n const statusStyle = statusConfig[status];\n\n const handleSave = () => {\n setIsLoading(true);\n setIsSaving(true);\n onSave?.(textValue, useDefaultValue);\n setTimeout(() => {\n setIsSaving(false);\n setIsLoading(false);\n onClose();\n }, 1000);\n };\n\n const handleSubmit = () => {\n setIsLoading(true);\n setIsSubmitting(true);\n onSubmit?.(textValue, useDefaultValue);\n setTimeout(() => {\n setIsSubmitting(false);\n setIsLoading(false);\n onClose();\n }, 1000);\n };\n\n\n\n return (\n <StyledDialog open={isOpen} onClose={onClose} maxWidth=\"md\" fullWidth>\n <IconButton\n onClick={onClose}\n sx={{\n position: 'absolute',\n top: 16,\n right: 16,\n zIndex: 1,\n }}\n >\n <CloseRounded sx={{ fontSize: 24 }} />\n </IconButton>\n\n\n <DialogContent sx={{ p: { xs: 3, sm: 4, md: 6 } }}>\n {/* Status Chip /}\n <Box sx={{ mb: 3 }}>\n <Chip\n label={statusStyle.label.toUpperCase()}\n sx={{\n backgroundColor: statusStyle.color,\n color: status === 'optional' \|\| status === 'mandatory' ? '#4D3019' : '#fff',\n fontWeight: 600,\n fontSize: '0.875rem',\n height: 'auto',\n py: 1,\n borderRadius: 0,\n px: 2,\n }}\n />\n </Box>\n\n\n {/ Description /}\n <Typography sx={{ mb: 3, lineHeight: 1.6, whiteSpace: 'pre-line' }}>\n {description}\n </Typography>\n\n\n {/ Alerts /}\n {status === 'action-required-note' && note && (\n <MuiAlert\n icon={<ErrorOutlineRounded sx={{ fontSize: 20 }} />}\n severity=\"error\"\n sx={{\n mb: 2,\n backgroundColor: '#FDFCEE',\n borderLeft: '4px solid #F56B6B',\n '& .MuiAlert-icon': {\n color: '#F56B6B',\n },\n '& .MuiAlert-message': {\n color: '#4D3019',\n },\n }}\n >\n {note}\n </MuiAlert>\n )}\n\n\n {status === 'accepted-note' && note && (\n <MuiAlert\n icon={<StickyNote2Rounded sx={{ fontSize: 20 }} />}\n severity=\"warning\"\n sx={{\n mb: 2,\n backgroundColor: '#FDFCEE',\n borderLeft: '4px solid #F5D76E',\n '& .MuiAlert-icon': {\n color: '#F5A623',\n },\n '& .MuiAlert-message': {\n color: '#4D3019',\n },\n }}\n >\n {note}\n </MuiAlert>\n )}\n\n\n {/ Text Field /}\n <TextField\n multiline\n rows={6}\n fullWidth\n value={textValue}\n onChange={(e) => setTextValue(e.target.value)}\n disabled={useDefaultValue}\n sx={{\n mb: 2,\n '& .MuiOutlinedInput-root': {\n backgroundColor: useDefaultValue ? 'rgba(0, 0, 0, 0.05)' : '#fff',\n borderRadius: 2,\n },\n }}\n />\n\n\n {/ Checkbox /}\n <FormControlLabel\n control={\n <Checkbox\n checked={useDefaultValue}\n onChange={handleUseDefaultValueChange}\n sx={{\n color: '#AC46FF',\n '&.Mui-checked': {\n color: '#AC46FF',\n },\n }}\n />\n }\n label=\"Use Default Value\"\n sx={{ mb: 3 }}\n />\n\n\n {/ Footer with Buttons and Navigation /}\n <Box\n sx={{\n display: 'flex',\n flexDirection: { xs: 'column', sm: 'row' },\n alignItems: { xs: 'stretch', sm: 'center' },\n justifyContent: 'space-between',\n gap: 2,\n pt: 3,\n borderTop: '1px solid',\n borderColor: 'divider',\n }}\n >\n {/ Action Buttons /}\n <Box sx={{ display: 'flex', gap: 1.5, flexWrap: 'wrap' }}>\n <Button\n onClick={handleSave}\n variant=\"outline\"\n size=\"md\"\n disabled={isLoading}\n >\n {isSaving ? <><CircularProgress size={20} /><Typography sx={{paddingLeft: 2}}>Saving...</Typography></> : \"Save\"}\n </Button>\n <Button\n onClick={handleSubmit}\n variant=\"outline\"\n size=\"md\"\n disabled={isLoading}\n sx={{\n backgroundColor: '#ac46ff52',\n '&:hover': {\n backgroundColor: '#ac46ff80',\n },\n }}\n >\n {isSubmitting ? <><CircularProgress size={20} /><Typography sx={{paddingLeft: 2}}>Submitting...</Typography></> : \"Submit for review\"}\n </Button>\n <Button onClick={onDeclineWording} variant=\"outline\" size=\"md\" sx={{\n backgroundColor: '#ff464652',\n '&:hover': {\n backgroundColor: '#ff464680', // Darker purple on hover\n }\n }}\n disabled={isLoading}\n >\n Decline wording\n </Button>\n </Box>\n\n\n {/ Navigation */}\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n gap: 1.5,\n justifyContent: { xs: 'space-between', sm: 'flex-end' },\n }}\n >\n <Typography fontWeight={500} fontSize=\"1.125rem\">\n {currentPage}/{totalPages}\n </Typography>\n <NavButton onClick={onPrevious} aria-label=\"Previous\" disabled={isLoading}>\n <Typography sx={{ fontSize: 16, fontWeight: 500 }}>Previous</Typography>\n </NavButton>\n <NavButton onClick={onNext} aria-label=\"Next\" disabled={isLoading}>\n <Typography sx={{ fontSize: 16, fontWeight: 500 }}>Next</Typography>\n </NavButton>\n </Box>\n </Box>\n </DialogContent>\n </StyledDialog>\n );\n};\n"],"names":["styled","Dialog","IconButton","useState","_jsxs","_jsx","CloseRounded","DialogContent","Box","Chip","Typography","MuiAlert","ErrorOutlineRounded","StickyNote2Rounded","TextField","FormControlLabel","Checkbox","Button","_Fragment","CircularProgress"],"mappings":"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"}

package/dist/cjs/components/PopoverMenu.js ADDED Viewed

@@ -0,0 +1,25 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+var jsxRuntime = require('react/jsx-runtime');
+var material = require('@mui/material');
+var LogoutIcon = require('@mui/icons-material/Logout');
+var ThemeProvider = require('../ThemeProvider.js');
+function PopoverMenu({ anchorEl, onClose, signOut, }) {
+    const theme = ThemeProvider.useTheme();
+    return (jsxRuntime.jsx(material.Menu, { anchorEl: anchorEl, open: Boolean(anchorEl), onClose: onClose, PaperProps: {
+            sx: {
+                backgroundColor: theme.palette.background.paper,
+                color: theme.palette.text.primary,
+            },
+        }, children: jsxRuntime.jsxs(material.MenuItem, { onClick: signOut, children: [jsxRuntime.jsx(material.ListItemIcon, { children: jsxRuntime.jsx(LogoutIcon, { sx: { color: theme.palette.primary.main } }) }), jsxRuntime.jsx(material.ListItemText, { primary: "Logout", sx: {
+                        color: theme.palette.primary.contrastText,
+                        fontFamily: theme.typography.fontFamily,
+                        fontWeight: theme.typography.button.fontWeight,
+                    } })] }, "logout") }));
+}
+exports.default = PopoverMenu;
+//# sourceMappingURL=PopoverMenu.js.map

package/dist/cjs/components/PopoverMenu.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"PopoverMenu.js","sources":["../../../../src/components/PopoverMenu.tsx"],"sourcesContent":["import React from 'react';\nimport { Menu, MenuItem, ListItemIcon, ListItemText } from '@mui/material';\nimport LogoutIcon from '@mui/icons-material/Logout';\nimport { useTheme } from '../ThemeProvider';\n\ninterface PopoverMenuProps {\n anchorEl: HTMLElement | null;\n onClose: () => void;\n signOut: () => void;\n}\n\nexport default function PopoverMenu({\n anchorEl,\n onClose,\n signOut,\n}: PopoverMenuProps) {\n const theme = useTheme();\n\n return (\n <Menu\n anchorEl={anchorEl}\n open={Boolean(anchorEl)}\n onClose={onClose}\n PaperProps={{\n sx: {\n backgroundColor: theme.palette.background.paper,\n color: theme.palette.text.primary,\n },\n }}\n >\n <MenuItem key=\"logout\" onClick={signOut}>\n <ListItemIcon>\n <LogoutIcon sx={{ color: theme.palette.primary.main }} />\n </ListItemIcon>\n <ListItemText\n primary=\"Logout\"\n sx={{\n color: theme.palette.primary.contrastText,\n fontFamily: theme.typography.fontFamily,\n fontWeight: theme.typography.button.fontWeight,\n }}\n />\n </MenuItem>\n </Menu>\n );\n}\n"],"names":["useTheme","_jsx","Menu","_jsxs","MenuItem","ListItemIcon","ListItemText"],"mappings":";;;;;;;;;AAWc,SAAU,WAAW,CAAC,EAClC,QAAQ,EACR,OAAO,EACP,OAAO,GACU,EAAA;AACjB,IAAA,MAAM,KAAK,GAAGA,sBAAQ,EAAE;IAExB,QACEC,eAACC,aAAI,EAAA,EACH,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,OAAO,CAAC,QAAQ,CAAC,EACvB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE;AACV,YAAA,EAAE,EAAE;AACF,gBAAA,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK;AAC/C,gBAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO;AAClC,aAAA;AACF,SAAA,EAAA,QAAA,EAEDC,gBAACC,iBAAQ,EAAA,EAAc,OAAO,EAAE,OAAO,EAAA,QAAA,EAAA,CACrCH,cAAA,CAACI,qBAAY,EAAA,EAAA,QAAA,EACXJ,eAAC,UAAU,EAAA,EAAC,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,EAAA,CAAI,EAAA,CAC5C,EACfA,cAAA,CAACK,qBAAY,EAAA,EACX,OAAO,EAAC,QAAQ,EAChB,EAAE,EAAE;AACF,wBAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,YAAY;AACzC,wBAAA,UAAU,EAAE,KAAK,CAAC,UAAU,CAAC,UAAU;AACvC,wBAAA,UAAU,EAAE,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,UAAU;AAC/C,qBAAA,EAAA,CACD,CAAA,EAAA,EAXU,QAAQ,CAYX,EAAA,CACN;AAEX;;;;"}

package/dist/esm/components/Header.d.ts CHANGED Viewed

@@ -2,6 +2,9 @@ import React from 'react';
 interface HeaderProps {
     userName?: string;
     userInitials?: string;
+    toggleMenu: () => void;
+    signOut: () => void;
+    search?: () => void;
 }
 export declare const Header: React.FC<HeaderProps>;
 export {};

package/dist/esm/components/Header.js CHANGED Viewed

@@ -1,26 +1,27 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { styled, Box, Typography, TextField, IconButton } from '@mui/material';
+import React from 'react';
+import { styled, Box, Typography, TextField, IconButton, Divider } from '@mui/material';
 import { useTheme } from '../ThemeProvider.js';
-import { SchoolRounded, SearchRounded } from '@mui/icons-material';
+import { MenuRounded, SchoolRounded, SearchRounded } from '@mui/icons-material';
+import PopoverMenu from './PopoverMenu.js';
 const StyledHeader = styled(Box)(({ theme }) => ({
-    padding: theme.spacing(1.5, 4), // px-4 py-3
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'space-between',
-    gap: theme.spacing(2), // gap-2
     backgroundColor: theme.palette.primary.main, // var(--color-primary)
-    [theme.breakpoints.up('sm')]: {
-        padding: theme.spacing(2, 6), // sm:px-6
-    },
     [theme.breakpoints.up('md')]: {
-        padding: theme.spacing(2, 8), // md:px-8
         gap: theme.spacing(4), // md:gap-4
+        padding: theme.spacing(1.5, 1.5), // px-4 py-3
+    },
+    [theme.breakpoints.down('md')]: {
+        padding: 0, // px-4 py-3
     },
 }));
 const StyledLogoWrapper = styled(Box)(({ theme }) => ({
     display: 'flex',
     alignItems: 'center',
+    padding: theme.spacing(1.5),
     gap: theme.spacing(2), // md:gap-2
     [theme.breakpoints.down('md')]: {
         gap: theme.spacing(1.5), // gap-1.5
@@ -30,10 +31,6 @@ const StyledLogoIcon = styled(Box)(({ theme }) => ({
     width: 32, // md:w-8 md:h-8
     height: 32,
     color: theme.palette.light.main, // text-[#FDFCEE]
-    [theme.breakpoints.down('md')]: {
-        width: 24, // w-6
-        height: 24, // h-6
-    },
 }));
 const StyledLogoText = styled(Typography)(({ theme }) => ({
     color: theme.palette.light.main, // text-[#FDFCEE]
@@ -50,21 +47,14 @@ const StyledLogoText = styled(Typography)(({ theme }) => ({
 const StyledSearchContainer = styled(Box)(({ theme }) => ({
     flex: 1,
     maxWidth: '32rem', // max-w-2xl
-    margin: theme.spacing(0, 8), // mx-8
+    margin: theme.spacing(0, 2), // mx-8
     position: 'relative',
-    [theme.breakpoints.down('md')]: {
-        margin: theme.spacing(0, 4), // sm:mx-4
-    },
-    [theme.breakpoints.down('sm')]: {
-        margin: theme.spacing(0, 2), // mx-2
-    },
 }));
 const StyledTextField = styled(TextField)(({ theme }) => ({
     '& .MuiInputBase-root': {
         backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]
         color: theme.palette.dark.main, // text-[#4D3019]
         borderRadius: '9999px', // rounded-full
-        paddingRight: theme.spacing(6), // pr-12
         fontSize: '1rem', // text-base
         [theme.breakpoints.down('md')]: {
             paddingRight: theme.spacing(5), // sm:pr-10
@@ -90,31 +80,39 @@ const StyledTextField = styled(TextField)(({ theme }) => ({
     },
 }));
 const StyledSearchButton = styled(IconButton)(({ theme }) => ({
-    position: 'absolute',
-    right: theme.spacing(2), // md:right-2
-    top: '50%',
-    transform: 'translateY(-50%)',
-    width: theme.spacing(5), // md:w-10
-    height: theme.spacing(5), // md:h-10
-    borderRadius: '50%', // rounded-full
-    backgroundColor: theme.palette.primary.main, // var(--color-primary)
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    position: 'static',
+    borderRadius: '50%',
+    backgroundColor: theme.palette.primary.main,
+    width: theme.spacing(5),
+    height: theme.spacing(5),
+    [theme.breakpoints.down('md')]: {
+        width: theme.spacing(5),
+        height: theme.spacing(5),
+        marginRight: theme.spacing(1),
+    },
+    [theme.breakpoints.down('sm')]: {
+        marginRight: theme.spacing(0.5),
+    },
     '&:hover': {
-        opacity: 0.9, // hover:opacity-90
+        opacity: 0.9,
         backgroundColor: theme.palette.primary.main,
     },
-    [theme.breakpoints.down('md')]: {
-        right: theme.spacing(1), // right-1
-        width: theme.spacing(4), // w-8
-        height: theme.spacing(4), // h-8
-    },
 }));
 const StyledSearchIcon = styled(Box)(({ theme }) => ({
-    width: 20, // md:w-5 md:h-5
-    height: 20,
-    color: theme.palette.light.main, // text-[#FDFCEE]
-    [theme.breakpoints.down('md')]: {
-        width: 16, // w-4
-        height: 16, // h-4
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    color: theme.palette.light.main,
+    width: '100%',
+    height: '100%',
+    '& svg': {
+        fontSize: '1.5rem',
+        [theme.breakpoints.down('sm')]: {
+            fontSize: '1.25rem',
+        },
     },
 }));
 const StyledUserContainer = styled(Box)(({ theme }) => ({
@@ -122,7 +120,7 @@ const StyledUserContainer = styled(Box)(({ theme }) => ({
     alignItems: 'center',
     gap: theme.spacing(3), // md:gap-3
     [theme.breakpoints.down('md')]: {
-        gap: theme.spacing(2), // gap-2
+        gap: 0,
     },
 }));
 const StyledAvatar = styled(Box)(({ theme }) => ({
@@ -137,11 +135,7 @@ const StyledAvatar = styled(Box)(({ theme }) => ({
     [theme.breakpoints.down('md')]: {
         width: theme.spacing(5), // sm:w-10
         height: theme.spacing(5), // sm:h-10
-    },
-    [theme.breakpoints.down('sm')]: {
-        width: theme.spacing(4), // w-8
-        height: theme.spacing(4), // h-8
-    },
+    }
 }));
 const StyledAvatarText = styled(Typography)(({ theme }) => ({
     color: theme.palette.dark.main, // text-[#4D3019]
@@ -154,6 +148,7 @@ const StyledAvatarText = styled(Typography)(({ theme }) => ({
 const StyledUserName = styled(Typography)(({ theme }) => ({
     color: theme.palette.light.main, // text-[#FDFCEE]
     fontWeight: 500, // font-medium
+    marginLeft: theme.spacing(1),
     fontSize: '1.125rem', // text-lg
     display: 'none', // hidden
     [theme.breakpoints.up('sm')]: {
@@ -161,13 +156,26 @@ const StyledUserName = styled(Typography)(({ theme }) => ({
     },
     [theme.breakpoints.down('md')]: {
         fontSize: '0.875rem', // text-sm
+        display: 'none'
     },
 }));
-const Header = ({ userName = 'John Doe', userInitials = 'JD', }) => {
+const Header = ({ userName = 'John Doe', userInitials = 'JD', toggleMenu, signOut, search }) => {
     const theme = useTheme();
-    return (jsxs(StyledHeader, { children: [jsxs(StyledLogoWrapper, { children: [jsx(StyledLogoIcon, { children: jsx(SchoolRounded, { sx: { fontSize: 32, color: 'currentColor' } }) }), jsx(StyledLogoText, { variant: "h1", children: theme.appName })] }), jsx(StyledSearchContainer, { children: jsx(StyledTextField, { placeholder: "Search for a policy", variant: "outlined", fullWidth: true, InputProps: {
-                        endAdornment: (jsx(StyledSearchButton, { children: jsx(StyledSearchIcon, { children: jsx(SearchRounded, { sx: { fontSize: 20 } }) }) })),
-                    } }) }), jsxs(StyledUserContainer, { children: [jsx(StyledAvatar, { children: jsx(StyledAvatarText, { children: userInitials }) }), jsx(StyledUserName, { children: userName })] })] }));
+    const [anchorEl, setAnchorEl] = React.useState(null);
+    const handleOpen = (event) => {
+        setAnchorEl(event.currentTarget);
+    };
+    const handleClose = () => {
+        setAnchorEl(null);
+    };
+    return (jsxs(StyledHeader, { children: [jsx(IconButton, { disableRipple: true, onClick: toggleMenu, sx: {
+                    display: { xs: 'block', md: 'none' }
+                }, children: jsx(MenuRounded, { sx: { fontSize: 32, color: 'white' } }) }), jsx(Divider, { orientation: 'vertical', sx: { color: '#FFFFFF', borderRightWidth: 2, display: { xs: 'block', md: 'none' } } }), 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, sx: { display: { xs: 'none', sm: 'none', md: 'block' } }, InputProps: {
+                        endAdornment: (jsx(StyledSearchButton, { children: jsx(StyledSearchIcon, { children: jsx(SearchRounded, {}) }) })),
+                    } }) }), jsxs(StyledUserContainer, { children: [jsx(StyledSearchButton, { disableRipple: true, onClick: search, sx: {
+                            display: { xs: 'flex', md: 'none' },
+                            backgroundColor: '#ffffff83'
+                        }, children: jsx(StyledSearchIcon, { children: jsx(SearchRounded, {}) }) }), jsxs(IconButton, { onClick: handleOpen, disableRipple: true, children: [jsx(StyledAvatar, { children: jsx(StyledAvatarText, { children: userInitials }) }), jsx(StyledUserName, { children: userName })] })] }), jsx(PopoverMenu, { anchorEl: anchorEl, onClose: handleClose, signOut: () => { signOut(); handleClose(); } })] }));
 };
 export { Header };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.js","sources":["../../../../src/components/Header.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { Box, styled, Typography, TextField, IconButton } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { SchoolRounded, SearchRounded } from '@mui/icons-material';\n\ninterface HeaderProps {\n userName?: string;\n userInitials?: string;\n}\n\nconst StyledHeader = styled(Box)(({ theme }) => ({\n padding: theme.spacing(1.5, 4), // px-4 py-3\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n gap: theme.spacing(2), // gap-2\n backgroundColor: theme.palette.primary.main, // var(--color-primary)\n [theme.breakpoints.up('sm')]: {\n padding: theme.spacing(2, 6), // sm:px-6\n },\n [theme.breakpoints.up('md')]: {\n padding: theme.spacing(2, 8), // md:px-8\n gap: theme.spacing(4), // md:gap-4\n },\n}));\n\nconst StyledLogoWrapper = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(2), // md:gap-2\n [theme.breakpoints.down('md')]: {\n gap: theme.spacing(1.5), // gap-1.5\n },\n}));\n\nconst StyledLogoIcon = styled(Box)(({ theme }) => ({\n width: 32, // md:w-8 md:h-8\n height: 32,\n color: theme.palette.light.main, // text-[#FDFCEE]\n [theme.breakpoints.down('md')]: {\n width: 24, // w-6\n height: 24, // h-6\n },\n}));\n\nconst StyledLogoText = styled(Typography)(({ theme }) => ({\n color: theme.palette.light.main, // text-[#FDFCEE]\n fontWeight: 700, // font-bold\n letterSpacing: '0.05em', // tracking-wide\n fontSize: '1.5rem', // text-2xl\n [theme.breakpoints.down('md')]: {\n fontSize: '1.25rem', // sm:text-xl\n },\n [theme.breakpoints.down('sm')]: {\n fontSize: '1.125rem', // text-lg\n },\n}));\n\nconst StyledSearchContainer = styled(Box)(({ theme }) => ({\n flex: 1,\n maxWidth: '32rem', // max-w-2xl\n margin: theme.spacing(0, 8), // mx-8\n position: 'relative',\n [theme.breakpoints.down('md')]: {\n margin: theme.spacing(0, 4), // sm:mx-4\n },\n [theme.breakpoints.down('sm')]: {\n margin: theme.spacing(0, 2), // mx-2\n },\n}));\n\nconst StyledTextField = styled(TextField)(({ theme }) => ({\n '& .MuiInputBase-root': {\n backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n color: theme.palette.dark.main, // text-[#4D3019]\n borderRadius: '9999px', // rounded-full\n paddingRight: theme.spacing(6), // pr-12\n fontSize: '1rem', // text-base\n [theme.breakpoints.down('md')]: {\n paddingRight: theme.spacing(5), // sm:pr-10\n fontSize: '0.875rem', // text-sm\n },\n },\n '& .MuiInputBase-input': {\n padding: theme.spacing(1.5, 3), // px-4 py-2\n [theme.breakpoints.up('md')]: {\n padding: theme.spacing(1.5, 4), // md:px-6 md:py-3\n },\n [theme.breakpoints.down('sm')]: {\n padding: theme.spacing(1.5, 2.5), // sm:px-5\n },\n },\n '& .MuiInputBase-input::placeholder': {\n color: `${theme.palette.dark.main}99`, // placeholder-[#4D3019]/60\n opacity: 1,\n },\n '& .MuiInputBase-root:focus-within': {\n outline: `2px solid ${theme.palette.light.main}`, // focus:ring-2 focus:ring-[#FDFCEE]\n outlineOffset: 0,\n },\n}));\n\nconst StyledSearchButton = styled(IconButton)(({ theme }) => ({\n position: 'absolute',\n right: theme.spacing(2), // md:right-2\n top: '50%',\n transform: 'translateY(-50%)',\n width: theme.spacing(5), // md:w-10\n height: theme.spacing(5), // md:h-10\n borderRadius: '50%', // rounded-full\n backgroundColor: theme.palette.primary.main, // var(--color-primary)\n '&:hover': {\n opacity: 0.9, // hover:opacity-90\n backgroundColor: theme.palette.primary.main,\n },\n [theme.breakpoints.down('md')]: {\n right: theme.spacing(1), // right-1\n width: theme.spacing(4), // w-8\n height: theme.spacing(4), // h-8\n },\n}));\n\nconst StyledSearchIcon = styled(Box)(({ theme }) => ({\n width: 20, // md:w-5 md:h-5\n height: 20,\n color: theme.palette.light.main, // text-[#FDFCEE]\n [theme.breakpoints.down('md')]: {\n width: 16, // w-4\n height: 16, // h-4\n },\n}));\n\nconst StyledUserContainer = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(3), // md:gap-3\n [theme.breakpoints.down('md')]: {\n gap: theme.spacing(2), // gap-2\n },\n}));\n\nconst StyledAvatar = styled(Box)(({ theme }) => ({\n width: theme.spacing(6), // md:w-12\n height: theme.spacing(6), // md:h-12\n borderRadius: '50%', // rounded-full\n backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n [theme.breakpoints.down('md')]: {\n width: theme.spacing(5), // sm:w-10\n height: theme.spacing(5), // sm:h-10\n },\n [theme.breakpoints.down('sm')]: {\n width: theme.spacing(4), // w-8\n height: theme.spacing(4), // h-8\n },\n}));\n\nconst StyledAvatarText = styled(Typography)(({ theme }) => ({\n color: theme.palette.dark.main, // text-[#4D3019]\n fontWeight: 700, // font-bold\n fontSize: '1.125rem', // text-lg\n [theme.breakpoints.down('md')]: {\n fontSize: '0.875rem', // text-sm\n },\n}));\n\nconst StyledUserName = styled(Typography)(({ theme }) => ({\n color: theme.palette.light.main, // text-[#FDFCEE]\n fontWeight: 500, // font-medium\n fontSize: '1.125rem', // text-lg\n display: 'none', // hidden\n [theme.breakpoints.up('sm')]: {\n display: 'inline', // sm:inline\n },\n [theme.breakpoints.down('md')]: {\n fontSize: '0.875rem', // text-sm\n },\n}));\n\nexport const Header: React.FC<HeaderProps> = ({\n userName = 'John Doe',\n userInitials = 'JD',\n}) => {\n const theme = useTheme();\n\n return (\n <StyledHeader>\n <StyledLogoWrapper>\n <StyledLogoIcon>\n <SchoolRounded sx={{fontSize:32, color: 'currentColor'}} />\n </StyledLogoIcon>\n <StyledLogoText variant=\"h1\">{theme.appName}</StyledLogoText>\n </StyledLogoWrapper>\n\n <StyledSearchContainer>\n <StyledTextField\n placeholder=\"Search for a policy\"\n variant=\"outlined\"\n fullWidth\n InputProps={{\n endAdornment: (\n <StyledSearchButton>\n <StyledSearchIcon>\n <SearchRounded sx={{fontSize: 20}} />\n </StyledSearchIcon>\n </StyledSearchButton>\n ),\n }}\n />\n </StyledSearchContainer>\n\n <StyledUserContainer>\n <StyledAvatar>\n <StyledAvatarText>{userInitials}</StyledAvatarText>\n </StyledAvatar>\n <StyledUserName>{userName}</StyledUserName>\n </StyledUserContainer>\n </StyledHeader>\n );\n};"],"names":["_jsxs","_jsx"],"mappings":"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"}
1	+ {"version":3,"file":"Header.js","sources":["../../../../src/components/Header.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { Box, styled, Typography, TextField, IconButton, Divider } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { MenuRounded, SchoolRounded, SearchRounded } from '@mui/icons-material';\nimport PopoverMenu from './PopoverMenu';\n\ninterface HeaderProps {\n userName?: string;\n userInitials?: string;\n toggleMenu: () => void;\n signOut: () => void;\n search?: () => void;\n}\n\nconst StyledHeader = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n backgroundColor: theme.palette.primary.main, // var(--color-primary)\n [theme.breakpoints.up('md')]: {\n gap: theme.spacing(4), // md:gap-4\n padding: theme.spacing(1.5, 1.5), // px-4 py-3\n },\n [theme.breakpoints.down('md')]: {\n padding: 0, // px-4 py-3\n },\n}));\n\nconst StyledLogoWrapper = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n padding: theme.spacing(1.5),\n gap: theme.spacing(2), // md:gap-2\n [theme.breakpoints.down('md')]: {\n gap: theme.spacing(1.5), // gap-1.5\n },\n}));\n\nconst StyledLogoIcon = styled(Box)(({ theme }) => ({\n width: 32, // md:w-8 md:h-8\n height: 32,\n color: theme.palette.light.main, // text-[#FDFCEE]\n}));\n\nconst StyledLogoText = styled(Typography)(({ theme }) => ({\n color: theme.palette.light.main, // text-[#FDFCEE]\n fontWeight: 700, // font-bold\n letterSpacing: '0.05em', // tracking-wide\n fontSize: '1.5rem', // text-2xl\n [theme.breakpoints.down('md')]: {\n fontSize: '1.25rem', // sm:text-xl\n },\n [theme.breakpoints.down('sm')]: {\n fontSize: '1.125rem', // text-lg\n },\n}));\n\nconst StyledSearchContainer = styled(Box)(({ theme }) => ({\n flex: 1,\n maxWidth: '32rem', // max-w-2xl\n margin: theme.spacing(0, 2), // mx-8\n position: 'relative',\n}));\n\nconst StyledTextField = styled(TextField)(({ theme }) => ({\n '& .MuiInputBase-root': {\n backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n color: theme.palette.dark.main, // text-[#4D3019]\n borderRadius: '9999px', // rounded-full\n fontSize: '1rem', // text-base\n [theme.breakpoints.down('md')]: {\n paddingRight: theme.spacing(5), // sm:pr-10\n fontSize: '0.875rem', // text-sm\n },\n },\n '& .MuiInputBase-input': {\n padding: theme.spacing(1.5, 3), // px-4 py-2\n [theme.breakpoints.up('md')]: {\n padding: theme.spacing(1.5, 4), // md:px-6 md:py-3\n },\n [theme.breakpoints.down('sm')]: {\n padding: theme.spacing(1.5, 2.5), // sm:px-5\n },\n },\n '& .MuiInputBase-input::placeholder': {\n color: `${theme.palette.dark.main}99`, // placeholder-[#4D3019]/60\n opacity: 1,\n },\n '& .MuiInputBase-root:focus-within': {\n outline: `2px solid ${theme.palette.light.main}`, // focus:ring-2 focus:ring-[#FDFCEE]\n outlineOffset: 0,\n },\n}));\n\nconst StyledSearchButton = styled(IconButton)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'static',\n borderRadius: '50%',\n backgroundColor: theme.palette.primary.main,\n width: theme.spacing(5),\n height: theme.spacing(5),\n [theme.breakpoints.down('md')]: {\n width: theme.spacing(5),\n height: theme.spacing(5),\n marginRight: theme.spacing(1),\n },\n [theme.breakpoints.down('sm')]: {\n marginRight: theme.spacing(0.5),\n },\n '&:hover': {\n opacity: 0.9,\n backgroundColor: theme.palette.primary.main,\n },\n}));\n\nconst StyledSearchIcon = styled(Box)(({ theme }) => ({\n display: 'flex', \n alignItems: 'center',\n justifyContent: 'center',\n color: theme.palette.light.main,\n width: '100%',\n height: '100%',\n '& svg': {\n fontSize: '1.5rem',\n [theme.breakpoints.down('sm')]: {\n fontSize: '1.25rem',\n },\n },\n}));\n\nconst StyledUserContainer = styled(Box)(({ theme }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(3), // md:gap-3\n [theme.breakpoints.down('md')]: {\n gap: 0,\n },\n}));\n\nconst StyledAvatar = styled(Box)(({ theme }) => ({\n width: theme.spacing(6), // md:w-12\n height: theme.spacing(6), // md:h-12\n borderRadius: '50%', // rounded-full\n backgroundColor: theme.palette.light.main, // bg-[#FDFCEE]\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n [theme.breakpoints.down('md')]: {\n width: theme.spacing(5), // sm:w-10\n height: theme.spacing(5), // sm:h-10\n }\n}));\n\nconst StyledAvatarText = styled(Typography)(({ theme }) => ({\n color: theme.palette.dark.main, // text-[#4D3019]\n fontWeight: 700, // font-bold\n fontSize: '1.125rem', // text-lg\n [theme.breakpoints.down('md')]: {\n fontSize: '0.875rem', // text-sm\n },\n}));\n\nconst StyledUserName = styled(Typography)(({ theme }) => ({\n color: theme.palette.light.main, // text-[#FDFCEE]\n fontWeight: 500, // font-medium\n marginLeft: theme.spacing(1),\n fontSize: '1.125rem', // text-lg\n display: 'none', // hidden\n [theme.breakpoints.up('sm')]: {\n display: 'inline', // sm:inline\n },\n [theme.breakpoints.down('md')]: {\n fontSize: '0.875rem', // text-sm\n display: 'none'\n },\n}));\n\nexport const Header: React.FC<HeaderProps> = ({\n userName = 'John Doe',\n userInitials = 'JD',\n toggleMenu,\n signOut,\n search\n}) => {\n const theme = useTheme();\n const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement \| null>(null);\n\n const handleOpen = (event: React.MouseEvent<HTMLButtonElement>) => {\n setAnchorEl(event.currentTarget);\n };\n\n const handleClose = () => {\n setAnchorEl(null);\n };\n\n\n return (\n <StyledHeader>\n <IconButton disableRipple onClick={toggleMenu} sx={{\n display: {xs: 'block', md: 'none'}\n }}>\n <MenuRounded sx={{fontSize: 32, color: 'white'}}/>\n </IconButton>\n <Divider orientation='vertical' sx={{color: '#FFFFFF',borderRightWidth: 2,display: {xs: 'block', md: 'none'}}}/>\n <StyledLogoWrapper>\n <StyledLogoIcon>\n <SchoolRounded sx={{fontSize:32, color: 'currentColor'}} />\n </StyledLogoIcon>\n <StyledLogoText variant=\"h1\">{theme.appName}</StyledLogoText>\n </StyledLogoWrapper>\n\n {/* Search input for md+ screens /}\n <StyledSearchContainer >\n <StyledTextField\n placeholder=\"Search for a policy\"\n variant=\"outlined\"\n fullWidth\n sx={{ display: { xs: 'none', sm: 'none', md: 'block' } }}\n InputProps={{\n endAdornment: (\n <StyledSearchButton>\n <StyledSearchIcon>\n <SearchRounded />\n </StyledSearchIcon>\n </StyledSearchButton>\n ),\n }}\n />\n </StyledSearchContainer>\n\n <StyledUserContainer>\n {/ Search button only visible on XS screens */}\n <StyledSearchButton\n disableRipple\n onClick={search}\n sx={{\n display: { xs: 'flex', md: 'none' },\n backgroundColor: '#ffffff83'\n }}\n >\n <StyledSearchIcon>\n <SearchRounded />\n </StyledSearchIcon>\n </StyledSearchButton>\n <IconButton onClick={handleOpen} disableRipple>\n <StyledAvatar>\n <StyledAvatarText>{userInitials}</StyledAvatarText>\n </StyledAvatar>\n <StyledUserName>{userName}</StyledUserName>\n </IconButton>\n </StyledUserContainer>\n\n <PopoverMenu\n anchorEl={anchorEl}\n onClose={handleClose}\n signOut={()=>{signOut(); handleClose();}}\n />\n </StyledHeader>\n );\n};"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/Modal.d.ts CHANGED Viewed

@@ -6,10 +6,8 @@ interface ModalProps {
     description: string;
     defaultText: string;
     note?: string;
-    acceptSuggestion?: boolean;
-    onAcceptSuggestionChange?: (checked: boolean) => void;
-    onSave?: () => void;
-    onSubmit?: () => void;
+    onSave?: (fieldValue: string, defaultChecked: boolean) => void;
+    onSubmit?: (fieldValue: string, defaultChecked: boolean) => void;
     onDeclineWording?: () => void;
     onPrevious?: () => void;
     onNext?: () => void;

package/dist/esm/components/Modal.js CHANGED Viewed

@@ -1,6 +1,6 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { useState } from 'react';
-import { styled, Dialog, IconButton, DialogContent, Box, Chip, Typography, Alert, TextField, FormControlLabel, Checkbox } from '@mui/material';
+import { styled, Dialog, IconButton, DialogContent, Box, Chip, Typography, Alert, TextField, FormControlLabel, Checkbox, CircularProgress } from '@mui/material';
 import { Button } from './Button.js';
 import { CloseRounded, ErrorOutlineRounded, StickyNote2Rounded } from '@mui/icons-material';
@@ -28,9 +28,12 @@ const NavButton = styled(IconButton)(({ theme }) => ({
         borderColor: theme.palette.dark.main, // Keep border dark
     },
 }));
-const Modal = ({ isOpen, onClose, status, description, defaultText, note, acceptSuggestion: initialAcceptSuggestion = true, onAcceptSuggestionChange, onSave, onSubmit, onDeclineWording, onPrevious, onNext, currentPage = 1, totalPages = 1, }) => {
+const Modal = ({ isOpen, onClose, status, description, defaultText, note, onSave, onSubmit, onDeclineWording, onPrevious, onNext, currentPage = 1, totalPages = 1, }) => {
     const [textValue, setTextValue] = useState(defaultText);
     const [useDefaultValue, setUseDefaultValue] = useState(true);
+    const [isLoading, setIsLoading] = useState(false);
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const [isSaving, setIsSaving] = useState(false);
     const handleUseDefaultValueChange = (event) => {
         setUseDefaultValue(event.target.checked);
     };
@@ -61,6 +64,26 @@ const Modal = ({ isOpen, onClose, status, description, defaultText, note, accept
         },
     };
     const statusStyle = statusConfig[status];
+    const handleSave = () => {
+        setIsLoading(true);
+        setIsSaving(true);
+        onSave?.(textValue, useDefaultValue);
+        setTimeout(() => {
+            setIsSaving(false);
+            setIsLoading(false);
+            onClose();
+        }, 1000);
+    };
+    const handleSubmit = () => {
+        setIsLoading(true);
+        setIsSubmitting(true);
+        onSubmit?.(textValue, useDefaultValue);
+        setTimeout(() => {
+            setIsSubmitting(false);
+            setIsLoading(false);
+            onClose();
+        }, 1000);
+    };
     return (jsxs(StyledDialog, { open: isOpen, onClose: onClose, maxWidth: "md", fullWidth: true, children: [jsx(IconButton, { onClick: onClose, sx: {
                     position: 'absolute',
                     top: 16,
@@ -115,22 +138,22 @@ 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, flexWrap: 'wrap' }, children: [jsx(Button, { onClick: onSave, variant: "outline", size: "md", children: "Save" }), jsx(Button, { onClick: onSubmit, variant: "outline", size: "md", sx: {
+                        }, children: [jsxs(Box, { sx: { display: 'flex', gap: 1.5, flexWrap: 'wrap' }, children: [jsx(Button, { onClick: handleSave, variant: "outline", size: "md", disabled: isLoading, children: isSaving ? jsxs(Fragment, { children: [jsx(CircularProgress, { size: 20 }), jsx(Typography, { sx: { paddingLeft: 2 }, children: "Saving..." })] }) : "Save" }), jsx(Button, { onClick: handleSubmit, variant: "outline", size: "md", disabled: isLoading, sx: {
                                             backgroundColor: '#ac46ff52',
                                             '&:hover': {
-                                                backgroundColor: '#ac46ff80', // Darker purple on hover
-                                            }
-                                        }, children: "Submit for review" }), jsx(Button, { onClick: onDeclineWording, variant: "outline", size: "md", sx: {
+                                                backgroundColor: '#ac46ff80',
+                                            },
+                                        }, children: isSubmitting ? jsxs(Fragment, { children: [jsx(CircularProgress, { size: 20 }), jsx(Typography, { sx: { paddingLeft: 2 }, children: "Submitting..." })] }) : "Submit for review" }), jsx(Button, { onClick: onDeclineWording, variant: "outline", size: "md", sx: {
                                             backgroundColor: '#ff464652',
                                             '&:hover': {
                                                 backgroundColor: '#ff464680', // Darker purple on hover
                                             }
-                                        }, children: "Decline wording" })] }), jsxs(Box, { sx: {
+                                        }, disabled: isLoading, children: "Decline wording" })] }), jsxs(Box, { sx: {
                                     display: 'flex',
                                     alignItems: 'center',
                                     gap: 1.5,
                                     justifyContent: { xs: 'space-between', sm: 'flex-end' },
-                                }, children: [jsxs(Typography, { fontWeight: 500, fontSize: "1.125rem", children: [currentPage, "/", totalPages] }), jsx(NavButton, { onClick: onPrevious, "aria-label": "Previous", children: jsx(Typography, { sx: { fontSize: 16, fontWeight: 500 }, children: "Previous" }) }), jsx(NavButton, { onClick: onNext, "aria-label": "Next", children: jsx(Typography, { sx: { fontSize: 16, fontWeight: 500 }, children: "Next" }) })] })] })] })] }));
+                                }, children: [jsxs(Typography, { fontWeight: 500, fontSize: "1.125rem", children: [currentPage, "/", totalPages] }), jsx(NavButton, { onClick: onPrevious, "aria-label": "Previous", disabled: isLoading, children: jsx(Typography, { sx: { fontSize: 16, fontWeight: 500 }, children: "Previous" }) }), jsx(NavButton, { onClick: onNext, "aria-label": "Next", disabled: isLoading, children: jsx(Typography, { sx: { fontSize: 16, fontWeight: 500 }, children: "Next" }) })] })] })] })] }));
 };
 export { Modal };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.js","sources":["../../../../src/components/Modal.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n Dialog,\n DialogContent,\n IconButton,\n Box,\n Typography,\n TextField,\n Checkbox,\n FormControlLabel,\n Alert as MuiAlert,\n Chip,\n styled,\n} from '@mui/material';\nimport { Button } from './Button';\nimport { CloseRounded, ErrorOutlineRounded, StickyNote2Rounded } from '@mui/icons-material';\n\n\ninterface ModalProps {\n isOpen: boolean;\n onClose: () => void;\n status: 'mandatory' \| 'optional' \| 'accepted' \| 'action-required' \| 'action-required-note' \| 'accepted-note';\n description: string;\n defaultText: string;\n note?: string;\n acceptSuggestion?: boolean;\n onAcceptSuggestionChange?: (checked: boolean) => void;\n onSave?: () => void;\n onSubmit?: () => void;\n onDeclineWording?: () => void;\n onPrevious?: () => void;\n onNext?: () => void;\n currentPage?: number;\n totalPages?: number;\n}\n\n\nconst StyledDialog = styled(Dialog)(({ theme }) => ({\n '& .MuiDialog-paper': {\n color: theme.palette.background.default,\n borderRadius: theme.shape.borderRadius,\n maxWidth: '896px',\n width: '100%',\n maxHeight: '90vh',\n },\n}));\n\n\nconst NavButton = styled(IconButton)(({ theme }) => ({\n width: 'auto',\n height: '40px',\n borderRadius: (typeof theme.shape.borderRadius === 'string'\n ? parseInt(theme.shape.borderRadius, 10)\n : theme.shape.borderRadius \|\| 4) * 2,\n border: `2px solid ${theme.palette.dark.main}`,\n backgroundColor: theme.palette.light.main,\n padding: theme.spacing(1, 2),\n '&:hover': {\n backgroundColor: theme.palette.grey[100], // Changed from dark.main to grey[100]\n color: theme.palette.dark.main, // Keep text dark instead of light\n borderColor: theme.palette.dark.main, // Keep border dark\n },\n}));\n\n\n\nexport const Modal: React.FC<ModalProps> = ({\n isOpen,\n onClose,\n status,\n description,\n defaultText,\n note,\n acceptSuggestion: initialAcceptSuggestion = true,\n onAcceptSuggestionChange,\n onSave,\n onSubmit,\n onDeclineWording,\n onPrevious,\n onNext,\n currentPage = 1,\n totalPages = 1,\n}) => {\n const [textValue, setTextValue] = useState(defaultText);\n const [useDefaultValue, setUseDefaultValue] = useState(true);\n\n\n const handleUseDefaultValueChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n setUseDefaultValue(event.target.checked);\n };\n\n\n const statusConfig = {\n mandatory: {\n color: '#F5A623',\n label: 'Mandatory',\n },\n optional: {\n color: '#F5D76E',\n label: 'Optional',\n },\n accepted: {\n color: '#A3D977',\n label: 'Accepted',\n },\n 'action-required': {\n color: '#F56B6B',\n label: 'Action Required',\n },\n 'action-required-note': {\n color: '#F56B6B',\n label: 'Action Required',\n },\n 'accepted-note': {\n color: '#A3D977',\n label: 'Accepted',\n },\n };\n\n\n const statusStyle = statusConfig[status];\n\n\n return (\n <StyledDialog open={isOpen} onClose={onClose} maxWidth=\"md\" fullWidth>\n <IconButton\n onClick={onClose}\n sx={{\n position: 'absolute',\n top: 16,\n right: 16,\n zIndex: 1,\n }}\n >\n <CloseRounded sx={{ fontSize: 24 }} />\n </IconButton>\n\n\n <DialogContent sx={{ p: { xs: 3, sm: 4, md: 6 } }}>\n {/* Status Chip /}\n <Box sx={{ mb: 3 }}>\n <Chip\n label={statusStyle.label.toUpperCase()}\n sx={{\n backgroundColor: statusStyle.color,\n color: status === 'optional' \|\| status === 'mandatory' ? '#4D3019' : '#fff',\n fontWeight: 600,\n fontSize: '0.875rem',\n height: 'auto',\n py: 1,\n borderRadius: 0,\n px: 2,\n }}\n />\n </Box>\n\n\n {/ Description /}\n <Typography sx={{ mb: 3, lineHeight: 1.6, whiteSpace: 'pre-line' }}>\n {description}\n </Typography>\n\n\n {/ Alerts /}\n {status === 'action-required-note' && note && (\n <MuiAlert\n icon={<ErrorOutlineRounded sx={{ fontSize: 20 }} />}\n severity=\"error\"\n sx={{\n mb: 2,\n backgroundColor: '#FDFCEE',\n borderLeft: '4px solid #F56B6B',\n '& .MuiAlert-icon': {\n color: '#F56B6B',\n },\n '& .MuiAlert-message': {\n color: '#4D3019',\n },\n }}\n >\n {note}\n </MuiAlert>\n )}\n\n\n {status === 'accepted-note' && note && (\n <MuiAlert\n icon={<StickyNote2Rounded sx={{ fontSize: 20 }} />}\n severity=\"warning\"\n sx={{\n mb: 2,\n backgroundColor: '#FDFCEE',\n borderLeft: '4px solid #F5D76E',\n '& .MuiAlert-icon': {\n color: '#F5A623',\n },\n '& .MuiAlert-message': {\n color: '#4D3019',\n },\n }}\n >\n {note}\n </MuiAlert>\n )}\n\n\n {/ Text Field /}\n <TextField\n multiline\n rows={6}\n fullWidth\n value={textValue}\n onChange={(e) => setTextValue(e.target.value)}\n disabled={useDefaultValue}\n sx={{\n mb: 2,\n '& .MuiOutlinedInput-root': {\n backgroundColor: useDefaultValue ? 'rgba(0, 0, 0, 0.05)' : '#fff',\n borderRadius: 2,\n },\n }}\n />\n\n\n {/ Checkbox /}\n <FormControlLabel\n control={\n <Checkbox\n checked={useDefaultValue}\n onChange={handleUseDefaultValueChange}\n sx={{\n color: '#AC46FF',\n '&.Mui-checked': {\n color: '#AC46FF',\n },\n }}\n />\n }\n label=\"Use Default Value\"\n sx={{ mb: 3 }}\n />\n\n\n {/ Footer with Buttons and Navigation /}\n <Box\n sx={{\n display: 'flex',\n flexDirection: { xs: 'column', sm: 'row' },\n alignItems: { xs: 'stretch', sm: 'center' },\n justifyContent: 'space-between',\n gap: 2,\n pt: 3,\n borderTop: '1px solid',\n borderColor: 'divider',\n }}\n >\n {/ Action Buttons /}\n <Box sx={{ display: 'flex', gap: 1.5, flexWrap: 'wrap' }}>\n <Button onClick={onSave} variant=\"outline\" size=\"md\">\n Save\n </Button>\n <Button onClick={onSubmit} variant=\"outline\" size=\"md\" sx={{\n backgroundColor: '#ac46ff52',\n '&:hover': {\n backgroundColor: '#ac46ff80', // Darker purple on hover\n }\n }}>\n Submit for review\n </Button>\n <Button onClick={onDeclineWording} variant=\"outline\" size=\"md\" sx={{\n backgroundColor: '#ff464652',\n '&:hover': {\n backgroundColor: '#ff464680', // Darker purple on hover\n }\n }}>\n Decline wording\n </Button>\n </Box>\n\n\n {/ Navigation */}\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n gap: 1.5,\n justifyContent: { xs: 'space-between', sm: 'flex-end' },\n }}\n >\n <Typography fontWeight={500} fontSize=\"1.125rem\">\n {currentPage}/{totalPages}\n </Typography>\n <NavButton onClick={onPrevious} aria-label=\"Previous\">\n <Typography sx={{ fontSize: 16, fontWeight: 500 }}>Previous</Typography>\n </NavButton>\n <NavButton onClick={onNext} aria-label=\"Next\">\n <Typography sx={{ fontSize: 16, fontWeight: 500 }}>Next</Typography>\n </NavButton>\n </Box>\n </Box>\n </DialogContent>\n </StyledDialog>\n );\n};\n"],"names":["_jsxs","_jsx","MuiAlert"],"mappings":"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"}
1	+ {"version":3,"file":"Modal.js","sources":["../../../../src/components/Modal.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport {\n Dialog,\n DialogContent,\n IconButton,\n Box,\n Typography,\n TextField,\n Checkbox,\n FormControlLabel,\n Alert as MuiAlert,\n Chip,\n styled,\n CircularProgress,\n} from '@mui/material';\nimport { Button } from './Button';\nimport { CloseRounded, ErrorOutlineRounded, StickyNote2Rounded } from '@mui/icons-material';\n\n\ninterface ModalProps {\n isOpen: boolean;\n onClose: () => void;\n status: 'mandatory' \| 'optional' \| 'accepted' \| 'action-required' \| 'action-required-note' \| 'accepted-note';\n description: string;\n defaultText: string;\n note?: string;\n onSave?: (fieldValue: string, defaultChecked: boolean) => void;\n onSubmit?: (fieldValue: string, defaultChecked: boolean) => void;\n onDeclineWording?: () => void;\n onPrevious?: () => void;\n onNext?: () => void;\n currentPage?: number;\n totalPages?: number;\n}\n\n\nconst StyledDialog = styled(Dialog)(({ theme }) => ({\n '& .MuiDialog-paper': {\n color: theme.palette.background.default,\n borderRadius: theme.shape.borderRadius,\n maxWidth: '896px',\n width: '100%',\n maxHeight: '90vh',\n },\n}));\n\n\nconst NavButton = styled(IconButton)(({ theme }) => ({\n width: 'auto',\n height: '40px',\n borderRadius: (typeof theme.shape.borderRadius === 'string'\n ? parseInt(theme.shape.borderRadius, 10)\n : theme.shape.borderRadius \|\| 4) * 2,\n border: `2px solid ${theme.palette.dark.main}`,\n backgroundColor: theme.palette.light.main,\n padding: theme.spacing(1, 2),\n '&:hover': {\n backgroundColor: theme.palette.grey[100], // Changed from dark.main to grey[100]\n color: theme.palette.dark.main, // Keep text dark instead of light\n borderColor: theme.palette.dark.main, // Keep border dark\n },\n}));\n\n\n\nexport const Modal: React.FC<ModalProps> = ({\n isOpen,\n onClose,\n status,\n description,\n defaultText,\n note,\n onSave,\n onSubmit,\n onDeclineWording,\n onPrevious,\n onNext,\n currentPage = 1,\n totalPages = 1,\n}) => {\n const [textValue, setTextValue] = useState(defaultText);\n const [useDefaultValue, setUseDefaultValue] = useState(true);\n const [isLoading, setIsLoading] = useState(false);\n const [isSubmitting, setIsSubmitting] = useState(false);\n const [isSaving, setIsSaving] = useState(false);\n\n\n const handleUseDefaultValueChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n setUseDefaultValue(event.target.checked);\n };\n\n\n const statusConfig = {\n mandatory: {\n color: '#F5A623',\n label: 'Mandatory',\n },\n optional: {\n color: '#F5D76E',\n label: 'Optional',\n },\n accepted: {\n color: '#A3D977',\n label: 'Accepted',\n },\n 'action-required': {\n color: '#F56B6B',\n label: 'Action Required',\n },\n 'action-required-note': {\n color: '#F56B6B',\n label: 'Action Required',\n },\n 'accepted-note': {\n color: '#A3D977',\n label: 'Accepted',\n },\n };\n\n\n const statusStyle = statusConfig[status];\n\n const handleSave = () => {\n setIsLoading(true);\n setIsSaving(true);\n onSave?.(textValue, useDefaultValue);\n setTimeout(() => {\n setIsSaving(false);\n setIsLoading(false);\n onClose();\n }, 1000);\n };\n\n const handleSubmit = () => {\n setIsLoading(true);\n setIsSubmitting(true);\n onSubmit?.(textValue, useDefaultValue);\n setTimeout(() => {\n setIsSubmitting(false);\n setIsLoading(false);\n onClose();\n }, 1000);\n };\n\n\n\n return (\n <StyledDialog open={isOpen} onClose={onClose} maxWidth=\"md\" fullWidth>\n <IconButton\n onClick={onClose}\n sx={{\n position: 'absolute',\n top: 16,\n right: 16,\n zIndex: 1,\n }}\n >\n <CloseRounded sx={{ fontSize: 24 }} />\n </IconButton>\n\n\n <DialogContent sx={{ p: { xs: 3, sm: 4, md: 6 } }}>\n {/* Status Chip /}\n <Box sx={{ mb: 3 }}>\n <Chip\n label={statusStyle.label.toUpperCase()}\n sx={{\n backgroundColor: statusStyle.color,\n color: status === 'optional' \|\| status === 'mandatory' ? '#4D3019' : '#fff',\n fontWeight: 600,\n fontSize: '0.875rem',\n height: 'auto',\n py: 1,\n borderRadius: 0,\n px: 2,\n }}\n />\n </Box>\n\n\n {/ Description /}\n <Typography sx={{ mb: 3, lineHeight: 1.6, whiteSpace: 'pre-line' }}>\n {description}\n </Typography>\n\n\n {/ Alerts /}\n {status === 'action-required-note' && note && (\n <MuiAlert\n icon={<ErrorOutlineRounded sx={{ fontSize: 20 }} />}\n severity=\"error\"\n sx={{\n mb: 2,\n backgroundColor: '#FDFCEE',\n borderLeft: '4px solid #F56B6B',\n '& .MuiAlert-icon': {\n color: '#F56B6B',\n },\n '& .MuiAlert-message': {\n color: '#4D3019',\n },\n }}\n >\n {note}\n </MuiAlert>\n )}\n\n\n {status === 'accepted-note' && note && (\n <MuiAlert\n icon={<StickyNote2Rounded sx={{ fontSize: 20 }} />}\n severity=\"warning\"\n sx={{\n mb: 2,\n backgroundColor: '#FDFCEE',\n borderLeft: '4px solid #F5D76E',\n '& .MuiAlert-icon': {\n color: '#F5A623',\n },\n '& .MuiAlert-message': {\n color: '#4D3019',\n },\n }}\n >\n {note}\n </MuiAlert>\n )}\n\n\n {/ Text Field /}\n <TextField\n multiline\n rows={6}\n fullWidth\n value={textValue}\n onChange={(e) => setTextValue(e.target.value)}\n disabled={useDefaultValue}\n sx={{\n mb: 2,\n '& .MuiOutlinedInput-root': {\n backgroundColor: useDefaultValue ? 'rgba(0, 0, 0, 0.05)' : '#fff',\n borderRadius: 2,\n },\n }}\n />\n\n\n {/ Checkbox /}\n <FormControlLabel\n control={\n <Checkbox\n checked={useDefaultValue}\n onChange={handleUseDefaultValueChange}\n sx={{\n color: '#AC46FF',\n '&.Mui-checked': {\n color: '#AC46FF',\n },\n }}\n />\n }\n label=\"Use Default Value\"\n sx={{ mb: 3 }}\n />\n\n\n {/ Footer with Buttons and Navigation /}\n <Box\n sx={{\n display: 'flex',\n flexDirection: { xs: 'column', sm: 'row' },\n alignItems: { xs: 'stretch', sm: 'center' },\n justifyContent: 'space-between',\n gap: 2,\n pt: 3,\n borderTop: '1px solid',\n borderColor: 'divider',\n }}\n >\n {/ Action Buttons /}\n <Box sx={{ display: 'flex', gap: 1.5, flexWrap: 'wrap' }}>\n <Button\n onClick={handleSave}\n variant=\"outline\"\n size=\"md\"\n disabled={isLoading}\n >\n {isSaving ? <><CircularProgress size={20} /><Typography sx={{paddingLeft: 2}}>Saving...</Typography></> : \"Save\"}\n </Button>\n <Button\n onClick={handleSubmit}\n variant=\"outline\"\n size=\"md\"\n disabled={isLoading}\n sx={{\n backgroundColor: '#ac46ff52',\n '&:hover': {\n backgroundColor: '#ac46ff80',\n },\n }}\n >\n {isSubmitting ? <><CircularProgress size={20} /><Typography sx={{paddingLeft: 2}}>Submitting...</Typography></> : \"Submit for review\"}\n </Button>\n <Button onClick={onDeclineWording} variant=\"outline\" size=\"md\" sx={{\n backgroundColor: '#ff464652',\n '&:hover': {\n backgroundColor: '#ff464680', // Darker purple on hover\n }\n }}\n disabled={isLoading}\n >\n Decline wording\n </Button>\n </Box>\n\n\n {/ Navigation */}\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n gap: 1.5,\n justifyContent: { xs: 'space-between', sm: 'flex-end' },\n }}\n >\n <Typography fontWeight={500} fontSize=\"1.125rem\">\n {currentPage}/{totalPages}\n </Typography>\n <NavButton onClick={onPrevious} aria-label=\"Previous\" disabled={isLoading}>\n <Typography sx={{ fontSize: 16, fontWeight: 500 }}>Previous</Typography>\n </NavButton>\n <NavButton onClick={onNext} aria-label=\"Next\" disabled={isLoading}>\n <Typography sx={{ fontSize: 16, fontWeight: 500 }}>Next</Typography>\n </NavButton>\n </Box>\n </Box>\n </DialogContent>\n </StyledDialog>\n );\n};\n"],"names":["_jsxs","_jsx","MuiAlert","_Fragment"],"mappings":"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"}

package/dist/esm/components/PopoverMenu.d.ts ADDED Viewed

@@ -0,0 +1,7 @@
+interface PopoverMenuProps {
+    anchorEl: HTMLElement | null;
+    onClose: () => void;
+    signOut: () => void;
+}
+export default function PopoverMenu({ anchorEl, onClose, signOut, }: PopoverMenuProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/components/PopoverMenu.js ADDED Viewed

@@ -0,0 +1,21 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Menu, MenuItem, ListItemIcon, ListItemText } from '@mui/material';
+import LogoutIcon from '@mui/icons-material/Logout';
+import { useTheme } from '../ThemeProvider.js';
+function PopoverMenu({ anchorEl, onClose, signOut, }) {
+    const theme = useTheme();
+    return (jsx(Menu, { anchorEl: anchorEl, open: Boolean(anchorEl), onClose: onClose, PaperProps: {
+            sx: {
+                backgroundColor: theme.palette.background.paper,
+                color: theme.palette.text.primary,
+            },
+        }, children: jsxs(MenuItem, { onClick: signOut, children: [jsx(ListItemIcon, { children: jsx(LogoutIcon, { sx: { color: theme.palette.primary.main } }) }), jsx(ListItemText, { primary: "Logout", sx: {
+                        color: theme.palette.primary.contrastText,
+                        fontFamily: theme.typography.fontFamily,
+                        fontWeight: theme.typography.button.fontWeight,
+                    } })] }, "logout") }));
+}
+export { PopoverMenu as default };
+//# sourceMappingURL=PopoverMenu.js.map

package/dist/esm/components/PopoverMenu.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"PopoverMenu.js","sources":["../../../../src/components/PopoverMenu.tsx"],"sourcesContent":["import React from 'react';\nimport { Menu, MenuItem, ListItemIcon, ListItemText } from '@mui/material';\nimport LogoutIcon from '@mui/icons-material/Logout';\nimport { useTheme } from '../ThemeProvider';\n\ninterface PopoverMenuProps {\n anchorEl: HTMLElement | null;\n onClose: () => void;\n signOut: () => void;\n}\n\nexport default function PopoverMenu({\n anchorEl,\n onClose,\n signOut,\n}: PopoverMenuProps) {\n const theme = useTheme();\n\n return (\n <Menu\n anchorEl={anchorEl}\n open={Boolean(anchorEl)}\n onClose={onClose}\n PaperProps={{\n sx: {\n backgroundColor: theme.palette.background.paper,\n color: theme.palette.text.primary,\n },\n }}\n >\n <MenuItem key=\"logout\" onClick={signOut}>\n <ListItemIcon>\n <LogoutIcon sx={{ color: theme.palette.primary.main }} />\n </ListItemIcon>\n <ListItemText\n primary=\"Logout\"\n sx={{\n color: theme.palette.primary.contrastText,\n fontFamily: theme.typography.fontFamily,\n fontWeight: theme.typography.button.fontWeight,\n }}\n />\n </MenuItem>\n </Menu>\n );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;AAWc,SAAU,WAAW,CAAC,EAClC,QAAQ,EACR,OAAO,EACP,OAAO,GACU,EAAA;AACjB,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;IAExB,QACEA,IAAC,IAAI,EAAA,EACH,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,OAAO,CAAC,QAAQ,CAAC,EACvB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE;AACV,YAAA,EAAE,EAAE;AACF,gBAAA,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK;AAC/C,gBAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO;AAClC,aAAA;AACF,SAAA,EAAA,QAAA,EAEDC,KAAC,QAAQ,EAAA,EAAc,OAAO,EAAE,OAAO,EAAA,QAAA,EAAA,CACrCD,GAAA,CAAC,YAAY,EAAA,EAAA,QAAA,EACXA,IAAC,UAAU,EAAA,EAAC,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,EAAE,EAAA,CAAI,EAAA,CAC5C,EACfA,GAAA,CAAC,YAAY,EAAA,EACX,OAAO,EAAC,QAAQ,EAChB,EAAE,EAAE;AACF,wBAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,YAAY;AACzC,wBAAA,UAAU,EAAE,KAAK,CAAC,UAAU,CAAC,UAAU;AACvC,wBAAA,UAAU,EAAE,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,UAAU;AAC/C,qBAAA,EAAA,CACD,CAAA,EAAA,EAXU,QAAQ,CAYX,EAAA,CACN;AAEX;;;;"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "ece-docs-components",
-  "version": "1.0.16",
+  "version": "1.0.18",
   "type": "module",
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",