ece-docs-components 1.0.25 → 1.0.27

package/dist/esm/components/DefinitionBox.js

@@ -2,7 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { styled, Box, Typography } from '@mui/material';
 import { useTheme } from '../ThemeProvider.js';
-import { IndeterminateCheckBoxRounded, AddBoxRounded } from '@mui/icons-material';
+import { CloseRounded, AddRounded } from '@mui/icons-material';
 
 const StyledWrapper = styled(Box)(({ theme }) => ({
 // No specific wrapper styles needed, just a container
@@ -13,17 +13,22 @@ const StyledParagraph = styled(Typography)(({ theme }) => ({
     display: 'inline-flex',
     alignItems: 'center',
 }));
-const StyledTermWrapper = styled(Box, {
-    shouldForwardProp: (prop) => prop !== 'isOpen',
-})(({ theme, isOpen }) => ({
+const StyledTermWrapper = styled(Box)(({ theme }) => ({
     position: 'relative',
     display: 'inline-flex',
     alignItems: 'center',
     cursor: 'pointer',
     marginLeft: theme.spacing(0.5), // ml-1
+}));
+const StyledTerm = styled('span', {
+    shouldForwardProp: (prop) => prop !== 'isOpen',
+})(({ theme, isOpen }) => ({
     paddingBottom: '1px', // style={{ paddingBottom: '1px' }}
-    borderBottom: `2px solid ${theme.palette.dark.main}`, // border-b-2
-    backgroundColor: theme.palette.background.default,
+    borderBottom: `2px solid ${isOpen ? theme.palette.secondary.main : theme.palette.dark.main}`, // border-b-2
+    transition: 'border-bottom-color 0.2s', // transition-colors
+    '&:hover': {
+        borderBottomColor: theme.palette.secondary.main, // hover effect
+    },
 }));
 const StyledIconWrapper = styled(Box)(({ theme }) => ({
     display: 'inline-flex',
@@ -35,25 +40,34 @@ const StyledIconWrapper = styled(Box)(({ theme }) => ({
 const StyledDefinitionBox = styled(Box)(({ theme }) => ({
     marginTop: theme.spacing(2), // mt-4
     padding: theme.spacing(2), // p-4
-    borderRadius: 4,
-    border: `1px solid ${theme.palette.dark.main}`,
-    backgroundColor: theme.palette.background.default,
+    borderRadius: (typeof theme.shape.borderRadius === 'string'
+        ? parseInt(theme.shape.borderRadius, 10)
+        : theme.shape.borderRadius || 4) * 2, // rounded-lg
+    border: `1px solid ${theme.palette.dark.main}33`, // border-[#4D3019]/20
+    borderRight: `4px solid ${theme.palette.dark.main}33`, // border-r-4
+    backgroundColor: theme.palette.light.main, // style={{ backgroundColor: '#FDFCEE' }}
 }));
 const StyledDefinitionText = styled(Typography)(({ theme }) => ({
     fontSize: '14px', // text-[14px]
     color: theme.palette.dark.main, // text-[#4D3019]
     lineHeight: 1.5, // leading-relaxed
 }));
-function DefinitionBox({ term, definition }) {
+function DefinitionBox({ term, definition, children }) {
     const theme = useTheme();
     const [isOpen, setIsOpen] = useState(false);
-    return (jsxs(StyledWrapper, { children: [jsx(StyledParagraph, { children: jsxs(StyledTermWrapper, { onClick: () => setIsOpen(!isOpen), isOpen: isOpen, children: [term, jsx(StyledIconWrapper, { children: isOpen ? (jsx(IndeterminateCheckBoxRounded, { sx: {
-                                    fontSize: 16,
-                                    color: theme.palette.text.primary
-                                } })) : (jsx(AddBoxRounded, { sx: {
-                                    fontSize: 16,
-                                    color: theme.palette.text.primary,
-                                } })) })] }) }), isOpen && (jsx(StyledDefinitionBox, { children: jsx(StyledDefinitionText, { children: definition }) }))] }));
+    return (jsxs(StyledWrapper, { children: [jsxs(StyledParagraph, { children: [children, jsxs(StyledTermWrapper, { onClick: () => setIsOpen(!isOpen), children: [jsx(StyledTerm, { isOpen: isOpen, onMouseEnter: (e) => (e.currentTarget.style.borderBottomColor = theme.palette.secondary.main), onMouseLeave: (e) => (e.currentTarget.style.borderBottomColor = isOpen ? theme.palette.secondary.main : theme.palette.dark.main), children: term }), jsx(StyledIconWrapper, { children: isOpen ? (jsx(CloseRounded, { sx: {
+                                        fontSize: 16,
+                                        color: isOpen ? theme.palette.secondary.main : theme.palette.dark.main,
+                                        '&:hover': {
+                                            color: theme.palette.secondary.main
+                                        }
+                                    } })) : (jsx(AddRounded, { sx: {
+                                        fontSize: 16,
+                                        color: theme.palette.dark.main,
+                                        '&:hover': {
+                                            color: theme.palette.secondary.main
+                                        }
+                                    } })) })] })] }), isOpen && (jsx(StyledDefinitionBox, { children: jsx(StyledDefinitionText, { children: definition }) }))] }));
 }
 
 export { DefinitionBox };

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

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

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

@@ -1,6 +1,6 @@
 interface ExpandingBoxProps {
-    term: string;
-    content: string;
+    open: boolean;
+    content: React.ReactNode | React.ReactNode[];
 }
-export declare function ExpandingBox({ term, content }: ExpandingBoxProps): import("react/jsx-runtime").JSX.Element;
+export declare const ExpandingBox: React.FC<ExpandingBoxProps>;
 export {};

package/dist/esm/components/ExpandingBox.js

@@ -1,36 +1,6 @@
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { useState } from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { styled, Box } from '@mui/material';
-import { useTheme } from '../ThemeProvider.js';
-import { IndeterminateCheckBoxRounded, AddBoxRounded } from '@mui/icons-material';
 
-const StyledWrapper = styled(Box)(({ theme, open }) => ({
-    display: 'inline-block',
-    position: 'relative',
-    verticalAlign: 'top', // Prevents shifting
-}));
-const StyledParagraph = styled('span')(({ theme }) => ({
-    color: theme.palette.dark.main,
-    display: 'inline-flex',
-    alignItems: 'center',
-}));
-const StyledTermWrapper = styled(Box)(({ theme, open }) => ({
-    position: 'relative',
-    display: 'inline-flex',
-    alignItems: 'center',
-    cursor: 'pointer',
-    marginLeft: theme.spacing(0.5),
-    paddingBottom: '1px',
-    borderBottom: `2px solid ${theme.palette.dark.main}`,
-    backgroundColor: theme.palette.background.default,
-}));
-const StyledIconWrapper = styled(Box)(({ theme }) => ({
-    display: 'inline-flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    marginLeft: theme.spacing(0.5),
-    transition: 'color 0.2s',
-}));
 const StyledExpandingBox = styled(Box)(({ theme }) => ({
     marginTop: theme.spacing(2),
     padding: theme.spacing(2),
@@ -40,21 +10,11 @@ const StyledExpandingBox = styled(Box)(({ theme }) => ({
     border: `1px solid ${theme.palette.dark.main}`,
     backgroundColor: theme.palette.background.default,
 }));
-function ExpandingBox({ term, content }) {
-    const theme = useTheme();
-    const [open, setOpen] = useState(false);
-    return (jsxs(Fragment, { children: [jsx(StyledWrapper, { open: open, children: jsx(StyledParagraph, { children: jsxs(StyledTermWrapper, { onClick: () => setOpen(!open), open: open, children: [term, jsx(StyledIconWrapper, { children: open ? (jsx(IndeterminateCheckBoxRounded, { sx: {
-                                        fontSize: 16,
-                                        color: theme.palette.text.primary
-                                    } })) : (jsx(AddBoxRounded, { sx: {
-                                        fontSize: 16,
-                                        color: theme.palette.text.primary,
-                                    } })) })] }) }) }), open && (jsx(StyledExpandingBox, { children: jsx(Box, { sx: {
-                        fontSize: '14px',
-                        color: theme.palette.dark.main,
-                        lineHeight: 1.5,
-                    }, dangerouslySetInnerHTML: { __html: content } }) }))] }));
-}
+const ExpandingBox = ({ open, content, }) => {
+    if (!open)
+        return null;
+    return jsx(StyledExpandingBox, { children: content });
+};
 
 export { ExpandingBox };
 //# sourceMappingURL=ExpandingBox.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ExpandingBox.js","sources":["../../../../src/components/ExpandingBox.tsx"],"sourcesContent":["import { useState } from 'react';\r\nimport { Box, styled, Typography } from '@mui/material';\r\nimport { useTheme } from '../ThemeProvider';\r\nimport { AddBoxRounded, IndeterminateCheckBoxRounded } from '@mui/icons-material';\r\n\r\ninterface ExpandingBoxProps {\r\n  term: string;\r\n  content: string;\r\n}\r\n\r\nconst StyledWrapper = styled(Box)<{ open: boolean }>(({ theme, open }) => ({\r\n  display: 'inline-block',\r\n  position: 'relative',\r\n  verticalAlign: 'top', // Prevents shifting\r\n}));\r\n\r\nconst StyledParagraph = styled('span')(({ theme }) => ({\r\n  color: theme.palette.dark.main,\r\n  display: 'inline-flex',\r\n  alignItems: 'center',\r\n}));\r\n\r\nconst StyledTermWrapper = styled(Box)<{ open: boolean }>(({ theme, open }) => ({\r\n  position: 'relative',\r\n  display: 'inline-flex',\r\n  alignItems: 'center',\r\n  cursor: 'pointer',\r\n  marginLeft: theme.spacing(0.5),\r\n  paddingBottom: '1px',\r\n  borderBottom: `2px solid ${theme.palette.dark.main}`,\r\n  backgroundColor: theme.palette.background.default,\r\n}));\r\n\r\nconst StyledIconWrapper = styled(Box)(({ theme }) => ({\r\n  display: 'inline-flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'center',\r\n  marginLeft: theme.spacing(0.5),\r\n  transition: 'color 0.2s',\r\n}));\r\n\r\nconst StyledExpandingBox = styled(Box)(({ theme }) => ({\r\n  marginTop: theme.spacing(2),\r\n  padding: theme.spacing(2),\r\n  borderRadius: (typeof theme.shape.borderRadius === 'string'\r\n    ? parseInt(theme.shape.borderRadius, 10)\r\n    : theme.shape.borderRadius || 4) * 2,\r\n  border: `1px solid ${theme.palette.dark.main}`,\r\n  backgroundColor: theme.palette.background.default,\r\n}));\r\n\r\nexport function ExpandingBox({ term, content }: ExpandingBoxProps) {\r\n  const theme = useTheme();\r\n  const [open, setOpen] = useState(false);\r\n\r\n  return (\r\n    <>\r\n    <StyledWrapper open={open}>\r\n      <StyledParagraph>\r\n        <StyledTermWrapper onClick={() => setOpen(!open)} open={open}>\r\n          {term}\r\n          <StyledIconWrapper>\r\n            {open ? (\r\n              <IndeterminateCheckBoxRounded\r\n                sx={{\r\n                  fontSize: 16,\r\n                  color: theme.palette.text.primary\r\n                }}\r\n              />\r\n            ) : (\r\n              <AddBoxRounded\r\n                sx={{\r\n                  fontSize: 16,\r\n                  color: theme.palette.text.primary,\r\n                }}\r\n              />\r\n            )}\r\n          </StyledIconWrapper>\r\n        </StyledTermWrapper>\r\n      </StyledParagraph>\r\n    </StyledWrapper>\r\n      {open && (\r\n        <StyledExpandingBox>\r\n          <Box\r\n            sx={{\r\n              fontSize: '14px',\r\n              color: theme.palette.dark.main,\r\n              lineHeight: 1.5,\r\n            }}\r\n            dangerouslySetInnerHTML={{ __html: content }}\r\n          />\r\n        </StyledExpandingBox>\r\n      )}\r\n    </>\r\n  );\r\n}\r\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"ExpandingBox.js","sources":["../../../../src/components/ExpandingBox.tsx"],"sourcesContent":["import { Box, styled } from '@mui/material';\ninterface ExpandingBoxProps {\n  open: boolean;\n  content: React.ReactNode | React.ReactNode[];\n}\n\nconst StyledExpandingBox = styled(Box)(({ theme }) => ({\n  marginTop: theme.spacing(2),\n  padding: theme.spacing(2),\n  borderRadius: (typeof theme.shape.borderRadius === 'string'\n    ? parseInt(theme.shape.borderRadius, 10)\n    : theme.shape.borderRadius || 4) * 2,\n  border: `1px solid ${theme.palette.dark.main}`,\n  backgroundColor: theme.palette.background.default,\n}));\n\nexport const ExpandingBox: React.FC<ExpandingBoxProps> = ({\n  open,\n  content,\n}) => {\n\n  if (!open) return null;\n  return <StyledExpandingBox>{content}</StyledExpandingBox>;\n}\n"],"names":["_jsx"],"mappings":";;;AAMA,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AACrD,IAAA,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC3B,IAAA,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IACzB,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,UAAU,CAAC,OAAO;AAClD,CAAA,CAAC,CAAC;AAEI,MAAM,YAAY,GAAgC,CAAC,EACxD,IAAI,EACJ,OAAO,GACR,KAAI;AAEH,IAAA,IAAI,CAAC,IAAI;AAAE,QAAA,OAAO,IAAI;AACtB,IAAA,OAAOA,GAAA,CAAC,kBAAkB,EAAA,EAAA,QAAA,EAAE,OAAO,GAAsB;AAC3D;;;;"}

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

@@ -0,0 +1,7 @@
+interface ExpandingBoxToggleProps {
+    term: string;
+    open: boolean;
+    setOpen: (open: boolean) => void;
+}
+export declare const ExpandingBoxToggle: React.FC<ExpandingBoxToggleProps>;
+export {};

package/dist/esm/components/ExpandingBoxToggle.js

@@ -0,0 +1,45 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { styled, Box } from '@mui/material';
+import { useTheme } from '../ThemeProvider.js';
+import { IndeterminateCheckBoxRounded, AddBoxRounded } from '@mui/icons-material';
+
+const StyledWrapper = styled(Box)(({ theme, open }) => ({
+    display: 'inline-block',
+    position: 'relative',
+    verticalAlign: 'top', // Prevents shifting
+}));
+const StyledParagraph = styled('span')(({ theme }) => ({
+    color: theme.palette.dark.main,
+    display: 'inline-flex',
+    alignItems: 'center',
+}));
+const StyledTermWrapper = styled(Box)(({ theme, open }) => ({
+    position: 'relative',
+    display: 'inline-flex',
+    alignItems: 'center',
+    cursor: 'pointer',
+    marginLeft: theme.spacing(0.5),
+    paddingBottom: '1px',
+    borderBottom: `2px solid ${theme.palette.dark.main}`,
+    backgroundColor: theme.palette.background.default,
+}));
+const StyledIconWrapper = styled(Box)(({ theme }) => ({
+    display: 'inline-flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    marginLeft: theme.spacing(0.5),
+    transition: 'color 0.2s',
+}));
+const ExpandingBoxToggle = ({ term, open, setOpen, }) => {
+    const theme = useTheme();
+    return (jsx(StyledWrapper, { open: open, children: jsx(StyledParagraph, { children: jsxs(StyledTermWrapper, { onClick: () => setOpen(!open), open: open, children: [term, jsx(StyledIconWrapper, { children: open ? (jsx(IndeterminateCheckBoxRounded, { sx: {
+                                fontSize: 16,
+                                color: theme.palette.text.primary
+                            } })) : (jsx(AddBoxRounded, { sx: {
+                                fontSize: 16,
+                                color: theme.palette.text.primary,
+                            } })) })] }) }) }));
+};
+
+export { ExpandingBoxToggle };
+//# sourceMappingURL=ExpandingBoxToggle.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ExpandingBoxToggle.js","sources":["../../../../src/components/ExpandingBoxToggle.tsx"],"sourcesContent":["import { Box, styled } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { AddBoxRounded, IndeterminateCheckBoxRounded } from '@mui/icons-material';\n\ninterface ExpandingBoxToggleProps {\n  term: string;\n  open: boolean;\n  setOpen: (open: boolean) => void;\n}\n\nconst StyledWrapper = styled(Box)<{ open: boolean }>(({ theme, open }) => ({\n  display: 'inline-block',\n  position: 'relative',\n  verticalAlign: 'top', // Prevents shifting\n}));\n\nconst StyledParagraph = styled('span')(({ theme }) => ({\n  color: theme.palette.dark.main,\n  display: 'inline-flex',\n  alignItems: 'center',\n}));\n\nconst StyledTermWrapper = styled(Box)<{ open: boolean }>(({ theme, open }) => ({\n  position: 'relative',\n  display: 'inline-flex',\n  alignItems: 'center',\n  cursor: 'pointer',\n  marginLeft: theme.spacing(0.5),\n  paddingBottom: '1px',\n  borderBottom: `2px solid ${theme.palette.dark.main}`,\n  backgroundColor: theme.palette.background.default,\n}));\n\nconst StyledIconWrapper = styled(Box)(({ theme }) => ({\n  display: 'inline-flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  marginLeft: theme.spacing(0.5),\n  transition: 'color 0.2s',\n}));\n\nexport const ExpandingBoxToggle: React.FC<ExpandingBoxToggleProps> = ({\n  term,\n  open,\n  setOpen,\n}) => {  const theme = useTheme();\n\n  return (\n    <StyledWrapper open={open}>\n      <StyledParagraph>\n        <StyledTermWrapper onClick={() => setOpen(!open)} open={open}>\n          {term}\n          <StyledIconWrapper>\n            {open ? (\n              <IndeterminateCheckBoxRounded\n                sx={{\n                  fontSize: 16,\n                  color: theme.palette.text.primary\n                }}\n              />\n            ) : (\n              <AddBoxRounded\n                sx={{\n                  fontSize: 16,\n                  color: theme.palette.text.primary,\n                }}\n              />\n            )}\n          </StyledIconWrapper>\n        </StyledTermWrapper>\n      </StyledParagraph>\n    </StyledWrapper>\n  );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;AAUA,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAC,CAAoB,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM;AACzE,IAAA,OAAO,EAAE,cAAc;AACvB,IAAA,QAAQ,EAAE,UAAU;IACpB,aAAa,EAAE,KAAK;AACrB,CAAA,CAAC,CAAC;AAEH,MAAM,eAAe,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AACrD,IAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;AAC9B,IAAA,OAAO,EAAE,aAAa;AACtB,IAAA,UAAU,EAAE,QAAQ;AACrB,CAAA,CAAC,CAAC;AAEH,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAoB,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM;AAC7E,IAAA,QAAQ,EAAE,UAAU;AACpB,IAAA,OAAO,EAAE,aAAa;AACtB,IAAA,UAAU,EAAE,QAAQ;AACpB,IAAA,MAAM,EAAE,SAAS;AACjB,IAAA,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;AAC9B,IAAA,aAAa,EAAE,KAAK;IACpB,YAAY,EAAE,aAAa,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,CAAE;AACpD,IAAA,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO;AAClD,CAAA,CAAC,CAAC;AAEH,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AACpD,IAAA,OAAO,EAAE,aAAa;AACtB,IAAA,UAAU,EAAE,QAAQ;AACpB,IAAA,cAAc,EAAE,QAAQ;AACxB,IAAA,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;AAC9B,IAAA,UAAU,EAAE,YAAY;AACzB,CAAA,CAAC,CAAC;AAEI,MAAM,kBAAkB,GAAsC,CAAC,EACpE,IAAI,EACJ,IAAI,EACJ,OAAO,GACR,KAAI;AAAI,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;AAE/B,IAAA,QACEA,GAAA,CAAC,aAAa,IAAC,IAAI,EAAE,IAAI,EAAA,QAAA,EACvBA,GAAA,CAAC,eAAe,EAAA,EAAA,QAAA,EACdC,IAAA,CAAC,iBAAiB,EAAA,EAAC,OAAO,EAAE,MAAM,OAAO,CAAC,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,EAAA,QAAA,EAAA,CACzD,IAAI,EACLD,GAAA,CAAC,iBAAiB,cACf,IAAI,IACHA,IAAC,4BAA4B,EAAA,EAC3B,EAAE,EAAE;AACF,gCAAA,QAAQ,EAAE,EAAE;AACZ,gCAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;6BAC3B,EAAA,CACD,KAEFA,GAAA,CAAC,aAAa,EAAA,EACZ,EAAE,EAAE;AACF,gCAAA,QAAQ,EAAE,EAAE;AACZ,gCAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO;AAClC,6BAAA,EAAA,CACD,CACH,EAAA,CACiB,CAAA,EAAA,CACF,EAAA,CACJ,EAAA,CACJ;AAEpB;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"FileUploadButton.js","sources":["../../../../src/components/FileUploadButton.tsx"],"sourcesContent":["import React from 'react';\r\nimport { Button } from './Button'; // Import your existing styled button component\r\nimport { styled } from '@mui/material/styles';\r\nimport { FileUploadRounded } from '@mui/icons-material';\r\n\r\ninterface FileUploadButtonProps {\r\n  label?: string;\r\n  accept?: string;\r\n  multiple?: boolean;\r\n  onFileSelect?: (files: FileList | null) => void;\r\n  variant?: 'primary' | 'secondary' | 'outline' | 'marked-read' | 'mark-read' | 'danger';\r\n  size?: 'sm' | 'md' | 'lg';\r\n}\r\n\r\nconst HiddenInput = styled('input')({\r\n  display: 'none',\r\n});\r\n\r\nexport const FileUploadButton: React.FC<FileUploadButtonProps> = ({\r\n  label = 'Upload File',\r\n  accept,\r\n  multiple = false,\r\n  onFileSelect,\r\n  variant = 'primary',\r\n  size = 'md',\r\n}) => {\r\n  const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n    const files = event.target.files;\r\n    if (onFileSelect) {\r\n      onFileSelect(files);\r\n    }\r\n  };\r\n\r\n  return (\r\n    <label htmlFor=\"file-upload\">\r\n      <HiddenInput\r\n        id=\"file-upload\"\r\n        type=\"file\"\r\n        accept={accept}\r\n        multiple={multiple}\r\n        onChange={handleFileChange}\r\n      />\r\n      <Button\r\n        component=\"span\"\r\n        variant={variant}\r\n        size={size}\r\n      >\r\n        <FileUploadRounded/>{label}\r\n      </Button>\r\n    </label>\r\n  );\r\n};\r\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;AAcA,MAAM,WAAW,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;AAClC,IAAA,OAAO,EAAE,MAAM;AAChB,CAAA,CAAC;AAEK,MAAM,gBAAgB,GAAoC,CAAC,EAChE,KAAK,GAAG,aAAa,EACrB,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,YAAY,EACZ,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,IAAI,GACZ,KAAI;AACH,IAAA,MAAM,gBAAgB,GAAG,CAAC,KAA0C,KAAI;AACtE,QAAA,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK;QAChC,IAAI,YAAY,EAAE;YAChB,YAAY,CAAC,KAAK,CAAC;QACrB;AACF,IAAA,CAAC;IAED,QACEA,IAAA,CAAA,OAAA,EAAA,EAAO,OAAO,EAAC,aAAa,aAC1BC,GAAA,CAAC,WAAW,EAAA,EACV,EAAE,EAAC,aAAa,EAChB,IAAI,EAAC,MAAM,EACX,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,gBAAgB,EAAA,CAC1B,EACFD,IAAA,CAAC,MAAM,EAAA,EACL,SAAS,EAAC,MAAM,EAChB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EAAA,QAAA,EAAA,CAEVC,GAAA,CAAC,iBAAiB,EAAA,EAAA,CAAE,EAAC,KAAK,CAAA,EAAA,CACnB,CAAA,EAAA,CACH;AAEZ;;;;"}
+{"version":3,"file":"FileUploadButton.js","sources":["../../../../src/components/FileUploadButton.tsx"],"sourcesContent":["import React from 'react';\nimport { Button } from './Button'; // Import your existing styled button component\nimport { styled } from '@mui/material/styles';\nimport { FileUploadRounded } from '@mui/icons-material';\n\ninterface FileUploadButtonProps {\n  label?: string;\n  accept?: string;\n  multiple?: boolean;\n  onFileSelect?: (files: FileList | null) => void;\n  variant?: 'primary' | 'secondary' | 'outline' | 'marked-read' | 'mark-read' | 'danger';\n  size?: 'sm' | 'md' | 'lg';\n}\n\nconst HiddenInput = styled('input')({\n  display: 'none',\n});\n\nexport const FileUploadButton: React.FC<FileUploadButtonProps> = ({\n  label = 'Upload File',\n  accept,\n  multiple = false,\n  onFileSelect,\n  variant = 'primary',\n  size = 'md',\n}) => {\n  const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const files = event.target.files;\n    if (onFileSelect) {\n      onFileSelect(files);\n    }\n  };\n\n  return (\n    <label htmlFor=\"file-upload\">\n      <HiddenInput\n        id=\"file-upload\"\n        type=\"file\"\n        accept={accept}\n        multiple={multiple}\n        onChange={handleFileChange}\n      />\n      <Button\n        component=\"span\"\n        variant={variant}\n        size={size}\n      >\n        <FileUploadRounded/>{label}\n      </Button>\n    </label>\n  );\n};\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;AAcA,MAAM,WAAW,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;AAClC,IAAA,OAAO,EAAE,MAAM;AAChB,CAAA,CAAC;AAEK,MAAM,gBAAgB,GAAoC,CAAC,EAChE,KAAK,GAAG,aAAa,EACrB,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,YAAY,EACZ,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,IAAI,GACZ,KAAI;AACH,IAAA,MAAM,gBAAgB,GAAG,CAAC,KAA0C,KAAI;AACtE,QAAA,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK;QAChC,IAAI,YAAY,EAAE;YAChB,YAAY,CAAC,KAAK,CAAC;QACrB;AACF,IAAA,CAAC;IAED,QACEA,IAAA,CAAA,OAAA,EAAA,EAAO,OAAO,EAAC,aAAa,aAC1BC,GAAA,CAAC,WAAW,EAAA,EACV,EAAE,EAAC,aAAa,EAChB,IAAI,EAAC,MAAM,EACX,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,gBAAgB,EAAA,CAC1B,EACFD,IAAA,CAAC,MAAM,EAAA,EACL,SAAS,EAAC,MAAM,EAChB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EAAA,QAAA,EAAA,CAEVC,GAAA,CAAC,iBAAiB,EAAA,EAAA,CAAE,EAAC,KAAK,CAAA,EAAA,CACnB,CAAA,EAAA,CACH;AAEZ;;;;"}

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

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

@@ -3,6 +3,6 @@ import { TextFieldProps } from '@mui/material';
 interface InputProps extends Omit<TextFieldProps, 'variant' | 'error'> {
     error?: string;
 }
-export declare const StyledLabel: import("@emotion/styled").StyledComponent<import("@mui/material").InputLabelOwnProps & Pick<import("@mui/material").FormLabelOwnProps, "color" | "filled"> & import("@mui/material/OverridableComponent").CommonProps & Omit<React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "disabled" | "color" | "className" | "style" | "classes" | "margin" | "children" | "sx" | "variant" | "size" | "error" | "filled" | "focused" | "required" | "disableAnimation" | "shrink"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const StyledLabel: import("@emotion/styled").StyledComponent<import("@mui/material").InputLabelOwnProps & Pick<import("@mui/material").FormLabelOwnProps, "color" | "filled"> & import("@mui/material/OverridableComponent").CommonProps & Omit<React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "disabled" | "color" | "margin" | "className" | "style" | "classes" | "children" | "variant" | "sx" | "size" | "error" | "filled" | "focused" | "required" | "disableAnimation" | "shrink"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const Input: React.FC<InputProps>;
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sources":["../../../../src/components/Input.tsx"],"sourcesContent":["import React from 'react';\r\nimport { styled, TextField, TextFieldProps, InputLabel } from '@mui/material';\r\n\r\ninterface InputProps extends Omit<TextFieldProps, 'variant' | 'error'> {\r\n  error?: string;\r\n}\r\n\r\nconst InputWrapper = styled('div')(({ theme }) => ({\r\n  width: '100%',\r\n}));\r\n\r\nexport const StyledLabel = styled(InputLabel)(({ theme }) => ({\r\n  fontSize: '0.875rem',\r\n  fontWeight: 500,\r\n  color: theme.palette.dark.main,\r\n  marginBottom: theme.spacing(0.75),\r\n  display: 'block',\r\n  position: 'static',\r\n  transform: 'none',\r\n  '&.Mui-focused': {\r\n    color: theme.palette.dark.main,\r\n  },\r\n}));\r\n\r\nconst StyledTextField = styled(TextField, {\r\n  shouldForwardProp: (prop) => !['errorMessage'].includes(prop as string),\r\n})<{ errorMessage?: string }>(({ theme, errorMessage }) => ({\r\n  width: '100%',\r\n  '& .MuiInputBase-root': {\r\n    backgroundColor: theme.palette.light.main,\r\n    borderRadius: (typeof theme.shape.borderRadius === 'string'\r\n  ? parseInt(theme.shape.borderRadius, 10)\r\n  : theme.shape.borderRadius || 4) * 2,\r\n    fontSize: '1rem',\r\n    color: theme.palette.dark.main,\r\n    minWidth: 0,\r\n    padding: 0, // Remove padding from root\r\n    '& .MuiOutlinedInput-notchedOutline': {\r\n      borderColor: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}33`,\r\n      borderWidth: 2,\r\n    },\r\n    '&:hover .MuiOutlinedInput-notchedOutline': {\r\n      borderColor: errorMessage ? theme.palette.accent.main : theme.palette.primary.main,\r\n      borderWidth: 2,\r\n    },\r\n    '&.Mui-focused .MuiOutlinedInput-notchedOutline': {\r\n      borderWidth: 2,\r\n      borderColor: errorMessage ? theme.palette.accent.main : theme.palette.primary.main,\r\n    },\r\n    '&.Mui-disabled': {\r\n      backgroundColor: `${theme.palette.dark.main}0D`,\r\n      '& .MuiInputBase-input': {\r\n        color: `${theme.palette.dark.main}80`,\r\n        cursor: 'not-allowed',\r\n      },\r\n      '& .MuiOutlinedInput-notchedOutline': {\r\n        borderColor: `${theme.palette.dark.main}33`,\r\n      },\r\n    },\r\n  },\r\n  // Target the actual input element for padding\r\n  '& .MuiInputBase-input': {\r\n    padding: theme.spacing(1, 3),\r\n    [theme.breakpoints.up('sm')]: {\r\n      padding: theme.spacing(1.25, 4),\r\n    },\r\n  },\r\n  '& .MuiFormHelperText-root': {\r\n    marginTop: theme.spacing(0.75),\r\n    fontSize: '0.875rem',\r\n    color: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}99`,\r\n  },\r\n}));\r\n\r\nexport const Input: React.FC<InputProps> = ({\r\n  error,\r\n  fullWidth = false,\r\n  id,\r\n  label,\r\n  ...props\r\n}) => {\r\n  const inputId = id || `input-${Math.random().toString(36).substr(2, 9)}`;\r\n\r\n  return (\r\n    <InputWrapper sx={{ ...(!fullWidth && { width: 'auto' }) }}>\r\n      {label && (\r\n        <StyledLabel htmlFor={inputId}>\r\n          {label}\r\n        </StyledLabel>\r\n      )}\r\n      <StyledTextField\r\n        id={inputId}\r\n        error={!!error}\r\n        helperText={error || props.helperText}\r\n        errorMessage={error}\r\n        fullWidth={fullWidth}\r\n        variant=\"outlined\"\r\n        {...props}\r\n      />\r\n    </InputWrapper>\r\n  );\r\n};\r\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"Input.js","sources":["../../../../src/components/Input.tsx"],"sourcesContent":["import React from 'react';\nimport { styled, TextField, TextFieldProps, InputLabel } from '@mui/material';\n\ninterface InputProps extends Omit<TextFieldProps, 'variant' | 'error'> {\n  error?: string;\n}\n\nconst InputWrapper = styled('div')(({ theme }) => ({\n  width: '100%',\n}));\n\nexport const StyledLabel = styled(InputLabel)(({ theme }) => ({\n  fontSize: '0.875rem',\n  fontWeight: 500,\n  color: theme.palette.dark.main,\n  marginBottom: theme.spacing(0.75),\n  display: 'block',\n  position: 'static',\n  transform: 'none',\n  '&.Mui-focused': {\n    color: theme.palette.dark.main,\n  },\n}));\n\nconst StyledTextField = styled(TextField, {\n  shouldForwardProp: (prop) => !['errorMessage'].includes(prop as string),\n})<{ errorMessage?: string }>(({ theme, errorMessage }) => ({\n  width: '100%',\n  '& .MuiInputBase-root': {\n    backgroundColor: theme.palette.light.main,\n    borderRadius: (typeof theme.shape.borderRadius === 'string'\n  ? parseInt(theme.shape.borderRadius, 10)\n  : theme.shape.borderRadius || 4) * 2,\n    fontSize: '1rem',\n    color: theme.palette.dark.main,\n    minWidth: 0,\n    padding: 0, // Remove padding from root\n    '& .MuiOutlinedInput-notchedOutline': {\n      borderColor: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}33`,\n      borderWidth: 2,\n    },\n    '&:hover .MuiOutlinedInput-notchedOutline': {\n      borderColor: errorMessage ? theme.palette.accent.main : theme.palette.primary.main,\n      borderWidth: 2,\n    },\n    '&.Mui-focused .MuiOutlinedInput-notchedOutline': {\n      borderWidth: 2,\n      borderColor: errorMessage ? theme.palette.accent.main : theme.palette.primary.main,\n    },\n    '&.Mui-disabled': {\n      backgroundColor: `${theme.palette.dark.main}0D`,\n      '& .MuiInputBase-input': {\n        color: `${theme.palette.dark.main}80`,\n        cursor: 'not-allowed',\n      },\n      '& .MuiOutlinedInput-notchedOutline': {\n        borderColor: `${theme.palette.dark.main}33`,\n      },\n    },\n  },\n  // Target the actual input element for padding\n  '& .MuiInputBase-input': {\n    padding: theme.spacing(1, 3),\n    [theme.breakpoints.up('sm')]: {\n      padding: theme.spacing(1.25, 4),\n    },\n  },\n  '& .MuiFormHelperText-root': {\n    marginTop: theme.spacing(0.75),\n    fontSize: '0.875rem',\n    color: errorMessage ? theme.palette.accent.main : `${theme.palette.dark.main}99`,\n  },\n}));\n\nexport const Input: React.FC<InputProps> = ({\n  error,\n  fullWidth = false,\n  id,\n  label,\n  ...props\n}) => {\n  const inputId = id || `input-${Math.random().toString(36).substr(2, 9)}`;\n\n  return (\n    <InputWrapper sx={{ ...(!fullWidth && { width: 'auto' }) }}>\n      {label && (\n        <StyledLabel htmlFor={inputId}>\n          {label}\n        </StyledLabel>\n      )}\n      <StyledTextField\n        id={inputId}\n        error={!!error}\n        helperText={error || props.helperText}\n        errorMessage={error}\n        fullWidth={fullWidth}\n        variant=\"outlined\"\n        {...props}\n      />\n    </InputWrapper>\n  );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/Modal.js

@@ -1,8 +1,8 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { useState, useEffect } from 'react';
-import { styled, Dialog, IconButton, DialogContent, Box, Chip, Typography, TextField, FormControlLabel, Checkbox, CircularProgress } from '@mui/material';
+import { styled, Dialog, IconButton, useTheme, DialogContent, Box, Chip, Typography, TextField, FormControlLabel, Checkbox, CircularProgress } from '@mui/material';
 import { Button } from './Button.js';
-import { CloseRounded, InfoOutlineRounded, ArticleRounded } from '@mui/icons-material';
+import { CloseRounded, InfoOutlineRounded, ArticleRounded, ArrowBackIosRounded, ArrowForwardIosRounded } from '@mui/icons-material';
 import { Alert } from './Alert.js';
 import { toast } from 'react-toastify';
 
@@ -29,13 +29,11 @@ const StyledDialog = styled(Dialog)(({ theme }) => ({
     },
 }));
 const NavButton = styled(IconButton)(({ theme }) => ({
-    width: 'auto',
+    width: '40px',
     height: '40px',
-    borderRadius: (typeof theme.shape.borderRadius === 'string'
-        ? parseInt(theme.shape.borderRadius, 10)
-        : theme.shape.borderRadius || 4) * 2,
+    borderRadius: 999,
     border: `2px solid ${theme.palette.dark.main}`,
-    backgroundColor: theme.palette.light.main,
+    backgroundColor: '#fff',
     padding: theme.spacing(1, 2),
     '&:hover': {
         backgroundColor: theme.palette.grey[100], // Changed from dark.main to grey[100]
@@ -77,6 +75,7 @@ const Modal = ({ isOpen, onClose, status, requirementType, description, value, d
     const [useDefaultValue, setUseDefaultValue] = useState(true);
     const [isSaving, setIsSaving] = useState(false);
     const [isSubmitting, setIsSubmitting] = useState(false);
+    const theme = useTheme();
     useEffect(() => {
         if (variableState === (VariableState.Pending || VariableState.Draft)) {
             setUseDefaultValue(false);
@@ -145,7 +144,9 @@ const Modal = ({ isOpen, onClose, status, requirementType, description, value, d
                     zIndex: 1,
                 }, children: jsx(CloseRounded, { sx: { fontSize: 24 } }) }), jsxs(DialogContent, { sx: { p: { xs: 3, sm: 4, md: 6 } }, children: [jsxs(Box, { sx: { mb: 3 }, children: [jsx(Chip, { label: requirementTypeStyle.label.toUpperCase(), sx: {
                                     mr: 3,
+                                    border: '3px solid',
                                     backgroundColor: requirementTypeStyle.color,
+                                    borderColor: requirementTypeStyle.color,
                                     color: '#4D3019',
                                     fontWeight: 600,
                                     fontSize: '0.875rem',
@@ -155,7 +156,9 @@ const Modal = ({ isOpen, onClose, status, requirementType, description, value, d
                                     px: 2,
                                 } }), jsx(Chip, { label: statusStyle.label.toUpperCase(), sx: {
                                     mr: 3,
-                                    backgroundColor: statusStyle.color,
+                                    border: '3px solid',
+                                    backgroundColor: '#FDFCEE',
+                                    borderColor: statusStyle.color,
                                     color: '#4D3019',
                                     fontWeight: 600,
                                     fontSize: '0.875rem',
@@ -190,12 +193,13 @@ const Modal = ({ isOpen, onClose, status, requirementType, description, value, d
                             pt: 3,
                             borderTop: '1px solid',
                             borderColor: 'divider',
-                        }, children: [jsxs(Box, { sx: { display: 'flex', gap: 1.5, flexWrap: 'wrap' }, children: [jsx(Button, { onClick: handleSave, variant: "outline", size: "md", disabled: canSubmitSave, 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: canSubmitSave, sx: {
+                        }, children: [jsxs(Box, { sx: { display: 'flex', gap: 1.5, flexWrap: 'wrap' }, children: [useDefaultValue === false ?
+                                        (jsx(Button, { onClick: handleSave, variant: "outline", size: "md", disabled: canSubmitSave, children: isSaving ? jsxs(Fragment, { children: [jsx(CircularProgress, { size: 20 }), jsx(Typography, { sx: { paddingLeft: 2 }, children: "Saving..." })] }) : "Save" })) : (jsx(Fragment, {})), jsx(Button, { onClick: handleSubmit, variant: "outline", size: "md", disabled: canSubmitSave, sx: {
                                             backgroundColor: '#ac46ff52',
                                             '&:hover': {
                                                 backgroundColor: '#ac46ff80',
                                             },
-                                        }, children: isSubmitting ? jsxs(Fragment, { children: [jsx(CircularProgress, { size: 20 }), jsx(Typography, { sx: { paddingLeft: 2 }, children: "Submitting..." })] }) : "Submit for review" }), variableReqType === RequirementType.Optional ?
+                                        }, children: isSubmitting ? jsxs(Fragment, { children: [jsx(CircularProgress, { size: 20 }), jsx(Typography, { sx: { paddingLeft: 2 }, children: "Submitting..." })] }) : "Submit for review" }), variableReqType === RequirementType.Optional || useDefaultValue === false ?
                                         (jsx(Button, { onClick: onDeclineWording, variant: "outline", size: "md", sx: {
                                                 backgroundColor: '#ff464652',
                                                 '&:hover': {
@@ -207,7 +211,7 @@ const Modal = ({ isOpen, onClose, status, requirementType, description, value, d
                                     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", 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" }) })] })] })] })] }));
+                                }, children: [currentPage !== 1 && jsx(NavButton, { onClick: onPrevious, "aria-label": "Previous", disabled: isLoading, children: jsx(ArrowBackIosRounded, { sx: { fontSize: 20, color: theme.palette.text.primary } }) }), currentPage !== totalPages && jsx(NavButton, { onClick: onNext, "aria-label": "Next", disabled: isLoading, children: jsx(ArrowForwardIosRounded, { sx: { fontSize: 20, color: theme.palette.text.primary } }) }), jsxs(Typography, { fontWeight: 500, fontSize: "1.125rem", children: [currentPage, "/", totalPages] })] })] })] })] }));
 };
 
 export { Modal };