ece-docs-components 1.0.53 → 1.0.55

package/dist/cjs/components/Header.js

@@ -3,15 +3,26 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var material = require('@mui/material');
-require('../ThemeProvider.js');
+var ThemeProvider = require('../ThemeProvider.js');
 var iconsMaterial = require('@mui/icons-material');
 var PopoverMenu = require('./PopoverMenu.js');
 var PrimaryLogo_Variation_Cream = require('../images/PrimaryLogo_Variation_Cream.svg.js');
 
+function renderDescription(desc) {
+    if (!desc)
+        return null;
+    const lines = desc.split(/\r?\n/).filter(line => line.trim().length > 0);
+    const bulletLines = lines.filter(line => line.trim().startsWith("* "));
+    const nonBulletLines = lines.filter(line => !line.trim().startsWith("* "));
+    return (jsxRuntime.jsxs("div", { style: { fontSize: 14, lineHeight: 1.5 }, children: [nonBulletLines.length > 0 && (jsxRuntime.jsx("div", { style: {
+                    whiteSpace: "pre-line",
+                    marginBottom: bulletLines.length > 0 ? 6 : 0, // spacing above bullets
+                }, children: nonBulletLines.join("\n") })), bulletLines.length > 0 && (jsxRuntime.jsx("ul", { style: { margin: 0, paddingLeft: 18 }, children: bulletLines.map((line, idx) => (jsxRuntime.jsx("li", { children: line.trim().replace(/^\*\s*/, "") }, idx))) }))] }));
+}
 const StyledHeader = material.styled(material.Box)(({ theme }) => ({
     display: 'flex',
     alignItems: 'center',
-    justifyContent: 'space-between',
+    justifyContent: 'flex-start',
     backgroundColor: theme.palette.primary.main, // var(--color-primary)
     [theme.breakpoints.up('md')]: {
         gap: theme.spacing(4), // md:gap-4
@@ -55,7 +66,7 @@ const StyledLogoSvg = material.styled(PrimaryLogo_Variation_Cream.ReactComponent
 `;
 const StyledSearchContainer = material.styled(material.Box)(({ theme }) => ({
     flex: 1,
-    maxWidth: '32rem', // max-w-2xl
+    maxWidth: '45rem',
     margin: theme.spacing(0, 2), // mx-8
     position: 'relative',
 }));
@@ -125,6 +136,7 @@ const StyledSearchIcon = material.styled(material.Box)(({ theme }) => ({
     },
 }));
 const StyledUserContainer = material.styled(material.Box)(({ theme }) => ({
+    marginLeft: 'auto',
     display: 'flex',
     alignItems: 'center',
     gap: theme.spacing(3), // md:gap-3
@@ -168,13 +180,78 @@ const StyledUserName = material.styled(material.Typography)(({ theme }) => ({
         display: 'none'
     },
 }));
-const Header = ({ userName = 'John Doe', userInitials = 'JD', toggleMenu, signOut, search, onResultClick, signUpStatus, }) => {
+const Header = ({ userName = 'John Doe', userInitials = 'JD', toggleMenu, signOut, search, onResultClick, signUpStatus, resetKey, }) => {
+    const theme = ThemeProvider.useTheme();
     const [anchorEl, setAnchorEl] = React.useState(null);
     const [searchQuery, setSearchQuery] = React.useState('');
     const [results, setResults] = React.useState([]);
     const [openDropdown, setOpenDropdown] = React.useState(false);
-    const inputRef = React.useRef(null);
+    const isMdUp = material.useMediaQuery(theme.breakpoints.up('md'));
+    const [mobileSearchOpen, setMobileSearchOpen] = React.useState(false);
+    const desktopInputRef = React.useRef(null);
+    const mobileInputRef = React.useRef(null);
+    const desktopFieldRef = React.useRef(null);
+    const headerRef = React.useRef(null);
+    const [headerHeight, setHeaderHeight] = React.useState(64);
+    const isActive = signUpStatus === 'Active';
+    const mobileResultsPaperRef = React.useRef(null);
+    const [mobileResultLimit, setMobileResultLimit] = React.useState(5);
+    const searchSeqRef = React.useRef(0);
     const debounceRef = React.useRef(undefined);
+    const maxVisibleResults = isMdUp ? 5 : 3;
+    const approxItemHeight = 80;
+    React.useLayoutEffect(() => {
+        const update = () => setHeaderHeight(headerRef.current?.offsetHeight ?? 64);
+        update();
+        window.addEventListener('resize', update);
+        return () => window.removeEventListener('resize', update);
+    }, []);
+    // Start at 5 each time results open/change on mobile
+    React.useLayoutEffect(() => {
+        if (isMdUp)
+            return;
+        if (!mobileSearchOpen || !openDropdown)
+            return;
+        setMobileResultLimit(5);
+    }, [isMdUp, mobileSearchOpen, openDropdown, results]);
+    // If the dropdown would run off-screen, reduce how many results we render
+    React.useLayoutEffect(() => {
+        if (isMdUp)
+            return;
+        if (!mobileSearchOpen || !openDropdown)
+            return;
+        const raf = requestAnimationFrame(() => {
+            const el = mobileResultsPaperRef.current;
+            if (!el)
+                return;
+            const rect = el.getBoundingClientRect();
+            const overflowPx = rect.bottom - window.innerHeight;
+            if (overflowPx > 0) {
+                setMobileResultLimit((n) => Math.max(1, n - 1));
+            }
+        });
+        return () => cancelAnimationFrame(raf);
+    }, [isMdUp, mobileSearchOpen, openDropdown, mobileResultLimit]);
+    const closeMobileSearch = () => {
+        setMobileSearchOpen(false);
+        setSearchQuery('');
+        setResults([]);
+        setOpenDropdown(false);
+        window.clearTimeout(debounceRef.current);
+    };
+    const toggleMobileSearch = () => {
+        setMobileSearchOpen(prev => {
+            const next = !prev;
+            if (!next) {
+                // cancelling
+                closeMobileSearch();
+                return false;
+            }
+            // opening
+            setTimeout(() => mobileInputRef.current?.focus(), 0);
+            return true;
+        });
+    };
     const handleOpen = (event) => {
         setAnchorEl(event.currentTarget);
     };
@@ -182,6 +259,7 @@ const Header = ({ userName = 'John Doe', userInitials = 'JD', toggleMenu, signOu
         setAnchorEl(null);
     };
     const runSearch = async (term) => {
+        const seq = ++searchSeqRef.current;
         if (!search) {
             setResults([]);
             setOpenDropdown(false);
@@ -194,63 +272,118 @@ const Header = ({ userName = 'John Doe', userInitials = 'JD', toggleMenu, signOu
             return;
         }
         const res = await Promise.resolve(search(trimmed));
+        if (seq !== searchSeqRef.current)
+            return; // Fixes debounce race condition causing old searches to appear after newer
         const list = Array.isArray(res) ? res : [];
         setResults(list);
         setOpenDropdown(list.length > 0);
     };
+    const handleKeyDown = (e) => {
+        if (e.key === 'Enter') {
+            e.preventDefault();
+            runSearch(searchQuery);
+        }
+    };
+    const handleSearchChange = (value) => {
+        setSearchQuery(value);
+        window.clearTimeout(debounceRef.current);
+        if (!value.trim()) {
+            runSearch(''); // Immediately run if no search to guarantee removal of listed results
+            return;
+        }
+        debounceRef.current = window.setTimeout(() => runSearch(value), 150);
+    };
     const handleSearchClick = (e) => {
         e.preventDefault();
         runSearch(searchQuery);
     };
+    React.useEffect(() => {
+        // When parent says the route changed (resetKey changes), reset search UI
+        closeMobileSearch();
+    }, [resetKey]);
     React.useEffect(() => {
         const handler = (e) => {
-            const anchor = inputRef.current?.parentElement;
-            if (anchor && !anchor.contains(e.target)) {
+            const t = e.target;
+            const inDesktop = desktopInputRef.current?.parentElement?.contains(t);
+            const inMobile = mobileInputRef.current?.parentElement?.contains(t);
+            if (!inDesktop && !inMobile) {
                 setOpenDropdown(false);
             }
         };
         document.addEventListener('click', handler);
         return () => document.removeEventListener('click', handler);
     }, []);
-    return (jsxRuntime.jsxs(StyledHeader, { children: [signUpStatus === 'Active' && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(material.IconButton, { disableRipple: true, onClick: toggleMenu, sx: { display: { xs: 'block', md: 'none' } }, size: "large", children: jsxRuntime.jsx(iconsMaterial.MenuRounded, { sx: { fontSize: 32, color: 'white' } }) }), jsxRuntime.jsx(material.Divider, { orientation: "vertical", sx: {
-                            color: '#FFFFFF',
-                            borderRightWidth: 2,
-                            display: { xs: 'block', md: 'none' },
-                        } })] })), jsxRuntime.jsx(StyledLogoWrapper, { children: jsxRuntime.jsx(StyledLogoIcon, { children: jsxRuntime.jsx(StyledLogoSvg, {}) }) }), signUpStatus === 'Active' && (jsxRuntime.jsxs(StyledSearchContainer, { children: [jsxRuntime.jsx(StyledTextField, { placeholder: "Search for a policy", variant: "outlined", fullWidth: true, value: searchQuery, inputRef: inputRef, onChange: (event) => {
-                            const value = event.target.value;
-                            setSearchQuery(value);
-                            window.clearTimeout(debounceRef.current);
-                            debounceRef.current = window.setTimeout(() => {
-                                runSearch(value);
-                            }, 300); // 300ms debounce
-                        }, onKeyDown: (e) => {
-                            if (e.key === 'Enter') ;
-                        }, sx: { display: { xs: 'none', sm: 'none', md: 'block' } }, InputProps: {
-                            endAdornment: (jsxRuntime.jsx(StyledSearchButton, { onClick: handleSearchClick, children: jsxRuntime.jsx(StyledSearchIcon, { children: jsxRuntime.jsx(iconsMaterial.SearchRounded, {}) }) })),
-                        } }), jsxRuntime.jsx(material.Popper, { open: openDropdown && results.length > 0, anchorEl: inputRef.current, placement: "bottom-start", style: {
-                            zIndex: 1300,
-                            width: inputRef.current?.offsetWidth,
-                        }, children: jsxRuntime.jsx(material.Paper, { elevation: 3, sx: {
-                                mt: 1,
-                                borderRadius: 2,
-                                maxHeight: 320,
-                                overflowY: 'auto',
-                            }, children: jsxRuntime.jsx(material.List, { dense: true, disablePadding: true, children: results.map((item, index) => (jsxRuntime.jsx(material.ListItemButton, { onClick: () => {
+    const mobileResultsToShow = results.slice(0, mobileResultLimit);
+    const ResultsList = ({ items, mode, paperRef, onPick, }) => {
+        const isDesktop = mode === 'desktop';
+        return (jsxRuntime.jsx(material.Paper, { ref: paperRef, elevation: 0, sx: {
+                mt: 1,
+                border: '1px solid #4D3019',
+                boxShadow: 'none',
+                backgroundColor: '#FEFDF7',
+                ...(isDesktop
+                    ? {
+                        maxHeight: items.length > maxVisibleResults
+                            ? maxVisibleResults * approxItemHeight
+                            : 'auto',
+                        borderRadius: '12px',
+                        overflowX: 'hidden',
+                        overflowY: items.length > maxVisibleResults ? 'auto' : 'hidden',
+                        pb: 1.5,
+                    }
+                    : {
+                        overflow: 'hidden', // no scroll, no scrollbar
+                        pb: 0,
+                    }),
+            }, children: jsxRuntime.jsx(material.List, { dense: true, disablePadding: true, children: items.map((item, index) => (jsxRuntime.jsx(material.ListItemButton, { alignItems: "flex-start", onClick: () => onPick(item), sx: {
+                        py: 1.5,
+                        px: 2,
+                        backgroundColor: '#FEFDF7',
+                        // dividers only on mobile (your current mobile styling)
+                        ...(isDesktop
+                            ? {}
+                            : {
+                                borderBottom: index === items.length - 1
+                                    ? 'none'
+                                    : '1px solid rgba(77,48,25,0.18)',
+                            }),
+                        '&:hover': { backgroundColor: '#F9F0FC' },
+                        '&:hover .search-result-title': {
+                            textDecoration: 'underline',
+                            color: '#AD46FF',
+                        },
+                    }, children: jsxRuntime.jsx(material.ListItemText, { primary: item.label, secondary: renderDescription(item.description), primaryTypographyProps: {
+                            className: 'search-result-title',
+                            fontWeight: 700,
+                            fontSize: '16px',
+                            color: '#4D3019',
+                        }, secondaryTypographyProps: { component: 'div', mt: 1 } }) }, index))) }) }));
+    };
+    return (jsxRuntime.jsxs(material.Box, { children: [jsxRuntime.jsxs(StyledHeader, { ref: headerRef, children: [isActive && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(material.IconButton, { disableRipple: true, onClick: toggleMenu, sx: { display: { xs: 'block', md: 'none' } }, size: "large", children: jsxRuntime.jsx(iconsMaterial.MenuRounded, { sx: { fontSize: 32, color: 'white' } }) }), jsxRuntime.jsx(material.Divider, { orientation: "vertical", sx: {
+                                    color: '#FFFFFF',
+                                    borderRightWidth: 2,
+                                    display: { xs: 'block', md: 'none' },
+                                } })] })), jsxRuntime.jsx(StyledLogoWrapper, { children: jsxRuntime.jsx(StyledLogoIcon, { children: jsxRuntime.jsx(StyledLogoSvg, {}) }) }), isActive && isMdUp && (jsxRuntime.jsxs(StyledSearchContainer, { children: [jsxRuntime.jsx(StyledTextField, { placeholder: "Search for a policy", variant: "outlined", fullWidth: true, value: searchQuery, inputRef: desktopInputRef, ref: desktopFieldRef, onChange: (e) => handleSearchChange(e.target.value), onKeyDown: handleKeyDown, InputProps: {
+                                    endAdornment: (jsxRuntime.jsx(StyledSearchButton, { onClick: handleSearchClick, children: jsxRuntime.jsx(StyledSearchIcon, { children: jsxRuntime.jsx(iconsMaterial.SearchRounded, {}) }) })),
+                                } }), jsxRuntime.jsx(material.Popper, { open: openDropdown && results.length > 0 && !!desktopFieldRef.current, anchorEl: desktopFieldRef.current, placement: "bottom-start", style: { zIndex: 1300, width: desktopFieldRef.current?.offsetWidth }, children: jsxRuntime.jsx(ResultsList, { mode: "desktop", items: results, onPick: (item) => {
                                         onResultClick?.(item);
                                         setOpenDropdown(false);
-                                    }, children: jsxRuntime.jsx(material.ListItemText, { primary: item.label, secondary: item.description, primaryTypographyProps: {
-                                            fontWeight: 700,
-                                            fontSize: '0.95rem',
-                                        }, secondaryTypographyProps: {
-                                            fontSize: '0.85rem',
-                                            mt: 0.25,
-                                        } }) }, index))) }) }) })] })), jsxRuntime.jsxs(StyledUserContainer, { children: [signUpStatus === 'Active' && (jsxRuntime.jsx(StyledSearchButton, { disableRipple: true, sx: {
-                            display: { xs: 'flex', md: 'none' },
-                            backgroundColor: '#ffffff83',
-                        }, children: jsxRuntime.jsx(StyledSearchIcon, { children: jsxRuntime.jsx(iconsMaterial.SearchRounded, {}) }) })), jsxRuntime.jsxs(material.IconButton, { onClick: handleOpen, disableRipple: true, children: [jsxRuntime.jsx(StyledAvatar, { children: jsxRuntime.jsx(StyledAvatarText, { children: userInitials }) }), jsxRuntime.jsx(StyledUserName, { children: userName })] })] }), jsxRuntime.jsx(PopoverMenu.default, { anchorEl: anchorEl, onClose: handleClose, signOut: () => {
-                    signOut();
-                    handleClose();
-                } })] }));
+                                    } }) })] })), jsxRuntime.jsxs(StyledUserContainer, { children: [isActive && !isMdUp && (jsxRuntime.jsx(StyledSearchButton, { disableRipple: true, onClick: toggleMobileSearch, sx: {
+                                    display: { xs: 'flex', md: 'none' },
+                                    backgroundColor: '#ffffff83',
+                                }, children: jsxRuntime.jsx(StyledSearchIcon, { children: jsxRuntime.jsx(iconsMaterial.SearchRounded, {}) }) })), jsxRuntime.jsxs(material.IconButton, { onClick: handleOpen, disableRipple: true, children: [jsxRuntime.jsx(StyledAvatar, { children: jsxRuntime.jsx(StyledAvatarText, { children: userInitials }) }), jsxRuntime.jsx(StyledUserName, { children: userName })] })] }), jsxRuntime.jsx(PopoverMenu.default, { anchorEl: anchorEl, onClose: handleClose, signOut: () => {
+                            signOut();
+                            handleClose();
+                        } })] }), !isMdUp && (jsxRuntime.jsx(material.Collapse, { in: isActive && mobileSearchOpen, unmountOnExit: true, timeout: 200, children: jsxRuntime.jsxs(material.Box, { sx: {
+                        display: { xs: 'block', md: 'none' },
+                        backgroundColor: theme.palette.primary.main,
+                        px: 2,
+                        pt: 1.5,
+                        pb: 2,
+                    }, children: [jsxRuntime.jsxs(material.Box, { sx: { display: 'flex', gap: 1, alignItems: 'center' }, children: [jsxRuntime.jsx(StyledTextField, { placeholder: "Search for a policy", variant: "outlined", fullWidth: true, value: searchQuery, inputRef: mobileInputRef, onChange: (e) => handleSearchChange(e.target.value), onKeyDown: handleKeyDown }), jsxRuntime.jsx(material.IconButton, { onClick: closeMobileSearch, sx: { color: theme.palette.light.main }, children: jsxRuntime.jsx(iconsMaterial.CloseRounded, {}) })] }), openDropdown && mobileResultsToShow.length > 0 && (jsxRuntime.jsx(material.Box, { sx: { mx: -2 }, children: jsxRuntime.jsx(ResultsList, { mode: "mobile", items: mobileResultsToShow, paperRef: mobileResultsPaperRef, onPick: (item) => {
+                                    onResultClick?.(item);
+                                    setOpenDropdown(false);
+                                } }) }))] }) }))] }));
 };
 
 exports.Header = Header;

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

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../../../src/components/Header.tsx"],"sourcesContent":["import React, { ChangeEvent } from 'react';\r\nimport {\r\n  Box,\r\n  styled,\r\n  Typography,\r\n  TextField,\r\n  IconButton,\r\n  Divider,\r\n  Popper,\r\n  Paper,\r\n  List,\r\n  ListItemText,\r\n  ListItemButton,\r\n} from '@mui/material';\r\nimport { useTheme } from '../ThemeProvider';\r\nimport { MenuRounded, SearchRounded } from '@mui/icons-material';\r\nimport PopoverMenu from './PopoverMenu';\r\nimport { ReactComponent as Logo } from '../images/PrimaryLogo_Variation_Cream.svg';\r\n\r\ntype SignUpStatus = 'Withdrawn' | 'Onboarding' | 'Active' | 'In Review';\r\ninterface HeaderProps {\r\n  userName?: string;\r\n  userInitials?: string;\r\n  toggleMenu: () => void;\r\n  signOut: () => void;\r\n  search?: (query: string) => Promise<HeaderSearchResult[]> | HeaderSearchResult[];\r\n  onResultClick?: (result: HeaderSearchResult) => void;\r\n  signUpStatus: SignUpStatus;\r\n}\r\n\r\nexport interface HeaderSearchResult {\r\n  label: string;\r\n  description?: string;\r\n  value: string;\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),\r\n  height: '64px', \r\n}));\r\n\r\n\r\nconst StyledLogoIcon = styled(Box)(({ theme }) => ({\r\n  width: '100%',\r\n  height: '100%',\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'center',\r\n  color: theme.palette.light.main,\r\n}));\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 StyledLogoSvg = styled(Logo)`\r\n  width: 100%;\r\n  height: 100%;\r\n  display: block;\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  onResultClick,\r\n  signUpStatus,\r\n}) => {\r\n  const theme = useTheme();\r\n  const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null);\r\n  const [searchQuery, setSearchQuery] = React.useState('');\r\n  const [results, setResults] = React.useState<HeaderSearchResult[]>([]);\r\n  const [openDropdown, setOpenDropdown] = React.useState(false);\r\n  const inputRef = React.useRef<HTMLInputElement | null>(null);\r\n  const debounceRef = React.useRef<number | undefined>(undefined);\r\n\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  const runSearch = async (term: string) => {\r\n    if (!search) {\r\n      setResults([]);\r\n      setOpenDropdown(false);\r\n      return;\r\n    }\r\n\r\n    const trimmed = term.trim();\r\n    if (!trimmed) {\r\n      setResults([]);\r\n      setOpenDropdown(false);\r\n      return;\r\n    }\r\n\r\n    const res = await Promise.resolve(search(trimmed));\r\n    const list = Array.isArray(res) ? res : [];\r\n    setResults(list);\r\n    setOpenDropdown(list.length > 0);\r\n  };\r\n\r\n  const handleSearchClick: React.MouseEventHandler<HTMLButtonElement> = (e) => {\r\n    e.preventDefault();\r\n    runSearch(searchQuery);\r\n  };\r\n\r\n\r\n  React.useEffect(() => {\r\n    const handler = (e: MouseEvent) => {\r\n      const anchor = inputRef.current?.parentElement;\r\n      if (anchor && !anchor.contains(e.target as Node)) {\r\n        setOpenDropdown(false);\r\n      }\r\n    };\r\n    document.addEventListener('click', handler);\r\n    return () => document.removeEventListener('click', handler);\r\n  }, []);\r\n\r\n  return (\r\n    <StyledHeader>\r\n      {signUpStatus === 'Active' && (\r\n        <>\r\n          <IconButton\r\n            disableRipple\r\n            onClick={toggleMenu}\r\n            sx={{ display: { xs: 'block', md: 'none' } }}\r\n            size=\"large\"\r\n          >\r\n            <MenuRounded sx={{ fontSize: 32, color: 'white' }} />\r\n          </IconButton>\r\n\r\n          <Divider\r\n            orientation=\"vertical\"\r\n            sx={{\r\n              color: '#FFFFFF',\r\n              borderRightWidth: 2,\r\n              display: { xs: 'block', md: 'none' },\r\n            }}\r\n          />\r\n        </>\r\n      )}\r\n\r\n      <StyledLogoWrapper>\r\n        <StyledLogoIcon>\r\n          <StyledLogoSvg />\r\n        </StyledLogoIcon>\r\n      </StyledLogoWrapper>\r\n\r\n      {/* Search input for md+ screens */}\r\n      {signUpStatus === 'Active' && (\r\n        <StyledSearchContainer>\r\n          <StyledTextField\r\n            placeholder=\"Search for a policy\"\r\n            variant=\"outlined\"\r\n            fullWidth\r\n            value={searchQuery}\r\n            inputRef={inputRef}\r\n            onChange={(event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n              const value = event.target.value;\r\n              setSearchQuery(value);\r\n\r\n              window.clearTimeout(debounceRef.current);\r\n              debounceRef.current = window.setTimeout(() => {\r\n                runSearch(value);\r\n              }, 300); // 300ms debounce\r\n            }}\r\n            onKeyDown={(e) => {\r\n              if (e.key === 'Enter') {\r\n                handleSearchClick;\r\n              }\r\n            }}\r\n            sx={{ display: { xs: 'none', sm: 'none', md: 'block' } }}\r\n            InputProps={{\r\n              endAdornment: (\r\n                <StyledSearchButton onClick={handleSearchClick}>\r\n                  <StyledSearchIcon>\r\n                    <SearchRounded />\r\n                  </StyledSearchIcon>\r\n                </StyledSearchButton>\r\n              ),\r\n            }}\r\n          />\r\n\r\n          {/* 🔽 Dropdown with results */}\r\n          <Popper\r\n            open={openDropdown && results.length > 0}\r\n            anchorEl={inputRef.current}\r\n            placement=\"bottom-start\"\r\n            style={{\r\n              zIndex: 1300,\r\n              width: inputRef.current?.offsetWidth,\r\n            }}\r\n          >\r\n            <Paper\r\n              elevation={3}\r\n              sx={{\r\n                mt: 1,\r\n                borderRadius: 2,\r\n                maxHeight: 320,\r\n                overflowY: 'auto',\r\n              }}\r\n            >\r\n              <List dense disablePadding>\r\n                {results.map((item, index) => (\r\n                  <ListItemButton\r\n                    key={index}\r\n                    onClick={() => {\r\n                      onResultClick?.(item);\r\n                      setOpenDropdown(false);\r\n                    }}\r\n                  >\r\n                    <ListItemText\r\n                      primary={item.label}\r\n                      secondary={item.description}\r\n                      primaryTypographyProps={{\r\n                        fontWeight: 700,\r\n                        fontSize: '0.95rem',\r\n                      }}\r\n                      secondaryTypographyProps={{\r\n                        fontSize: '0.85rem',\r\n                        mt: 0.25,\r\n                      }}\r\n                    />\r\n                  </ListItemButton>\r\n                ))}\r\n              </List>\r\n            </Paper>\r\n          </Popper>\r\n        </StyledSearchContainer>\r\n      )}\r\n\r\n      <StyledUserContainer>\r\n        {/* Search button only visible on XS screens (you can wire this up later) */}\r\n        {signUpStatus === 'Active' && (\r\n          <StyledSearchButton\r\n            disableRipple\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        )}\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={() => {\r\n          signOut();\r\n          handleClose();\r\n        }}\r\n      />\r\n    </StyledHeader>\r\n  );\r\n};"],"names":["styled","Box","Typography","Logo","TextField","IconButton","_jsxs","_Fragment","_jsx","MenuRounded","Divider","SearchRounded","Popper","Paper","List","ListItemButton","ListItemText","PopoverMenu"],"mappings":"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"}
+{"version":3,"file":"Header.js","sources":["../../../../src/components/Header.tsx"],"sourcesContent":["import React, { ChangeEvent } from 'react';\r\nimport {\r\n  Box,\r\n  styled,\r\n  Typography,\r\n  TextField,\r\n  IconButton,\r\n  Divider,\r\n  Popper,\r\n  Paper,\r\n  List,\r\n  ListItemText,\r\n  ListItemButton,\r\n  Collapse,\r\n  useMediaQuery,\r\n} from '@mui/material';\r\nimport { useTheme } from '../ThemeProvider';\r\nimport { MenuRounded, SearchRounded, CloseRounded } from '@mui/icons-material';\r\nimport PopoverMenu from './PopoverMenu';\r\nimport { ReactComponent as Logo } from '../images/PrimaryLogo_Variation_Cream.svg';\r\n\r\ntype SignUpStatus = 'Withdrawn' | 'Onboarding' | 'Active' | 'In Review';\r\ninterface HeaderProps {\r\n  userName?: string;\r\n  userInitials?: string;\r\n  toggleMenu: () => void;\r\n  signOut: () => void;\r\n  search?: (query: string) => Promise<HeaderSearchResult[]> | HeaderSearchResult[];\r\n  onResultClick?: (result: HeaderSearchResult) => void;\r\n  signUpStatus: SignUpStatus;\r\n  resetKey?: string | number;\r\n}\r\n\r\nexport interface HeaderSearchResult {\r\n  label: string;\r\n  description?: string;\r\n  value: string;\r\n}\r\n\r\nfunction renderDescription(desc: string): React.ReactNode {\r\n  if (!desc) return null;\r\n\r\n  const lines = desc.split(/\\r?\\n/).filter(line => line.trim().length > 0);\r\n\r\n  const bulletLines = lines.filter(line => line.trim().startsWith(\"* \"));\r\n  const nonBulletLines = lines.filter(line => !line.trim().startsWith(\"* \"));\r\n\r\n  return (\r\n    <div style={{ fontSize: 14, lineHeight: 1.5 }}>\r\n      {nonBulletLines.length > 0 && (\r\n        <div\r\n          style={{\r\n            whiteSpace: \"pre-line\",\r\n            marginBottom: bulletLines.length > 0 ? 6 : 0, // spacing above bullets\r\n          }}\r\n        >\r\n          {nonBulletLines.join(\"\\n\")}\r\n        </div>\r\n      )}\r\n\r\n      {bulletLines.length > 0 && (\r\n        <ul style={{ margin: 0, paddingLeft: 18 }}>\r\n          {bulletLines.map((line, idx) => (\r\n            <li key={idx}>\r\n              {line.trim().replace(/^\\*\\s*/, \"\")}\r\n            </li>\r\n          ))}\r\n        </ul>\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n\r\nconst StyledHeader = styled(Box)(({ theme }) => ({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'flex-start',\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),\r\n  height: '64px', \r\n}));\r\n\r\n\r\nconst StyledLogoIcon = styled(Box)(({ theme }) => ({\r\n  width: '100%',\r\n  height: '100%',\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'center',\r\n  color: theme.palette.light.main,\r\n}));\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 StyledLogoSvg = styled(Logo)`\r\n  width: 100%;\r\n  height: 100%;\r\n  display: block;\r\n`;\r\n\r\n\r\nconst StyledSearchContainer = styled(Box)(({ theme }) => ({\r\n  flex: 1,\r\n  maxWidth: '45rem',\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  marginLeft: 'auto',\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  onResultClick,\r\n  signUpStatus,\r\n  resetKey,\r\n}) => {\r\n  const theme = useTheme();\r\n  const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null);\r\n  const [searchQuery, setSearchQuery] = React.useState('');\r\n  const [results, setResults] = React.useState<HeaderSearchResult[]>([]);\r\n  const [openDropdown, setOpenDropdown] = React.useState(false);\r\n\r\n  const isMdUp = useMediaQuery(theme.breakpoints.up('md'));\r\n  const [mobileSearchOpen, setMobileSearchOpen] = React.useState(false);\r\n\r\n  const desktopInputRef = React.useRef<HTMLInputElement | null>(null);\r\n  const mobileInputRef = React.useRef<HTMLInputElement | null>(null);\r\n  const desktopFieldRef = React.useRef<HTMLDivElement | null>(null);\r\n\r\n\r\n  const headerRef = React.useRef<HTMLDivElement | null>(null);\r\n  const [headerHeight, setHeaderHeight] = React.useState(64);\r\n  const isActive = signUpStatus === 'Active';\r\n\r\n  const mobileResultsPaperRef = React.useRef<HTMLDivElement | null>(null);\r\n  const [mobileResultLimit, setMobileResultLimit] = React.useState(5);\r\n\r\n  const searchSeqRef = React.useRef(0);\r\n  const debounceRef = React.useRef<number | undefined>(undefined);\r\n  const maxVisibleResults = isMdUp ? 5 : 3;\r\n  const approxItemHeight = 80;  \r\n\r\n  React.useLayoutEffect(() => {\r\n    const update = () => setHeaderHeight(headerRef.current?.offsetHeight ?? 64);\r\n    update();\r\n    window.addEventListener('resize', update);\r\n    return () => window.removeEventListener('resize', update);\r\n  }, []);\r\n\r\n  // Start at 5 each time results open/change on mobile\r\n  React.useLayoutEffect(() => {\r\n    if (isMdUp) return;\r\n    if (!mobileSearchOpen || !openDropdown) return;\r\n    setMobileResultLimit(5);\r\n  }, [isMdUp, mobileSearchOpen, openDropdown, results]);\r\n\r\n  // If the dropdown would run off-screen, reduce how many results we render\r\n  React.useLayoutEffect(() => {\r\n    if (isMdUp) return;\r\n    if (!mobileSearchOpen || !openDropdown) return;\r\n\r\n    const raf = requestAnimationFrame(() => {\r\n      const el = mobileResultsPaperRef.current;\r\n      if (!el) return;\r\n\r\n      const rect = el.getBoundingClientRect();\r\n      const overflowPx = rect.bottom - window.innerHeight;\r\n\r\n      if (overflowPx > 0) {\r\n        setMobileResultLimit((n) => Math.max(1, n - 1));\r\n      }\r\n    });\r\n\r\n  return () => cancelAnimationFrame(raf);\r\n}, [isMdUp, mobileSearchOpen, openDropdown, mobileResultLimit]);\r\n\r\n\r\n  const closeMobileSearch = () => {\r\n    setMobileSearchOpen(false);\r\n    setSearchQuery('');\r\n    setResults([]);\r\n    setOpenDropdown(false);\r\n    window.clearTimeout(debounceRef.current);\r\n  };\r\n\r\n  const toggleMobileSearch = () => {\r\n    setMobileSearchOpen(prev => {\r\n      const next = !prev;\r\n      if (!next) {\r\n        // cancelling\r\n        closeMobileSearch();\r\n        return false;\r\n      }\r\n      // opening\r\n      setTimeout(() => mobileInputRef.current?.focus(), 0);\r\n      return true;\r\n    });\r\n  };\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  const runSearch = async (term: string) => {\r\n    const seq = ++searchSeqRef.current;\r\n\r\n    if (!search) {\r\n      setResults([]);\r\n      setOpenDropdown(false);\r\n      return;\r\n    }\r\n\r\n    const trimmed = term.trim();\r\n    if (!trimmed) {\r\n      setResults([]);\r\n      setOpenDropdown(false);\r\n      return;\r\n    }\r\n\r\n    const res = await Promise.resolve(search(trimmed));\r\n\r\n    if (seq !== searchSeqRef.current) return; // Fixes debounce race condition causing old searches to appear after newer\r\n\r\n    const list = Array.isArray(res) ? res : [];\r\n    setResults(list);\r\n    setOpenDropdown(list.length > 0);\r\n  };\r\n\r\n  const handleKeyDown = (e: React.KeyboardEvent) => {\r\n    if (e.key === 'Enter') {\r\n      e.preventDefault();\r\n      runSearch(searchQuery);\r\n    }\r\n  };\r\n\r\n  const handleSearchChange = (value: string) => {\r\n    setSearchQuery(value);\r\n\r\n    window.clearTimeout(debounceRef.current);\r\n\r\n    if (!value.trim()) {\r\n      runSearch(''); // Immediately run if no search to guarantee removal of listed results\r\n      return;\r\n    }\r\n\r\n    debounceRef.current = window.setTimeout(() => runSearch(value), 150);\r\n  };\r\n\r\n\r\n\r\n  const handleSearchClick: React.MouseEventHandler<HTMLButtonElement> = (e) => {\r\n    e.preventDefault();\r\n    runSearch(searchQuery);\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    // When parent says the route changed (resetKey changes), reset search UI\r\n    closeMobileSearch();\r\n  }, [resetKey]);\r\n\r\n  React.useEffect(() => {\r\n    const handler = (e: MouseEvent) => {\r\n      const t = e.target as Node;\r\n\r\n      const inDesktop = desktopInputRef.current?.parentElement?.contains(t);\r\n      const inMobile = mobileInputRef.current?.parentElement?.contains(t);\r\n\r\n      if (!inDesktop && !inMobile) {\r\n        setOpenDropdown(false);\r\n      }\r\n    };\r\n\r\n    document.addEventListener('click', handler);\r\n    return () => document.removeEventListener('click', handler);\r\n  }, []);\r\n\r\n  const mobileResultsToShow = results.slice(0, mobileResultLimit);\r\n\r\n  type ResultsMode = 'desktop' | 'mobile';\r\n\r\n  const ResultsList = ({\r\n    items,\r\n    mode,\r\n    paperRef,\r\n    onPick,\r\n  }: {\r\n    items: HeaderSearchResult[];\r\n    mode: ResultsMode;\r\n    paperRef?: React.Ref<HTMLDivElement>;\r\n    onPick: (item: HeaderSearchResult) => void;\r\n  }) => {\r\n    const isDesktop = mode === 'desktop';\r\n    return (\r\n      <Paper\r\n        ref={paperRef}\r\n        elevation={0}\r\n        \r\n        sx={{\r\n          mt: 1,\r\n          border: '1px solid #4D3019',\r\n          boxShadow: 'none',\r\n          backgroundColor: '#FEFDF7',\r\n\r\n          ...(isDesktop\r\n            ? {\r\n                maxHeight:\r\n                  items.length > maxVisibleResults\r\n                    ? maxVisibleResults * approxItemHeight\r\n                    : 'auto',\r\n                borderRadius: '12px',\r\n                overflowX: 'hidden',\r\n                overflowY: items.length > maxVisibleResults ? 'auto' : 'hidden',\r\n                pb: 1.5,\r\n              }\r\n            : {\r\n                overflow: 'hidden', // no scroll, no scrollbar\r\n                pb: 0,\r\n              }),\r\n        }}\r\n      >\r\n        <List dense disablePadding>\r\n          {items.map((item, index) => (\r\n            <ListItemButton\r\n              key={index}\r\n              alignItems=\"flex-start\"\r\n              onClick={() => onPick(item)}\r\n              sx={{\r\n                py: 1.5,\r\n                px: 2,\r\n                backgroundColor: '#FEFDF7',\r\n\r\n                // dividers only on mobile (your current mobile styling)\r\n                ...(isDesktop\r\n                  ? {}\r\n                  : {\r\n                      borderBottom:\r\n                        index === items.length - 1\r\n                          ? 'none'\r\n                          : '1px solid rgba(77,48,25,0.18)',\r\n                    }),\r\n\r\n                '&:hover': { backgroundColor: '#F9F0FC' },\r\n                '&:hover .search-result-title': {\r\n                  textDecoration: 'underline',\r\n                  color: '#AD46FF',\r\n                },\r\n              }}\r\n            >\r\n              <ListItemText\r\n                primary={item.label}\r\n                secondary={renderDescription(item.description!)}\r\n                primaryTypographyProps={{\r\n                  className: 'search-result-title',\r\n                  fontWeight: 700,\r\n                  fontSize: '16px',\r\n                  color: '#4D3019',\r\n                }}\r\n                secondaryTypographyProps={{ component: 'div', mt: 1 }}\r\n              />\r\n            </ListItemButton>\r\n          ))}\r\n        </List>\r\n      </Paper>\r\n    );\r\n  };\r\n\r\n\r\n  return (\r\n    <Box>\r\n      <StyledHeader ref={headerRef}>\r\n        {isActive && (\r\n          <>\r\n            <IconButton\r\n              disableRipple\r\n              onClick={toggleMenu}\r\n              sx={{ display: { xs: 'block', md: 'none' } }}\r\n              size=\"large\"\r\n            >\r\n              <MenuRounded sx={{ fontSize: 32, color: 'white' }} />\r\n            </IconButton>\r\n\r\n            <Divider\r\n              orientation=\"vertical\"\r\n              sx={{\r\n                color: '#FFFFFF',\r\n                borderRightWidth: 2,\r\n                display: { xs: 'block', md: 'none' },\r\n              }}\r\n            />\r\n          </>\r\n        )}\r\n\r\n        <StyledLogoWrapper>\r\n          <StyledLogoIcon>\r\n            <StyledLogoSvg />\r\n          </StyledLogoIcon>\r\n        </StyledLogoWrapper>\r\n\r\n        {/* Desktop search only */}\r\n        {isActive && isMdUp && (\r\n          <StyledSearchContainer>\r\n            <StyledTextField\r\n              placeholder=\"Search for a policy\"\r\n              variant=\"outlined\"\r\n              fullWidth\r\n              value={searchQuery}\r\n              inputRef={desktopInputRef}\r\n              ref={desktopFieldRef}\r\n              onChange={(e) => handleSearchChange(e.target.value)}\r\n              onKeyDown={handleKeyDown}\r\n              InputProps={{\r\n                endAdornment: (\r\n                  <StyledSearchButton onClick={handleSearchClick}>\r\n                    <StyledSearchIcon>\r\n                      <SearchRounded />\r\n                    </StyledSearchIcon>\r\n                  </StyledSearchButton>\r\n                ),\r\n              }}\r\n            />\r\n\r\n            <Popper\r\n              open={openDropdown && results.length > 0 && !!desktopFieldRef.current}\r\n              anchorEl={desktopFieldRef.current}\r\n              placement=\"bottom-start\"\r\n              style={{ zIndex: 1300, width: desktopFieldRef.current?.offsetWidth }}\r\n            >\r\n              <ResultsList\r\n                mode=\"desktop\"\r\n                items={results}\r\n                onPick={(item) => {\r\n                  onResultClick?.(item);\r\n                  setOpenDropdown(false);\r\n                }}\r\n              />\r\n            </Popper>\r\n          </StyledSearchContainer>\r\n        )}\r\n\r\n        <StyledUserContainer>\r\n          {/* Mobile search button only */}\r\n          {isActive && !isMdUp && (\r\n            <StyledSearchButton\r\n              disableRipple\r\n              onClick={toggleMobileSearch}\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          )}\r\n\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={() => {\r\n            signOut();\r\n            handleClose();\r\n          }}\r\n        />\r\n      </StyledHeader>\r\n\r\n      {/* Mobile panel only */}\r\n      {!isMdUp && (\r\n        <Collapse in={isActive && mobileSearchOpen} unmountOnExit timeout={200}>\r\n          <Box\r\n            sx={{\r\n              display: { xs: 'block', md: 'none' },\r\n              backgroundColor: theme.palette.primary.main,\r\n              px: 2,\r\n              pt: 1.5,\r\n              pb: 2,\r\n            }}\r\n          >\r\n            <Box sx={{ display: 'flex', gap: 1, alignItems: 'center' }}>\r\n              <StyledTextField\r\n                placeholder=\"Search for a policy\"\r\n                variant=\"outlined\"\r\n                fullWidth\r\n                value={searchQuery}\r\n                inputRef={mobileInputRef}\r\n                onChange={(e) => handleSearchChange(e.target.value)}\r\n                onKeyDown={handleKeyDown}\r\n              />\r\n\r\n              <IconButton onClick={closeMobileSearch} sx={{ color: theme.palette.light.main }}>\r\n                <CloseRounded />\r\n              </IconButton>\r\n            </Box>\r\n\r\n            {openDropdown && mobileResultsToShow.length > 0 && (\r\n              <Box sx={{ mx: -2 }}>\r\n                <ResultsList\r\n                  mode=\"mobile\"\r\n                  items={mobileResultsToShow}\r\n                  paperRef={mobileResultsPaperRef}\r\n                  onPick={(item) => {\r\n                    onResultClick?.(item);\r\n                    setOpenDropdown(false);\r\n                  }}\r\n                />\r\n              </Box>\r\n            )}\r\n          </Box>\r\n        </Collapse>\r\n      )}\r\n    </Box>\r\n  );\r\n};"],"names":["_jsxs","_jsx","styled","Box","Typography","Logo","TextField","IconButton","useTheme","useMediaQuery","Paper","List","ListItemButton","ListItemText","_Fragment","MenuRounded","Divider","SearchRounded","Popper","PopoverMenu","Collapse","CloseRounded"],"mappings":"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"}

package/dist/cjs/components/NoteBox.js

@@ -99,7 +99,6 @@ const NoteBox = ({ status, requirementType, label, note, children, className = '
     const [isHovered, setIsHovered] = React.useState(false);
     // Map current status
     const variableState = variableProcessing.mapStatusToVariableState(status);
-    console.log("HELLO", status, requirementType);
     const requirementTypeState = variableProcessing.mapRequirementTypeToState(requirementType);
     const style = variableState
         ? statusConfig[variableState]

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

@@ -1 +1 @@
-{"version":3,"file":"NoteBox.js","sources":["../../../../src/components/NoteBox.tsx"],"sourcesContent":["import React, { useState } from 'react';\r\nimport { Box, Typography, IconButton, styled, Chip } from '@mui/material';\r\nimport { CheckRounded, EditRounded } from '@mui/icons-material';\r\nimport { Alert } from './Alert';\r\nimport { RequirementType, VariableState } from '../types/variable';\r\nimport { mapRequirementTypeToState, mapStatusToVariableState } from '../helpers/variableProcessing';\r\n\r\ninterface NoteBoxProps {\r\n  status?: string; // Use only status now\r\n  requirementType?: string;\r\n  label?: string;\r\n  note?: string;\r\n  children: React.ReactNode;\r\n  className?: string;\r\n  onEditClick?: () => void;\r\n}\r\n\r\n// Status based color configs (from Modal)\r\nconst statusConfig: {\r\n  [key in VariableState]: {\r\n    highlight: string;\r\n    highlightSelected: string;\r\n    label: string;\r\n    alertVariant?: \"error\" | \"info\";\r\n  }\r\n} = {\r\n  Accepted: {\r\n    highlight: '#EDF9CD',\r\n    highlightSelected: '#DBF59A',\r\n    label: 'Accepted',\r\n  },\r\n  Pending: {\r\n    highlight: '#F5E2FF',\r\n    highlightSelected: '#EBC7FF',\r\n    label: 'Pending',\r\n    alertVariant: 'info',\r\n  },\r\n  'Action Required': {\r\n    highlight: '#FBEEEE',\r\n    highlightSelected: '#FFBCB3',\r\n    label: 'ActionRequired',\r\n    alertVariant: 'error',\r\n  },\r\n  'Declined': {\r\n    highlight: '#FFF6D1',\r\n    highlightSelected: '#FDE58E',\r\n    label: 'Declined',\r\n  },\r\n  'Not Started': {\r\n    highlight: '#f8c97cff',\r\n    highlightSelected: '#F5A623',\r\n    label: 'Not Started',\r\n  },\r\n  Draft: {\r\n    highlight: '#FFEACD',\r\n    highlightSelected: '#FFC365',\r\n    label: 'Draft',\r\n  },\r\n};\r\n\r\nconst NoteContainer = styled(Box)({\r\n  position: 'relative',\r\n  display: 'inline',\r\n  maxWidth: '100%',\r\n});\r\n\r\n// Uses highlight colors driven by status exclusively\r\nconst HighlightWrapper = styled(Box, {\r\n  shouldForwardProp: (prop) =>\r\n    prop !== 'isHovered' &&\r\n    prop !== 'highlightColor' &&\r\n    prop !== 'highlightSelectedColor'\r\n})<{\r\n  isHovered: boolean;\r\n  highlightColor: string;\r\n  highlightSelectedColor: string;\r\n}>(({ isHovered, highlightColor, highlightSelectedColor }) => ({\r\n  position: 'relative',\r\n  display: 'inline',\r\n  maxWidth: '100%',\r\n  '&:hover .edit-button': {\r\n    opacity: 1,\r\n  },\r\n  '& .highlight-span': {\r\n    background: isHovered ? highlightSelectedColor : highlightColor,\r\n    padding: '2px 4px',\r\n    borderBottom: '2px solid rgba(77, 48, 25, 0.3)',\r\n    boxDecorationBreak: 'clone',\r\n    WebkitBoxDecorationBreak: 'clone',\r\n    transition: 'background 0.2s ease',\r\n    cursor: 'pointer',\r\n    fontSize: '1rem',\r\n    wordWrap: 'break-word',\r\n    overflowWrap: 'break-word',\r\n    display: 'inline',\r\n    color: '#4D3019',\r\n  },\r\n}));\r\n\r\nconst EditButton = styled(IconButton)(({ theme }) => ({\r\n  top: 0,\r\n  right: 0,\r\n  transform: 'translate(-50%, -50%)',\r\n  position: 'relative',\r\n  width: 20,\r\n  height: 20,\r\n  marginRight: -20,\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: '#4D3019',\r\n  opacity: 0,\r\n  transition: 'all 0.2s ease',\r\n  boxShadow: '0 1px 3px rgba(0,0,0,0.12)',\r\n  '&:hover': {\r\n    backgroundColor: '#4D3019',\r\n    transform: 'translate(-50%, -50%) scale(1.1)',\r\n  },\r\n}));\r\n\r\nexport const NoteBox: React.FC<NoteBoxProps> = ({\r\n  status,\r\n  requirementType,\r\n  label,\r\n  note,\r\n  children,\r\n  className = '',\r\n  onEditClick,\r\n}) => {\r\n  const [isHovered, setIsHovered] = useState(false);\r\n\r\n  // Map current status\r\n  const variableState = mapStatusToVariableState(status!!);\r\n  console.log(\"HELLO\", status, requirementType);\r\n  const requirementTypeState = mapRequirementTypeToState(requirementType!!)\r\n\r\n  const style = variableState\r\n    ? statusConfig[variableState]\r\n    : {\r\n        highlight: '#EEE',\r\n        highlightSelected: '#DDD',\r\n        label: label || '',\r\n      };\r\n\r\n\r\n  const reqTypeConfig = {\r\n    Default: {\r\n      color: '#F5A623',\r\n      highlight: '#f3bf6bff',\r\n      highlightSelected: '#F5A623',\r\n      label: 'Mandatory',\r\n    },\r\n    Optional: {\r\n      color: '#F5D76E',\r\n      highlight: '#f3e2a5ff',\r\n      highlightSelected: '#F5D76E',\r\n      label: 'Optional',\r\n    },\r\n  };\r\n\r\n\r\n  const requirementTypeStyle = requirementTypeState ? reqTypeConfig[requirementTypeState] :\r\n  {\r\n    highlight: '#EEE',\r\n    highlightSelected: '#DDD',\r\n    label: label || '',\r\n  };;\r\n\r\n  \r\n  return (\r\n    <NoteContainer className={className}>\r\n      {/* Alert for note when status matches and note available */}\r\n      {variableState && style.alertVariant && note && (\r\n        <Alert variant={style.alertVariant} sx={{ mb: 1 }}>\r\n          {note}\r\n        </Alert>\r\n      )}\r\n\r\n      {/* Highlighted content box */}\r\n      <HighlightWrapper\r\n        isHovered={isHovered}\r\n        highlightColor={variableState === VariableState.NotStarted? requirementTypeStyle.highlight : style.highlight}\r\n        highlightSelectedColor={variableState === VariableState.NotStarted? requirementTypeStyle.highlightSelected : style.highlightSelected}\r\n        onMouseEnter={() => setIsHovered(true)}\r\n        onMouseLeave={() => setIsHovered(false)}\r\n        onClick={(e) => {\r\n          e.stopPropagation();\r\n          if (onEditClick) {\r\n            onEditClick();\r\n          }\r\n        }}\r\n      >\r\n        <span className=\"highlight-span\" style={{display:'inline'}}>{children}</span>\r\n        <EditButton\r\n          className=\"edit-button\"\r\n          onClick={(e) => {\r\n            e.stopPropagation();\r\n            if (onEditClick) {\r\n              onEditClick();\r\n            }\r\n          }}\r\n          size=\"small\"\r\n        >\r\n          {variableState === VariableState.Accepted\r\n            ? <CheckRounded sx={{ fontSize: 14, color: \"#FFFFFF\", strokeWidth: 2 }} />\r\n            : <EditRounded sx={{ fontSize: 14, color: \"#FFFFFF\", strokeWidth: 2 }} /> }\r\n        </EditButton>\r\n      </HighlightWrapper>\r\n    </NoteContainer>\r\n  );\r\n};\r\n"],"names":["styled","Box","IconButton","useState","mapStatusToVariableState","mapRequirementTypeToState","_jsxs","_jsx","Alert","VariableState","CheckRounded","EditRounded"],"mappings":"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"}
+{"version":3,"file":"NoteBox.js","sources":["../../../../src/components/NoteBox.tsx"],"sourcesContent":["import React, { useState } from 'react';\r\nimport { Box, Typography, IconButton, styled, Chip } from '@mui/material';\r\nimport { CheckRounded, EditRounded } from '@mui/icons-material';\r\nimport { Alert } from './Alert';\r\nimport { RequirementType, VariableState } from '../types/variable';\r\nimport { mapRequirementTypeToState, mapStatusToVariableState } from '../helpers/variableProcessing';\r\n\r\ninterface NoteBoxProps {\r\n  status?: string; // Use only status now\r\n  requirementType?: string;\r\n  label?: string;\r\n  note?: string;\r\n  children: React.ReactNode;\r\n  className?: string;\r\n  onEditClick?: () => void;\r\n}\r\n\r\n// Status based color configs (from Modal)\r\nconst statusConfig: {\r\n  [key in VariableState]: {\r\n    highlight: string;\r\n    highlightSelected: string;\r\n    label: string;\r\n    alertVariant?: \"error\" | \"info\";\r\n  }\r\n} = {\r\n  Accepted: {\r\n    highlight: '#EDF9CD',\r\n    highlightSelected: '#DBF59A',\r\n    label: 'Accepted',\r\n  },\r\n  Pending: {\r\n    highlight: '#F5E2FF',\r\n    highlightSelected: '#EBC7FF',\r\n    label: 'Pending',\r\n    alertVariant: 'info',\r\n  },\r\n  'Action Required': {\r\n    highlight: '#FBEEEE',\r\n    highlightSelected: '#FFBCB3',\r\n    label: 'ActionRequired',\r\n    alertVariant: 'error',\r\n  },\r\n  'Declined': {\r\n    highlight: '#FFF6D1',\r\n    highlightSelected: '#FDE58E',\r\n    label: 'Declined',\r\n  },\r\n  'Not Started': {\r\n    highlight: '#f8c97cff',\r\n    highlightSelected: '#F5A623',\r\n    label: 'Not Started',\r\n  },\r\n  Draft: {\r\n    highlight: '#FFEACD',\r\n    highlightSelected: '#FFC365',\r\n    label: 'Draft',\r\n  },\r\n};\r\n\r\nconst NoteContainer = styled(Box)({\r\n  position: 'relative',\r\n  display: 'inline',\r\n  maxWidth: '100%',\r\n});\r\n\r\n// Uses highlight colors driven by status exclusively\r\nconst HighlightWrapper = styled(Box, {\r\n  shouldForwardProp: (prop) =>\r\n    prop !== 'isHovered' &&\r\n    prop !== 'highlightColor' &&\r\n    prop !== 'highlightSelectedColor'\r\n})<{\r\n  isHovered: boolean;\r\n  highlightColor: string;\r\n  highlightSelectedColor: string;\r\n}>(({ isHovered, highlightColor, highlightSelectedColor }) => ({\r\n  position: 'relative',\r\n  display: 'inline',\r\n  maxWidth: '100%',\r\n  '&:hover .edit-button': {\r\n    opacity: 1,\r\n  },\r\n  '& .highlight-span': {\r\n    background: isHovered ? highlightSelectedColor : highlightColor,\r\n    padding: '2px 4px',\r\n    borderBottom: '2px solid rgba(77, 48, 25, 0.3)',\r\n    boxDecorationBreak: 'clone',\r\n    WebkitBoxDecorationBreak: 'clone',\r\n    transition: 'background 0.2s ease',\r\n    cursor: 'pointer',\r\n    fontSize: '1rem',\r\n    wordWrap: 'break-word',\r\n    overflowWrap: 'break-word',\r\n    display: 'inline',\r\n    color: '#4D3019',\r\n  },\r\n}));\r\n\r\nconst EditButton = styled(IconButton)(({ theme }) => ({\r\n  top: 0,\r\n  right: 0,\r\n  transform: 'translate(-50%, -50%)',\r\n  position: 'relative',\r\n  width: 20,\r\n  height: 20,\r\n  marginRight: -20,\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: '#4D3019',\r\n  opacity: 0,\r\n  transition: 'all 0.2s ease',\r\n  boxShadow: '0 1px 3px rgba(0,0,0,0.12)',\r\n  '&:hover': {\r\n    backgroundColor: '#4D3019',\r\n    transform: 'translate(-50%, -50%) scale(1.1)',\r\n  },\r\n}));\r\n\r\nexport const NoteBox: React.FC<NoteBoxProps> = ({\r\n  status,\r\n  requirementType,\r\n  label,\r\n  note,\r\n  children,\r\n  className = '',\r\n  onEditClick,\r\n}) => {\r\n  const [isHovered, setIsHovered] = useState(false);\r\n\r\n  // Map current status\r\n  const variableState = mapStatusToVariableState(status!!);\r\n  const requirementTypeState = mapRequirementTypeToState(requirementType!!)\r\n\r\n  const style = variableState\r\n    ? statusConfig[variableState]\r\n    : {\r\n        highlight: '#EEE',\r\n        highlightSelected: '#DDD',\r\n        label: label || '',\r\n      };\r\n\r\n\r\n  const reqTypeConfig = {\r\n    Default: {\r\n      color: '#F5A623',\r\n      highlight: '#f3bf6bff',\r\n      highlightSelected: '#F5A623',\r\n      label: 'Mandatory',\r\n    },\r\n    Optional: {\r\n      color: '#F5D76E',\r\n      highlight: '#f3e2a5ff',\r\n      highlightSelected: '#F5D76E',\r\n      label: 'Optional',\r\n    },\r\n  };\r\n\r\n\r\n  const requirementTypeStyle = requirementTypeState ? reqTypeConfig[requirementTypeState] :\r\n  {\r\n    highlight: '#EEE',\r\n    highlightSelected: '#DDD',\r\n    label: label || '',\r\n  };;\r\n\r\n  \r\n  return (\r\n    <NoteContainer className={className}>\r\n      {/* Alert for note when status matches and note available */}\r\n      {variableState && style.alertVariant && note && (\r\n        <Alert variant={style.alertVariant} sx={{ mb: 1 }}>\r\n          {note}\r\n        </Alert>\r\n      )}\r\n\r\n      {/* Highlighted content box */}\r\n      <HighlightWrapper\r\n        isHovered={isHovered}\r\n        highlightColor={variableState === VariableState.NotStarted? requirementTypeStyle.highlight : style.highlight}\r\n        highlightSelectedColor={variableState === VariableState.NotStarted? requirementTypeStyle.highlightSelected : style.highlightSelected}\r\n        onMouseEnter={() => setIsHovered(true)}\r\n        onMouseLeave={() => setIsHovered(false)}\r\n        onClick={(e) => {\r\n          e.stopPropagation();\r\n          if (onEditClick) {\r\n            onEditClick();\r\n          }\r\n        }}\r\n      >\r\n        <span className=\"highlight-span\" style={{display:'inline'}}>{children}</span>\r\n        <EditButton\r\n          className=\"edit-button\"\r\n          onClick={(e) => {\r\n            e.stopPropagation();\r\n            if (onEditClick) {\r\n              onEditClick();\r\n            }\r\n          }}\r\n          size=\"small\"\r\n        >\r\n          {variableState === VariableState.Accepted\r\n            ? <CheckRounded sx={{ fontSize: 14, color: \"#FFFFFF\", strokeWidth: 2 }} />\r\n            : <EditRounded sx={{ fontSize: 14, color: \"#FFFFFF\", strokeWidth: 2 }} /> }\r\n        </EditButton>\r\n      </HighlightWrapper>\r\n    </NoteContainer>\r\n  );\r\n};\r\n"],"names":["styled","Box","IconButton","useState","mapStatusToVariableState","mapRequirementTypeToState","_jsxs","_jsx","Alert","VariableState","CheckRounded","EditRounded"],"mappings":"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"}

package/dist/cjs/components/StatusBar.js

@@ -47,7 +47,7 @@ const NextButton = material.styled(material.IconButton)(({ theme }) => ({
 }));
 const StatusBar = ({ itemCount, variant = 'actionstarted', onTailorClick, onNextClick }) => {
     let message = "";
-    if (itemCount < 1) {
+    if (itemCount <= 1) {
         message = `There is ${itemCount} item that needs attention.`;
     }
     else {

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

@@ -1 +1 @@
-{"version":3,"file":"StatusBar.js","sources":["../../../../src/components/StatusBar.tsx"],"sourcesContent":["\r\n\r\nimport React from 'react';\r\nimport { Box, Typography, IconButton, styled } from '@mui/material';\r\nimport { Button } from './Button';\r\nimport { ChevronRightRounded, PieChartRounded } from '@mui/icons-material';\r\n\r\ninterface StatusBarProps {\r\n  itemCount: number;\r\n  variant: 'actionstarted' | 'noaction';\r\n  onTailorClick?: () => void;\r\n  onNextClick?: () => void;\r\n}\r\n\r\nconst StatusBarContainer = styled(Box)(({ theme }) => ({\r\n  width: '100%',\r\n  backgroundColor: '#F5C98E',\r\n  padding: theme.spacing(1.5, 3),\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'space-between',\r\n  gap: theme.spacing(3),\r\n  flexDirection: 'row',\r\n  [theme.breakpoints.down('sm')]: {\r\n    flexDirection: 'column',\r\n    padding: theme.spacing(1.25, 2),\r\n  },\r\n}));\r\n\r\nconst ContentWrapper = styled(Box)(({ theme }) => ({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  gap: theme.spacing(1.5),\r\n  flex: 1,\r\n  minWidth: 0,\r\n  justifyContent: 'flex-start',\r\n  [theme.breakpoints.down('sm')]: {\r\n    justifyContent: 'center',\r\n    gap: theme.spacing(1),\r\n  },\r\n}));\r\n\r\nconst NextButton = styled(IconButton)(({ theme }) => ({\r\n  width: 40,\r\n  height: 40,\r\n  border: `2px solid rgba(77, 48, 25, 0.25)`,\r\n  backgroundColor: '#fff',\r\n  '&:hover': {\r\n    backgroundColor: '#4D3019',\r\n    color: '#fff',\r\n  },\r\n  [theme.breakpoints.down('sm')]: {\r\n    width: 36,\r\n    height: 36,\r\n  },\r\n}));\r\n\r\nexport const StatusBar: React.FC<StatusBarProps> = ({\r\n  itemCount,\r\n  variant = 'actionstarted',\r\n  onTailorClick,\r\n  onNextClick\r\n}) => {\r\n  let message = \"\"\r\n  if (itemCount < 1){\r\n    message = `There is ${itemCount} item that needs attention.`;\r\n  } else {\r\n    message = `There are ${itemCount} items that need attention.`;\r\n  }\r\n  return (\r\n    <StatusBarContainer>\r\n      <ContentWrapper>\r\n        <PieChartRounded \r\n          sx={{\r\n            fontSize: 24,\r\n            color:\"#4D3019\",\r\n            flexShrink: 0 ,\r\n        }}\r\n        />\r\n        <Typography\r\n          component=\"p\"\r\n          sx={{\r\n            fontSize: { xs: '14px', sm: '15px', md: '16px' },\r\n            color: '#4D3019',\r\n            wordBreak: 'break-word',\r\n            textAlign: { xs: 'center', sm: 'left' },\r\n          }}\r\n        >\r\n          <Box\r\n            component=\"span\"\r\n            sx={{ fontWeight: 700 }}\r\n          >\r\n            {variant === 'actionstarted' ? 'Incomplete.' : 'Not started.'}\r\n          </Box>\r\n          {' '}\r\n          {message}\r\n        </Typography>\r\n\r\n      </ContentWrapper>\r\n      {variant === 'actionstarted' ? (\r\n        <Box sx={{ display: 'flex', gap: 1.5, flexShrink: 0 }}>\r\n          <NextButton\r\n            onClick={onNextClick}\r\n            aria-label=\"Next\"\r\n          >\r\n            <ChevronRightRounded sx={{fontSize:20}} />\r\n          </NextButton>\r\n        </Box>\r\n      ) : (\r\n        <Box sx={{ flexShrink: 0 }}>\r\n          <Button\r\n            variant=\"outline\"\r\n            size=\"sm\"\r\n            onClick={onTailorClick}\r\n          >\r\n            Tailor policies\r\n          </Button>\r\n        </Box>\r\n      )}\r\n    </StatusBarContainer>\r\n  );\r\n};"],"names":["styled","Box","IconButton","_jsxs","_jsx","PieChartRounded","Typography","ChevronRightRounded","Button"],"mappings":"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"}
+{"version":3,"file":"StatusBar.js","sources":["../../../../src/components/StatusBar.tsx"],"sourcesContent":["\r\n\r\nimport React from 'react';\r\nimport { Box, Typography, IconButton, styled } from '@mui/material';\r\nimport { Button } from './Button';\r\nimport { ChevronRightRounded, PieChartRounded } from '@mui/icons-material';\r\n\r\ninterface StatusBarProps {\r\n  itemCount: number;\r\n  variant: 'actionstarted' | 'noaction';\r\n  onTailorClick?: () => void;\r\n  onNextClick?: () => void;\r\n}\r\n\r\nconst StatusBarContainer = styled(Box)(({ theme }) => ({\r\n  width: '100%',\r\n  backgroundColor: '#F5C98E',\r\n  padding: theme.spacing(1.5, 3),\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'space-between',\r\n  gap: theme.spacing(3),\r\n  flexDirection: 'row',\r\n  [theme.breakpoints.down('sm')]: {\r\n    flexDirection: 'column',\r\n    padding: theme.spacing(1.25, 2),\r\n  },\r\n}));\r\n\r\nconst ContentWrapper = styled(Box)(({ theme }) => ({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  gap: theme.spacing(1.5),\r\n  flex: 1,\r\n  minWidth: 0,\r\n  justifyContent: 'flex-start',\r\n  [theme.breakpoints.down('sm')]: {\r\n    justifyContent: 'center',\r\n    gap: theme.spacing(1),\r\n  },\r\n}));\r\n\r\nconst NextButton = styled(IconButton)(({ theme }) => ({\r\n  width: 40,\r\n  height: 40,\r\n  border: `2px solid rgba(77, 48, 25, 0.25)`,\r\n  backgroundColor: '#fff',\r\n  '&:hover': {\r\n    backgroundColor: '#4D3019',\r\n    color: '#fff',\r\n  },\r\n  [theme.breakpoints.down('sm')]: {\r\n    width: 36,\r\n    height: 36,\r\n  },\r\n}));\r\n\r\nexport const StatusBar: React.FC<StatusBarProps> = ({\r\n  itemCount,\r\n  variant = 'actionstarted',\r\n  onTailorClick,\r\n  onNextClick\r\n}) => {\r\n  let message = \"\"\r\n  if (itemCount <= 1){\r\n    message = `There is ${itemCount} item that needs attention.`;\r\n  } else {\r\n    message = `There are ${itemCount} items that need attention.`;\r\n  }\r\n  return (\r\n    <StatusBarContainer>\r\n      <ContentWrapper>\r\n        <PieChartRounded \r\n          sx={{\r\n            fontSize: 24,\r\n            color:\"#4D3019\",\r\n            flexShrink: 0 ,\r\n        }}\r\n        />\r\n        <Typography\r\n          component=\"p\"\r\n          sx={{\r\n            fontSize: { xs: '14px', sm: '15px', md: '16px' },\r\n            color: '#4D3019',\r\n            wordBreak: 'break-word',\r\n            textAlign: { xs: 'center', sm: 'left' },\r\n          }}\r\n        >\r\n          <Box\r\n            component=\"span\"\r\n            sx={{ fontWeight: 700 }}\r\n          >\r\n            {variant === 'actionstarted' ? 'Incomplete.' : 'Not started.'}\r\n          </Box>\r\n          {' '}\r\n          {message}\r\n        </Typography>\r\n\r\n      </ContentWrapper>\r\n      {variant === 'actionstarted' ? (\r\n        <Box sx={{ display: 'flex', gap: 1.5, flexShrink: 0 }}>\r\n          <NextButton\r\n            onClick={onNextClick}\r\n            aria-label=\"Next\"\r\n          >\r\n            <ChevronRightRounded sx={{fontSize:20}} />\r\n          </NextButton>\r\n        </Box>\r\n      ) : (\r\n        <Box sx={{ flexShrink: 0 }}>\r\n          <Button\r\n            variant=\"outline\"\r\n            size=\"sm\"\r\n            onClick={onTailorClick}\r\n          >\r\n            Tailor policies\r\n          </Button>\r\n        </Box>\r\n      )}\r\n    </StatusBarContainer>\r\n  );\r\n};"],"names":["styled","Box","IconButton","_jsxs","_jsx","PieChartRounded","Typography","ChevronRightRounded","Button"],"mappings":"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"}

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

@@ -8,6 +8,7 @@ interface HeaderProps {
     search?: (query: string) => Promise<HeaderSearchResult[]> | HeaderSearchResult[];
     onResultClick?: (result: HeaderSearchResult) => void;
     signUpStatus: SignUpStatus;
+    resetKey?: string | number;
 }
 export interface HeaderSearchResult {
     label: string;

package/dist/esm/components/Header.js

@@ -1,15 +1,26 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import React__default from 'react';
-import { styled, Box, Typography, TextField, IconButton, Divider, Popper, Paper, List, ListItemButton, ListItemText } from '@mui/material';
-import '../ThemeProvider.js';
-import { MenuRounded, SearchRounded } from '@mui/icons-material';
+import { styled, Box, Typography, TextField, IconButton, useMediaQuery, Divider, Popper, Collapse, Paper, List, ListItemButton, ListItemText } from '@mui/material';
+import { useTheme } from '../ThemeProvider.js';
+import { MenuRounded, SearchRounded, CloseRounded } from '@mui/icons-material';
 import PopoverMenu from './PopoverMenu.js';
 import { ReactComponent as SvgPrimaryLogoVariationCream } from '../images/PrimaryLogo_Variation_Cream.svg.js';
 
+function renderDescription(desc) {
+    if (!desc)
+        return null;
+    const lines = desc.split(/\r?\n/).filter(line => line.trim().length > 0);
+    const bulletLines = lines.filter(line => line.trim().startsWith("* "));
+    const nonBulletLines = lines.filter(line => !line.trim().startsWith("* "));
+    return (jsxs("div", { style: { fontSize: 14, lineHeight: 1.5 }, children: [nonBulletLines.length > 0 && (jsx("div", { style: {
+                    whiteSpace: "pre-line",
+                    marginBottom: bulletLines.length > 0 ? 6 : 0, // spacing above bullets
+                }, children: nonBulletLines.join("\n") })), bulletLines.length > 0 && (jsx("ul", { style: { margin: 0, paddingLeft: 18 }, children: bulletLines.map((line, idx) => (jsx("li", { children: line.trim().replace(/^\*\s*/, "") }, idx))) }))] }));
+}
 const StyledHeader = styled(Box)(({ theme }) => ({
     display: 'flex',
     alignItems: 'center',
-    justifyContent: 'space-between',
+    justifyContent: 'flex-start',
     backgroundColor: theme.palette.primary.main, // var(--color-primary)
     [theme.breakpoints.up('md')]: {
         gap: theme.spacing(4), // md:gap-4
@@ -53,7 +64,7 @@ const StyledLogoSvg = styled(SvgPrimaryLogoVariationCream) `
 `;
 const StyledSearchContainer = styled(Box)(({ theme }) => ({
     flex: 1,
-    maxWidth: '32rem', // max-w-2xl
+    maxWidth: '45rem',
     margin: theme.spacing(0, 2), // mx-8
     position: 'relative',
 }));
@@ -123,6 +134,7 @@ const StyledSearchIcon = styled(Box)(({ theme }) => ({
     },
 }));
 const StyledUserContainer = styled(Box)(({ theme }) => ({
+    marginLeft: 'auto',
     display: 'flex',
     alignItems: 'center',
     gap: theme.spacing(3), // md:gap-3
@@ -166,13 +178,78 @@ const StyledUserName = styled(Typography)(({ theme }) => ({
         display: 'none'
     },
 }));
-const Header = ({ userName = 'John Doe', userInitials = 'JD', toggleMenu, signOut, search, onResultClick, signUpStatus, }) => {
+const Header = ({ userName = 'John Doe', userInitials = 'JD', toggleMenu, signOut, search, onResultClick, signUpStatus, resetKey, }) => {
+    const theme = useTheme();
     const [anchorEl, setAnchorEl] = React__default.useState(null);
     const [searchQuery, setSearchQuery] = React__default.useState('');
     const [results, setResults] = React__default.useState([]);
     const [openDropdown, setOpenDropdown] = React__default.useState(false);
-    const inputRef = React__default.useRef(null);
+    const isMdUp = useMediaQuery(theme.breakpoints.up('md'));
+    const [mobileSearchOpen, setMobileSearchOpen] = React__default.useState(false);
+    const desktopInputRef = React__default.useRef(null);
+    const mobileInputRef = React__default.useRef(null);
+    const desktopFieldRef = React__default.useRef(null);
+    const headerRef = React__default.useRef(null);
+    const [headerHeight, setHeaderHeight] = React__default.useState(64);
+    const isActive = signUpStatus === 'Active';
+    const mobileResultsPaperRef = React__default.useRef(null);
+    const [mobileResultLimit, setMobileResultLimit] = React__default.useState(5);
+    const searchSeqRef = React__default.useRef(0);
     const debounceRef = React__default.useRef(undefined);
+    const maxVisibleResults = isMdUp ? 5 : 3;
+    const approxItemHeight = 80;
+    React__default.useLayoutEffect(() => {
+        const update = () => setHeaderHeight(headerRef.current?.offsetHeight ?? 64);
+        update();
+        window.addEventListener('resize', update);
+        return () => window.removeEventListener('resize', update);
+    }, []);
+    // Start at 5 each time results open/change on mobile
+    React__default.useLayoutEffect(() => {
+        if (isMdUp)
+            return;
+        if (!mobileSearchOpen || !openDropdown)
+            return;
+        setMobileResultLimit(5);
+    }, [isMdUp, mobileSearchOpen, openDropdown, results]);
+    // If the dropdown would run off-screen, reduce how many results we render
+    React__default.useLayoutEffect(() => {
+        if (isMdUp)
+            return;
+        if (!mobileSearchOpen || !openDropdown)
+            return;
+        const raf = requestAnimationFrame(() => {
+            const el = mobileResultsPaperRef.current;
+            if (!el)
+                return;
+            const rect = el.getBoundingClientRect();
+            const overflowPx = rect.bottom - window.innerHeight;
+            if (overflowPx > 0) {
+                setMobileResultLimit((n) => Math.max(1, n - 1));
+            }
+        });
+        return () => cancelAnimationFrame(raf);
+    }, [isMdUp, mobileSearchOpen, openDropdown, mobileResultLimit]);
+    const closeMobileSearch = () => {
+        setMobileSearchOpen(false);
+        setSearchQuery('');
+        setResults([]);
+        setOpenDropdown(false);
+        window.clearTimeout(debounceRef.current);
+    };
+    const toggleMobileSearch = () => {
+        setMobileSearchOpen(prev => {
+            const next = !prev;
+            if (!next) {
+                // cancelling
+                closeMobileSearch();
+                return false;
+            }
+            // opening
+            setTimeout(() => mobileInputRef.current?.focus(), 0);
+            return true;
+        });
+    };
     const handleOpen = (event) => {
         setAnchorEl(event.currentTarget);
     };
@@ -180,6 +257,7 @@ const Header = ({ userName = 'John Doe', userInitials = 'JD', toggleMenu, signOu
         setAnchorEl(null);
     };
     const runSearch = async (term) => {
+        const seq = ++searchSeqRef.current;
         if (!search) {
             setResults([]);
             setOpenDropdown(false);
@@ -192,63 +270,118 @@ const Header = ({ userName = 'John Doe', userInitials = 'JD', toggleMenu, signOu
             return;
         }
         const res = await Promise.resolve(search(trimmed));
+        if (seq !== searchSeqRef.current)
+            return; // Fixes debounce race condition causing old searches to appear after newer
         const list = Array.isArray(res) ? res : [];
         setResults(list);
         setOpenDropdown(list.length > 0);
     };
+    const handleKeyDown = (e) => {
+        if (e.key === 'Enter') {
+            e.preventDefault();
+            runSearch(searchQuery);
+        }
+    };
+    const handleSearchChange = (value) => {
+        setSearchQuery(value);
+        window.clearTimeout(debounceRef.current);
+        if (!value.trim()) {
+            runSearch(''); // Immediately run if no search to guarantee removal of listed results
+            return;
+        }
+        debounceRef.current = window.setTimeout(() => runSearch(value), 150);
+    };
     const handleSearchClick = (e) => {
         e.preventDefault();
         runSearch(searchQuery);
     };
+    React__default.useEffect(() => {
+        // When parent says the route changed (resetKey changes), reset search UI
+        closeMobileSearch();
+    }, [resetKey]);
     React__default.useEffect(() => {
         const handler = (e) => {
-            const anchor = inputRef.current?.parentElement;
-            if (anchor && !anchor.contains(e.target)) {
+            const t = e.target;
+            const inDesktop = desktopInputRef.current?.parentElement?.contains(t);
+            const inMobile = mobileInputRef.current?.parentElement?.contains(t);
+            if (!inDesktop && !inMobile) {
                 setOpenDropdown(false);
             }
         };
         document.addEventListener('click', handler);
         return () => document.removeEventListener('click', handler);
     }, []);
-    return (jsxs(StyledHeader, { children: [signUpStatus === 'Active' && (jsxs(Fragment, { children: [jsx(IconButton, { disableRipple: true, onClick: toggleMenu, sx: { display: { xs: 'block', md: 'none' } }, size: "large", children: jsx(MenuRounded, { sx: { fontSize: 32, color: 'white' } }) }), jsx(Divider, { orientation: "vertical", sx: {
-                            color: '#FFFFFF',
-                            borderRightWidth: 2,
-                            display: { xs: 'block', md: 'none' },
-                        } })] })), jsx(StyledLogoWrapper, { children: jsx(StyledLogoIcon, { children: jsx(StyledLogoSvg, {}) }) }), signUpStatus === 'Active' && (jsxs(StyledSearchContainer, { children: [jsx(StyledTextField, { placeholder: "Search for a policy", variant: "outlined", fullWidth: true, value: searchQuery, inputRef: inputRef, onChange: (event) => {
-                            const value = event.target.value;
-                            setSearchQuery(value);
-                            window.clearTimeout(debounceRef.current);
-                            debounceRef.current = window.setTimeout(() => {
-                                runSearch(value);
-                            }, 300); // 300ms debounce
-                        }, onKeyDown: (e) => {
-                            if (e.key === 'Enter') ;
-                        }, sx: { display: { xs: 'none', sm: 'none', md: 'block' } }, InputProps: {
-                            endAdornment: (jsx(StyledSearchButton, { onClick: handleSearchClick, children: jsx(StyledSearchIcon, { children: jsx(SearchRounded, {}) }) })),
-                        } }), jsx(Popper, { open: openDropdown && results.length > 0, anchorEl: inputRef.current, placement: "bottom-start", style: {
-                            zIndex: 1300,
-                            width: inputRef.current?.offsetWidth,
-                        }, children: jsx(Paper, { elevation: 3, sx: {
-                                mt: 1,
-                                borderRadius: 2,
-                                maxHeight: 320,
-                                overflowY: 'auto',
-                            }, children: jsx(List, { dense: true, disablePadding: true, children: results.map((item, index) => (jsx(ListItemButton, { onClick: () => {
+    const mobileResultsToShow = results.slice(0, mobileResultLimit);
+    const ResultsList = ({ items, mode, paperRef, onPick, }) => {
+        const isDesktop = mode === 'desktop';
+        return (jsx(Paper, { ref: paperRef, elevation: 0, sx: {
+                mt: 1,
+                border: '1px solid #4D3019',
+                boxShadow: 'none',
+                backgroundColor: '#FEFDF7',
+                ...(isDesktop
+                    ? {
+                        maxHeight: items.length > maxVisibleResults
+                            ? maxVisibleResults * approxItemHeight
+                            : 'auto',
+                        borderRadius: '12px',
+                        overflowX: 'hidden',
+                        overflowY: items.length > maxVisibleResults ? 'auto' : 'hidden',
+                        pb: 1.5,
+                    }
+                    : {
+                        overflow: 'hidden', // no scroll, no scrollbar
+                        pb: 0,
+                    }),
+            }, children: jsx(List, { dense: true, disablePadding: true, children: items.map((item, index) => (jsx(ListItemButton, { alignItems: "flex-start", onClick: () => onPick(item), sx: {
+                        py: 1.5,
+                        px: 2,
+                        backgroundColor: '#FEFDF7',
+                        // dividers only on mobile (your current mobile styling)
+                        ...(isDesktop
+                            ? {}
+                            : {
+                                borderBottom: index === items.length - 1
+                                    ? 'none'
+                                    : '1px solid rgba(77,48,25,0.18)',
+                            }),
+                        '&:hover': { backgroundColor: '#F9F0FC' },
+                        '&:hover .search-result-title': {
+                            textDecoration: 'underline',
+                            color: '#AD46FF',
+                        },
+                    }, children: jsx(ListItemText, { primary: item.label, secondary: renderDescription(item.description), primaryTypographyProps: {
+                            className: 'search-result-title',
+                            fontWeight: 700,
+                            fontSize: '16px',
+                            color: '#4D3019',
+                        }, secondaryTypographyProps: { component: 'div', mt: 1 } }) }, index))) }) }));
+    };
+    return (jsxs(Box, { children: [jsxs(StyledHeader, { ref: headerRef, children: [isActive && (jsxs(Fragment, { children: [jsx(IconButton, { disableRipple: true, onClick: toggleMenu, sx: { display: { xs: 'block', md: 'none' } }, size: "large", children: jsx(MenuRounded, { sx: { fontSize: 32, color: 'white' } }) }), jsx(Divider, { orientation: "vertical", sx: {
+                                    color: '#FFFFFF',
+                                    borderRightWidth: 2,
+                                    display: { xs: 'block', md: 'none' },
+                                } })] })), jsx(StyledLogoWrapper, { children: jsx(StyledLogoIcon, { children: jsx(StyledLogoSvg, {}) }) }), isActive && isMdUp && (jsxs(StyledSearchContainer, { children: [jsx(StyledTextField, { placeholder: "Search for a policy", variant: "outlined", fullWidth: true, value: searchQuery, inputRef: desktopInputRef, ref: desktopFieldRef, onChange: (e) => handleSearchChange(e.target.value), onKeyDown: handleKeyDown, InputProps: {
+                                    endAdornment: (jsx(StyledSearchButton, { onClick: handleSearchClick, children: jsx(StyledSearchIcon, { children: jsx(SearchRounded, {}) }) })),
+                                } }), jsx(Popper, { open: openDropdown && results.length > 0 && !!desktopFieldRef.current, anchorEl: desktopFieldRef.current, placement: "bottom-start", style: { zIndex: 1300, width: desktopFieldRef.current?.offsetWidth }, children: jsx(ResultsList, { mode: "desktop", items: results, onPick: (item) => {
                                         onResultClick?.(item);
                                         setOpenDropdown(false);
-                                    }, children: jsx(ListItemText, { primary: item.label, secondary: item.description, primaryTypographyProps: {
-                                            fontWeight: 700,
-                                            fontSize: '0.95rem',
-                                        }, secondaryTypographyProps: {
-                                            fontSize: '0.85rem',
-                                            mt: 0.25,
-                                        } }) }, index))) }) }) })] })), jsxs(StyledUserContainer, { children: [signUpStatus === 'Active' && (jsx(StyledSearchButton, { disableRipple: true, sx: {
-                            display: { xs: 'flex', md: 'none' },
-                            backgroundColor: '#ffffff83',
-                        }, children: jsx(StyledSearchIcon, { children: jsx(SearchRounded, {}) }) })), jsxs(IconButton, { onClick: handleOpen, disableRipple: true, children: [jsx(StyledAvatar, { children: jsx(StyledAvatarText, { children: userInitials }) }), jsx(StyledUserName, { children: userName })] })] }), jsx(PopoverMenu, { anchorEl: anchorEl, onClose: handleClose, signOut: () => {
-                    signOut();
-                    handleClose();
-                } })] }));
+                                    } }) })] })), jsxs(StyledUserContainer, { children: [isActive && !isMdUp && (jsx(StyledSearchButton, { disableRipple: true, onClick: toggleMobileSearch, sx: {
+                                    display: { xs: 'flex', md: 'none' },
+                                    backgroundColor: '#ffffff83',
+                                }, children: jsx(StyledSearchIcon, { children: jsx(SearchRounded, {}) }) })), jsxs(IconButton, { onClick: handleOpen, disableRipple: true, children: [jsx(StyledAvatar, { children: jsx(StyledAvatarText, { children: userInitials }) }), jsx(StyledUserName, { children: userName })] })] }), jsx(PopoverMenu, { anchorEl: anchorEl, onClose: handleClose, signOut: () => {
+                            signOut();
+                            handleClose();
+                        } })] }), !isMdUp && (jsx(Collapse, { in: isActive && mobileSearchOpen, unmountOnExit: true, timeout: 200, children: jsxs(Box, { sx: {
+                        display: { xs: 'block', md: 'none' },
+                        backgroundColor: theme.palette.primary.main,
+                        px: 2,
+                        pt: 1.5,
+                        pb: 2,
+                    }, children: [jsxs(Box, { sx: { display: 'flex', gap: 1, alignItems: 'center' }, children: [jsx(StyledTextField, { placeholder: "Search for a policy", variant: "outlined", fullWidth: true, value: searchQuery, inputRef: mobileInputRef, onChange: (e) => handleSearchChange(e.target.value), onKeyDown: handleKeyDown }), jsx(IconButton, { onClick: closeMobileSearch, sx: { color: theme.palette.light.main }, children: jsx(CloseRounded, {}) })] }), openDropdown && mobileResultsToShow.length > 0 && (jsx(Box, { sx: { mx: -2 }, children: jsx(ResultsList, { mode: "mobile", items: mobileResultsToShow, paperRef: mobileResultsPaperRef, onPick: (item) => {
+                                    onResultClick?.(item);
+                                    setOpenDropdown(false);
+                                } }) }))] }) }))] }));
 };
 
 export { Header };

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

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../../../src/components/Header.tsx"],"sourcesContent":["import React, { ChangeEvent } from 'react';\r\nimport {\r\n  Box,\r\n  styled,\r\n  Typography,\r\n  TextField,\r\n  IconButton,\r\n  Divider,\r\n  Popper,\r\n  Paper,\r\n  List,\r\n  ListItemText,\r\n  ListItemButton,\r\n} from '@mui/material';\r\nimport { useTheme } from '../ThemeProvider';\r\nimport { MenuRounded, SearchRounded } from '@mui/icons-material';\r\nimport PopoverMenu from './PopoverMenu';\r\nimport { ReactComponent as Logo } from '../images/PrimaryLogo_Variation_Cream.svg';\r\n\r\ntype SignUpStatus = 'Withdrawn' | 'Onboarding' | 'Active' | 'In Review';\r\ninterface HeaderProps {\r\n  userName?: string;\r\n  userInitials?: string;\r\n  toggleMenu: () => void;\r\n  signOut: () => void;\r\n  search?: (query: string) => Promise<HeaderSearchResult[]> | HeaderSearchResult[];\r\n  onResultClick?: (result: HeaderSearchResult) => void;\r\n  signUpStatus: SignUpStatus;\r\n}\r\n\r\nexport interface HeaderSearchResult {\r\n  label: string;\r\n  description?: string;\r\n  value: string;\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),\r\n  height: '64px', \r\n}));\r\n\r\n\r\nconst StyledLogoIcon = styled(Box)(({ theme }) => ({\r\n  width: '100%',\r\n  height: '100%',\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'center',\r\n  color: theme.palette.light.main,\r\n}));\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 StyledLogoSvg = styled(Logo)`\r\n  width: 100%;\r\n  height: 100%;\r\n  display: block;\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  onResultClick,\r\n  signUpStatus,\r\n}) => {\r\n  const theme = useTheme();\r\n  const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null);\r\n  const [searchQuery, setSearchQuery] = React.useState('');\r\n  const [results, setResults] = React.useState<HeaderSearchResult[]>([]);\r\n  const [openDropdown, setOpenDropdown] = React.useState(false);\r\n  const inputRef = React.useRef<HTMLInputElement | null>(null);\r\n  const debounceRef = React.useRef<number | undefined>(undefined);\r\n\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  const runSearch = async (term: string) => {\r\n    if (!search) {\r\n      setResults([]);\r\n      setOpenDropdown(false);\r\n      return;\r\n    }\r\n\r\n    const trimmed = term.trim();\r\n    if (!trimmed) {\r\n      setResults([]);\r\n      setOpenDropdown(false);\r\n      return;\r\n    }\r\n\r\n    const res = await Promise.resolve(search(trimmed));\r\n    const list = Array.isArray(res) ? res : [];\r\n    setResults(list);\r\n    setOpenDropdown(list.length > 0);\r\n  };\r\n\r\n  const handleSearchClick: React.MouseEventHandler<HTMLButtonElement> = (e) => {\r\n    e.preventDefault();\r\n    runSearch(searchQuery);\r\n  };\r\n\r\n\r\n  React.useEffect(() => {\r\n    const handler = (e: MouseEvent) => {\r\n      const anchor = inputRef.current?.parentElement;\r\n      if (anchor && !anchor.contains(e.target as Node)) {\r\n        setOpenDropdown(false);\r\n      }\r\n    };\r\n    document.addEventListener('click', handler);\r\n    return () => document.removeEventListener('click', handler);\r\n  }, []);\r\n\r\n  return (\r\n    <StyledHeader>\r\n      {signUpStatus === 'Active' && (\r\n        <>\r\n          <IconButton\r\n            disableRipple\r\n            onClick={toggleMenu}\r\n            sx={{ display: { xs: 'block', md: 'none' } }}\r\n            size=\"large\"\r\n          >\r\n            <MenuRounded sx={{ fontSize: 32, color: 'white' }} />\r\n          </IconButton>\r\n\r\n          <Divider\r\n            orientation=\"vertical\"\r\n            sx={{\r\n              color: '#FFFFFF',\r\n              borderRightWidth: 2,\r\n              display: { xs: 'block', md: 'none' },\r\n            }}\r\n          />\r\n        </>\r\n      )}\r\n\r\n      <StyledLogoWrapper>\r\n        <StyledLogoIcon>\r\n          <StyledLogoSvg />\r\n        </StyledLogoIcon>\r\n      </StyledLogoWrapper>\r\n\r\n      {/* Search input for md+ screens */}\r\n      {signUpStatus === 'Active' && (\r\n        <StyledSearchContainer>\r\n          <StyledTextField\r\n            placeholder=\"Search for a policy\"\r\n            variant=\"outlined\"\r\n            fullWidth\r\n            value={searchQuery}\r\n            inputRef={inputRef}\r\n            onChange={(event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n              const value = event.target.value;\r\n              setSearchQuery(value);\r\n\r\n              window.clearTimeout(debounceRef.current);\r\n              debounceRef.current = window.setTimeout(() => {\r\n                runSearch(value);\r\n              }, 300); // 300ms debounce\r\n            }}\r\n            onKeyDown={(e) => {\r\n              if (e.key === 'Enter') {\r\n                handleSearchClick;\r\n              }\r\n            }}\r\n            sx={{ display: { xs: 'none', sm: 'none', md: 'block' } }}\r\n            InputProps={{\r\n              endAdornment: (\r\n                <StyledSearchButton onClick={handleSearchClick}>\r\n                  <StyledSearchIcon>\r\n                    <SearchRounded />\r\n                  </StyledSearchIcon>\r\n                </StyledSearchButton>\r\n              ),\r\n            }}\r\n          />\r\n\r\n          {/* 🔽 Dropdown with results */}\r\n          <Popper\r\n            open={openDropdown && results.length > 0}\r\n            anchorEl={inputRef.current}\r\n            placement=\"bottom-start\"\r\n            style={{\r\n              zIndex: 1300,\r\n              width: inputRef.current?.offsetWidth,\r\n            }}\r\n          >\r\n            <Paper\r\n              elevation={3}\r\n              sx={{\r\n                mt: 1,\r\n                borderRadius: 2,\r\n                maxHeight: 320,\r\n                overflowY: 'auto',\r\n              }}\r\n            >\r\n              <List dense disablePadding>\r\n                {results.map((item, index) => (\r\n                  <ListItemButton\r\n                    key={index}\r\n                    onClick={() => {\r\n                      onResultClick?.(item);\r\n                      setOpenDropdown(false);\r\n                    }}\r\n                  >\r\n                    <ListItemText\r\n                      primary={item.label}\r\n                      secondary={item.description}\r\n                      primaryTypographyProps={{\r\n                        fontWeight: 700,\r\n                        fontSize: '0.95rem',\r\n                      }}\r\n                      secondaryTypographyProps={{\r\n                        fontSize: '0.85rem',\r\n                        mt: 0.25,\r\n                      }}\r\n                    />\r\n                  </ListItemButton>\r\n                ))}\r\n              </List>\r\n            </Paper>\r\n          </Popper>\r\n        </StyledSearchContainer>\r\n      )}\r\n\r\n      <StyledUserContainer>\r\n        {/* Search button only visible on XS screens (you can wire this up later) */}\r\n        {signUpStatus === 'Active' && (\r\n          <StyledSearchButton\r\n            disableRipple\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        )}\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={() => {\r\n          signOut();\r\n          handleClose();\r\n        }}\r\n      />\r\n    </StyledHeader>\r\n  );\r\n};"],"names":["Logo","React","_jsxs","_Fragment","_jsx"],"mappings":"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"}
+{"version":3,"file":"Header.js","sources":["../../../../src/components/Header.tsx"],"sourcesContent":["import React, { ChangeEvent } from 'react';\r\nimport {\r\n  Box,\r\n  styled,\r\n  Typography,\r\n  TextField,\r\n  IconButton,\r\n  Divider,\r\n  Popper,\r\n  Paper,\r\n  List,\r\n  ListItemText,\r\n  ListItemButton,\r\n  Collapse,\r\n  useMediaQuery,\r\n} from '@mui/material';\r\nimport { useTheme } from '../ThemeProvider';\r\nimport { MenuRounded, SearchRounded, CloseRounded } from '@mui/icons-material';\r\nimport PopoverMenu from './PopoverMenu';\r\nimport { ReactComponent as Logo } from '../images/PrimaryLogo_Variation_Cream.svg';\r\n\r\ntype SignUpStatus = 'Withdrawn' | 'Onboarding' | 'Active' | 'In Review';\r\ninterface HeaderProps {\r\n  userName?: string;\r\n  userInitials?: string;\r\n  toggleMenu: () => void;\r\n  signOut: () => void;\r\n  search?: (query: string) => Promise<HeaderSearchResult[]> | HeaderSearchResult[];\r\n  onResultClick?: (result: HeaderSearchResult) => void;\r\n  signUpStatus: SignUpStatus;\r\n  resetKey?: string | number;\r\n}\r\n\r\nexport interface HeaderSearchResult {\r\n  label: string;\r\n  description?: string;\r\n  value: string;\r\n}\r\n\r\nfunction renderDescription(desc: string): React.ReactNode {\r\n  if (!desc) return null;\r\n\r\n  const lines = desc.split(/\\r?\\n/).filter(line => line.trim().length > 0);\r\n\r\n  const bulletLines = lines.filter(line => line.trim().startsWith(\"* \"));\r\n  const nonBulletLines = lines.filter(line => !line.trim().startsWith(\"* \"));\r\n\r\n  return (\r\n    <div style={{ fontSize: 14, lineHeight: 1.5 }}>\r\n      {nonBulletLines.length > 0 && (\r\n        <div\r\n          style={{\r\n            whiteSpace: \"pre-line\",\r\n            marginBottom: bulletLines.length > 0 ? 6 : 0, // spacing above bullets\r\n          }}\r\n        >\r\n          {nonBulletLines.join(\"\\n\")}\r\n        </div>\r\n      )}\r\n\r\n      {bulletLines.length > 0 && (\r\n        <ul style={{ margin: 0, paddingLeft: 18 }}>\r\n          {bulletLines.map((line, idx) => (\r\n            <li key={idx}>\r\n              {line.trim().replace(/^\\*\\s*/, \"\")}\r\n            </li>\r\n          ))}\r\n        </ul>\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n\r\nconst StyledHeader = styled(Box)(({ theme }) => ({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'flex-start',\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),\r\n  height: '64px', \r\n}));\r\n\r\n\r\nconst StyledLogoIcon = styled(Box)(({ theme }) => ({\r\n  width: '100%',\r\n  height: '100%',\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'center',\r\n  color: theme.palette.light.main,\r\n}));\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 StyledLogoSvg = styled(Logo)`\r\n  width: 100%;\r\n  height: 100%;\r\n  display: block;\r\n`;\r\n\r\n\r\nconst StyledSearchContainer = styled(Box)(({ theme }) => ({\r\n  flex: 1,\r\n  maxWidth: '45rem',\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  marginLeft: 'auto',\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  onResultClick,\r\n  signUpStatus,\r\n  resetKey,\r\n}) => {\r\n  const theme = useTheme();\r\n  const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement | null>(null);\r\n  const [searchQuery, setSearchQuery] = React.useState('');\r\n  const [results, setResults] = React.useState<HeaderSearchResult[]>([]);\r\n  const [openDropdown, setOpenDropdown] = React.useState(false);\r\n\r\n  const isMdUp = useMediaQuery(theme.breakpoints.up('md'));\r\n  const [mobileSearchOpen, setMobileSearchOpen] = React.useState(false);\r\n\r\n  const desktopInputRef = React.useRef<HTMLInputElement | null>(null);\r\n  const mobileInputRef = React.useRef<HTMLInputElement | null>(null);\r\n  const desktopFieldRef = React.useRef<HTMLDivElement | null>(null);\r\n\r\n\r\n  const headerRef = React.useRef<HTMLDivElement | null>(null);\r\n  const [headerHeight, setHeaderHeight] = React.useState(64);\r\n  const isActive = signUpStatus === 'Active';\r\n\r\n  const mobileResultsPaperRef = React.useRef<HTMLDivElement | null>(null);\r\n  const [mobileResultLimit, setMobileResultLimit] = React.useState(5);\r\n\r\n  const searchSeqRef = React.useRef(0);\r\n  const debounceRef = React.useRef<number | undefined>(undefined);\r\n  const maxVisibleResults = isMdUp ? 5 : 3;\r\n  const approxItemHeight = 80;  \r\n\r\n  React.useLayoutEffect(() => {\r\n    const update = () => setHeaderHeight(headerRef.current?.offsetHeight ?? 64);\r\n    update();\r\n    window.addEventListener('resize', update);\r\n    return () => window.removeEventListener('resize', update);\r\n  }, []);\r\n\r\n  // Start at 5 each time results open/change on mobile\r\n  React.useLayoutEffect(() => {\r\n    if (isMdUp) return;\r\n    if (!mobileSearchOpen || !openDropdown) return;\r\n    setMobileResultLimit(5);\r\n  }, [isMdUp, mobileSearchOpen, openDropdown, results]);\r\n\r\n  // If the dropdown would run off-screen, reduce how many results we render\r\n  React.useLayoutEffect(() => {\r\n    if (isMdUp) return;\r\n    if (!mobileSearchOpen || !openDropdown) return;\r\n\r\n    const raf = requestAnimationFrame(() => {\r\n      const el = mobileResultsPaperRef.current;\r\n      if (!el) return;\r\n\r\n      const rect = el.getBoundingClientRect();\r\n      const overflowPx = rect.bottom - window.innerHeight;\r\n\r\n      if (overflowPx > 0) {\r\n        setMobileResultLimit((n) => Math.max(1, n - 1));\r\n      }\r\n    });\r\n\r\n  return () => cancelAnimationFrame(raf);\r\n}, [isMdUp, mobileSearchOpen, openDropdown, mobileResultLimit]);\r\n\r\n\r\n  const closeMobileSearch = () => {\r\n    setMobileSearchOpen(false);\r\n    setSearchQuery('');\r\n    setResults([]);\r\n    setOpenDropdown(false);\r\n    window.clearTimeout(debounceRef.current);\r\n  };\r\n\r\n  const toggleMobileSearch = () => {\r\n    setMobileSearchOpen(prev => {\r\n      const next = !prev;\r\n      if (!next) {\r\n        // cancelling\r\n        closeMobileSearch();\r\n        return false;\r\n      }\r\n      // opening\r\n      setTimeout(() => mobileInputRef.current?.focus(), 0);\r\n      return true;\r\n    });\r\n  };\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  const runSearch = async (term: string) => {\r\n    const seq = ++searchSeqRef.current;\r\n\r\n    if (!search) {\r\n      setResults([]);\r\n      setOpenDropdown(false);\r\n      return;\r\n    }\r\n\r\n    const trimmed = term.trim();\r\n    if (!trimmed) {\r\n      setResults([]);\r\n      setOpenDropdown(false);\r\n      return;\r\n    }\r\n\r\n    const res = await Promise.resolve(search(trimmed));\r\n\r\n    if (seq !== searchSeqRef.current) return; // Fixes debounce race condition causing old searches to appear after newer\r\n\r\n    const list = Array.isArray(res) ? res : [];\r\n    setResults(list);\r\n    setOpenDropdown(list.length > 0);\r\n  };\r\n\r\n  const handleKeyDown = (e: React.KeyboardEvent) => {\r\n    if (e.key === 'Enter') {\r\n      e.preventDefault();\r\n      runSearch(searchQuery);\r\n    }\r\n  };\r\n\r\n  const handleSearchChange = (value: string) => {\r\n    setSearchQuery(value);\r\n\r\n    window.clearTimeout(debounceRef.current);\r\n\r\n    if (!value.trim()) {\r\n      runSearch(''); // Immediately run if no search to guarantee removal of listed results\r\n      return;\r\n    }\r\n\r\n    debounceRef.current = window.setTimeout(() => runSearch(value), 150);\r\n  };\r\n\r\n\r\n\r\n  const handleSearchClick: React.MouseEventHandler<HTMLButtonElement> = (e) => {\r\n    e.preventDefault();\r\n    runSearch(searchQuery);\r\n  };\r\n\r\n  React.useEffect(() => {\r\n    // When parent says the route changed (resetKey changes), reset search UI\r\n    closeMobileSearch();\r\n  }, [resetKey]);\r\n\r\n  React.useEffect(() => {\r\n    const handler = (e: MouseEvent) => {\r\n      const t = e.target as Node;\r\n\r\n      const inDesktop = desktopInputRef.current?.parentElement?.contains(t);\r\n      const inMobile = mobileInputRef.current?.parentElement?.contains(t);\r\n\r\n      if (!inDesktop && !inMobile) {\r\n        setOpenDropdown(false);\r\n      }\r\n    };\r\n\r\n    document.addEventListener('click', handler);\r\n    return () => document.removeEventListener('click', handler);\r\n  }, []);\r\n\r\n  const mobileResultsToShow = results.slice(0, mobileResultLimit);\r\n\r\n  type ResultsMode = 'desktop' | 'mobile';\r\n\r\n  const ResultsList = ({\r\n    items,\r\n    mode,\r\n    paperRef,\r\n    onPick,\r\n  }: {\r\n    items: HeaderSearchResult[];\r\n    mode: ResultsMode;\r\n    paperRef?: React.Ref<HTMLDivElement>;\r\n    onPick: (item: HeaderSearchResult) => void;\r\n  }) => {\r\n    const isDesktop = mode === 'desktop';\r\n    return (\r\n      <Paper\r\n        ref={paperRef}\r\n        elevation={0}\r\n        \r\n        sx={{\r\n          mt: 1,\r\n          border: '1px solid #4D3019',\r\n          boxShadow: 'none',\r\n          backgroundColor: '#FEFDF7',\r\n\r\n          ...(isDesktop\r\n            ? {\r\n                maxHeight:\r\n                  items.length > maxVisibleResults\r\n                    ? maxVisibleResults * approxItemHeight\r\n                    : 'auto',\r\n                borderRadius: '12px',\r\n                overflowX: 'hidden',\r\n                overflowY: items.length > maxVisibleResults ? 'auto' : 'hidden',\r\n                pb: 1.5,\r\n              }\r\n            : {\r\n                overflow: 'hidden', // no scroll, no scrollbar\r\n                pb: 0,\r\n              }),\r\n        }}\r\n      >\r\n        <List dense disablePadding>\r\n          {items.map((item, index) => (\r\n            <ListItemButton\r\n              key={index}\r\n              alignItems=\"flex-start\"\r\n              onClick={() => onPick(item)}\r\n              sx={{\r\n                py: 1.5,\r\n                px: 2,\r\n                backgroundColor: '#FEFDF7',\r\n\r\n                // dividers only on mobile (your current mobile styling)\r\n                ...(isDesktop\r\n                  ? {}\r\n                  : {\r\n                      borderBottom:\r\n                        index === items.length - 1\r\n                          ? 'none'\r\n                          : '1px solid rgba(77,48,25,0.18)',\r\n                    }),\r\n\r\n                '&:hover': { backgroundColor: '#F9F0FC' },\r\n                '&:hover .search-result-title': {\r\n                  textDecoration: 'underline',\r\n                  color: '#AD46FF',\r\n                },\r\n              }}\r\n            >\r\n              <ListItemText\r\n                primary={item.label}\r\n                secondary={renderDescription(item.description!)}\r\n                primaryTypographyProps={{\r\n                  className: 'search-result-title',\r\n                  fontWeight: 700,\r\n                  fontSize: '16px',\r\n                  color: '#4D3019',\r\n                }}\r\n                secondaryTypographyProps={{ component: 'div', mt: 1 }}\r\n              />\r\n            </ListItemButton>\r\n          ))}\r\n        </List>\r\n      </Paper>\r\n    );\r\n  };\r\n\r\n\r\n  return (\r\n    <Box>\r\n      <StyledHeader ref={headerRef}>\r\n        {isActive && (\r\n          <>\r\n            <IconButton\r\n              disableRipple\r\n              onClick={toggleMenu}\r\n              sx={{ display: { xs: 'block', md: 'none' } }}\r\n              size=\"large\"\r\n            >\r\n              <MenuRounded sx={{ fontSize: 32, color: 'white' }} />\r\n            </IconButton>\r\n\r\n            <Divider\r\n              orientation=\"vertical\"\r\n              sx={{\r\n                color: '#FFFFFF',\r\n                borderRightWidth: 2,\r\n                display: { xs: 'block', md: 'none' },\r\n              }}\r\n            />\r\n          </>\r\n        )}\r\n\r\n        <StyledLogoWrapper>\r\n          <StyledLogoIcon>\r\n            <StyledLogoSvg />\r\n          </StyledLogoIcon>\r\n        </StyledLogoWrapper>\r\n\r\n        {/* Desktop search only */}\r\n        {isActive && isMdUp && (\r\n          <StyledSearchContainer>\r\n            <StyledTextField\r\n              placeholder=\"Search for a policy\"\r\n              variant=\"outlined\"\r\n              fullWidth\r\n              value={searchQuery}\r\n              inputRef={desktopInputRef}\r\n              ref={desktopFieldRef}\r\n              onChange={(e) => handleSearchChange(e.target.value)}\r\n              onKeyDown={handleKeyDown}\r\n              InputProps={{\r\n                endAdornment: (\r\n                  <StyledSearchButton onClick={handleSearchClick}>\r\n                    <StyledSearchIcon>\r\n                      <SearchRounded />\r\n                    </StyledSearchIcon>\r\n                  </StyledSearchButton>\r\n                ),\r\n              }}\r\n            />\r\n\r\n            <Popper\r\n              open={openDropdown && results.length > 0 && !!desktopFieldRef.current}\r\n              anchorEl={desktopFieldRef.current}\r\n              placement=\"bottom-start\"\r\n              style={{ zIndex: 1300, width: desktopFieldRef.current?.offsetWidth }}\r\n            >\r\n              <ResultsList\r\n                mode=\"desktop\"\r\n                items={results}\r\n                onPick={(item) => {\r\n                  onResultClick?.(item);\r\n                  setOpenDropdown(false);\r\n                }}\r\n              />\r\n            </Popper>\r\n          </StyledSearchContainer>\r\n        )}\r\n\r\n        <StyledUserContainer>\r\n          {/* Mobile search button only */}\r\n          {isActive && !isMdUp && (\r\n            <StyledSearchButton\r\n              disableRipple\r\n              onClick={toggleMobileSearch}\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          )}\r\n\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={() => {\r\n            signOut();\r\n            handleClose();\r\n          }}\r\n        />\r\n      </StyledHeader>\r\n\r\n      {/* Mobile panel only */}\r\n      {!isMdUp && (\r\n        <Collapse in={isActive && mobileSearchOpen} unmountOnExit timeout={200}>\r\n          <Box\r\n            sx={{\r\n              display: { xs: 'block', md: 'none' },\r\n              backgroundColor: theme.palette.primary.main,\r\n              px: 2,\r\n              pt: 1.5,\r\n              pb: 2,\r\n            }}\r\n          >\r\n            <Box sx={{ display: 'flex', gap: 1, alignItems: 'center' }}>\r\n              <StyledTextField\r\n                placeholder=\"Search for a policy\"\r\n                variant=\"outlined\"\r\n                fullWidth\r\n                value={searchQuery}\r\n                inputRef={mobileInputRef}\r\n                onChange={(e) => handleSearchChange(e.target.value)}\r\n                onKeyDown={handleKeyDown}\r\n              />\r\n\r\n              <IconButton onClick={closeMobileSearch} sx={{ color: theme.palette.light.main }}>\r\n                <CloseRounded />\r\n              </IconButton>\r\n            </Box>\r\n\r\n            {openDropdown && mobileResultsToShow.length > 0 && (\r\n              <Box sx={{ mx: -2 }}>\r\n                <ResultsList\r\n                  mode=\"mobile\"\r\n                  items={mobileResultsToShow}\r\n                  paperRef={mobileResultsPaperRef}\r\n                  onPick={(item) => {\r\n                    onResultClick?.(item);\r\n                    setOpenDropdown(false);\r\n                  }}\r\n                />\r\n              </Box>\r\n            )}\r\n          </Box>\r\n        </Collapse>\r\n      )}\r\n    </Box>\r\n  );\r\n};"],"names":["_jsxs","_jsx","Logo","React","_Fragment"],"mappings":"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"}

package/dist/esm/components/NoteBox.js

@@ -97,7 +97,6 @@ const NoteBox = ({ status, requirementType, label, note, children, className = '
     const [isHovered, setIsHovered] = useState(false);
     // Map current status
     const variableState = mapStatusToVariableState(status);
-    console.log("HELLO", status, requirementType);
     const requirementTypeState = mapRequirementTypeToState(requirementType);
     const style = variableState
         ? statusConfig[variableState]

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

@@ -1 +1 @@
-{"version":3,"file":"NoteBox.js","sources":["../../../../src/components/NoteBox.tsx"],"sourcesContent":["import React, { useState } from 'react';\r\nimport { Box, Typography, IconButton, styled, Chip } from '@mui/material';\r\nimport { CheckRounded, EditRounded } from '@mui/icons-material';\r\nimport { Alert } from './Alert';\r\nimport { RequirementType, VariableState } from '../types/variable';\r\nimport { mapRequirementTypeToState, mapStatusToVariableState } from '../helpers/variableProcessing';\r\n\r\ninterface NoteBoxProps {\r\n  status?: string; // Use only status now\r\n  requirementType?: string;\r\n  label?: string;\r\n  note?: string;\r\n  children: React.ReactNode;\r\n  className?: string;\r\n  onEditClick?: () => void;\r\n}\r\n\r\n// Status based color configs (from Modal)\r\nconst statusConfig: {\r\n  [key in VariableState]: {\r\n    highlight: string;\r\n    highlightSelected: string;\r\n    label: string;\r\n    alertVariant?: \"error\" | \"info\";\r\n  }\r\n} = {\r\n  Accepted: {\r\n    highlight: '#EDF9CD',\r\n    highlightSelected: '#DBF59A',\r\n    label: 'Accepted',\r\n  },\r\n  Pending: {\r\n    highlight: '#F5E2FF',\r\n    highlightSelected: '#EBC7FF',\r\n    label: 'Pending',\r\n    alertVariant: 'info',\r\n  },\r\n  'Action Required': {\r\n    highlight: '#FBEEEE',\r\n    highlightSelected: '#FFBCB3',\r\n    label: 'ActionRequired',\r\n    alertVariant: 'error',\r\n  },\r\n  'Declined': {\r\n    highlight: '#FFF6D1',\r\n    highlightSelected: '#FDE58E',\r\n    label: 'Declined',\r\n  },\r\n  'Not Started': {\r\n    highlight: '#f8c97cff',\r\n    highlightSelected: '#F5A623',\r\n    label: 'Not Started',\r\n  },\r\n  Draft: {\r\n    highlight: '#FFEACD',\r\n    highlightSelected: '#FFC365',\r\n    label: 'Draft',\r\n  },\r\n};\r\n\r\nconst NoteContainer = styled(Box)({\r\n  position: 'relative',\r\n  display: 'inline',\r\n  maxWidth: '100%',\r\n});\r\n\r\n// Uses highlight colors driven by status exclusively\r\nconst HighlightWrapper = styled(Box, {\r\n  shouldForwardProp: (prop) =>\r\n    prop !== 'isHovered' &&\r\n    prop !== 'highlightColor' &&\r\n    prop !== 'highlightSelectedColor'\r\n})<{\r\n  isHovered: boolean;\r\n  highlightColor: string;\r\n  highlightSelectedColor: string;\r\n}>(({ isHovered, highlightColor, highlightSelectedColor }) => ({\r\n  position: 'relative',\r\n  display: 'inline',\r\n  maxWidth: '100%',\r\n  '&:hover .edit-button': {\r\n    opacity: 1,\r\n  },\r\n  '& .highlight-span': {\r\n    background: isHovered ? highlightSelectedColor : highlightColor,\r\n    padding: '2px 4px',\r\n    borderBottom: '2px solid rgba(77, 48, 25, 0.3)',\r\n    boxDecorationBreak: 'clone',\r\n    WebkitBoxDecorationBreak: 'clone',\r\n    transition: 'background 0.2s ease',\r\n    cursor: 'pointer',\r\n    fontSize: '1rem',\r\n    wordWrap: 'break-word',\r\n    overflowWrap: 'break-word',\r\n    display: 'inline',\r\n    color: '#4D3019',\r\n  },\r\n}));\r\n\r\nconst EditButton = styled(IconButton)(({ theme }) => ({\r\n  top: 0,\r\n  right: 0,\r\n  transform: 'translate(-50%, -50%)',\r\n  position: 'relative',\r\n  width: 20,\r\n  height: 20,\r\n  marginRight: -20,\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: '#4D3019',\r\n  opacity: 0,\r\n  transition: 'all 0.2s ease',\r\n  boxShadow: '0 1px 3px rgba(0,0,0,0.12)',\r\n  '&:hover': {\r\n    backgroundColor: '#4D3019',\r\n    transform: 'translate(-50%, -50%) scale(1.1)',\r\n  },\r\n}));\r\n\r\nexport const NoteBox: React.FC<NoteBoxProps> = ({\r\n  status,\r\n  requirementType,\r\n  label,\r\n  note,\r\n  children,\r\n  className = '',\r\n  onEditClick,\r\n}) => {\r\n  const [isHovered, setIsHovered] = useState(false);\r\n\r\n  // Map current status\r\n  const variableState = mapStatusToVariableState(status!!);\r\n  console.log(\"HELLO\", status, requirementType);\r\n  const requirementTypeState = mapRequirementTypeToState(requirementType!!)\r\n\r\n  const style = variableState\r\n    ? statusConfig[variableState]\r\n    : {\r\n        highlight: '#EEE',\r\n        highlightSelected: '#DDD',\r\n        label: label || '',\r\n      };\r\n\r\n\r\n  const reqTypeConfig = {\r\n    Default: {\r\n      color: '#F5A623',\r\n      highlight: '#f3bf6bff',\r\n      highlightSelected: '#F5A623',\r\n      label: 'Mandatory',\r\n    },\r\n    Optional: {\r\n      color: '#F5D76E',\r\n      highlight: '#f3e2a5ff',\r\n      highlightSelected: '#F5D76E',\r\n      label: 'Optional',\r\n    },\r\n  };\r\n\r\n\r\n  const requirementTypeStyle = requirementTypeState ? reqTypeConfig[requirementTypeState] :\r\n  {\r\n    highlight: '#EEE',\r\n    highlightSelected: '#DDD',\r\n    label: label || '',\r\n  };;\r\n\r\n  \r\n  return (\r\n    <NoteContainer className={className}>\r\n      {/* Alert for note when status matches and note available */}\r\n      {variableState && style.alertVariant && note && (\r\n        <Alert variant={style.alertVariant} sx={{ mb: 1 }}>\r\n          {note}\r\n        </Alert>\r\n      )}\r\n\r\n      {/* Highlighted content box */}\r\n      <HighlightWrapper\r\n        isHovered={isHovered}\r\n        highlightColor={variableState === VariableState.NotStarted? requirementTypeStyle.highlight : style.highlight}\r\n        highlightSelectedColor={variableState === VariableState.NotStarted? requirementTypeStyle.highlightSelected : style.highlightSelected}\r\n        onMouseEnter={() => setIsHovered(true)}\r\n        onMouseLeave={() => setIsHovered(false)}\r\n        onClick={(e) => {\r\n          e.stopPropagation();\r\n          if (onEditClick) {\r\n            onEditClick();\r\n          }\r\n        }}\r\n      >\r\n        <span className=\"highlight-span\" style={{display:'inline'}}>{children}</span>\r\n        <EditButton\r\n          className=\"edit-button\"\r\n          onClick={(e) => {\r\n            e.stopPropagation();\r\n            if (onEditClick) {\r\n              onEditClick();\r\n            }\r\n          }}\r\n          size=\"small\"\r\n        >\r\n          {variableState === VariableState.Accepted\r\n            ? <CheckRounded sx={{ fontSize: 14, color: \"#FFFFFF\", strokeWidth: 2 }} />\r\n            : <EditRounded sx={{ fontSize: 14, color: \"#FFFFFF\", strokeWidth: 2 }} /> }\r\n        </EditButton>\r\n      </HighlightWrapper>\r\n    </NoteContainer>\r\n  );\r\n};\r\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"NoteBox.js","sources":["../../../../src/components/NoteBox.tsx"],"sourcesContent":["import React, { useState } from 'react';\r\nimport { Box, Typography, IconButton, styled, Chip } from '@mui/material';\r\nimport { CheckRounded, EditRounded } from '@mui/icons-material';\r\nimport { Alert } from './Alert';\r\nimport { RequirementType, VariableState } from '../types/variable';\r\nimport { mapRequirementTypeToState, mapStatusToVariableState } from '../helpers/variableProcessing';\r\n\r\ninterface NoteBoxProps {\r\n  status?: string; // Use only status now\r\n  requirementType?: string;\r\n  label?: string;\r\n  note?: string;\r\n  children: React.ReactNode;\r\n  className?: string;\r\n  onEditClick?: () => void;\r\n}\r\n\r\n// Status based color configs (from Modal)\r\nconst statusConfig: {\r\n  [key in VariableState]: {\r\n    highlight: string;\r\n    highlightSelected: string;\r\n    label: string;\r\n    alertVariant?: \"error\" | \"info\";\r\n  }\r\n} = {\r\n  Accepted: {\r\n    highlight: '#EDF9CD',\r\n    highlightSelected: '#DBF59A',\r\n    label: 'Accepted',\r\n  },\r\n  Pending: {\r\n    highlight: '#F5E2FF',\r\n    highlightSelected: '#EBC7FF',\r\n    label: 'Pending',\r\n    alertVariant: 'info',\r\n  },\r\n  'Action Required': {\r\n    highlight: '#FBEEEE',\r\n    highlightSelected: '#FFBCB3',\r\n    label: 'ActionRequired',\r\n    alertVariant: 'error',\r\n  },\r\n  'Declined': {\r\n    highlight: '#FFF6D1',\r\n    highlightSelected: '#FDE58E',\r\n    label: 'Declined',\r\n  },\r\n  'Not Started': {\r\n    highlight: '#f8c97cff',\r\n    highlightSelected: '#F5A623',\r\n    label: 'Not Started',\r\n  },\r\n  Draft: {\r\n    highlight: '#FFEACD',\r\n    highlightSelected: '#FFC365',\r\n    label: 'Draft',\r\n  },\r\n};\r\n\r\nconst NoteContainer = styled(Box)({\r\n  position: 'relative',\r\n  display: 'inline',\r\n  maxWidth: '100%',\r\n});\r\n\r\n// Uses highlight colors driven by status exclusively\r\nconst HighlightWrapper = styled(Box, {\r\n  shouldForwardProp: (prop) =>\r\n    prop !== 'isHovered' &&\r\n    prop !== 'highlightColor' &&\r\n    prop !== 'highlightSelectedColor'\r\n})<{\r\n  isHovered: boolean;\r\n  highlightColor: string;\r\n  highlightSelectedColor: string;\r\n}>(({ isHovered, highlightColor, highlightSelectedColor }) => ({\r\n  position: 'relative',\r\n  display: 'inline',\r\n  maxWidth: '100%',\r\n  '&:hover .edit-button': {\r\n    opacity: 1,\r\n  },\r\n  '& .highlight-span': {\r\n    background: isHovered ? highlightSelectedColor : highlightColor,\r\n    padding: '2px 4px',\r\n    borderBottom: '2px solid rgba(77, 48, 25, 0.3)',\r\n    boxDecorationBreak: 'clone',\r\n    WebkitBoxDecorationBreak: 'clone',\r\n    transition: 'background 0.2s ease',\r\n    cursor: 'pointer',\r\n    fontSize: '1rem',\r\n    wordWrap: 'break-word',\r\n    overflowWrap: 'break-word',\r\n    display: 'inline',\r\n    color: '#4D3019',\r\n  },\r\n}));\r\n\r\nconst EditButton = styled(IconButton)(({ theme }) => ({\r\n  top: 0,\r\n  right: 0,\r\n  transform: 'translate(-50%, -50%)',\r\n  position: 'relative',\r\n  width: 20,\r\n  height: 20,\r\n  marginRight: -20,\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: '#4D3019',\r\n  opacity: 0,\r\n  transition: 'all 0.2s ease',\r\n  boxShadow: '0 1px 3px rgba(0,0,0,0.12)',\r\n  '&:hover': {\r\n    backgroundColor: '#4D3019',\r\n    transform: 'translate(-50%, -50%) scale(1.1)',\r\n  },\r\n}));\r\n\r\nexport const NoteBox: React.FC<NoteBoxProps> = ({\r\n  status,\r\n  requirementType,\r\n  label,\r\n  note,\r\n  children,\r\n  className = '',\r\n  onEditClick,\r\n}) => {\r\n  const [isHovered, setIsHovered] = useState(false);\r\n\r\n  // Map current status\r\n  const variableState = mapStatusToVariableState(status!!);\r\n  const requirementTypeState = mapRequirementTypeToState(requirementType!!)\r\n\r\n  const style = variableState\r\n    ? statusConfig[variableState]\r\n    : {\r\n        highlight: '#EEE',\r\n        highlightSelected: '#DDD',\r\n        label: label || '',\r\n      };\r\n\r\n\r\n  const reqTypeConfig = {\r\n    Default: {\r\n      color: '#F5A623',\r\n      highlight: '#f3bf6bff',\r\n      highlightSelected: '#F5A623',\r\n      label: 'Mandatory',\r\n    },\r\n    Optional: {\r\n      color: '#F5D76E',\r\n      highlight: '#f3e2a5ff',\r\n      highlightSelected: '#F5D76E',\r\n      label: 'Optional',\r\n    },\r\n  };\r\n\r\n\r\n  const requirementTypeStyle = requirementTypeState ? reqTypeConfig[requirementTypeState] :\r\n  {\r\n    highlight: '#EEE',\r\n    highlightSelected: '#DDD',\r\n    label: label || '',\r\n  };;\r\n\r\n  \r\n  return (\r\n    <NoteContainer className={className}>\r\n      {/* Alert for note when status matches and note available */}\r\n      {variableState && style.alertVariant && note && (\r\n        <Alert variant={style.alertVariant} sx={{ mb: 1 }}>\r\n          {note}\r\n        </Alert>\r\n      )}\r\n\r\n      {/* Highlighted content box */}\r\n      <HighlightWrapper\r\n        isHovered={isHovered}\r\n        highlightColor={variableState === VariableState.NotStarted? requirementTypeStyle.highlight : style.highlight}\r\n        highlightSelectedColor={variableState === VariableState.NotStarted? requirementTypeStyle.highlightSelected : style.highlightSelected}\r\n        onMouseEnter={() => setIsHovered(true)}\r\n        onMouseLeave={() => setIsHovered(false)}\r\n        onClick={(e) => {\r\n          e.stopPropagation();\r\n          if (onEditClick) {\r\n            onEditClick();\r\n          }\r\n        }}\r\n      >\r\n        <span className=\"highlight-span\" style={{display:'inline'}}>{children}</span>\r\n        <EditButton\r\n          className=\"edit-button\"\r\n          onClick={(e) => {\r\n            e.stopPropagation();\r\n            if (onEditClick) {\r\n              onEditClick();\r\n            }\r\n          }}\r\n          size=\"small\"\r\n        >\r\n          {variableState === VariableState.Accepted\r\n            ? <CheckRounded sx={{ fontSize: 14, color: \"#FFFFFF\", strokeWidth: 2 }} />\r\n            : <EditRounded sx={{ fontSize: 14, color: \"#FFFFFF\", strokeWidth: 2 }} /> }\r\n        </EditButton>\r\n      </HighlightWrapper>\r\n    </NoteContainer>\r\n  );\r\n};\r\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;AAiBA;AACA,MAAM,YAAY,GAOd;AACF,IAAA,QAAQ,EAAE;AACR,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,KAAK,EAAE,UAAU;AAClB,KAAA;AACD,IAAA,OAAO,EAAE;AACP,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,KAAK,EAAE,SAAS;AAChB,QAAA,YAAY,EAAE,MAAM;AACrB,KAAA;AACD,IAAA,iBAAiB,EAAE;AACjB,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,KAAK,EAAE,gBAAgB;AACvB,QAAA,YAAY,EAAE,OAAO;AACtB,KAAA;AACD,IAAA,UAAU,EAAE;AACV,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,KAAK,EAAE,UAAU;AAClB,KAAA;AACD,IAAA,aAAa,EAAE;AACb,QAAA,SAAS,EAAE,WAAW;AACtB,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,KAAK,EAAE,aAAa;AACrB,KAAA;AACD,IAAA,KAAK,EAAE;AACL,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,iBAAiB,EAAE,SAAS;AAC5B,QAAA,KAAK,EAAE,OAAO;AACf,KAAA;CACF;AAED,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;AAChC,IAAA,QAAQ,EAAE,UAAU;AACpB,IAAA,OAAO,EAAE,QAAQ;AACjB,IAAA,QAAQ,EAAE,MAAM;AACjB,CAAA,CAAC;AAEF;AACA,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,EAAE;IACnC,iBAAiB,EAAE,CAAC,IAAI,KACtB,IAAI,KAAK,WAAW;AACpB,QAAA,IAAI,KAAK,gBAAgB;AACzB,QAAA,IAAI,KAAK;AACZ,CAAA,CAAC,CAIC,CAAC,EAAE,SAAS,EAAE,cAAc,EAAE,sBAAsB,EAAE,MAAM;AAC7D,IAAA,QAAQ,EAAE,UAAU;AACpB,IAAA,OAAO,EAAE,QAAQ;AACjB,IAAA,QAAQ,EAAE,MAAM;AAChB,IAAA,sBAAsB,EAAE;AACtB,QAAA,OAAO,EAAE,CAAC;AACX,KAAA;AACD,IAAA,mBAAmB,EAAE;QACnB,UAAU,EAAE,SAAS,GAAG,sBAAsB,GAAG,cAAc;AAC/D,QAAA,OAAO,EAAE,SAAS;AAClB,QAAA,YAAY,EAAE,iCAAiC;AAC/C,QAAA,kBAAkB,EAAE,OAAO;AAC3B,QAAA,wBAAwB,EAAE,OAAO;AACjC,QAAA,UAAU,EAAE,sBAAsB;AAClC,QAAA,MAAM,EAAE,SAAS;AACjB,QAAA,QAAQ,EAAE,MAAM;AAChB,QAAA,QAAQ,EAAE,YAAY;AACtB,QAAA,YAAY,EAAE,YAAY;AAC1B,QAAA,OAAO,EAAE,QAAQ;AACjB,QAAA,KAAK,EAAE,SAAS;AACjB,KAAA;AACF,CAAA,CAAC,CAAC;AAEH,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM;AACpD,IAAA,GAAG,EAAE,CAAC;AACN,IAAA,KAAK,EAAE,CAAC;AACR,IAAA,SAAS,EAAE,uBAAuB;AAClC,IAAA,QAAQ,EAAE,UAAU;AACpB,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,MAAM,EAAE,EAAE;IACV,WAAW,EAAE,GAAG;IAChB,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;AACtC,IAAA,eAAe,EAAE,SAAS;AAC1B,IAAA,OAAO,EAAE,CAAC;AACV,IAAA,UAAU,EAAE,eAAe;AAC3B,IAAA,SAAS,EAAE,4BAA4B;AACvC,IAAA,SAAS,EAAE;AACT,QAAA,eAAe,EAAE,SAAS;AAC1B,QAAA,SAAS,EAAE,kCAAkC;AAC9C,KAAA;AACF,CAAA,CAAC,CAAC;MAEU,OAAO,GAA2B,CAAC,EAC9C,MAAM,EACN,eAAe,EACf,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,WAAW,GACZ,KAAI;IACH,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;;AAGjD,IAAA,MAAM,aAAa,GAAG,wBAAwB,CAAC,MAAQ,CAAC;AACxD,IAAA,MAAM,oBAAoB,GAAG,yBAAyB,CAAC,eAAiB,CAAC;IAEzE,MAAM,KAAK,GAAG;AACZ,UAAE,YAAY,CAAC,aAAa;AAC5B,UAAE;AACE,YAAA,SAAS,EAAE,MAAM;AACjB,YAAA,iBAAiB,EAAE,OAEpB;AAGL,IAAA,MAAM,aAAa,GAAG;AACpB,QAAA,OAAO,EAAE;AACP,YAAA,KAAK,EAAE,SAAS;AAChB,YAAA,SAAS,EAAE,WAAW;AACtB,YAAA,iBAAiB,EAAE,SAAS;AAC5B,YAAA,KAAK,EAAE,WAAW;AACnB,SAAA;AACD,QAAA,QAAQ,EAAE;AACR,YAAA,KAAK,EAAE,SAAS;AAChB,YAAA,SAAS,EAAE,WAAW;AACtB,YAAA,iBAAiB,EAAE,SAAS;AAC5B,YAAA,KAAK,EAAE,UAAU;AAClB,SAAA;KACF;IAGD,MAAM,oBAAoB,GAAG,oBAAoB,GAAG,aAAa,CAAC,oBAAoB,CAAC;AACvF,QAAA;AACE,YAAA,SAAS,EAAE,MAAM;AACjB,YAAA,iBAAiB,EAAE,OAEpB;IAGD,QACEA,IAAA,CAAC,aAAa,EAAA,EAAC,SAAS,EAAE,SAAS,EAAA,QAAA,EAAA,CAEhC,aAAa,IAAI,KAAK,CAAC,YAAY,IAAI,IAAI,KAC1CC,GAAA,CAAC,KAAK,IAAC,OAAO,EAAE,KAAK,CAAC,YAAY,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,YAC9C,IAAI,EAAA,CACC,CACT,EAGDD,IAAA,CAAC,gBAAgB,IACf,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,aAAa,KAAK,aAAa,CAAC,UAAU,GAAE,oBAAoB,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAC5G,sBAAsB,EAAE,aAAa,KAAK,aAAa,CAAC,UAAU,GAAE,oBAAoB,CAAC,iBAAiB,GAAG,KAAK,CAAC,iBAAiB,EACpI,YAAY,EAAE,MAAM,YAAY,CAAC,IAAI,CAAC,EACtC,YAAY,EAAE,MAAM,YAAY,CAAC,KAAK,CAAC,EACvC,OAAO,EAAE,CAAC,CAAC,KAAI;oBACb,CAAC,CAAC,eAAe,EAAE;oBACnB,IAAI,WAAW,EAAE;AACf,wBAAA,WAAW,EAAE;oBACf;AACF,gBAAA,CAAC,EAAA,QAAA,EAAA,CAEDC,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAE,EAAC,OAAO,EAAC,QAAQ,EAAC,EAAA,QAAA,EAAG,QAAQ,EAAA,CAAQ,EAC7EA,GAAA,CAAC,UAAU,EAAA,EACT,SAAS,EAAC,aAAa,EACvB,OAAO,EAAE,CAAC,CAAC,KAAI;4BACb,CAAC,CAAC,eAAe,EAAE;4BACnB,IAAI,WAAW,EAAE;AACf,gCAAA,WAAW,EAAE;4BACf;wBACF,CAAC,EACD,IAAI,EAAC,OAAO,YAEX,aAAa,KAAK,aAAa,CAAC;AAC/B,8BAAEA,GAAA,CAAC,YAAY,IAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC,EAAE,EAAA;8BACpEA,GAAA,CAAC,WAAW,EAAA,EAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC,EAAE,GAAI,EAAA,CAChE,CAAA,EAAA,CACI,CAAA,EAAA,CACL;AAEpB;;;;"}

package/dist/esm/components/StatusBar.js

@@ -45,7 +45,7 @@ const NextButton = styled(IconButton)(({ theme }) => ({
 }));
 const StatusBar = ({ itemCount, variant = 'actionstarted', onTailorClick, onNextClick }) => {
     let message = "";
-    if (itemCount < 1) {
+    if (itemCount <= 1) {
         message = `There is ${itemCount} item that needs attention.`;
     }
     else {

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

@@ -1 +1 @@
-{"version":3,"file":"StatusBar.js","sources":["../../../../src/components/StatusBar.tsx"],"sourcesContent":["\r\n\r\nimport React from 'react';\r\nimport { Box, Typography, IconButton, styled } from '@mui/material';\r\nimport { Button } from './Button';\r\nimport { ChevronRightRounded, PieChartRounded } from '@mui/icons-material';\r\n\r\ninterface StatusBarProps {\r\n  itemCount: number;\r\n  variant: 'actionstarted' | 'noaction';\r\n  onTailorClick?: () => void;\r\n  onNextClick?: () => void;\r\n}\r\n\r\nconst StatusBarContainer = styled(Box)(({ theme }) => ({\r\n  width: '100%',\r\n  backgroundColor: '#F5C98E',\r\n  padding: theme.spacing(1.5, 3),\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'space-between',\r\n  gap: theme.spacing(3),\r\n  flexDirection: 'row',\r\n  [theme.breakpoints.down('sm')]: {\r\n    flexDirection: 'column',\r\n    padding: theme.spacing(1.25, 2),\r\n  },\r\n}));\r\n\r\nconst ContentWrapper = styled(Box)(({ theme }) => ({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  gap: theme.spacing(1.5),\r\n  flex: 1,\r\n  minWidth: 0,\r\n  justifyContent: 'flex-start',\r\n  [theme.breakpoints.down('sm')]: {\r\n    justifyContent: 'center',\r\n    gap: theme.spacing(1),\r\n  },\r\n}));\r\n\r\nconst NextButton = styled(IconButton)(({ theme }) => ({\r\n  width: 40,\r\n  height: 40,\r\n  border: `2px solid rgba(77, 48, 25, 0.25)`,\r\n  backgroundColor: '#fff',\r\n  '&:hover': {\r\n    backgroundColor: '#4D3019',\r\n    color: '#fff',\r\n  },\r\n  [theme.breakpoints.down('sm')]: {\r\n    width: 36,\r\n    height: 36,\r\n  },\r\n}));\r\n\r\nexport const StatusBar: React.FC<StatusBarProps> = ({\r\n  itemCount,\r\n  variant = 'actionstarted',\r\n  onTailorClick,\r\n  onNextClick\r\n}) => {\r\n  let message = \"\"\r\n  if (itemCount < 1){\r\n    message = `There is ${itemCount} item that needs attention.`;\r\n  } else {\r\n    message = `There are ${itemCount} items that need attention.`;\r\n  }\r\n  return (\r\n    <StatusBarContainer>\r\n      <ContentWrapper>\r\n        <PieChartRounded \r\n          sx={{\r\n            fontSize: 24,\r\n            color:\"#4D3019\",\r\n            flexShrink: 0 ,\r\n        }}\r\n        />\r\n        <Typography\r\n          component=\"p\"\r\n          sx={{\r\n            fontSize: { xs: '14px', sm: '15px', md: '16px' },\r\n            color: '#4D3019',\r\n            wordBreak: 'break-word',\r\n            textAlign: { xs: 'center', sm: 'left' },\r\n          }}\r\n        >\r\n          <Box\r\n            component=\"span\"\r\n            sx={{ fontWeight: 700 }}\r\n          >\r\n            {variant === 'actionstarted' ? 'Incomplete.' : 'Not started.'}\r\n          </Box>\r\n          {' '}\r\n          {message}\r\n        </Typography>\r\n\r\n      </ContentWrapper>\r\n      {variant === 'actionstarted' ? (\r\n        <Box sx={{ display: 'flex', gap: 1.5, flexShrink: 0 }}>\r\n          <NextButton\r\n            onClick={onNextClick}\r\n            aria-label=\"Next\"\r\n          >\r\n            <ChevronRightRounded sx={{fontSize:20}} />\r\n          </NextButton>\r\n        </Box>\r\n      ) : (\r\n        <Box sx={{ flexShrink: 0 }}>\r\n          <Button\r\n            variant=\"outline\"\r\n            size=\"sm\"\r\n            onClick={onTailorClick}\r\n          >\r\n            Tailor policies\r\n          </Button>\r\n        </Box>\r\n      )}\r\n    </StatusBarContainer>\r\n  );\r\n};"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"StatusBar.js","sources":["../../../../src/components/StatusBar.tsx"],"sourcesContent":["\r\n\r\nimport React from 'react';\r\nimport { Box, Typography, IconButton, styled } from '@mui/material';\r\nimport { Button } from './Button';\r\nimport { ChevronRightRounded, PieChartRounded } from '@mui/icons-material';\r\n\r\ninterface StatusBarProps {\r\n  itemCount: number;\r\n  variant: 'actionstarted' | 'noaction';\r\n  onTailorClick?: () => void;\r\n  onNextClick?: () => void;\r\n}\r\n\r\nconst StatusBarContainer = styled(Box)(({ theme }) => ({\r\n  width: '100%',\r\n  backgroundColor: '#F5C98E',\r\n  padding: theme.spacing(1.5, 3),\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  justifyContent: 'space-between',\r\n  gap: theme.spacing(3),\r\n  flexDirection: 'row',\r\n  [theme.breakpoints.down('sm')]: {\r\n    flexDirection: 'column',\r\n    padding: theme.spacing(1.25, 2),\r\n  },\r\n}));\r\n\r\nconst ContentWrapper = styled(Box)(({ theme }) => ({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n  gap: theme.spacing(1.5),\r\n  flex: 1,\r\n  minWidth: 0,\r\n  justifyContent: 'flex-start',\r\n  [theme.breakpoints.down('sm')]: {\r\n    justifyContent: 'center',\r\n    gap: theme.spacing(1),\r\n  },\r\n}));\r\n\r\nconst NextButton = styled(IconButton)(({ theme }) => ({\r\n  width: 40,\r\n  height: 40,\r\n  border: `2px solid rgba(77, 48, 25, 0.25)`,\r\n  backgroundColor: '#fff',\r\n  '&:hover': {\r\n    backgroundColor: '#4D3019',\r\n    color: '#fff',\r\n  },\r\n  [theme.breakpoints.down('sm')]: {\r\n    width: 36,\r\n    height: 36,\r\n  },\r\n}));\r\n\r\nexport const StatusBar: React.FC<StatusBarProps> = ({\r\n  itemCount,\r\n  variant = 'actionstarted',\r\n  onTailorClick,\r\n  onNextClick\r\n}) => {\r\n  let message = \"\"\r\n  if (itemCount <= 1){\r\n    message = `There is ${itemCount} item that needs attention.`;\r\n  } else {\r\n    message = `There are ${itemCount} items that need attention.`;\r\n  }\r\n  return (\r\n    <StatusBarContainer>\r\n      <ContentWrapper>\r\n        <PieChartRounded \r\n          sx={{\r\n            fontSize: 24,\r\n            color:\"#4D3019\",\r\n            flexShrink: 0 ,\r\n        }}\r\n        />\r\n        <Typography\r\n          component=\"p\"\r\n          sx={{\r\n            fontSize: { xs: '14px', sm: '15px', md: '16px' },\r\n            color: '#4D3019',\r\n            wordBreak: 'break-word',\r\n            textAlign: { xs: 'center', sm: 'left' },\r\n          }}\r\n        >\r\n          <Box\r\n            component=\"span\"\r\n            sx={{ fontWeight: 700 }}\r\n          >\r\n            {variant === 'actionstarted' ? 'Incomplete.' : 'Not started.'}\r\n          </Box>\r\n          {' '}\r\n          {message}\r\n        </Typography>\r\n\r\n      </ContentWrapper>\r\n      {variant === 'actionstarted' ? (\r\n        <Box sx={{ display: 'flex', gap: 1.5, flexShrink: 0 }}>\r\n          <NextButton\r\n            onClick={onNextClick}\r\n            aria-label=\"Next\"\r\n          >\r\n            <ChevronRightRounded sx={{fontSize:20}} />\r\n          </NextButton>\r\n        </Box>\r\n      ) : (\r\n        <Box sx={{ flexShrink: 0 }}>\r\n          <Button\r\n            variant=\"outline\"\r\n            size=\"sm\"\r\n            onClick={onTailorClick}\r\n          >\r\n            Tailor policies\r\n          </Button>\r\n        </Box>\r\n      )}\r\n    </StatusBarContainer>\r\n  );\r\n};"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/package.json

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