ece-docs-components 1.0.89 → 1.0.91

package/dist/cjs/_virtual/index8.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var lib = {};
+var cjs = {};
 
-exports.__exports = lib;
+exports.__exports = cjs;
 //# sourceMappingURL=index8.js.map

package/dist/cjs/_virtual/index9.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var cjs = {};
+var lib = {};
 
-exports.__exports = cjs;
+exports.__exports = lib;
 //# sourceMappingURL=index9.js.map

package/dist/cjs/components/Alert.js

@@ -5,50 +5,61 @@ var material = require('@mui/material');
 var iconsMaterial = require('@mui/icons-material');
 
 const StyledAlert = material.styled(material.Alert)(({ theme, customvariant }) => {
-    const { alertColors, text } = theme.palette;
     const variants = {
-        info: { backgroundColor: alertColors.info.background, borderColor: alertColors.info.border, color: alertColors.info.color },
-        success: { backgroundColor: alertColors.success.background, borderColor: alertColors.success.border, color: alertColors.success.color },
+        info: {
+            backgroundColor: '#F8F0FC',
+            borderColor: '#C269FA',
+            color: '#4D3019',
+        },
+        success: {
+            backgroundColor: '#f0fdf4',
+            borderColor: '#bbf7d0',
+            color: '#14532d',
+        },
         warning: {
-            backgroundColor: alertColors.warning.background,
-            borderColor: alertColors.warning.border,
-            color: alertColors.warning.color,
+            backgroundColor: '#fefce8',
+            borderColor: '#fef08a',
+            color: '#713f12',
         },
         error: {
-            backgroundColor: alertColors.error.background,
-            borderColor: alertColors.error.border,
-            color: alertColors.error.color,
+            backgroundColor: '#fef2f2',
+            borderColor: '#fecaca',
+            color: '#7f1d1d',
+        },
+        'note-internallink': {
+            backgroundColor: '#FDFCEE',
+            borderColor: '#ECE8DF',
+            color: '#4D3019',
         },
-        'note-internallink': { backgroundColor: alertColors.noteInternalLink.background, borderColor: alertColors.noteInternalLink.border, color: alertColors.noteInternalLink.color },
         'note-externallink': {
-            backgroundColor: alertColors.noteExternalLink.background,
-            borderColor: alertColors.noteExternalLink.border,
-            color: alertColors.noteExternalLink.color,
+            backgroundColor: '#FDFCEE',
+            borderColor: '#ECE8DF',
+            color: '#4D3019',
         },
         'note': {
-            backgroundColor: alertColors.note.background,
-            borderColor: alertColors.note.border,
-            color: alertColors.note.color,
+            backgroundColor: '#FDFCEE',
+            borderColor: '#ECE8DF',
+            color: '#4D3019',
         },
         'note-important': {
-            backgroundColor: alertColors.noteImportant.background,
-            borderColor: alertColors.noteImportant.border,
-            color: alertColors.noteImportant.color,
+            backgroundColor: '#FDEDED',
+            borderColor: '#EDA6A6',
+            color: '#5F2120',
         },
         'note-task': {
-            backgroundColor: alertColors.noteTask.background,
-            borderColor: alertColors.noteTask.border,
-            color: alertColors.noteTask.color,
+            backgroundColor: '#FFF4E5',
+            borderColor: '#F9C18F',
+            color: '#4D3019',
         },
         'note-assurance': {
-            backgroundColor: alertColors.noteAssurance.background,
-            borderColor: alertColors.noteAssurance.border,
-            color: alertColors.noteAssurance.color,
+            backgroundColor: '#FFF4E5',
+            borderColor: '#F9C18F',
+            color: '#4D3019',
         },
         'note-share': {
-            backgroundColor: alertColors.noteShare.background,
-            borderColor: alertColors.noteShare.border,
-            color: alertColors.noteShare.color,
+            backgroundColor: '#F8F0FC',
+            borderColor: '#C269FA',
+            color: '#4D3019',
         },
         custom: {
             backgroundColor: theme.palette.light.main,

package/dist/cjs/components/Alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","sources":["../../../../src/components/Alert.tsx"],"sourcesContent":["\r\n\r\nimport React from 'react';\r\nimport { Alert as MuiAlert, AlertProps as MuiAlertProps, styled, SxProps, Theme } from '@mui/material';\r\nimport { ErrorOutlineRounded, HighlightOffRounded, InfoOutlineRounded, LinkRounded, NoteOutlined, OpenInNewOutlined, TaskAltRounded } from '@mui/icons-material';\r\n\r\ninterface AlertProps {\r\n  variant?: 'info' |\r\n            'success' |\r\n            'warning' |\r\n            'error' |\r\n            'note-internallink' |\r\n            'note-externallink' |\r\n            'note-important' |\r\n            'note' |\r\n            'note-assurance' |\r\n            'note-share' |\r\n            'note-task' |\r\n            'custom';\r\n  children: React.ReactNode;\r\n  className?: string;\r\n  icon?: boolean | React.ReactNode; // Allow React node\r\n  sx?: SxProps<Theme>; \r\n}\r\n\r\nconst StyledAlert = styled(MuiAlert)<{ customvariant?: string }>(({ theme, customvariant }) => {\r\n  const { alertColors, text } = theme.palette;\r\n  const variants = {\r\n    info: { backgroundColor: alertColors.info.background, borderColor: alertColors.info.border, color: alertColors.info.color },\r\n    success: { backgroundColor: alertColors.success.background, borderColor: alertColors.success.border, color: alertColors.success.color },\r\n    warning: {\r\n      backgroundColor: alertColors.warning.background,\r\n      borderColor: alertColors.warning.border,\r\n      color: alertColors.warning.color,\r\n    },\r\n    error: {\r\n      backgroundColor: alertColors.error.background,\r\n      borderColor: alertColors.error.border,\r\n      color: alertColors.error.color,\r\n    },\r\n    'note-internallink': { backgroundColor: alertColors.noteInternalLink.background, borderColor: alertColors.noteInternalLink.border, color: alertColors.noteInternalLink.color },\r\n    'note-externallink': {\r\n      backgroundColor: alertColors.noteExternalLink.background,\r\n      borderColor: alertColors.noteExternalLink.border,\r\n      color: alertColors.noteExternalLink.color,\r\n    },\r\n    'note': {\r\n      backgroundColor: alertColors.note.background,\r\n      borderColor: alertColors.note.border,\r\n      color: alertColors.note.color,\r\n    },\r\n    'note-important': {\r\n      backgroundColor: alertColors.noteImportant.background,\r\n      borderColor: alertColors.noteImportant.border,\r\n      color: alertColors.noteImportant.color,\r\n    },\r\n    'note-task': {\r\n      backgroundColor: alertColors.noteTask.background,\r\n      borderColor: alertColors.noteTask.border,\r\n      color: alertColors.noteTask.color,\r\n    },\r\n    'note-assurance': {\r\n      backgroundColor: alertColors.noteAssurance.background,\r\n      borderColor: alertColors.noteAssurance.border,\r\n      color: alertColors.noteAssurance.color,\r\n    },\r\n    'note-share': {\r\n      backgroundColor: alertColors.noteShare.background,\r\n      borderColor: alertColors.noteShare.border,\r\n      color: alertColors.noteShare.color,\r\n    },\r\n    custom: {\r\n      backgroundColor: theme.palette.light.main,\r\n      borderColor: `${theme.palette.dark.main}33`,\r\n      color: theme.palette.dark.main,\r\n    },\r\n  };\r\n\r\n  const variantKey = customvariant as keyof typeof variants || 'info';\r\n  const style = variants[variantKey];\r\n\r\n  return {\r\n    display: 'flex',\r\n    alignItems: 'flex-start',\r\n    gap: theme.spacing(1.5),\r\n    padding: theme.spacing(2),\r\n    marginBottom: theme.spacing(1.5),\r\n    overflow: 'visible',\r\n    maxHeight: 'none',\r\n    fontSize: '1rem',\r\n    border: `1px solid ${style.borderColor}`,\r\n    borderRadius: (typeof theme.shape.borderRadius === 'string'\r\n  ? parseInt(theme.shape.borderRadius, 10)\r\n  : theme.shape.borderRadius || 4) * 2,\r\n    backgroundColor: style.backgroundColor,\r\n    color: style.color,\r\n    '& .MuiAlert-icon': {\r\n      marginRight: 0,\r\n      padding: 0,\r\n      marginTop: '2px',\r\n    },\r\n    '& .MuiAlert-message': {\r\n      padding: 0,\r\n      flex: 1,\r\n      overflow: 'visible',\r\n      maxHeight: 'none',\r\n    },\r\n  };\r\n});\r\n\r\nexport const Alert: React.FC<AlertProps> = ({\r\n  variant = 'info',\r\n  children,\r\n  className = '',\r\n  icon = true,\r\n  sx,\r\n}) => {\r\n  const iconMap = {\r\n    info: <InfoOutlineRounded sx={{fontSize: 20, color:'#C571FA'}} />,\r\n    success: <TaskAltRounded sx={{fontSize: 20}} />,\r\n    warning: <ErrorOutlineRounded sx={{fontSize: 20}} />,\r\n    error: <HighlightOffRounded  sx={{fontSize: 20}} />,\r\n    'note-internallink': <LinkRounded sx={{fontSize: 20, color:'#4D3019'}} />,\r\n    'note-externallink': <OpenInNewOutlined sx={{fontSize: 20, color:'#4D3019'}} />,\r\n    'note': <NoteOutlined sx={{fontSize: 20, color:'#4D3019'}} />,\r\n    'note-important': <InfoOutlineRounded sx={{fontSize: 20, color:'#D32F2F'}} />,\r\n    'note-assurance': <TaskAltRounded sx={{fontSize: 20, color:'#FF9800'}} />,\r\n    'note-task': <TaskAltRounded sx={{fontSize: 20, color:'#FF9800'}} />,\r\n    'note-share': <InfoOutlineRounded sx={{fontSize: 20, color:'#C571FA'}} />,\r\n    custom: <InfoOutlineRounded sx={{fontSize: 20}} />,\r\n  };\r\n\r\n  const severityMap: Record<string, MuiAlertProps['severity'] | undefined> = {\r\n    info: 'info',\r\n    success: 'success',\r\n    warning: 'warning',\r\n    error: 'error',\r\n    custom: 'info',\r\n    'note-internallink': undefined,\r\n    'note-externallink': undefined,\r\n    'note-important': undefined,\r\n    'note': undefined,\r\n    'note-task': undefined,\r\n    'note-assurance': undefined,\r\n    'note-share': undefined,\r\n  };\r\n\r\n\r\n  const getIcon = () => {\r\n    if (icon === false) return false;\r\n    if (icon === true) return iconMap[variant];\r\n    return icon; // Custom icon passed\r\n  };\r\n\r\n  return (\r\n    <StyledAlert\r\n      customvariant={variant}\r\n      severity={severityMap[variant]}\r\n      icon={getIcon()}\r\n      className={className}\r\n      sx={sx}\r\n    >\r\n      {children}\r\n    </StyledAlert>\r\n  );\r\n};"],"names":["styled","MuiAlert","_jsx","InfoOutlineRounded","TaskAltRounded","ErrorOutlineRounded","HighlightOffRounded","LinkRounded","OpenInNewOutlined","NoteOutlined"],"mappings":"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"}
+{"version":3,"file":"Alert.js","sources":["../../../../src/components/Alert.tsx"],"sourcesContent":["\r\n\r\nimport React from 'react';\r\nimport { Alert as MuiAlert, AlertProps as MuiAlertProps, styled, SxProps, Theme } from '@mui/material';\r\nimport { ErrorOutlineRounded, HighlightOffRounded, InfoOutlineRounded, LinkRounded, NoteOutlined, OpenInNewOutlined, TaskAltRounded } from '@mui/icons-material';\r\n\r\ninterface AlertProps {\r\n  variant?: 'info' |\r\n            'success' |\r\n            'warning' |\r\n            'error' |\r\n            'note-internallink' |\r\n            'note-externallink' |\r\n            'note-important' |\r\n            'note' |\r\n            'note-assurance' |\r\n            'note-share' |\r\n            'note-task' |\r\n            'custom';\r\n  children: React.ReactNode;\r\n  className?: string;\r\n  icon?: boolean | React.ReactNode; // Allow React node\r\n  sx?: SxProps<Theme>; \r\n}\r\n\r\nconst StyledAlert = styled(MuiAlert)<{ customvariant?: string }>(({ theme, customvariant }) => {\r\n  const variants = {\r\n    info: {\r\n      backgroundColor: '#F8F0FC',\r\n      borderColor: '#C269FA',\r\n      color: '#4D3019',\r\n    },\r\n    success: {\r\n      backgroundColor: '#f0fdf4',\r\n      borderColor: '#bbf7d0',\r\n      color: '#14532d',\r\n    },\r\n    warning: {\r\n      backgroundColor: '#fefce8',\r\n      borderColor: '#fef08a',\r\n      color: '#713f12',\r\n    },\r\n    error: {\r\n      backgroundColor: '#fef2f2',\r\n      borderColor: '#fecaca',\r\n      color: '#7f1d1d',\r\n    },\r\n    'note-internallink': {\r\n      backgroundColor: '#FDFCEE',\r\n      borderColor: '#ECE8DF',\r\n      color: '#4D3019',\r\n    },\r\n    'note-externallink': {\r\n      backgroundColor: '#FDFCEE',\r\n      borderColor: '#ECE8DF',\r\n      color: '#4D3019',\r\n    },\r\n    'note': {\r\n      backgroundColor: '#FDFCEE',\r\n      borderColor: '#ECE8DF',\r\n      color: '#4D3019',\r\n    },\r\n    'note-important': {\r\n      backgroundColor: '#FDEDED',\r\n      borderColor: '#EDA6A6',\r\n      color: '#5F2120',\r\n    },\r\n    'note-task': {\r\n      backgroundColor: '#FFF4E5',\r\n      borderColor: '#F9C18F',\r\n      color: '#4D3019',\r\n    },\r\n    'note-assurance': {\r\n      backgroundColor: '#FFF4E5',\r\n      borderColor: '#F9C18F',\r\n      color: '#4D3019',\r\n    },\r\n    'note-share': {\r\n      backgroundColor: '#F8F0FC',\r\n      borderColor: '#C269FA',\r\n      color: '#4D3019',\r\n    },\r\n    custom: {\r\n      backgroundColor: theme.palette.light.main,\r\n      borderColor: `${theme.palette.dark.main}33`,\r\n      color: theme.palette.dark.main,\r\n    },\r\n  };\r\n\r\n  const variantKey = customvariant as keyof typeof variants || 'info';\r\n  const style = variants[variantKey];\r\n\r\n  return {\r\n    display: 'flex',\r\n    alignItems: 'flex-start',\r\n    gap: theme.spacing(1.5),\r\n    padding: theme.spacing(2),\r\n    marginBottom: theme.spacing(1.5),\r\n    overflow: 'visible',\r\n    maxHeight: 'none',\r\n    fontSize: '1rem',\r\n    border: `1px solid ${style.borderColor}`,\r\n    borderRadius: (typeof theme.shape.borderRadius === 'string'\r\n  ? parseInt(theme.shape.borderRadius, 10)\r\n  : theme.shape.borderRadius || 4) * 2,\r\n    backgroundColor: style.backgroundColor,\r\n    color: style.color,\r\n    '& .MuiAlert-icon': {\r\n      marginRight: 0,\r\n      padding: 0,\r\n      marginTop: '2px',\r\n    },\r\n    '& .MuiAlert-message': {\r\n      padding: 0,\r\n      flex: 1,\r\n      overflow: 'visible',\r\n      maxHeight: 'none',\r\n    },\r\n  };\r\n});\r\n\r\nexport const Alert: React.FC<AlertProps> = ({\r\n  variant = 'info',\r\n  children,\r\n  className = '',\r\n  icon = true,\r\n  sx,\r\n}) => {\r\n  const iconMap = {\r\n    info: <InfoOutlineRounded sx={{fontSize: 20, color:'#C571FA'}} />,\r\n    success: <TaskAltRounded sx={{fontSize: 20}} />,\r\n    warning: <ErrorOutlineRounded sx={{fontSize: 20}} />,\r\n    error: <HighlightOffRounded  sx={{fontSize: 20}} />,\r\n    'note-internallink': <LinkRounded sx={{fontSize: 20, color:'#4D3019'}} />,\r\n    'note-externallink': <OpenInNewOutlined sx={{fontSize: 20, color:'#4D3019'}} />,\r\n    'note': <NoteOutlined sx={{fontSize: 20, color:'#4D3019'}} />,\r\n    'note-important': <InfoOutlineRounded sx={{fontSize: 20, color:'#D32F2F'}} />,\r\n    'note-assurance': <TaskAltRounded sx={{fontSize: 20, color:'#FF9800'}} />,\r\n    'note-task': <TaskAltRounded sx={{fontSize: 20, color:'#FF9800'}} />,\r\n    'note-share': <InfoOutlineRounded sx={{fontSize: 20, color:'#C571FA'}} />,\r\n    custom: <InfoOutlineRounded sx={{fontSize: 20}} />,\r\n  };\r\n\r\n  const severityMap: Record<string, MuiAlertProps['severity'] | undefined> = {\r\n    info: 'info',\r\n    success: 'success',\r\n    warning: 'warning',\r\n    error: 'error',\r\n    custom: 'info',\r\n    'note-internallink': undefined,\r\n    'note-externallink': undefined,\r\n    'note-important': undefined,\r\n    'note': undefined,\r\n    'note-task': undefined,\r\n    'note-assurance': undefined,\r\n    'note-share': undefined,\r\n  };\r\n\r\n\r\n  const getIcon = () => {\r\n    if (icon === false) return false;\r\n    if (icon === true) return iconMap[variant];\r\n    return icon; // Custom icon passed\r\n  };\r\n\r\n  return (\r\n    <StyledAlert\r\n      customvariant={variant}\r\n      severity={severityMap[variant]}\r\n      icon={getIcon()}\r\n      className={className}\r\n      sx={sx}\r\n    >\r\n      {children}\r\n    </StyledAlert>\r\n  );\r\n};"],"names":["styled","MuiAlert","_jsx","InfoOutlineRounded","TaskAltRounded","ErrorOutlineRounded","HighlightOffRounded","LinkRounded","OpenInNewOutlined","NoteOutlined"],"mappings":"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"}

package/dist/cjs/components/Breadcrumb.js

@@ -40,7 +40,7 @@ const DropdownButton = material.styled("button")(({ theme }) => ({
         borderColor: `${theme.palette.dark.main}4D`,
     },
     [theme.breakpoints.down("sm")]: {
-        width: '100%',
+        width: "100%",
         padding: theme.spacing(0.75, 1),
         gap: theme.spacing(0.5),
     },
@@ -92,8 +92,8 @@ const Breadcrumb = ({ items, currentItem, dropdownItems = [], onItemSelect, onNa
         const { scrollLeft, scrollWidth, clientWidth } = el;
         const atStart = scrollLeft === 0;
         const atEnd = scrollLeft + clientWidth >= scrollWidth - 1;
-        const left = atStart ? 'black' : 'transparent';
-        const right = atEnd ? 'black' : 'transparent';
+        const left = atStart ? "black" : "transparent";
+        const right = atEnd ? "black" : "transparent";
         const mask = `linear-gradient(to right, ${left}, black 30px, black calc(100% - 30px), ${right})`;
         el.style.maskImage = mask;
         el.style.webkitMaskImage = mask;
@@ -103,11 +103,11 @@ const Breadcrumb = ({ items, currentItem, dropdownItems = [], onItemSelect, onNa
         if (!el)
             return;
         updateMask(el); // set on mount
-        el.addEventListener('scroll', () => updateMask(el));
-        return () => el.removeEventListener('scroll', () => updateMask(el));
+        el.addEventListener("scroll", () => updateMask(el));
+        return () => el.removeEventListener("scroll", () => updateMask(el));
     }, []);
     React.useEffect(() => {
-        endRef.current?.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
+        endRef.current?.scrollIntoView({ behavior: "smooth", block: "nearest" });
     }, [items]);
     const handleNavigation = (path) => {
         if (onNavigate) {
@@ -143,13 +143,22 @@ const Breadcrumb = ({ items, currentItem, dropdownItems = [], onItemSelect, onNa
                         minWidth: 0,
                         scrollbarWidth: "none",
                         "&::-webkit-scrollbar": { display: "none" },
-                    }, children: items.map((item) => (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsx(iconsMaterial.ChevronRightRounded, {}), jsxRuntime.jsx(material.Typography, { onClick: () => {
-                                    handleNavigation(item.href);
+                    }, children: items.map((item) => (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsx(iconsMaterial.ChevronRightRounded, {}), item.label === currentItem ? (jsxRuntime.jsx(material.Typography, { sx: {
+                                    fontWeight: 700,
+                                    whiteSpace: "nowrap",
+                                }, children: item?.label ?? "" })) : (jsxRuntime.jsx(material.Link
+                            // href={item.href as string}
+                            , { 
+                                // href={item.href as string}
+                                underline: item.label === currentItem ? "none" : "always", onClick: () => {
+                                    if (item.label !== currentItem)
+                                        handleNavigation(item.href);
                                 }, sx: {
-                                    fontWeight: 500,
+                                    '&:hover': { cursor: 'pointer' },
                                     color: theme.palette.dark.main,
+                                    fontWeight: 500,
                                     whiteSpace: "nowrap",
-                                }, children: item?.label ?? "" }), jsxRuntime.jsx("div", { ref: endRef })] }, item.label))) }), jsxRuntime.jsx(DropdownMenu, { dropdownItems: dropdownItems, currentItem: currentItem, anchorEl: anchorEl, isDropdownOpen: isDropdownOpen, handleDropdownToggle: handleDropdownToggle, handleClose: handleClose, handleItemClick: handleItemClick })] }));
+                                }, children: item?.label ?? "" })), jsxRuntime.jsx("div", { ref: endRef })] }, item.label))) }), jsxRuntime.jsx(DropdownMenu, { dropdownItems: dropdownItems, currentItem: currentItem, anchorEl: anchorEl, isDropdownOpen: isDropdownOpen, handleDropdownToggle: handleDropdownToggle, handleClose: handleClose, handleItemClick: handleItemClick })] }));
     }
     return (jsxRuntime.jsxs(material.Box, { component: "nav", sx: {
             display: "inline-flex",
@@ -168,16 +177,22 @@ const Breadcrumb = ({ items, currentItem, dropdownItems = [], onItemSelect, onNa
                     "& .MuiBreadcrumbs-separator": {
                         color: `${theme.palette.dark.main}66`,
                     },
-                }, children: items.map((item) => (jsxRuntime.jsx(material.Typography, { sx: {
+                }, children: items.map((item) => (item.label === currentItem ? (jsxRuntime.jsx(material.Typography, { sx: {
+                        fontWeight: 700,
+                        whiteSpace: "nowrap",
+                    }, children: item?.label ?? "" })) : (jsxRuntime.jsx(material.Link
+                // href={item.href as string}
+                , { 
+                    // href={item.href as string}
+                    underline: item.label === currentItem ? "none" : "always", onClick: () => {
+                        if (item.label !== currentItem)
+                            handleNavigation(item.href);
+                    }, sx: {
+                        '&:hover': { cursor: 'pointer' },
                         color: theme.palette.dark.main,
                         fontWeight: 500,
-                        px: { xs: 0.5, sm: 1 },
-                        // minWidth: 0,
                         whiteSpace: "nowrap",
-                        // overflow: "hidden",
-                        textOverflow: "ellipsis",
-                        cursor: item.href ? "pointer" : "default",
-                    }, onClick: () => item.href && handleNavigation(item.href), children: item.label }, item.label))) }), jsxRuntime.jsx(DropdownMenu, { dropdownItems: dropdownItems, currentItem: currentItem, anchorEl: anchorEl, isDropdownOpen: isDropdownOpen, handleDropdownToggle: handleDropdownToggle, handleClose: handleClose, handleItemClick: handleItemClick })] }));
+                    }, children: item?.label ?? "" })))) }), jsxRuntime.jsx(DropdownMenu, { dropdownItems: dropdownItems, currentItem: currentItem, anchorEl: anchorEl, isDropdownOpen: isDropdownOpen, handleDropdownToggle: handleDropdownToggle, handleClose: handleClose, handleItemClick: handleItemClick })] }));
 };
 
 exports.Breadcrumb = Breadcrumb;

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

@@ -1 +1 @@
-{"version":3,"file":"Breadcrumb.js","sources":["../../../../src/components/Breadcrumb.tsx"],"sourcesContent":["import React, { Fragment, useEffect, useRef, useState } from \"react\";\r\nimport {\r\n  Box,\r\n  Breadcrumbs as MuiBreadcrumbs,\r\n  Typography,\r\n  IconButton,\r\n  Menu,\r\n  MenuItem,\r\n  styled,\r\n  useMediaQuery,\r\n} from \"@mui/material\";\r\nimport { useTheme } from \"../ThemeProvider\";\r\nimport {\r\n  HomeRounded,\r\n  ExpandMoreRounded,\r\n  ChevronRightRounded,\r\n} from \"@mui/icons-material\";\r\n\r\ninterface BreadcrumbItem {\r\n  label: string;\r\n  href?: string;\r\n}\r\n\r\ninterface BreadcrumbProps {\r\n  items: BreadcrumbItem[];\r\n  currentItem: string;\r\n  dropdownItems?: BreadcrumbItem[];\r\n  onItemSelect?: (item: BreadcrumbItem) => void;\r\n  onNavigate?: (path: string) => void;\r\n}\r\n\r\nconst HomeButton = styled(IconButton)(({ theme }) => ({\r\n  width: 40,\r\n  height: 40,\r\n  borderRadius:\r\n    (typeof theme.shape.borderRadius === \"string\"\r\n      ? parseInt(theme.shape.borderRadius, 10)\r\n      : theme.shape.borderRadius || 4) * 2,\r\n  backgroundColor: theme.palette.secondary.main || theme.palette.accent.main,\r\n  flexShrink: 0,\r\n  \"&:hover\": {\r\n    backgroundColor: theme.palette.secondary.main || theme.palette.accent.main,\r\n    opacity: 0.8,\r\n  },\r\n}));\r\n\r\nconst DropdownButton = styled(\"button\")(({ theme }) => ({\r\n  display: \"flex\",\r\n  alignItems: \"center\",\r\n  justifyContent: \"space-between\",\r\n  gap: theme.spacing(1),\r\n  padding: theme.spacing(0.75, 2),\r\n  borderRadius:\r\n    (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}33`,\r\n  backgroundColor: \"#fff\",\r\n  color: theme.palette.dark.main,\r\n  fontWeight: 500,\r\n  whiteSpace: \"nowrap\",\r\n  cursor: \"pointer\",\r\n  transition: \"border-color 0.2s\",\r\n  fontSize: \"0.875rem\",\r\n  \"&:hover\": {\r\n    borderColor: `${theme.palette.dark.main}4D`,\r\n  },\r\n  [theme.breakpoints.down(\"sm\")]: {\r\n    width: '100%',\r\n    padding: theme.spacing(0.75, 1),\r\n    gap: theme.spacing(0.5),\r\n  },\r\n}));\r\n\r\nconst StyledMenu = styled(Menu)(({ theme }) => ({\r\n  \"& .MuiPaper-root\": {\r\n    marginTop: theme.spacing(1),\r\n    width: \"auto\",\r\n    [theme.breakpoints.down(\"sm\")]: {\r\n      width: \"100%\",\r\n    },\r\n    borderRadius:\r\n      (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}33`,\r\n    boxShadow:\r\n      \"0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)\",\r\n  },\r\n}));\r\n\r\nconst StyledMenuItem = styled(MenuItem, {\r\n  shouldForwardProp: (prop) => prop !== \"isActive\",\r\n})<{ isActive?: boolean }>(({ theme, isActive }) => ({\r\n  padding: theme.spacing(1.25, 2),\r\n  fontSize: \"0.875rem\",\r\n  color: isActive ? theme.palette.primary.main : \"#4D3019\",\r\n  fontWeight: isActive ? 500 : 400,\r\n  backgroundColor: isActive ? \"#F5F1ED\" : \"transparent\",\r\n  whiteSpace: \"normal\",\r\n  wordBreak: \"break-word\",\r\n  display: \"block\",\r\n  \"&:hover\": {\r\n    backgroundColor: \"#F5F1ED\",\r\n  },\r\n}));\r\n\r\nconst DropdownMenu = ({\r\n  dropdownItems,\r\n  currentItem,\r\n  anchorEl,\r\n  isDropdownOpen,\r\n  handleDropdownToggle,\r\n  handleClose,\r\n  handleItemClick,\r\n}: {\r\n  dropdownItems: BreadcrumbItem[];\r\n  currentItem: string;\r\n  anchorEl: HTMLElement | null;\r\n  isDropdownOpen: boolean;\r\n  handleDropdownToggle: (e: React.MouseEvent<HTMLButtonElement>) => void;\r\n  handleClose: () => void;\r\n  handleItemClick: (item: BreadcrumbItem) => void;\r\n}) => {\r\n  return dropdownItems.length > 0 ? (\r\n    <Box sx={{ position: \"relative\", flexShrink: 0 }}>\r\n      <DropdownButton type=\"button\" onClick={handleDropdownToggle}>\r\n        In this section...\r\n        <ExpandMoreRounded\r\n          sx={{\r\n            fontSize: 20,\r\n            transition: \"transform 0.2s\",\r\n            transform: isDropdownOpen ? \"rotate(180deg)\" : \"rotate(0deg)\",\r\n          }}\r\n        />\r\n      </DropdownButton>\r\n\r\n      <StyledMenu\r\n        anchorEl={anchorEl}\r\n        open={isDropdownOpen}\r\n        onClose={handleClose}\r\n        disableScrollLock\r\n      >\r\n        {dropdownItems.map((item, index) => (\r\n          <StyledMenuItem\r\n            key={index}\r\n            onClick={() => handleItemClick(item)}\r\n            isActive={item.label === currentItem}\r\n          >\r\n            {item.label}\r\n          </StyledMenuItem>\r\n        ))}\r\n      </StyledMenu>\r\n    </Box>\r\n  ) : null;\r\n};\r\n\r\nexport const Breadcrumb: React.FC<BreadcrumbProps> = ({\r\n  items,\r\n  currentItem,\r\n  dropdownItems = [],\r\n  onItemSelect,\r\n  onNavigate,\r\n}) => {\r\n  const theme = useTheme();\r\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\r\n  const isDropdownOpen = Boolean(anchorEl);\r\n  const isMobile = useMediaQuery(theme.breakpoints.down(\"sm\"));\r\n  const scrollMask = useRef<HTMLDivElement>(null);\r\n  const endRef = useRef<HTMLDivElement>(null);\r\n  \r\n  const updateMask = (el: { style?: any; scrollLeft?: any; scrollWidth?: any; clientWidth?: any; }) => {\r\n    const { scrollLeft, scrollWidth, clientWidth } = el;\r\n    const atStart = scrollLeft === 0;\r\n    const atEnd = scrollLeft + clientWidth >= scrollWidth - 1;\r\n\r\n    const left = atStart ? 'black' : 'transparent';\r\n    const right = atEnd ? 'black' : 'transparent';\r\n\r\n    const mask = `linear-gradient(to right, ${left}, black 30px, black calc(100% - 30px), ${right})`;\r\n    el.style.maskImage = mask;\r\n    el.style.webkitMaskImage = mask;\r\n  };\r\n\r\n  useEffect(() => {\r\n    const el = scrollMask.current;\r\n    if (!el) return;\r\n    updateMask(el); // set on mount\r\n    el.addEventListener('scroll', () => updateMask(el));\r\n    return () => el.removeEventListener('scroll', () => updateMask(el));\r\n  }, []);\r\n\r\n  useEffect(() => {\r\n    endRef.current?.scrollIntoView({ behavior: 'smooth', block: 'nearest' });\r\n  }, [items]);\r\n\r\n\r\n  const handleNavigation = (path: string) => {\r\n    if (onNavigate) {\r\n      onNavigate(path);\r\n    } else {\r\n      window.location.href = path;\r\n    }\r\n  };\r\n\r\n  const handleDropdownToggle = (event: React.MouseEvent<HTMLButtonElement>) => {\r\n    setAnchorEl(event.currentTarget);\r\n  };\r\n\r\n  const handleClose = () => setAnchorEl(null);\r\n\r\n  const handleHomeClick = () => handleNavigation(\"/\");\r\n  const handleItemClick = (item: BreadcrumbItem) => {\r\n    onItemSelect?.(item);\r\n    handleClose();\r\n    if (item.href) handleNavigation(item.href);\r\n  };\r\n  \r\n  if (items.length < 1) {\r\n    return;\r\n  }\r\n\r\n  if (isMobile) {\r\n\r\n    return (\r\n      <Box\r\n        display=\"flex\"\r\n        flexDirection=\"column\"\r\n        gap={2}\r\n      >\r\n        <Box\r\n          ref={scrollMask}\r\n          component=\"nav\"\r\n          sx={{\r\n            width: \"100%\",\r\n            display: \"flex\",\r\n            flexDirection: \"row\",\r\n            alignItems: \"start\",\r\n            flexWrap: \"nowrap\",\r\n            overflowX: \"auto\",\r\n            textOverflow: \"ellipsis\",\r\n            minWidth: 0,\r\n            scrollbarWidth: \"none\",\r\n            \"&::-webkit-scrollbar\": { display: \"none\" },\r\n          }}\r\n        >\r\n          {items.map((item) => (\r\n            <Fragment key={item.label}>\r\n                <ChevronRightRounded />\r\n              <Typography\r\n                onClick={() => {\r\n                  handleNavigation(item.href as string);\r\n                }}\r\n                sx={{\r\n                  fontWeight: 500,\r\n                  color: theme.palette.dark.main,\r\n                  whiteSpace: \"nowrap\",\r\n                }}\r\n              >\r\n                {item?.label ?? \"\"}\r\n              </Typography>\r\n              <div ref={endRef}/>\r\n            </Fragment>\r\n          ))}\r\n        </Box>\r\n        <DropdownMenu\r\n          dropdownItems={dropdownItems}\r\n          currentItem={currentItem}\r\n          anchorEl={anchorEl}\r\n          isDropdownOpen={isDropdownOpen}\r\n          handleDropdownToggle={handleDropdownToggle}\r\n          handleClose={handleClose}\r\n          handleItemClick={handleItemClick}\r\n        />\r\n      </Box>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <Box\r\n      component=\"nav\"\r\n      sx={{\r\n        display: \"inline-flex\",\r\n        justifyContent: \"start\",\r\n        alignItems: \"center\",\r\n        // flexWrap: \"nowrap\",\r\n        gap: 1,\r\n        scrollbarWidth: \"none\",\r\n        \"&::-webkit-scrollbar\": { display: \"none\" },\r\n      }}\r\n    >\r\n      <HomeButton aria-label=\"Home\" onClick={handleHomeClick}>\r\n        <HomeRounded sx={{ fontSize: 20, color: \"#4D3019\" }} />\r\n      </HomeButton>\r\n      <MuiBreadcrumbs\r\n        separator=\"/\"\r\n        sx={{\r\n          display: \"inline-flex\",\r\n          flexDirection: \"row\",\r\n          flexWrap: \"initial\",\r\n          // width: \"fit-content\",\r\n          flexShrink: 2,\r\n          \"& .MuiBreadcrumbs-separator\": {\r\n            color: `${theme.palette.dark.main}66`,\r\n          },\r\n        }}\r\n      >\r\n        {items.map((item) => (\r\n          <Typography\r\n            key={item.label}\r\n            sx={{\r\n              color: theme.palette.dark.main,\r\n              fontWeight: 500,\r\n              px: { xs: 0.5, sm: 1 },\r\n              // minWidth: 0,\r\n              whiteSpace: \"nowrap\",\r\n              // overflow: \"hidden\",\r\n              textOverflow: \"ellipsis\",\r\n              cursor: item.href ? \"pointer\" : \"default\",\r\n            }}\r\n            onClick={() => item.href && handleNavigation(item.href)}\r\n          >\r\n            {item.label}\r\n          </Typography>\r\n        ))}\r\n      </MuiBreadcrumbs>\r\n      <DropdownMenu\r\n        dropdownItems={dropdownItems}\r\n        currentItem={currentItem}\r\n        anchorEl={anchorEl}\r\n        isDropdownOpen={isDropdownOpen}\r\n        handleDropdownToggle={handleDropdownToggle}\r\n        handleClose={handleClose}\r\n        handleItemClick={handleItemClick}\r\n      />\r\n    </Box>\r\n  );\r\n};\r\n"],"names":["styled","IconButton","Menu","MenuItem","_jsxs","Box","_jsx","ExpandMoreRounded","useTheme","useState","useMediaQuery","useRef","useEffect","Fragment","ChevronRightRounded","Typography","HomeRounded","MuiBreadcrumbs"],"mappings":"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"}
+{"version":3,"file":"Breadcrumb.js","sources":["../../../../src/components/Breadcrumb.tsx"],"sourcesContent":["import React, { Fragment, useEffect, useRef, useState } from \"react\";\r\nimport {\r\n  Box,\r\n  Breadcrumbs as MuiBreadcrumbs,\r\n  Typography,\r\n  IconButton,\r\n  Menu,\r\n  MenuItem,\r\n  styled,\r\n  useMediaQuery,\r\n  Link,\r\n} from \"@mui/material\";\r\nimport { useTheme } from \"../ThemeProvider\";\r\nimport {\r\n  HomeRounded,\r\n  ExpandMoreRounded,\r\n  ChevronRightRounded,\r\n} from \"@mui/icons-material\";\r\n\r\ninterface BreadcrumbItem {\r\n  label: string;\r\n  href?: string;\r\n}\r\n\r\ninterface BreadcrumbProps {\r\n  items: BreadcrumbItem[];\r\n  currentItem: string;\r\n  dropdownItems?: BreadcrumbItem[];\r\n  onItemSelect?: (item: BreadcrumbItem) => void;\r\n  onNavigate?: (path: string) => void;\r\n}\r\n\r\nconst HomeButton = styled(IconButton)(({ theme }) => ({\r\n  width: 40,\r\n  height: 40,\r\n  borderRadius:\r\n    (typeof theme.shape.borderRadius === \"string\"\r\n      ? parseInt(theme.shape.borderRadius, 10)\r\n      : theme.shape.borderRadius || 4) * 2,\r\n  backgroundColor: theme.palette.secondary.main || theme.palette.accent.main,\r\n  flexShrink: 0,\r\n  \"&:hover\": {\r\n    backgroundColor: theme.palette.secondary.main || theme.palette.accent.main,\r\n    opacity: 0.8,\r\n  },\r\n}));\r\n\r\nconst DropdownButton = styled(\"button\")(({ theme }) => ({\r\n  display: \"flex\",\r\n  alignItems: \"center\",\r\n  justifyContent: \"space-between\",\r\n  gap: theme.spacing(1),\r\n  padding: theme.spacing(0.75, 2),\r\n  borderRadius:\r\n    (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}33`,\r\n  backgroundColor: \"#fff\",\r\n  color: theme.palette.dark.main,\r\n  fontWeight: 500,\r\n  whiteSpace: \"nowrap\",\r\n  cursor: \"pointer\",\r\n  transition: \"border-color 0.2s\",\r\n  fontSize: \"0.875rem\",\r\n  \"&:hover\": {\r\n    borderColor: `${theme.palette.dark.main}4D`,\r\n  },\r\n  [theme.breakpoints.down(\"sm\")]: {\r\n    width: \"100%\",\r\n    padding: theme.spacing(0.75, 1),\r\n    gap: theme.spacing(0.5),\r\n  },\r\n}));\r\n\r\nconst StyledMenu = styled(Menu)(({ theme }) => ({\r\n  \"& .MuiPaper-root\": {\r\n    marginTop: theme.spacing(1),\r\n    width: \"auto\",\r\n    [theme.breakpoints.down(\"sm\")]: {\r\n      width: \"100%\",\r\n    },\r\n    borderRadius:\r\n      (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}33`,\r\n    boxShadow:\r\n      \"0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)\",\r\n  },\r\n}));\r\n\r\nconst StyledMenuItem = styled(MenuItem, {\r\n  shouldForwardProp: (prop) => prop !== \"isActive\",\r\n})<{ isActive?: boolean }>(({ theme, isActive }) => ({\r\n  padding: theme.spacing(1.25, 2),\r\n  fontSize: \"0.875rem\",\r\n  color: isActive ? theme.palette.primary.main : \"#4D3019\",\r\n  fontWeight: isActive ? 500 : 400,\r\n  backgroundColor: isActive ? \"#F5F1ED\" : \"transparent\",\r\n  whiteSpace: \"normal\",\r\n  wordBreak: \"break-word\",\r\n  display: \"block\",\r\n  \"&:hover\": {\r\n    backgroundColor: \"#F5F1ED\",\r\n  },\r\n}));\r\n\r\nconst DropdownMenu = ({\r\n  dropdownItems,\r\n  currentItem,\r\n  anchorEl,\r\n  isDropdownOpen,\r\n  handleDropdownToggle,\r\n  handleClose,\r\n  handleItemClick,\r\n}: {\r\n  dropdownItems: BreadcrumbItem[];\r\n  currentItem: string;\r\n  anchorEl: HTMLElement | null;\r\n  isDropdownOpen: boolean;\r\n  handleDropdownToggle: (e: React.MouseEvent<HTMLButtonElement>) => void;\r\n  handleClose: () => void;\r\n  handleItemClick: (item: BreadcrumbItem) => void;\r\n}) => {\r\n  return dropdownItems.length > 0 ? (\r\n    <Box sx={{ position: \"relative\", flexShrink: 0 }}>\r\n      <DropdownButton type=\"button\" onClick={handleDropdownToggle}>\r\n        In this section...\r\n        <ExpandMoreRounded\r\n          sx={{\r\n            fontSize: 20,\r\n            transition: \"transform 0.2s\",\r\n            transform: isDropdownOpen ? \"rotate(180deg)\" : \"rotate(0deg)\",\r\n          }}\r\n        />\r\n      </DropdownButton>\r\n\r\n      <StyledMenu\r\n        anchorEl={anchorEl}\r\n        open={isDropdownOpen}\r\n        onClose={handleClose}\r\n        disableScrollLock\r\n      >\r\n        {dropdownItems.map((item, index) => (\r\n          <StyledMenuItem\r\n            key={index}\r\n            onClick={() => handleItemClick(item)}\r\n            isActive={item.label === currentItem}\r\n          >\r\n            {item.label}\r\n          </StyledMenuItem>\r\n        ))}\r\n      </StyledMenu>\r\n    </Box>\r\n  ) : null;\r\n};\r\n\r\nexport const Breadcrumb: React.FC<BreadcrumbProps> = ({\r\n  items,\r\n  currentItem,\r\n  dropdownItems = [],\r\n  onItemSelect,\r\n  onNavigate,\r\n}) => {\r\n  const theme = useTheme();\r\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\r\n  const isDropdownOpen = Boolean(anchorEl);\r\n  const isMobile = useMediaQuery(theme.breakpoints.down(\"sm\"));\r\n  const scrollMask = useRef<HTMLDivElement>(null);\r\n  const endRef = useRef<HTMLDivElement>(null);\r\n\r\n  const updateMask = (el: {\r\n    style?: any;\r\n    scrollLeft?: any;\r\n    scrollWidth?: any;\r\n    clientWidth?: any;\r\n  }) => {\r\n    const { scrollLeft, scrollWidth, clientWidth } = el;\r\n    const atStart = scrollLeft === 0;\r\n    const atEnd = scrollLeft + clientWidth >= scrollWidth - 1;\r\n\r\n    const left = atStart ? \"black\" : \"transparent\";\r\n    const right = atEnd ? \"black\" : \"transparent\";\r\n\r\n    const mask = `linear-gradient(to right, ${left}, black 30px, black calc(100% - 30px), ${right})`;\r\n    el.style.maskImage = mask;\r\n    el.style.webkitMaskImage = mask;\r\n  };\r\n\r\n  useEffect(() => {\r\n    const el = scrollMask.current;\r\n    if (!el) return;\r\n    updateMask(el); // set on mount\r\n    el.addEventListener(\"scroll\", () => updateMask(el));\r\n    return () => el.removeEventListener(\"scroll\", () => updateMask(el));\r\n  }, []);\r\n\r\n  useEffect(() => {\r\n    endRef.current?.scrollIntoView({ behavior: \"smooth\", block: \"nearest\" });\r\n  }, [items]);\r\n\r\n  const handleNavigation = (path: string) => {\r\n    if (onNavigate) {\r\n      onNavigate(path);\r\n    } else {\r\n      window.location.href = path;\r\n    }\r\n  };\r\n\r\n  const handleDropdownToggle = (event: React.MouseEvent<HTMLButtonElement>) => {\r\n    setAnchorEl(event.currentTarget);\r\n  };\r\n\r\n  const handleClose = () => setAnchorEl(null);\r\n\r\n  const handleHomeClick = () => handleNavigation(\"/\");\r\n  const handleItemClick = (item: BreadcrumbItem) => {\r\n    onItemSelect?.(item);\r\n    handleClose();\r\n    if (item.href) handleNavigation(item.href);\r\n  };\r\n\r\n  if (items.length < 1) {\r\n    return;\r\n  }\r\n\r\n  if (isMobile) {\r\n    return (\r\n      <Box display=\"flex\" flexDirection=\"column\" gap={2}>\r\n        <Box\r\n          ref={scrollMask}\r\n          component=\"nav\"\r\n          sx={{\r\n            width: \"100%\",\r\n            display: \"flex\",\r\n            flexDirection: \"row\",\r\n            alignItems: \"start\",\r\n            flexWrap: \"nowrap\",\r\n            overflowX: \"auto\",\r\n            textOverflow: \"ellipsis\",\r\n            minWidth: 0,\r\n            scrollbarWidth: \"none\",\r\n            \"&::-webkit-scrollbar\": { display: \"none\" },\r\n          }}\r\n        >\r\n          {items.map((item) => (\r\n            <Fragment key={item.label}>\r\n              <ChevronRightRounded />\r\n              {item.label === currentItem ? (\r\n                <Typography\r\n                  sx={{\r\n                    fontWeight: 700,\r\n                    whiteSpace: \"nowrap\",\r\n                  }}\r\n                >\r\n                  {item?.label ?? \"\"}\r\n                </Typography>\r\n              ) : (\r\n                <Link\r\n                  // href={item.href as string}\r\n                  underline={item.label === currentItem ? \"none\" : \"always\"}\r\n                  onClick={() => {\r\n                    if (item.label !== currentItem)\r\n                      handleNavigation(item.href as string);\r\n                  }}\r\n                  sx={{\r\n                    '&:hover': { cursor: 'pointer' },\r\n                    color: theme.palette.dark.main,\r\n                    fontWeight: 500,\r\n                    whiteSpace: \"nowrap\",\r\n                  }}\r\n                >\r\n                  {item?.label ?? \"\"}\r\n                </Link>\r\n              )}\r\n              <div ref={endRef} />\r\n            </Fragment>\r\n          ))}\r\n        </Box>\r\n        <DropdownMenu\r\n          dropdownItems={dropdownItems}\r\n          currentItem={currentItem}\r\n          anchorEl={anchorEl}\r\n          isDropdownOpen={isDropdownOpen}\r\n          handleDropdownToggle={handleDropdownToggle}\r\n          handleClose={handleClose}\r\n          handleItemClick={handleItemClick}\r\n        />\r\n      </Box>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <Box\r\n      component=\"nav\"\r\n      sx={{\r\n        display: \"inline-flex\",\r\n        justifyContent: \"start\",\r\n        alignItems: \"center\",\r\n        // flexWrap: \"nowrap\",\r\n        gap: 1,\r\n        scrollbarWidth: \"none\",\r\n        \"&::-webkit-scrollbar\": { display: \"none\" },\r\n      }}\r\n    >\r\n      <HomeButton aria-label=\"Home\" onClick={handleHomeClick}>\r\n        <HomeRounded sx={{ fontSize: 20, color: \"#4D3019\" }} />\r\n      </HomeButton>\r\n      <MuiBreadcrumbs\r\n        separator=\"/\"\r\n        sx={{\r\n          display: \"inline-flex\",\r\n          flexDirection: \"row\",\r\n          flexWrap: \"initial\",\r\n          // width: \"fit-content\",\r\n          flexShrink: 2,\r\n          \"& .MuiBreadcrumbs-separator\": {\r\n            color: `${theme.palette.dark.main}66`,\r\n          },\r\n        }}\r\n      >\r\n        {items.map((item) => (\r\n          item.label === currentItem ? (\r\n            <Typography\r\n              sx={{\r\n                fontWeight: 700,\r\n                whiteSpace: \"nowrap\",\r\n              }}\r\n            >\r\n              {item?.label ?? \"\"}\r\n            </Typography>\r\n          ) : (\r\n            <Link\r\n              // href={item.href as string}\r\n              underline={item.label === currentItem ? \"none\" : \"always\"}\r\n              onClick={() => {\r\n                if (item.label !== currentItem)\r\n                  handleNavigation(item.href as string);\r\n              }}\r\n              sx={{\r\n                '&:hover': { cursor: 'pointer' },\r\n                color: theme.palette.dark.main,\r\n                fontWeight: 500,\r\n                whiteSpace: \"nowrap\",\r\n              }}\r\n            >\r\n              {item?.label ?? \"\"}\r\n            </Link>\r\n          )\r\n        ))}\r\n      </MuiBreadcrumbs>\r\n      <DropdownMenu\r\n        dropdownItems={dropdownItems}\r\n        currentItem={currentItem}\r\n        anchorEl={anchorEl}\r\n        isDropdownOpen={isDropdownOpen}\r\n        handleDropdownToggle={handleDropdownToggle}\r\n        handleClose={handleClose}\r\n        handleItemClick={handleItemClick}\r\n      />\r\n    </Box>\r\n  );\r\n};\r\n"],"names":["styled","IconButton","Menu","MenuItem","_jsxs","Box","_jsx","ExpandMoreRounded","useTheme","useState","useMediaQuery","useRef","useEffect","Fragment","ChevronRightRounded","Typography","Link","HomeRounded","MuiBreadcrumbs"],"mappings":"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"}

package/dist/cjs/components/Button.js

@@ -10,6 +10,18 @@ const StyledButton = styles.styled(material.Button, {
     shouldForwardProp: (prop) => prop !== 'customVariant' && prop !== 'customSize',
 })(({ theme, customVariant, customSize }) => {
     const currentTheme = theme.palette;
+    // Map each variant to its background color
+    const variantBackgrounds = {
+        primary: currentTheme.primary.main,
+        secondary: currentTheme.secondary.main,
+        outline: currentTheme.light.main,
+        'marked-read': 'rgb(163, 217, 119)', // use solid equiv for contrast calc
+        'mark-read': currentTheme.custom?.markAsReadBackgroundColor || currentTheme.accent.main,
+        danger: '#D32F2F',
+    };
+    const currentBg = variantBackgrounds[customVariant] ?? currentTheme.primary.main;
+    // Returns '#fff' or '#000' based on WCAG contrast ratio
+    const disabledTextColor = theme.palette.getContrastText(currentBg);
     // Size styles
     const sizeStyles = {
         sm: {
@@ -39,7 +51,9 @@ const StyledButton = styles.styled(material.Button, {
         },
         '&.Mui-disabled': {
             opacity: 0.5,
+            color: disabledTextColor,
             cursor: 'not-allowed',
+            pointerEvents: 'auto',
         },
         ...sizeStyles[customSize],
     };
@@ -91,19 +105,19 @@ const StyledButton = styles.styled(material.Button, {
             border: '1px solid',
             fontSize: '14px',
             padding: '2px 8px',
-            borderColor: currentTheme.custom?.markAsReadBorderColor || currentTheme.secondary.main,
+            borderColor: currentTheme.custom?.markAsReadBorderColor || currentTheme.secondary.main, // Visible border
             color: currentTheme.dark.main,
             '&:hover': {
                 opacity: 0.9,
             },
         },
         danger: {
-            backgroundColor: theme.palette.custom.dangerBackground,
-            color: theme.palette.primary.contrastText,
+            backgroundColor: '#D32F2F',
+            color: '#FFFFFF',
             borderColor: 'transparent', // Transparent border
             boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
             '&:hover': {
-                backgroundColor: theme.palette.custom.dangerBackgroundHover,
+                backgroundColor: '#B71C1C',
                 opacity: 0.9,
             },
         },

package/dist/cjs/components/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../src/components/Button.tsx"],"sourcesContent":["import React from 'react';\r\nimport { Button as MuiButton, ButtonProps as MuiButtonProps } from '@mui/material';\r\nimport { styled } from '@mui/material/styles';\r\nimport { ArticleRounded, FactCheckRounded } from '@mui/icons-material';\r\nimport { useTheme } from '../ThemeProvider';\r\n\r\ninterface CustomButtonProps extends Omit<MuiButtonProps, 'variant' | 'size'> {\r\n  variant?: 'primary' | 'secondary' | 'outline' | 'marked-read' | 'mark-read' | 'danger';\r\n  size?: 'sm' | 'md' | 'lg';\r\n}\r\n\r\nconst StyledButton = styled(MuiButton, {\r\n  shouldForwardProp: (prop) => prop !== 'customVariant' && prop !== 'customSize',\r\n})<{ customVariant: string; customSize: string }>(({ theme, customVariant, customSize }) => {\r\n  const currentTheme = theme.palette;\r\n\r\n  // Size styles\r\n  const sizeStyles = {\r\n    sm: {\r\n      padding: '6px 12px',\r\n      fontSize: '0.875rem',\r\n    },\r\n    md: {\r\n      padding: '10px 16px',\r\n      fontSize: '1rem',\r\n    },\r\n    lg: {\r\n      padding: '12px 24px',\r\n      fontSize: '1.125rem',\r\n    },\r\n  };\r\n\r\n  const baseStyles = {\r\n    fontWeight: 500,\r\n    borderRadius: (typeof theme.shape.borderRadius === 'string'\r\n      ? parseInt(theme.shape.borderRadius, 10)\r\n      : theme.shape.borderRadius || 4) * 2,\r\n    textTransform: 'none' as const,\r\n    transition: 'all 0.2s',\r\n    boxShadow: 'none',\r\n    border: '2px solid transparent',\r\n    '&:hover': {\r\n      boxShadow: 'none',\r\n    },\r\n    '&.Mui-disabled': {\r\n      opacity: 0.5,\r\n      cursor: 'not-allowed',\r\n    },\r\n    ...sizeStyles[customSize as keyof typeof sizeStyles],\r\n  };\r\n\r\n  // Variant styles\r\n  const variantStyles = {\r\n    primary: {\r\n      backgroundColor: currentTheme.primary.main,\r\n      color: currentTheme.custom?.primaryButtonTextColor || '#FFFFFF',\r\n      borderColor: 'transparent', // Transparent border\r\n      boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\r\n      '&:hover': {\r\n        backgroundColor: currentTheme.primary.main,\r\n        opacity: 0.9,\r\n      },\r\n    },\r\n    secondary: {\r\n      backgroundColor: currentTheme.secondary.main,\r\n      color: currentTheme.dark.main,\r\n      borderColor: 'transparent', // Transparent border\r\n      boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\r\n      '&:hover': {\r\n        backgroundColor: currentTheme.secondary.main,\r\n        opacity: 0.9,\r\n      },\r\n    },\r\n    outline: {\r\n      backgroundColor: currentTheme.light.main,\r\n      borderColor: 'rgba(77, 48, 25, 0.2)', // Visible border\r\n      color: currentTheme.dark.main,\r\n      '&:hover': {\r\n        backgroundColor: 'rgba(77, 48, 25, 0.05)',\r\n        borderColor: 'rgba(77, 48, 25, 0.3)',\r\n      },\r\n    },\r\n    'marked-read': {\r\n      backgroundColor: 'rgba(163, 217, 119, 0.1)',\r\n      fontSize: '14px',\r\n      border: '1px solid',\r\n      padding: '2px 8px',\r\n      borderColor: currentTheme.markedRead.main, // Visible border\r\n      color: currentTheme.dark.main,\r\n      '&:hover': {\r\n        backgroundColor: 'rgba(163, 217, 119, 0.2)',\r\n        cursor: 'not-allowed',\r\n      },\r\n    },\r\n    'mark-read': {\r\n      backgroundColor: currentTheme.custom?.markAsReadBackgroundColor || currentTheme.accent.main,\r\n      border: '1px solid',\r\n      fontSize: '14px',\r\n      padding: '2px 8px',\r\n      borderColor: currentTheme.custom?.markAsReadBorderColor || currentTheme.secondary.main, \r\n      color: currentTheme.dark.main,\r\n      '&:hover': {\r\n        opacity: 0.9,\r\n      },\r\n    },\r\n    danger: {\r\n      backgroundColor: theme.palette.custom.dangerBackground,\r\n      color: theme.palette.primary.contrastText,\r\n      borderColor: 'transparent', // Transparent border\r\n      boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\r\n      '&:hover': {\r\n        backgroundColor: theme.palette.custom.dangerBackgroundHover,\r\n        opacity: 0.9,\r\n      },\r\n    },\r\n  };\r\n\r\n  return {\r\n    ...baseStyles,\r\n    ...variantStyles[customVariant as keyof typeof variantStyles],\r\n  };\r\n});\r\n\r\nexport const Button: React.FC<CustomButtonProps> = ({\r\n  variant = 'primary',\r\n  size = 'md',\r\n  children,\r\n  endIcon,\r\n  fullWidth = false,\r\n  ...props\r\n}) => {\r\n  // Logic for special end icons per variant\r\n  const getEndIcon = () => {\r\n    const theme = useTheme();\r\n    if (variant === 'mark-read') {\r\n      return (\r\n        <ArticleRounded sx={{ fontSize: 22, color: theme.palette.custom.iconColor }} />\r\n      );\r\n    }\r\n\r\n    if (variant === 'marked-read') {\r\n      return <FactCheckRounded sx={{ fontSize: 22, color: '#5a9c1a' }} />;\r\n    }\r\n\r\n    return endIcon || null;\r\n  };\r\n\r\n  return (\r\n    <StyledButton\r\n      customVariant={variant}\r\n      customSize={size}\r\n      fullWidth={fullWidth}\r\n      disableRipple\r\n      endIcon={getEndIcon()}\r\n      {...props}\r\n    >\r\n      {children}\r\n    </StyledButton>\r\n  );\r\n};\r\n"],"names":["styled","MuiButton","useTheme","_jsx","ArticleRounded","FactCheckRounded"],"mappings":"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"}
+{"version":3,"file":"Button.js","sources":["../../../../src/components/Button.tsx"],"sourcesContent":["import React from 'react';\r\nimport { Button as MuiButton, ButtonProps as MuiButtonProps } from '@mui/material';\r\nimport { styled } from '@mui/material/styles';\r\nimport { ArticleRounded, FactCheckRounded } from '@mui/icons-material';\r\nimport { useTheme } from '../ThemeProvider';\r\n\r\ninterface CustomButtonProps extends Omit<MuiButtonProps, 'variant' | 'size'> {\r\n  variant?: 'primary' | 'secondary' | 'outline' | 'marked-read' | 'mark-read' | 'danger';\r\n  size?: 'sm' | 'md' | 'lg';\r\n}\r\n\r\nconst StyledButton = styled(MuiButton, {\r\n  shouldForwardProp: (prop) => prop !== 'customVariant' && prop !== 'customSize',\r\n})<{ customVariant: string; customSize: string }>(({ theme, customVariant, customSize }) => {\r\n  const currentTheme = theme.palette;\r\n\r\n  // Map each variant to its background color\r\n  const variantBackgrounds: Record<string, string> = {\r\n    primary: currentTheme.primary.main,\r\n    secondary: currentTheme.secondary.main,\r\n    outline: currentTheme.light.main,\r\n    'marked-read': 'rgb(163, 217, 119)', // use solid equiv for contrast calc\r\n    'mark-read': currentTheme.custom?.markAsReadBackgroundColor || currentTheme.accent.main,\r\n    danger: '#D32F2F',\r\n  };\r\n\r\n  const currentBg = variantBackgrounds[customVariant] ?? currentTheme.primary.main;\r\n\r\n  // Returns '#fff' or '#000' based on WCAG contrast ratio\r\n  const disabledTextColor = theme.palette.getContrastText(currentBg);\r\n\r\n  // Size styles\r\n  const sizeStyles = {\r\n    sm: {\r\n      padding: '6px 12px',\r\n      fontSize: '0.875rem',\r\n    },\r\n    md: {\r\n      padding: '10px 16px',\r\n      fontSize: '1rem',\r\n    },\r\n    lg: {\r\n      padding: '12px 24px',\r\n      fontSize: '1.125rem',\r\n    },\r\n  };\r\n\r\n  const baseStyles = {\r\n    fontWeight: 500,\r\n    borderRadius: (typeof theme.shape.borderRadius === 'string'\r\n      ? parseInt(theme.shape.borderRadius, 10)\r\n      : theme.shape.borderRadius || 4) * 2,\r\n    textTransform: 'none' as const,\r\n    transition: 'all 0.2s',\r\n    boxShadow: 'none',\r\n    border: '2px solid transparent',\r\n    '&:hover': {\r\n      boxShadow: 'none',\r\n    },\r\n    '&.Mui-disabled': {\r\n      opacity: 0.5,\r\n      color: disabledTextColor,\r\n      cursor: 'not-allowed',\r\n      pointerEvents: 'auto',\r\n    },\r\n\r\n    ...sizeStyles[customSize as keyof typeof sizeStyles],\r\n  };\r\n\r\n  // Variant styles\r\n  const variantStyles = {\r\n    primary: {\r\n      backgroundColor: currentTheme.primary.main,\r\n      color: currentTheme.custom?.primaryButtonTextColor || '#FFFFFF',\r\n      borderColor: 'transparent', // Transparent border\r\n      boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\r\n      '&:hover': {\r\n        backgroundColor: currentTheme.primary.main,\r\n        opacity: 0.9,\r\n      },\r\n    },\r\n    secondary: {\r\n      backgroundColor: currentTheme.secondary.main,\r\n      color: currentTheme.dark.main,\r\n      borderColor: 'transparent', // Transparent border\r\n      boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\r\n      '&:hover': {\r\n        backgroundColor: currentTheme.secondary.main,\r\n        opacity: 0.9,\r\n      },\r\n    },\r\n    outline: {\r\n      backgroundColor: currentTheme.light.main,\r\n      borderColor: 'rgba(77, 48, 25, 0.2)', // Visible border\r\n      color: currentTheme.dark.main,\r\n      '&:hover': {\r\n        backgroundColor: 'rgba(77, 48, 25, 0.05)',\r\n        borderColor: 'rgba(77, 48, 25, 0.3)',\r\n      },\r\n    },\r\n    'marked-read': {\r\n      backgroundColor: 'rgba(163, 217, 119, 0.1)',\r\n      fontSize: '14px',\r\n      border: '1px solid',\r\n      padding: '2px 8px',\r\n      borderColor: currentTheme.markedRead.main, // Visible border\r\n      color: currentTheme.dark.main,\r\n      '&:hover': {\r\n        backgroundColor: 'rgba(163, 217, 119, 0.2)',\r\n        cursor: 'not-allowed',\r\n      },\r\n    },\r\n    'mark-read': {\r\n      backgroundColor: currentTheme.custom?.markAsReadBackgroundColor || currentTheme.accent.main,\r\n      border: '1px solid',\r\n      fontSize: '14px',\r\n      padding: '2px 8px',\r\n      borderColor: currentTheme.custom?.markAsReadBorderColor || currentTheme.secondary.main, // Visible border\r\n      color: currentTheme.dark.main,\r\n      '&:hover': {\r\n        opacity: 0.9,\r\n      },\r\n    },\r\n    danger: {\r\n      backgroundColor: '#D32F2F',\r\n      color: '#FFFFFF',\r\n      borderColor: 'transparent', // Transparent border\r\n      boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\r\n      '&:hover': {\r\n        backgroundColor: '#B71C1C',\r\n        opacity: 0.9,\r\n      },\r\n    },\r\n  };\r\n\r\n  return {\r\n    ...baseStyles,\r\n    ...variantStyles[customVariant as keyof typeof variantStyles],\r\n  };\r\n});\r\n\r\nexport const Button: React.FC<CustomButtonProps> = ({\r\n  variant = 'primary',\r\n  size = 'md',\r\n  children,\r\n  endIcon,\r\n  fullWidth = false,\r\n  ...props\r\n}) => {\r\n  // Logic for special end icons per variant\r\n  const getEndIcon = () => {\r\n    const theme = useTheme();\r\n    if (variant === 'mark-read') {\r\n      return (\r\n        <ArticleRounded sx={{ fontSize: 22, color: theme.palette.custom.iconColor }} />\r\n      );\r\n    }\r\n\r\n    if (variant === 'marked-read') {\r\n      return <FactCheckRounded sx={{ fontSize: 22, color: '#5a9c1a' }} />;\r\n    }\r\n\r\n    return endIcon || null;\r\n  };\r\n\r\n  return (\r\n    <StyledButton\r\n      customVariant={variant}\r\n      customSize={size}\r\n      fullWidth={fullWidth}\r\n      disableRipple\r\n      endIcon={getEndIcon()}\r\n      {...props}\r\n    >\r\n      {children}\r\n    </StyledButton>\r\n  );\r\n};\r\n"],"names":["styled","MuiButton","useTheme","_jsx","ArticleRounded","FactCheckRounded"],"mappings":"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"}

package/dist/cjs/components/Input.js

@@ -57,9 +57,9 @@ const StyledTextField = material.styled(material.TextField, {
     },
     // Target the actual input element for padding
     '& .MuiInputBase-input': {
-        padding: theme.spacing(1, 3),
+        padding: theme.spacing(1, 1.5),
         [theme.breakpoints.up('sm')]: {
-            padding: theme.spacing(1.25, 4),
+            padding: theme.spacing(1.25, 2),
         },
     },
     '& .MuiFormHelperText-root': {

package/dist/cjs/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    height: 48,\r\n    padding: 0, // Remove padding from root\r\n    '& .MuiOutlinedInput-notchedOutline': {\r\n      borderColor: errorMessage ? theme.palette.error.main : `${theme.palette.dark.main}33`,\r\n      borderWidth: 2,\r\n    },\r\n    '&:hover .MuiOutlinedInput-notchedOutline': {\r\n      borderColor: errorMessage ? theme.palette.error.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.error.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.error.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":["styled","InputLabel","TextField","_jsxs","_jsx"],"mappings":";;;;;AAOA,MAAM,YAAY,GAAGA,eAAM,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AACjD,IAAA,KAAK,EAAE,MAAM;AACd,CAAA,CAAC,CAAC;AAEI,MAAM,WAAW,GAAGA,eAAM,CAACC,mBAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AAC5D,IAAA,QAAQ,EAAE,UAAU;AACpB,IAAA,UAAU,EAAE,GAAG;AACf,IAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;AAC9B,IAAA,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;AACjC,IAAA,OAAO,EAAE,OAAO;AAChB,IAAA,QAAQ,EAAE,QAAQ;AAClB,IAAA,SAAS,EAAE,MAAM;AACjB,IAAA,eAAe,EAAE;AACf,QAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;AAC/B,KAAA;AACF,CAAA,CAAC;AAEF,MAAM,eAAe,GAAGD,eAAM,CAACE,kBAAS,EAAE;AACxC,IAAA,iBAAiB,EAAE,CAAC,IAAI,KAAK,CAAC,CAAC,cAAc,CAAC,CAAC,QAAQ,CAAC,IAAc,CAAC;CACxE,CAAC,CAA4B,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM;AAC1D,IAAA,KAAK,EAAE,MAAM;AACb,IAAA,sBAAsB,EAAE;AACtB,QAAA,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI;QACzC,YAAY,EAAE,CAAC,OAAO,KAAK,CAAC,KAAK,CAAC,YAAY,KAAK;cACnD,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY,EAAE,EAAE;cACrC,KAAK,CAAC,KAAK,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC;AAClC,QAAA,QAAQ,EAAE,MAAM;AAChB,QAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;AAC9B,QAAA,QAAQ,EAAE,CAAC;AACX,QAAA,MAAM,EAAE,EAAE;QACV,OAAO,EAAE,CAAC;AACV,QAAA,oCAAoC,EAAE;YACpC,WAAW,EAAE,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,CAAA,EAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AACrF,YAAA,WAAW,EAAE,CAAC;AACf,SAAA;AACD,QAAA,0CAA0C,EAAE;YAC1C,WAAW,EAAE,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI;AACjF,YAAA,WAAW,EAAE,CAAC;AACf,SAAA;AACD,QAAA,gDAAgD,EAAE;AAChD,YAAA,WAAW,EAAE,CAAC;YACd,WAAW,EAAE,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI;AAClF,SAAA;AACD,QAAA,gBAAgB,EAAE;YAChB,eAAe,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AAC/C,YAAA,uBAAuB,EAAE;gBACvB,KAAK,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AACrC,gBAAA,MAAM,EAAE,aAAa;AACtB,aAAA;AACD,YAAA,oCAAoC,EAAE;gBACpC,WAAW,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AAC5C,aAAA;AACF,SAAA;AACF,KAAA;;AAED,IAAA,uBAAuB,EAAE;QACvB,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;QAC5B,CAAC,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;YAC5B,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,CAAC;AAChC,SAAA;AACF,KAAA;AACD,IAAA,2BAA2B,EAAE;AAC3B,QAAA,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;AAC9B,QAAA,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,GAAG,CAAA,EAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AAChF,KAAA;AACF,CAAA,CAAC,CAAC;MAEU,KAAK,GAAyB,CAAC,EAC1C,KAAK,EACL,SAAS,GAAG,KAAK,EACjB,EAAE,EACF,KAAK,EACL,GAAG,KAAK,EACT,KAAI;IACH,MAAM,OAAO,GAAG,EAAE,IAAI,SAAS,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA,CAAE;AAExE,IAAA,QACEC,eAAA,CAAC,YAAY,EAAA,EAAC,EAAE,EAAE,EAAE,IAAI,CAAC,SAAS,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,EAAA,QAAA,EAAA,CACvD,KAAK,KACJC,cAAA,CAAC,WAAW,EAAA,EAAC,OAAO,EAAE,OAAO,EAAA,QAAA,EAC1B,KAAK,EAAA,CACM,CACf,EACDA,cAAA,CAAC,eAAe,EAAA,EACd,EAAE,EAAE,OAAO,EACX,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,UAAU,EAAE,KAAK,IAAI,KAAK,CAAC,UAAU,EACrC,YAAY,EAAE,KAAK,EACnB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAC,UAAU,EAAA,GACd,KAAK,EAAA,CACT,CAAA,EAAA,CACW;AAEnB;;;;;"}
+{"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    height: 48,\r\n    padding: 0, // Remove padding from root\r\n    '& .MuiOutlinedInput-notchedOutline': {\r\n      borderColor: errorMessage ? theme.palette.error.main : `${theme.palette.dark.main}33`,\r\n      borderWidth: 2,\r\n    },\r\n    '&:hover .MuiOutlinedInput-notchedOutline': {\r\n      borderColor: errorMessage ? theme.palette.error.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.error.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, 1.5),\r\n    [theme.breakpoints.up('sm')]: {\r\n      padding: theme.spacing(1.25, 2),\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.error.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":["styled","InputLabel","TextField","_jsxs","_jsx"],"mappings":"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"}

package/dist/cjs/components/Modal.js

@@ -87,42 +87,24 @@ const Modal = ({ isOpen, onClose, variableId, status, requirementType, descripti
     };
     const canSubmitSave = isLoading || variableState === variable.VariableState.Pending;
     const statusConfig = {
-        [variable.VariableState.Pending]: {
-            color: theme.palette.statusColors.pending.highlightSelected,
-            label: 'Pending',
-        },
-        [variable.VariableState.Draft]: {
-            color: theme.palette.dark.main,
-            label: 'Draft',
-        },
-        [variable.VariableState.Declined]: {
-            color: theme.palette.dark.main,
-            label: 'Declined',
-        },
-        [variable.VariableState.ActionRequired]: {
-            color: theme.palette.statusColors.actionRequired.highlightSelected,
-            label: 'Action Required',
-        },
-        [variable.VariableState.Accepted]: {
-            color: theme.palette.statusColors.accepted.highlightSelected,
-            label: 'Accepted',
-        },
-        [variable.VariableState.NotStarted]: {
-            color: theme.palette.statusColors.unknown.highlightSelected,
-            label: 'Not Started',
-        },
+        [variable.VariableState.Pending]: { color: '#EBC7FF', label: 'Pending' },
+        [variable.VariableState.Draft]: { color: '#4D3019', label: 'Draft' },
+        [variable.VariableState.Declined]: { color: '#4D3019', label: 'Declined' },
+        [variable.VariableState.ActionRequired]: { color: '#FFBCB3', label: 'Action Required' },
+        [variable.VariableState.Accepted]: { color: '#DBF59A', label: 'Accepted' },
+        [variable.VariableState.NotStarted]: { color: '#000000ff', label: 'Not Started' },
     };
     const reqTypeConfig = {
-        Default: {
-            color: theme.palette.statusColors.mandatory.color,
-            highlight: theme.palette.statusColors.mandatory.highlight,
-            highlightSelected: theme.palette.statusColors.mandatory.highlightSelected,
+        "Default": {
+            color: '#F5A623',
+            highlight: '#f3bf6bff',
+            highlightSelected: '#F5A623',
             label: 'Mandatory',
         },
-        Optional: {
-            color: theme.palette.statusColors.optional.color,
-            highlight: theme.palette.statusColors.optional.highlight,
-            highlightSelected: theme.palette.statusColors.optional.highlightSelected,
+        "Optional": {
+            color: '#F5D76E',
+            highlight: '#f3e2a5ff',
+            highlightSelected: '#F5D76E',
             label: 'Optional',
         },
     };
@@ -205,8 +187,10 @@ const Modal = ({ isOpen, onClose, variableId, status, requirementType, descripti
                                             },
                                         }, children: isSubmitting ? jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(material.CircularProgress, { size: 20 }), jsxRuntime.jsx(material.Typography, { sx: { paddingLeft: 2 }, children: "Submitting..." })] }) : useDefaultValue === false ? "Submit for review" : "Submit" }), variableReqType === variable.RequirementType.Optional &&
                                         (jsxRuntime.jsx(Button.Button, { onClick: onDeclineWording, variant: "outline", size: "md", sx: {
-                                                backgroundColor: `${theme.palette.custom.dangerBackground}52`,
-                                                '&:hover': { backgroundColor: `${theme.palette.custom.dangerBackground}80` },
+                                                backgroundColor: '#ff464652',
+                                                '&:hover': {
+                                                    backgroundColor: '#ff464680', // Darker purple on hover
+                                                }
                                             }, disabled: canSubmitSave, children: "Decline wording" }))] })) : (jsxRuntime.jsx(material.Box, { sx: { display: 'flex', gap: 1.5, flexWrap: 'wrap' }, children: jsxRuntime.jsx(Button.Button, { onClick: () => {
                                         setIsSubmitting(true);
                                         // Pass the default value and true directly to onSubmit
@@ -216,8 +200,10 @@ const Modal = ({ isOpen, onClose, variableId, status, requirementType, descripti
                                         setUseDefaultValue(true);
                                         onSubmit?.(payloadValue, true);
                                     }, variant: "outline", size: "md", disabled: canSubmitSave, sx: {
-                                        backgroundColor: `${theme.palette.custom.dangerBackground}52`,
-                                        '&:hover': { backgroundColor: `${theme.palette.custom.dangerBackground}80` },
+                                        backgroundColor: '#ff464652',
+                                        '&:hover': {
+                                            backgroundColor: '#ff464680',
+                                        }
                                     }, children: isSubmitting ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(material.CircularProgress, { size: 20 }), jsxRuntime.jsx(material.Typography, { sx: { paddingLeft: 2 }, children: "Restoring..." })] })) : ("Restore wording") }) })), jsxRuntime.jsxs(material.Box, { sx: {
                                     display: 'flex',
                                     alignItems: 'center',