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

ece-docs-components 1.0.18 → 1.0.20

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

Files changed (854) hide show

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

@@ -1,32 +1,97 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
-import { styled, Box, IconButton, Typography } from '@mui/material';
+import { styled, Box, IconButton } from '@mui/material';
 import { EditRounded } from '@mui/icons-material';
+import { Alert } from './Alert.js';
+// Status Enum
+var VariableState;
+(function (VariableState) {
+    VariableState["Accepted"] = "Accepted";
+    VariableState["Pending"] = "Pending";
+    VariableState["Rejected"] = "Rejected";
+    VariableState["NotAccepted"] = "Not Accepted";
+    VariableState["Draft"] = "Draft";
+})(VariableState || (VariableState = {}));
+function mapStatusToVariableState(status) {
+    switch (status) {
+        case "Accepted": return VariableState.Accepted;
+        case "Pending": return VariableState.Pending;
+        case "Rejected": return VariableState.Rejected;
+        case "Not Accepted": return VariableState.NotAccepted;
+        case "Draft": return VariableState.Draft;
+        default: return undefined;
+    }
+}
+// Status based color configs (from Modal)
+const statusConfig = {
+    Accepted: {
+        highlight: '#EDF9CD',
+        highlightSelected: '#DBF59A',
+        label: 'Accepted',
+        labelColor: '#2D5016',
+        chipColor: '#A3D977',
+        chipTextColor: '#fff',
+    },
+    Pending: {
+        highlight: '#F5E2FF',
+        highlightSelected: '#EBC7FF',
+        label: 'Pending',
+        labelColor: 'var(--color-secondary)',
+        chipColor: '#F5A623',
+        chipTextColor: '#4D3019',
+        alertVariant: 'info',
+    },
+    Rejected: {
+        highlight: '#FBEEEE',
+        highlightSelected: '#FFBCB3',
+        label: 'Rejected',
+        labelColor: '#CC0000',
+        chipColor: '#F56B6B',
+        chipTextColor: '#fff',
+        alertVariant: 'error',
+    },
+    'Not Accepted': {
+        highlight: '#FFF6D1',
+        highlightSelected: '#FDE58E',
+        label: 'Not Accepted',
+        labelColor: 'var(--color-secondary)',
+        chipColor: '#A3D977',
+        chipTextColor: '#4D3019',
+    },
+    Draft: {
+        highlight: '#FFEACD',
+        highlightSelected: '#FFC365',
+        label: 'Draft',
+        labelColor: 'rgba(0, 0, 0, 0.6)',
+        chipColor: '#F5D76E',
+        chipTextColor: '#fff',
+    },
+};
 const NoteContainer = styled(Box)({
     position: 'relative',
     maxWidth: '100%',
 });
+// Uses highlight colors driven by status exclusively
 const HighlightWrapper = styled(Box, {
     shouldForwardProp: (prop) => prop !== 'isHovered' &&
         prop !== 'highlightColor' &&
-        prop !== 'highlightSelectedColor' &&
-        prop !== 'isCustom'
-})(({ isHovered, highlightColor, highlightSelectedColor, isCustom }) => ({
+        prop !== 'highlightSelectedColor'
+})(({ isHovered, highlightColor, highlightSelectedColor }) => ({
     position: 'relative',
-    display: 'inline-block', // Keep this as inline-block
+    display: 'inline-block',
     maxWidth: '100%',
     '&:hover .edit-button': {
         opacity: 1,
     },
     '& .highlight-span': {
-        background: isCustom ? highlightColor : (isHovered ? highlightSelectedColor : highlightColor),
+        background: isHovered ? highlightSelectedColor : highlightColor,
         padding: '2px 4px',
         borderBottom: '2px solid rgba(77, 48, 25, 0.3)',
         boxDecorationBreak: 'clone',
         WebkitBoxDecorationBreak: 'clone',
-        transition: isCustom ? 'none' : 'background 0.2s ease',
-        cursor: isCustom ? 'default' : 'pointer',
+        transition: 'background 0.2s ease',
+        cursor: 'pointer',
         fontSize: '13px',
         wordWrap: 'break-word',
         overflowWrap: 'break-word',
@@ -53,59 +118,16 @@ const EditButton = styled(IconButton)(({ theme }) => ({
         transform: 'translate(50%, -50%) scale(1.1)',
     },
 }));
-const NoteBox = ({ variant = 'default', label, children, className = '', onEditClick, }) => {
+const NoteBox = ({ status, label, note, children, className = '', onEditClick, }) => {
     const [isHovered, setIsHovered] = useState(false);
-    const variants = {
-        default: {
-            highlight: '#FFEACD',
-            highlightSelected: '#FFC365',
-            label: '',
-            labelColor: '',
-        },
-        mandatory: {
-            highlight: '#FFEACD',
-            highlightSelected: '#FFC365',
-            label: 'Not Answered (Mandatory)',
-            labelColor: 'var(--color-secondary)',
-        },
-        optional: {
-            highlight: '#FFF6D1',
-            highlightSelected: '#FDE58E',
-            label: 'Not Answered (Optional)',
-            labelColor: 'var(--color-secondary)',
-        },
-        pending: {
-            highlight: '#F5E2FF',
-            highlightSelected: '#EBC7FF',
-            label: 'Pending',
-            labelColor: 'var(--color-secondary)',
-        },
-        accepted: {
-            highlight: '#EDF9CD',
-            highlightSelected: '#DBF59A',
-            label: 'Accepted',
-            labelColor: '#2D5016',
-        },
-        'action-required': {
-            highlight: '#FBEEEE',
-            highlightSelected: '#FFBCB3',
-            label: 'Action required before approval',
-            labelColor: '#CC0000',
-        },
-        custom: {
-            highlight: '#D9EDF8',
-            highlightSelected: '#B3E0F2',
-            label: 'Custom Text',
-            labelColor: 'var(--color-secondary)',
-        },
-    };
-    const style = variants[variant];
-    const displayLabel = label || style.label;
-    return (jsxs(NoteContainer, { className: className, children: [displayLabel && (jsx(Box, { sx: { mb: 1 }, children: jsx(Typography, { component: "span", sx: {
-                        fontSize: '13px',
-                        fontWeight: 500,
-                        color: style.labelColor || 'rgba(0, 0, 0, 0.6)',
-                    }, children: displayLabel }) })), jsxs(HighlightWrapper, { isHovered: isHovered, highlightColor: style.highlight, highlightSelectedColor: style.highlightSelected, isCustom: variant === 'custom', onMouseEnter: () => variant !== 'custom' && setIsHovered(true), onMouseLeave: () => variant !== 'custom' && setIsHovered(false), children: [jsx("span", { className: "highlight-span", children: children }), jsx(EditButton, { className: "edit-button", onClick: (e) => {
+    // Map current status
+    const variableState = mapStatusToVariableState(status);
+    const style = variableState
+        ? statusConfig[variableState]
+        : {
+            highlight: '#EEE',
+            highlightSelected: '#DDD'};
+    return (jsxs(NoteContainer, { className: className, children: [variableState && style.alertVariant && note && (jsx(Alert, { variant: style.alertVariant, sx: { mb: 1 }, children: note })), jsxs(HighlightWrapper, { isHovered: isHovered, highlightColor: style.highlight, highlightSelectedColor: style.highlightSelected, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), children: [jsx("span", { className: "highlight-span", children: children }), jsx(EditButton, { className: "edit-button", onClick: (e) => {
                             e.stopPropagation();
                             if (onEditClick) {
                                 onEditClick();

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

	@@ -1 +1 @@
1	- {"version":3,"file":"NoteBox.js","sources":["../../../../src/components/NoteBox.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Box, Typography, IconButton, styled } from '@mui/material';\nimport { EditRounded } from '@mui/icons-material';\n\n\ninterface NoteBoxProps {\n variant?: 'default' \| 'mandatory' \| 'optional' \| 'pending' \| 'accepted' \| 'action-required' \| 'custom';\n label?: string;\n children: React.ReactNode;\n className?: string;\n onEditClick?: () => void;\n}\n\n\nconst NoteContainer = styled(Box)({\n position: 'relative',\n maxWidth: '100%',\n});\n\nconst HighlightWrapper = styled(Box,{\n shouldForwardProp: (prop) => \n prop !== 'isHovered' && \n prop !== 'highlightColor' && \n prop !== 'highlightSelectedColor' && \n prop !== 'isCustom'\n})<{ \n isHovered: boolean; \n highlightColor: string; \n highlightSelectedColor: string;\n isCustom: boolean;\n}>(({ isHovered, highlightColor, highlightSelectedColor, isCustom }) => ({\n position: 'relative',\n display: 'inline-block', // Keep this as inline-block\n maxWidth: '100%',\n '&:hover .edit-button': {\n opacity: 1,\n },\n '& .highlight-span': {\n background: isCustom ? highlightColor : (isHovered ? highlightSelectedColor : highlightColor),\n padding: '2px 4px',\n borderBottom: '2px solid rgba(77, 48, 25, 0.3)',\n boxDecorationBreak: 'clone',\n WebkitBoxDecorationBreak: 'clone',\n transition: isCustom ? 'none' : 'background 0.2s ease',\n cursor: isCustom ? 'default' : 'pointer',\n fontSize: '13px',\n wordWrap: 'break-word',\n overflowWrap: 'break-word',\n display: 'inline',\n color: '#4D3019',\n },\n}));\n\nconst EditButton = styled(IconButton)(({ theme }) => ({\n position: 'absolute',\n top: 0,\n right: 0,\n transform: 'translate(50%, -50%)',\n width: 20,\n height: 20,\n borderRadius: (typeof theme.shape.borderRadius === 'string'\n ? parseInt(theme.shape.borderRadius, 10)\n : theme.shape.borderRadius \|\| 4) * 2,\n backgroundColor: '#4D3019',\n opacity: 0,\n transition: 'all 0.2s ease',\n boxShadow: '0 1px 3px rgba(0,0,0,0.12)',\n '&:hover': {\n backgroundColor: '#4D3019',\n transform: 'translate(50%, -50%) scale(1.1)',\n },\n}));\n\n\nexport const NoteBox: React.FC<NoteBoxProps> = ({\n variant = 'default',\n label,\n children,\n className = '',\n onEditClick,\n}) => {\n const [isHovered, setIsHovered] = useState(false);\n\n\n const variants = {\n default: {\n highlight: '#FFEACD',\n highlightSelected: '#FFC365',\n label: '',\n labelColor: '',\n },\n mandatory: {\n highlight: '#FFEACD',\n highlightSelected: '#FFC365',\n label: 'Not Answered (Mandatory)',\n labelColor: 'var(--color-secondary)',\n },\n optional: {\n highlight: '#FFF6D1',\n highlightSelected: '#FDE58E',\n label: 'Not Answered (Optional)',\n labelColor: 'var(--color-secondary)',\n },\n pending: {\n highlight: '#F5E2FF',\n highlightSelected: '#EBC7FF',\n label: 'Pending',\n labelColor: 'var(--color-secondary)',\n },\n accepted: {\n highlight: '#EDF9CD',\n highlightSelected: '#DBF59A',\n label: 'Accepted',\n labelColor: '#2D5016',\n },\n 'action-required': {\n highlight: '#FBEEEE',\n highlightSelected: '#FFBCB3',\n label: 'Action required before approval',\n labelColor: '#CC0000',\n },\n custom: {\n highlight: '#D9EDF8',\n highlightSelected: '#B3E0F2',\n label: 'Custom Text',\n labelColor: 'var(--color-secondary)',\n },\n };\n\n\n const style = variants[variant];\n const displayLabel = label \|\| style.label;\n\n\n return (\n <NoteContainer className={className}>\n {displayLabel && (\n <Box sx={{ mb: 1 }}>\n <Typography\n component=\"span\"\n sx={{\n fontSize: '13px',\n fontWeight: 500,\n color: style.labelColor \|\| 'rgba(0, 0, 0, 0.6)',\n }}\n >\n {displayLabel}\n </Typography>\n </Box>\n )}\n <HighlightWrapper\n isHovered={isHovered}\n highlightColor={style.highlight}\n highlightSelectedColor={style.highlightSelected}\n isCustom={variant === 'custom'}\n onMouseEnter={() => variant !== 'custom' && setIsHovered(true)}\n onMouseLeave={() => variant !== 'custom' && setIsHovered(false)}\n >\n <span className=\"highlight-span\">\n {children}\n </span>\n <EditButton\n className=\"edit-button\"\n onClick={(e) => {\n e.stopPropagation();\n if (onEditClick) {\n onEditClick();\n }\n }}\n title=\"Edit variable highlight\"\n size=\"small\"\n >\n <EditRounded sx={{fontSize:14, color:\"#FFFFFF\", strokeWidth:2}} />\n </EditButton>\n </HighlightWrapper>\n </NoteContainer>\n );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
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 { EditRounded } from '@mui/icons-material';\r\nimport { Alert } from './Alert';\r\n\r\n// Status Enum\r\nenum VariableState {\r\n Accepted = \"Accepted\",\r\n Pending = \"Pending\",\r\n Rejected = \"Rejected\",\r\n NotAccepted = \"Not Accepted\",\r\n Draft = \"Draft\"\r\n}\r\n\r\ninterface NoteBoxProps {\r\n status?: string; // Use only status now\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\nfunction mapStatusToVariableState(status?: string): VariableState \| undefined {\r\n switch (status) {\r\n case \"Accepted\": return VariableState.Accepted;\r\n case \"Pending\": return VariableState.Pending;\r\n case \"Rejected\": return VariableState.Rejected;\r\n case \"Not Accepted\": return VariableState.NotAccepted;\r\n case \"Draft\": return VariableState.Draft;\r\n default: return undefined;\r\n }\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 labelColor: string;\r\n chipColor: string;\r\n chipTextColor: 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 labelColor: '#2D5016',\r\n chipColor: '#A3D977',\r\n chipTextColor: '#fff',\r\n },\r\n Pending: {\r\n highlight: '#F5E2FF',\r\n highlightSelected: '#EBC7FF',\r\n label: 'Pending',\r\n labelColor: 'var(--color-secondary)',\r\n chipColor: '#F5A623',\r\n chipTextColor: '#4D3019',\r\n alertVariant: 'info',\r\n },\r\n Rejected: {\r\n highlight: '#FBEEEE',\r\n highlightSelected: '#FFBCB3',\r\n label: 'Rejected',\r\n labelColor: '#CC0000',\r\n chipColor: '#F56B6B',\r\n chipTextColor: '#fff',\r\n alertVariant: 'error',\r\n },\r\n 'Not Accepted': {\r\n highlight: '#FFF6D1',\r\n highlightSelected: '#FDE58E',\r\n label: 'Not Accepted',\r\n labelColor: 'var(--color-secondary)',\r\n chipColor: '#A3D977',\r\n chipTextColor: '#4D3019',\r\n },\r\n Draft: {\r\n highlight: '#FFEACD',\r\n highlightSelected: '#FFC365',\r\n label: 'Draft',\r\n labelColor: 'rgba(0, 0, 0, 0.6)',\r\n chipColor: '#F5D76E',\r\n chipTextColor: '#fff',\r\n },\r\n};\r\n\r\nconst NoteContainer = styled(Box)({\r\n position: 'relative',\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-block',\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: '13px',\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 position: 'absolute',\r\n top: 0,\r\n right: 0,\r\n transform: 'translate(50%, -50%)',\r\n width: 20,\r\n height: 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 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 style = variableState\r\n ? statusConfig[variableState]\r\n : {\r\n highlight: '#EEE',\r\n highlightSelected: '#DDD',\r\n label: label \|\| '',\r\n labelColor: 'rgba(0,0,0,0.6)',\r\n chipColor: '#ccc',\r\n chipTextColor: '#4D3019',\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={style.highlight}\r\n highlightSelectedColor={style.highlightSelected}\r\n onMouseEnter={() => setIsHovered(true)}\r\n onMouseLeave={() => setIsHovered(false)}\r\n >\r\n <span className=\"highlight-span\">{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 title=\"Edit variable highlight\"\r\n size=\"small\"\r\n >\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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"}

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

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

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

@@ -45,37 +45,58 @@ const StepNumber = styled(Box, {
 const StepLine = styled(Box, {
     shouldForwardProp: (prop) => prop !== 'isCompleted'
 })(({ theme, isCompleted }) => ({
-    flex: 1,
     height: 4,
     borderRadius: 2,
-    margin: '0 8px',
-    minWidth: '1rem',
+    width: '100%',
     transition: 'background-color 0.2s',
     backgroundColor: isCompleted ? theme.palette.primary.main : `${theme.palette.dark.main}1A`,
     [theme.breakpoints.down('sm')]: {
         height: 2,
-        margin: '0 4px',
     },
 }));
 const StepIndicator = ({ steps, currentStep, className = '' }) => {
     const theme = useTheme();
+    const cols = steps.length * 2 - 1;
     return (jsx(Box, { className: className, sx: {
-            display: 'flex',
+            display: 'grid',
+            gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))`,
+            gridAutoRows: 'auto',
             alignItems: 'center',
-            justifyContent: 'space-between',
-            overflowX: 'auto',
+            rowGap: { xs: 0.5, sm: 1 },
+            // Keep if you want horizontal scrolling in very tight layouts:
+            // overflowX: 'auto',
             pb: 1,
         }, children: steps.map((step, index) => {
             const stepNumber = index + 1;
             const isActive = stepNumber === currentStep;
             const isCompleted = stepNumber < currentStep;
-            return (jsxs(React.Fragment, { children: [jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', alignItems: 'center', flexShrink: 0 }, children: [jsx(StepNumber, { isActive: isActive, isCompleted: isCompleted, children: stepNumber }), jsx(Typography, { sx: {
-                                    mt: { xs: 0.5, sm: 1 },
-                                    fontSize: { xs: '10px', sm: '12px' },
-                                    fontWeight: 500,
-                                    whiteSpace: 'nowrap',
-                                    color: isActive ? theme.palette.primary.main : `${theme.palette.dark.main}99`,
-                                }, children: step })] }), index < steps.length - 1 && (jsx(StepLine, { isCompleted: isCompleted }))] }, index));
+            const circleCol = 2 * index + 1;
+            const lineCol = 2 * index + 2;
+            return (jsxs(React.Fragment, { children: [jsx(Box, { sx: {
+                            gridColumn: `${circleCol} / span 1`,
+                            gridRow: 1,
+                            display: 'flex',
+                            justifyContent: 'center',
+                        }, children: jsx(StepNumber, { isActive: isActive, isCompleted: isCompleted, children: stepNumber }) }), index < steps.length - 1 && (jsx(Box, { sx: {
+                            gridColumn: `${lineCol} / span 1`,
+                            gridRow: 1,
+                            display: 'flex',
+                            alignItems: 'center',
+                        }, children: jsx(StepLine, { isCompleted: isCompleted }) })), jsx(Typography, { sx: {
+                            gridColumn: `${circleCol} / span 1`,
+                            gridRow: 2,
+                            mt: { xs: 0.5, sm: 1 },
+                            fontSize: { xs: '10px', sm: '12px' },
+                            fontWeight: 500,
+                            textAlign: 'center',
+                            whiteSpace: 'normal',
+                            overflowWrap: 'anywhere',
+                            wordBreak: 'break-word',
+                            // Constrain label width so wrap looks tidy; tweak as needed
+                            maxWidth: { xs: 80, sm: 112, md: 140 },
+                            justifySelf: 'center',
+                            color: isActive ? theme.palette.primary.main : `${theme.palette.dark.main}99`,
+                        }, children: step })] }, index));
         }) }));
 };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Progress.js","sources":["../../../../src/components/Progress.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { Box, Typography, LinearProgress, styled } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\n\ninterface ProgressProps {\n current: number;\n total: number;\n showLabel?: boolean;\n className?: string;\n}\n\nconst StyledLinearProgress = styled(LinearProgress)(({ theme }) => ({\n height: 10,\n borderRadius: 9999,\n backgroundColor: `${theme.palette.dark.main}1A`,\n '& .MuiLinearProgress-bar': {\n borderRadius: 9999,\n backgroundColor: theme.palette.primary.main,\n transition: 'transform 0.3s ease-out',\n },\n}));\n\nexport const Progress: React.FC<ProgressProps> = ({\n current,\n total,\n showLabel = true,\n className = ''\n}) => {\n const percentage = Math.min(Math.max((current / total) * 100, 0), 100);\n\n return (\n <Box className={className}>\n {showLabel && (\n <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 1 }}>\n <Typography variant=\"body2\" fontWeight={500}>\n Step {current} of {total}\n </Typography>\n <Typography variant=\"body2\" fontWeight={500}>\n {Math.round(percentage)}%\n </Typography>\n </Box>\n )}\n <StyledLinearProgress variant=\"determinate\" value={percentage} />\n </Box>\n );\n};\n\ninterface StepIndicatorProps {\n steps: string[];\n currentStep: number;\n className?: string;\n}\n\nconst StepNumber = styled(Box,{\n shouldForwardProp: (prop) => prop !== 'isActive' && prop !== 'isCompleted'\n})<{ isActive: boolean; isCompleted: boolean }>(\n ({ theme, isActive, isCompleted }) => ({\n width: 40,\n height: 40,\n borderRadius: '50%',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n fontWeight: 600,\n fontSize: '0.875rem',\n transition: 'all 0.2s',\n backgroundColor: isCompleted \|\| isActive \n ? theme.palette.primary.main \n : `${theme.palette.dark.main}1A`,\n color: isCompleted \|\| isActive \n ? (theme.palette.custom?.stepIndicatorTextColor \|\| theme.palette.dark.main)\n : `${theme.palette.dark.main}99`,\n boxShadow: isActive ? `0 0 0 4px ${theme.palette.primary.main}33` : 'none',\n [theme.breakpoints.down('sm')]: {\n width: 32,\n height: 32,\n fontSize: '0.75rem',\n },\n })\n);\n\nconst StepLine = styled(Box,{\n shouldForwardProp: (prop) => prop !== 'isCompleted'\n})<{ isCompleted: boolean }>(({ theme, isCompleted }) => ({\n flex: 1,\n height: 4,\n borderRadius: 2,\n margin: '0 8px',\n minWidth: '1rem',\n transition: 'background-color 0.2s',\n backgroundColor: isCompleted ? theme.palette.primary.main : `${theme.palette.dark.main}1A`,\n [theme.breakpoints.down('sm')]: {\n height: 2,\n margin: '0 4px',\n },\n}));\n\nexport const StepIndicator: React.FC<StepIndicatorProps> = ({\n steps,\n currentStep,\n className = ''\n}) => {\n const theme = useTheme();\n\n return (\n <Box \n className={className}\n sx={{ \n display: 'flex', \n alignItems: 'center', \n justifyContent: 'space-between',\n overflowX: 'auto',\n pb: 1,\n }}\n >\n {steps.map((step, index) => {\n const stepNumber = index + 1;\n const isActive = stepNumber === currentStep;\n const isCompleted = stepNumber < currentStep;\n\n return (\n <React.Fragment key={index}>\n <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', flexShrink: 0 }}>\n <StepNumber isActive={isActive} isCompleted={isCompleted}>\n {stepNumber}\n </StepNumber>\n <Typography\n sx={{\n mt: { xs: 0.5, sm: 1 },\n fontSize: { xs: '10px', sm: '12px' },\n fontWeight: 500,\n whiteSpace: 'nowrap',\n color: isActive ? theme.palette.primary.main : `${theme.palette.dark.main}99`,\n }}\n >\n {step}\n </Typography>\n </Box>\n {index < steps.length - 1 && (\n <StepLine isCompleted={isCompleted} />\n )}\n </React.Fragment>\n );\n })}\n </Box>\n );\n};"],"names":["_jsxs","_jsx"],"mappings":"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"}
1	+ {"version":3,"file":"Progress.js","sources":["../../../../src/components/Progress.tsx"],"sourcesContent":["\r\n\r\nimport React from 'react';\r\nimport { Box, Typography, LinearProgress, styled } from '@mui/material';\r\nimport { useTheme } from '../ThemeProvider';\r\n\r\ninterface ProgressProps {\r\n current: number;\r\n total: number;\r\n showLabel?: boolean;\r\n className?: string;\r\n}\r\n\r\nconst StyledLinearProgress = styled(LinearProgress)(({ theme }) => ({\r\n height: 10,\r\n borderRadius: 9999,\r\n backgroundColor: `${theme.palette.dark.main}1A`,\r\n '& .MuiLinearProgress-bar': {\r\n borderRadius: 9999,\r\n backgroundColor: theme.palette.primary.main,\r\n transition: 'transform 0.3s ease-out',\r\n },\r\n}));\r\n\r\nexport const Progress: React.FC<ProgressProps> = ({\r\n current,\r\n total,\r\n showLabel = true,\r\n className = ''\r\n}) => {\r\n const percentage = Math.min(Math.max((current / total) * 100, 0), 100);\r\n\r\n return (\r\n <Box className={className}>\r\n {showLabel && (\r\n <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 1 }}>\r\n <Typography variant=\"body2\" fontWeight={500}>\r\n Step {current} of {total}\r\n </Typography>\r\n <Typography variant=\"body2\" fontWeight={500}>\r\n {Math.round(percentage)}%\r\n </Typography>\r\n </Box>\r\n )}\r\n <StyledLinearProgress variant=\"determinate\" value={percentage} />\r\n </Box>\r\n );\r\n};\r\ninterface StepIndicatorProps {\r\n steps: string[];\r\n currentStep: number;\r\n className?: string;\r\n}\r\n\r\nconst StepNumber = styled(Box, {\r\n shouldForwardProp: (prop) => prop !== 'isActive' && prop !== 'isCompleted'\r\n})<{ isActive: boolean; isCompleted: boolean }>(\r\n ({ theme, isActive, isCompleted }) => ({\r\n width: 40,\r\n height: 40,\r\n borderRadius: '50%',\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n fontWeight: 600,\r\n fontSize: '0.875rem',\r\n transition: 'all 0.2s',\r\n backgroundColor: isCompleted \|\| isActive\r\n ? theme.palette.primary.main\r\n : `${theme.palette.dark.main}1A`,\r\n color: isCompleted \|\| isActive\r\n ? (theme.palette.custom?.stepIndicatorTextColor \|\| theme.palette.dark.main)\r\n : `${theme.palette.dark.main}99`,\r\n boxShadow: isActive ? `0 0 0 4px ${theme.palette.primary.main}33` : 'none',\r\n [theme.breakpoints.down('sm')]: {\r\n width: 32,\r\n height: 32,\r\n fontSize: '0.75rem',\r\n },\r\n })\r\n);\r\n\r\nconst StepLine = styled(Box, {\r\n shouldForwardProp: (prop) => prop !== 'isCompleted'\r\n})<{ isCompleted: boolean }>(({ theme, isCompleted }) => ({\r\n height: 4,\r\n borderRadius: 2,\r\n width: '100%',\r\n transition: 'background-color 0.2s',\r\n backgroundColor: isCompleted ? theme.palette.primary.main : `${theme.palette.dark.main}1A`,\r\n [theme.breakpoints.down('sm')]: {\r\n height: 2,\r\n },\r\n}));\r\n\r\nexport const StepIndicator: React.FC<StepIndicatorProps> = ({\r\n steps,\r\n currentStep,\r\n className = ''\r\n}) => {\r\n const theme = useTheme();\r\n const cols = steps.length * 2 - 1;\r\n\r\n return (\r\n <Box\r\n className={className}\r\n sx={{\r\n display: 'grid',\r\n gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))`,\r\n gridAutoRows: 'auto',\r\n alignItems: 'center',\r\n rowGap: { xs: 0.5, sm: 1 },\r\n // Keep if you want horizontal scrolling in very tight layouts:\r\n // overflowX: 'auto',\r\n pb: 1,\r\n }}\r\n >\r\n {steps.map((step, index) => {\r\n const stepNumber = index + 1;\r\n const isActive = stepNumber === currentStep;\r\n const isCompleted = stepNumber < currentStep;\r\n const circleCol = 2 * index + 1;\r\n const lineCol = 2 * index + 2;\r\n\r\n return (\r\n <React.Fragment key={index}>\r\n {/* Circle /}\r\n <Box\r\n sx={{\r\n gridColumn: `${circleCol} / span 1`,\r\n gridRow: 1,\r\n display: 'flex',\r\n justifyContent: 'center',\r\n }}\r\n >\r\n <StepNumber isActive={isActive} isCompleted={isCompleted}>\r\n {stepNumber}\r\n </StepNumber>\r\n </Box>\r\n\r\n {/ Connector (not after last step) /}\r\n {index < steps.length - 1 && (\r\n <Box\r\n sx={{\r\n gridColumn: `${lineCol} / span 1`,\r\n gridRow: 1,\r\n display: 'flex',\r\n alignItems: 'center',\r\n }}\r\n >\r\n <StepLine isCompleted={isCompleted} />\r\n </Box>\r\n )}\r\n\r\n {/ Label row (wraps independently) */}\r\n <Typography\r\n sx={{\r\n gridColumn: `${circleCol} / span 1`,\r\n gridRow: 2,\r\n mt: { xs: 0.5, sm: 1 },\r\n fontSize: { xs: '10px', sm: '12px' },\r\n fontWeight: 500,\r\n textAlign: 'center',\r\n whiteSpace: 'normal',\r\n overflowWrap: 'anywhere',\r\n wordBreak: 'break-word',\r\n // Constrain label width so wrap looks tidy; tweak as needed\r\n maxWidth: { xs: 80, sm: 112, md: 140 },\r\n justifySelf: 'center',\r\n color: isActive ? theme.palette.primary.main : `${theme.palette.dark.main}99`,\r\n }}\r\n >\r\n {step}\r\n </Typography>\r\n </React.Fragment>\r\n );\r\n })}\r\n </Box>\r\n );\r\n};\r\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Radio.js","sources":["../../../../src/components/Radio.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { Box, FormControl, FormLabel, FormHelperText, FormControlLabel, styled, Typography } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\n\ninterface RadioProps extends React.InputHTMLAttributes<HTMLInputElement> {\n label: string;\n description?: string;\n}\n\nconst CustomRadioIcon = styled('span')<{ checked?: boolean }>(({ theme, checked }) => ({\n width: 20,\n height: 20,\n borderRadius: '50%',\n border: checked ? `5px solid ${theme.palette.secondary.main}` : `2px solid ${theme.palette.dark.main}4D`,\n transition: 'all 0.2s',\n backgroundColor: 'transparent',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n}));\n\nexport const Radio: React.FC<RadioProps> = ({\n label,\n description,\n className = '',\n id,\n checked,\n ...props\n}) => {\n const radioId = id \|\| `radio-${Math.random().toString(36).substr(2, 9)}`;\n const theme = useTheme();\n\n return (\n <FormControlLabel\n className={className}\n control={\n <Box sx={{ display: 'flex', alignItems: 'center', height: 24, mr: 1.5 }}>\n <input\n id={radioId}\n type=\"radio\"\n style={{ display: 'none' }}\n checked={checked}\n {...props}\n />\n <CustomRadioIcon \n checked={checked}\n onClick={(e) => {\n const input = document.getElementById(radioId) as HTMLInputElement;\n if (input && !props.disabled) {\n input.click();\n }\n }}\n sx={{\n cursor: props.disabled ? 'not-allowed' : 'pointer',\n opacity: props.disabled ? 0.5 : 1,\n }}\n />\n </Box>\n }\n label={\n <Box sx={{ ml: 0 }}>\n <Typography\n component=\"label\"\n htmlFor={radioId}\n sx={{\n fontSize: '1rem',\n fontWeight: 500,\n color: theme.palette.dark.main,\n cursor: props.disabled ? 'not-allowed' : 'pointer',\n opacity: props.disabled ? 0.5 : 1,\n }}\n >\n {label}\n </Typography>\n {description && (\n <Typography\n variant=\"body2\"\n sx={{\n fontSize: '0.875rem',\n color: `${theme.palette.dark.main}99`,\n mt: 0.25,\n }}\n >\n {description}\n </Typography>\n )}\n </Box>\n }\n sx={{ alignItems: 'flex-start', ml: 0 }}\n />\n );\n};\n\ninterface RadioGroupProps {\n label?: string;\n error?: string;\n children: React.ReactNode;\n className?: string;\n}\n\nexport const RadioGroup: React.FC<RadioGroupProps> = ({\n label,\n error,\n children,\n className = ''\n}) => {\n const theme = useTheme();\n\n return (\n <FormControl component=\"fieldset\" className={className} error={!!error} fullWidth>\n {label && (\n <FormLabel\n component=\"legend\"\n sx={{\n fontSize: '0.875rem',\n fontWeight: 500,\n color: theme.palette.dark.main,\n mb: 1.5,\n '&.Mui-focused': {\n color: theme.palette.dark.main,\n },\n }}\n >\n {label}\n </FormLabel>\n )}\n <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>\n {children}\n </Box>\n {error && (\n <FormHelperText\n sx={{\n mt: 1,\n fontSize: '0.875rem',\n color: theme.palette.accent.main,\n }}\n >\n {error}\n </FormHelperText>\n )}\n </FormControl>\n );\n};"],"names":["_jsx","_jsxs"],"mappings":"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"}
1	+ {"version":3,"file":"Radio.js","sources":["../../../../src/components/Radio.tsx"],"sourcesContent":["\r\n\r\nimport React from 'react';\r\nimport { Box, FormControl, FormLabel, FormHelperText, FormControlLabel, styled, Typography } from '@mui/material';\r\nimport { useTheme } from '../ThemeProvider';\r\n\r\ninterface RadioProps extends React.InputHTMLAttributes<HTMLInputElement> {\r\n label: string;\r\n description?: string;\r\n}\r\n\r\nconst CustomRadioIcon = styled('span')<{ checked?: boolean }>(({ theme, checked }) => ({\r\n width: 20,\r\n height: 20,\r\n borderRadius: '50%',\r\n border: checked ? `5px solid ${theme.palette.secondary.main}` : `2px solid ${theme.palette.dark.main}4D`,\r\n transition: 'all 0.2s',\r\n backgroundColor: 'transparent',\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n}));\r\n\r\nexport const Radio: React.FC<RadioProps> = ({\r\n label,\r\n description,\r\n className = '',\r\n id,\r\n checked,\r\n ...props\r\n}) => {\r\n const radioId = id \|\| `radio-${Math.random().toString(36).substr(2, 9)}`;\r\n const theme = useTheme();\r\n\r\n return (\r\n <FormControlLabel\r\n className={className}\r\n control={\r\n <Box sx={{ display: 'flex', alignItems: 'center', height: 24, mr: 1.5 }}>\r\n <input\r\n id={radioId}\r\n type=\"radio\"\r\n style={{ display: 'none' }}\r\n checked={checked}\r\n {...props}\r\n />\r\n <CustomRadioIcon \r\n checked={checked}\r\n onClick={(e) => {\r\n const input = document.getElementById(radioId) as HTMLInputElement;\r\n if (input && !props.disabled) {\r\n input.click();\r\n }\r\n }}\r\n sx={{\r\n cursor: props.disabled ? 'not-allowed' : 'pointer',\r\n opacity: props.disabled ? 0.5 : 1,\r\n }}\r\n />\r\n </Box>\r\n }\r\n label={\r\n <Box sx={{ ml: 0 }}>\r\n <Typography\r\n component=\"label\"\r\n htmlFor={radioId}\r\n sx={{\r\n fontSize: '1rem',\r\n fontWeight: 500,\r\n color: theme.palette.dark.main,\r\n cursor: props.disabled ? 'not-allowed' : 'pointer',\r\n opacity: props.disabled ? 0.5 : 1,\r\n }}\r\n >\r\n {label}\r\n </Typography>\r\n {description && (\r\n <Typography\r\n variant=\"body2\"\r\n sx={{\r\n fontSize: '0.875rem',\r\n color: `${theme.palette.dark.main}99`,\r\n mt: 0.25,\r\n }}\r\n >\r\n {description}\r\n </Typography>\r\n )}\r\n </Box>\r\n }\r\n sx={{ alignItems: 'flex-start', ml: 0 }}\r\n />\r\n );\r\n};\r\n\r\ninterface RadioGroupProps {\r\n label?: string;\r\n error?: string;\r\n children: React.ReactNode;\r\n className?: string;\r\n}\r\n\r\nexport const RadioGroup: React.FC<RadioGroupProps> = ({\r\n label,\r\n error,\r\n children,\r\n className = ''\r\n}) => {\r\n const theme = useTheme();\r\n\r\n return (\r\n <FormControl component=\"fieldset\" className={className} error={!!error} fullWidth>\r\n {label && (\r\n <FormLabel\r\n component=\"legend\"\r\n sx={{\r\n fontSize: '0.875rem',\r\n fontWeight: 500,\r\n color: theme.palette.dark.main,\r\n mb: 1.5,\r\n '&.Mui-focused': {\r\n color: theme.palette.dark.main,\r\n },\r\n }}\r\n >\r\n {label}\r\n </FormLabel>\r\n )}\r\n <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>\r\n {children}\r\n </Box>\r\n {error && (\r\n <FormHelperText\r\n sx={{\r\n mt: 1,\r\n fontSize: '0.875rem',\r\n color: theme.palette.accent.main,\r\n }}\r\n >\r\n {error}\r\n </FormHelperText>\r\n )}\r\n </FormControl>\r\n );\r\n};"],"names":["_jsx","_jsxs"],"mappings":"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"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ReadBy.js","sources":["../../../../src/components/ReadBy.tsx"],"sourcesContent":["\n\nimport React, { useState } from 'react';\nimport { Box, IconButton, Typography, styled } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { ExpandLessRounded, ExpandMoreRounded } from '@mui/icons-material';\n\ninterface ReadByProps {\n names: string[];\n}\n\nconst ReadByContainer = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'flex-start',\n gap: theme.spacing(2),\n padding: theme.spacing(2),\n borderLeft: `4px solid ${theme.palette.primary.main}`,\n borderRadius: '0 8px 8px 0',\n backgroundColor: theme.palette.custom?.readByBackgroundColor \|\| theme.palette.accent.main,\n [theme.breakpoints.down('sm')]: {\n flexDirection: 'column',\n padding: theme.spacing(1.5),\n },\n}));\n\nconst ExpandButton = styled(IconButton)(({ theme }) => ({\n width: 32,\n height: 32,\n backgroundColor: '#4d3019',\n color: '#fff',\n flexShrink: 0,\n '&:hover': {\n backgroundColor: '#4d3019',\n opacity: 0.8,\n },\n [theme.breakpoints.down('sm')]: {\n alignSelf: 'flex-end',\n },\n}));\n\nexport const ReadBy: React.FC<ReadByProps> = ({ names }) => {\n const theme = useTheme();\n const [isExpanded, setIsExpanded] = useState(false);\n\n const displayText = isExpanded\n ? names.join(', ')\n : names.length > 5\n ? `${names.slice(0, 5).join(', ')}...`\n : names.join(', ');\n\n return (\n <ReadByContainer>\n <Box sx={{ flex: 1, minWidth: 0, wordBreak: 'break-word' }}>\n <Typography\n component=\"span\"\n sx={{\n fontSize: { xs: '13px', sm: '14px' },\n fontWeight: 700,\n color: theme.palette.dark.main,\n }}\n >\n Read by:\n </Typography>\n <Typography\n component=\"span\"\n sx={{\n fontSize: { xs: '13px', sm: '14px' },\n color: theme.palette.dark.main,\n ml: 1,\n }}\n >\n {displayText}\n </Typography>\n </Box>\n {names.length > 5 && (\n <ExpandButton\n onClick={() => setIsExpanded(!isExpanded)}\n aria-label={isExpanded ? 'Collapse' : 'Expand'}\n size=\"small\"\n >\n {isExpanded ? (\n <ExpandLessRounded sx={{fontSize: 16}} />\n ) : (\n <ExpandMoreRounded sx={{fontSize: 16}} />\n )}\n </ExpandButton>\n )}\n </ReadByContainer>\n );\n};"],"names":["_jsxs","_jsx"],"mappings":"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"}
1	+ {"version":3,"file":"ReadBy.js","sources":["../../../../src/components/ReadBy.tsx"],"sourcesContent":["\r\n\r\nimport React, { useState } from 'react';\r\nimport { Box, IconButton, Typography, styled } from '@mui/material';\r\nimport { useTheme } from '../ThemeProvider';\r\nimport { ExpandLessRounded, ExpandMoreRounded } from '@mui/icons-material';\r\n\r\ninterface ReadByProps {\r\n names: string[];\r\n}\r\n\r\nconst ReadByContainer = styled(Box)(({ theme }) => ({\r\n display: 'flex',\r\n flexDirection: 'row',\r\n alignItems: 'flex-start',\r\n gap: theme.spacing(2),\r\n padding: theme.spacing(2),\r\n borderLeft: `4px solid ${theme.palette.primary.main}`,\r\n borderRadius: '0 8px 8px 0',\r\n backgroundColor: theme.palette.custom?.readByBackgroundColor \|\| theme.palette.accent.main,\r\n [theme.breakpoints.down('sm')]: {\r\n flexDirection: 'column',\r\n padding: theme.spacing(1.5),\r\n },\r\n}));\r\n\r\nconst ExpandButton = styled(IconButton)(({ theme }) => ({\r\n width: 32,\r\n height: 32,\r\n backgroundColor: '#4d3019',\r\n color: '#fff',\r\n flexShrink: 0,\r\n '&:hover': {\r\n backgroundColor: '#4d3019',\r\n opacity: 0.8,\r\n },\r\n [theme.breakpoints.down('sm')]: {\r\n alignSelf: 'flex-end',\r\n },\r\n}));\r\n\r\nexport const ReadBy: React.FC<ReadByProps> = ({ names }) => {\r\n const theme = useTheme();\r\n const [isExpanded, setIsExpanded] = useState(false);\r\n\r\n const displayText = isExpanded\r\n ? names.join(', ')\r\n : names.length > 5\r\n ? `${names.slice(0, 5).join(', ')}...`\r\n : names.join(', ');\r\n\r\n return (\r\n <ReadByContainer>\r\n <Box sx={{ flex: 1, minWidth: 0, wordBreak: 'break-word' }}>\r\n <Typography\r\n component=\"span\"\r\n sx={{\r\n fontSize: { xs: '13px', sm: '14px' },\r\n fontWeight: 700,\r\n color: theme.palette.dark.main,\r\n }}\r\n >\r\n Read by:\r\n </Typography>\r\n <Typography\r\n component=\"span\"\r\n sx={{\r\n fontSize: { xs: '13px', sm: '14px' },\r\n color: theme.palette.dark.main,\r\n ml: 1,\r\n }}\r\n >\r\n {displayText}\r\n </Typography>\r\n </Box>\r\n {names.length > 5 && (\r\n <ExpandButton\r\n onClick={() => setIsExpanded(!isExpanded)}\r\n aria-label={isExpanded ? 'Collapse' : 'Expand'}\r\n size=\"small\"\r\n >\r\n {isExpanded ? (\r\n <ExpandLessRounded sx={{fontSize: 16}} />\r\n ) : (\r\n <ExpandMoreRounded sx={{fontSize: 16}} />\r\n )}\r\n </ExpandButton>\r\n )}\r\n </ReadByContainer>\r\n );\r\n};"],"names":["_jsxs","_jsx"],"mappings":"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"}

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

@@ -0,0 +1,16 @@
+import React from 'react';
+interface RichTextAreaProps {
+    error?: string;
+    value: string;
+    label?: string;
+    fullWidth?: boolean;
+    id?: string;
+    onChange: (question: any, value: string) => void;
+    question: any;
+    helperText?: string;
+    rows?: number;
+    disabled?: boolean;
+    placeholder?: string;
+}
+export declare const RichTextArea: React.FC<RichTextAreaProps>;
+export {};

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

@@ -0,0 +1,48 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { styled } from '@mui/material';
+import { StyledLabel } from './Input.js';
+const AreaWrapper = styled('div')(({ theme }) => ({
+    width: '100%',
+}));
+const StyledTextarea = styled('textarea', {
+    shouldForwardProp: (prop) => !['error'].includes(prop),
+})(({ theme, error }) => ({
+    width: '100%',
+    backgroundColor: theme.palette.light.main,
+    borderRadius: (typeof theme.shape.borderRadius === 'string'
+        ? parseInt(theme.shape.borderRadius, 10)
+        : theme.shape.borderRadius || 4) * 2,
+    color: theme.palette.dark.main,
+    fontSize: '1rem',
+    minWidth: 0,
+    border: `2px solid ${error ? theme.palette.error.main : `${theme.palette.dark.main}33`}`,
+    padding: theme.spacing(1, 3),
+    fontFamily: theme.typography.fontFamily,
+    outline: 'none',
+    transition: 'border-color 0.2s',
+    '&:focus': {
+        borderColor: error ? theme.palette.error.main : theme.palette.primary.main,
+    },
+    '&:hover': {
+        borderColor: error ? theme.palette.error.main : theme.palette.primary.main,
+    },
+    '&:disabled': {
+        backgroundColor: `${theme.palette.dark.main}0D`,
+        color: `${theme.palette.dark.main}80`,
+        cursor: 'not-allowed',
+    },
+    resize: 'vertical',
+}));
+const HelperText = styled('div')(({ theme, error }) => ({
+    marginTop: theme.spacing(0.75),
+    fontSize: '0.875rem',
+    color: error ? theme.palette.error.main : `${theme.palette.dark.main}99`,
+}));
+const RichTextArea = ({ error, value, label, fullWidth = false, id, onChange, question, helperText, rows = 4, disabled, placeholder, }) => {
+    const inputId = id || `richtextarea-${Math.random().toString(36).substr(2, 9)}`;
+    return (jsxs(AreaWrapper, { sx: { ...(!fullWidth && { width: 'auto' }) }, children: [label && (jsx(StyledLabel, { htmlFor: inputId, children: label })), jsx(StyledTextarea, { id: inputId, error: error, value: value || '', rows: rows, onChange: (e) => onChange(question, e.target.value), disabled: disabled, placeholder: placeholder }), (error || helperText) && (jsx(HelperText, { error: error, children: error || helperText }))] }));
+};
+export { RichTextArea };
+//# sourceMappingURL=RichTextArea.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"RichTextArea.js","sources":["../../../../src/components/RichTextArea.tsx"],"sourcesContent":["import React from 'react';\r\nimport { styled, InputLabel } from '@mui/material';\r\nimport { StyledLabel } from './Input';\r\n\r\ninterface RichTextAreaProps {\r\n error?: string;\r\n value: string;\r\n label?: string;\r\n fullWidth?: boolean;\r\n id?: string;\r\n onChange: (question: any, value: string) => void;\r\n question: any;\r\n helperText?: string;\r\n rows?: number;\r\n disabled?: boolean;\r\n placeholder?: string;\r\n}\r\n\r\nconst AreaWrapper = styled('div')(({ theme }) => ({\r\n width: '100%',\r\n}));\r\n\r\nconst StyledTextarea = styled('textarea', {\r\n shouldForwardProp: (prop) => !['error'].includes(prop as string),\r\n})<{ error?: string }>(({ theme, error }) => ({\r\n width: '100%',\r\n backgroundColor: theme.palette.light.main,\r\n borderRadius: (typeof theme.shape.borderRadius === 'string'\r\n ? parseInt(theme.shape.borderRadius, 10)\r\n : theme.shape.borderRadius || 4) * 2,\r\n color: theme.palette.dark.main,\r\n fontSize: '1rem',\r\n minWidth: 0,\r\n border: `2px solid ${error ? theme.palette.error.main : `${theme.palette.dark.main}33`}`,\r\n padding: theme.spacing(1, 3),\r\n fontFamily: theme.typography.fontFamily,\r\n outline: 'none',\r\n transition: 'border-color 0.2s',\r\n '&:focus': {\r\n borderColor: error ? theme.palette.error.main : theme.palette.primary.main,\r\n },\r\n '&:hover': {\r\n borderColor: error ? theme.palette.error.main : theme.palette.primary.main,\r\n },\r\n '&:disabled': {\r\n backgroundColor: `${theme.palette.dark.main}0D`,\r\n color: `${theme.palette.dark.main}80`,\r\n cursor: 'not-allowed',\r\n },\r\n resize: 'vertical',\r\n}));\r\n\r\nconst HelperText = styled('div')<{ error?: string }>(({ theme, error }) => ({\r\n marginTop: theme.spacing(0.75),\r\n fontSize: '0.875rem',\r\n color: error ? theme.palette.error.main : `${theme.palette.dark.main}99`,\r\n}));\r\n\r\nexport const RichTextArea: React.FC<RichTextAreaProps> = ({\r\n error,\r\n value,\r\n label,\r\n fullWidth = false,\r\n id,\r\n onChange,\r\n question,\r\n helperText,\r\n rows = 4,\r\n disabled,\r\n placeholder,\r\n}) => {\r\n const inputId = id || `richtextarea-${Math.random().toString(36).substr(2, 9)}`;\r\n\r\n return (\r\n <AreaWrapper sx={{ ...(!fullWidth && { width: 'auto' }) }}>\r\n {label && (\r\n <StyledLabel htmlFor={inputId}>\r\n {label}\r\n </StyledLabel>\r\n )}\r\n <StyledTextarea\r\n id={inputId}\r\n error={error}\r\n value={value || ''}\r\n rows={rows}\r\n onChange={(e) => onChange(question, e.target.value)}\r\n disabled={disabled}\r\n placeholder={placeholder}\r\n />\r\n {(error || helperText) && (\r\n <HelperText error={error}>\r\n {error || helperText}\r\n </HelperText>\r\n )}\r\n </AreaWrapper>\r\n );\r\n};\r\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

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

@@ -1,7 +1,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { styled, Select as Select$1, InputLabel, FormControl, MenuItem, FormHelperText } from '@mui/material';
+import { styled, Select as Select$1, FormControl, MenuItem, FormHelperText } from '@mui/material';
 import { useTheme } from '../ThemeProvider.js';
 import { ExpandMoreRounded } from '@mui/icons-material';
+import { StyledLabel } from './Input.js';
 const StyledSelect = styled(Select$1)(({ theme, error }) => ({
     backgroundColor: theme.palette.light.main,
@@ -31,17 +32,6 @@ const StyledSelect = styled(Select$1)(({ theme, error }) => ({
         color: `${theme.palette.dark.main}66`,
     },
 }));
-const StyledInputLabel = styled(InputLabel)(({ theme }) => ({
-    fontSize: '0.875rem',
-    fontWeight: 500,
-    color: theme.palette.dark.main,
-    position: 'relative',
-    transform: 'none',
-    marginBottom: theme.spacing(0.75),
-    '&.Mui-focused': {
-        color: theme.palette.dark.main,
-    },
-}));
 const Select = ({ label, error, helperText, fullWidth = false, options, className = '', id, value, onChange, disabled, name, }) => {
     const theme = useTheme();
     const selectId = id || `select-${Math.random().toString(36).substr(2, 9)}`;
@@ -58,7 +48,7 @@ const Select = ({ label, error, helperText, fullWidth = false, options, classNam
             onChange(syntheticEvent);
         }
     };
-    return (jsxs(FormControl, { fullWidth: fullWidth, error: !!error, className: className, children: [label && (jsx(StyledInputLabel, { htmlFor: selectId, shrink: false, children: label })), jsx(StyledSelect, { id: selectId, name: name, value: value || '', onChange: handleChange, disabled: disabled, error: !!error, IconComponent: ExpandMoreRounded, MenuProps: {
+    return (jsxs(FormControl, { fullWidth: fullWidth, error: !!error, className: className, children: [label && (jsx(StyledLabel, { htmlFor: selectId, shrink: false, children: label })), jsx(StyledSelect, { id: selectId, name: name, value: value || '', onChange: handleChange, disabled: disabled, error: !!error, IconComponent: ExpandMoreRounded, MenuProps: {
                     PaperProps: {
                         sx: {
                             mt: 1,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Select.js","sources":["../../../../src/components/Select.tsx"],"sourcesContent":["\n\nimport React from 'react';\nimport { FormControl, InputLabel, Select as MuiSelect, MenuItem, FormHelperText, styled } from '@mui/material';\nimport { useTheme } from '../ThemeProvider';\nimport { ExpandMoreRounded } from '@mui/icons-material';\n\ninterface SelectProps {\n label?: string;\n error?: string;\n helperText?: string;\n fullWidth?: boolean;\n options: { value: string; label: string }[];\n value?: string;\n onChange?: (event: React.ChangeEvent<HTMLSelectElement>) => void;\n disabled?: boolean;\n className?: string;\n id?: string;\n name?: string;\n}\n\nconst StyledSelect = styled(MuiSelect)(({ theme, error }) => ({\n backgroundColor: theme.palette.light.main,\n borderRadius: (typeof theme.shape.borderRadius === 'string'\n ? parseInt(theme.shape.borderRadius, 10)\n : theme.shape.borderRadius \|\| 4) * 2,\n fontSize: '1rem',\n color: theme.palette.dark.main,\n '& .MuiOutlinedInput-notchedOutline': {\n borderColor: error ? theme.palette.accent.main : `${theme.palette.dark.main}33`,\n },\n '&:hover .MuiOutlinedInput-notchedOutline': {\n borderColor: error ? theme.palette.accent.main : theme.palette.primary.main,\n },\n '&.Mui-focused .MuiOutlinedInput-notchedOutline': {\n borderWidth: 2,\n borderColor: error ? theme.palette.accent.main : theme.palette.primary.main,\n },\n '&.Mui-disabled': {\n backgroundColor: `${theme.palette.dark.main}0D`,\n '& .MuiSelect-select': {\n color: `${theme.palette.dark.main}80`,\n cursor: 'not-allowed',\n },\n },\n '& .MuiSelect-icon': {\n color: `${theme.palette.dark.main}66`,\n },\n}));\n\~~nconst StyledInputLabel = styled(InputLabel)(({ theme }) => ({\~~n ~~fontSize: '0.875rem',\n fontWeight: 500,\n color: theme.palette.dark.main,\n position: 'relative',\n transform: 'none',\n marginBottom: theme.spacing(0.75),\n '&.Mui-focused': {~~\~~n color: theme.palette.dark.main,\n },\n}));\n~~\nexport const Select: React.FC<SelectProps> = ({\n label,\n error,\n helperText,\n fullWidth = false,\n options,\n className = '',\n id,\n value,\n onChange,\n disabled,\n name,\n}) => {\n const theme = useTheme();\n const selectId = id \|\| `select-${Math.random().toString(36).substr(2, 9)}`;\n\n const handleChange = (event: any) => {\n if (onChange) {\n // Create a synthetic event that matches React.ChangeEvent<HTMLSelectElement>\n const syntheticEvent = {\n target: {\n value: event.target.value,\n name: name \|\| '',\n },\n currentTarget: event.currentTarget,\n } as React.ChangeEvent<HTMLSelectElement>;\n onChange(syntheticEvent);\n }\n };\n\n return (\n <FormControl \n fullWidth={fullWidth} \n error={!!error}\n className={className}\n >\n {label && (\n <~~StyledInputLabel~~ htmlFor={selectId} shrink={false}>\n {label}\n </~~StyledInputLabel~~>\n )}\n <StyledSelect\n id={selectId}\n name={name}\n value={value \|\| ''}\n onChange={handleChange}\n disabled={disabled}\n error={!!error}\n IconComponent={ExpandMoreRounded}\n MenuProps={{\n PaperProps: {\n sx: {\n mt: 1,\n borderRadius: 2,\n boxShadow: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',\n },\n },\n }}\n >\n {options.map((option) => (\n <MenuItem \n key={option.value} \n value={option.value}\n sx={{\n fontSize: '1rem',\n color: theme.palette.dark.main,\n '&:hover': {\n backgroundColor: `${theme.palette.primary.main}1A`,\n },\n '&.Mui-selected': {\n backgroundColor: `${theme.palette.primary.main}26`,\n '&:hover': {\n backgroundColor: `${theme.palette.primary.main}33`,\n },\n },\n }}\n >\n {option.label}\n </MenuItem>\n ))}\n </StyledSelect>\n {error && (\n <FormHelperText\n sx={{\n mt: 0.75,\n fontSize: '0.875rem',\n color: theme.palette.accent.main,\n }}\n >\n {error}\n </FormHelperText>\n )}\n {helperText && !error && (\n <FormHelperText\n sx={{\n mt: 0.75,\n fontSize: '0.875rem',\n color: `${theme.palette.dark.main}99`,\n }}\n >\n {helperText}\n </FormHelperText>\n )}\n </FormControl>\n );\n};"],"names":["MuiSelect","_jsxs","_jsx"],"mappings":"~~;;;;;AAqBA~~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~~gBAAgB~~,IAAC,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAA,QAAA,~~EAC/C~~,KAAK,~~GACW~~,~~CACpB~~,EACDA,GAAA,CAAC,YAAY,EAAA,EACX,EAAE,EAAE,QAAQ,EACZ,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,IAAI,EAAE,EAClB,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,aAAa,EAAE,iBAAiB,EAChC,SAAS,EAAE;AACT,oBAAA,UAAU,EAAE;AACV,wBAAA,EAAE,EAAE;AACF,4BAAA,EAAE,EAAE,CAAC;AACL,4BAAA,YAAY,EAAE,CAAC;AACf,4BAAA,SAAS,EAAE,uEAAuE;AACnF,yBAAA;AACF,qBAAA;iBACF,EAAA,QAAA,EAEA,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,MAClBA,IAAC,QAAQ,EAAA,EAEP,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,EAAE,EAAE;AACF,wBAAA,QAAQ,EAAE,MAAM;AAChB,wBAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI;AAC9B,wBAAA,SAAS,EAAE;4BACT,eAAe,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAA,EAAA,CAAI;AACnD,yBAAA;AACD,wBAAA,gBAAgB,EAAE;4BAChB,eAAe,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAA,EAAA,CAAI;AAClD,4BAAA,SAAS,EAAE;gCACT,eAAe,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAA,EAAA,CAAI;AACnD,6BAAA;AACF,yBAAA;AACF,qBAAA,EAAA,QAAA,EAEA,MAAM,CAAC,KAAK,IAhBR,MAAM,CAAC,KAAK,CAiBR,CACZ,CAAC,EAAA,CACW,EACd,KAAK,KACJA,IAAC,cAAc,EAAA,EACb,EAAE,EAAE;AACF,oBAAA,EAAE,EAAE,IAAI;AACR,oBAAA,QAAQ,EAAE,UAAU;AACpB,oBAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI;AACjC,iBAAA,EAAA,QAAA,EAEA,KAAK,EAAA,CACS,CAClB,EACA,UAAU,IAAI,CAAC,KAAK,KACnBA,GAAA,CAAC,cAAc,EAAA,EACb,EAAE,EAAE;AACF,oBAAA,EAAE,EAAE,IAAI;AACR,oBAAA,QAAQ,EAAE,UAAU;oBACpB,KAAK,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI;AACtC,iBAAA,EAAA,QAAA,EAEA,UAAU,EAAA,CACI,CAClB,CAAA,EAAA,CACW;AAElB;;;;"}
1	+ {"version":3,"file":"Select.js","sources":["../../../../src/components/Select.tsx"],"sourcesContent":["\r\n\r\nimport React from 'react';\r\nimport { FormControl, InputLabel, Select as MuiSelect, MenuItem, FormHelperText, styled } from '@mui/material';\r\nimport { useTheme } from '../ThemeProvider';\r\nimport { ExpandMoreRounded } from '@mui/icons-material';\r\nimport { StyledLabel } from './Input';\r\n\r\ninterface SelectProps {\r\n label?: string;\r\n error?: string;\r\n helperText?: string;\r\n fullWidth?: boolean;\r\n options: { value: string; label: string }[];\r\n value?: string;\r\n onChange?: (event: React.ChangeEvent<HTMLSelectElement>) => void;\r\n disabled?: boolean;\r\n className?: string;\r\n id?: string;\r\n name?: string;\r\n}\r\n\r\nconst StyledSelect = styled(MuiSelect)(({ theme, error }) => ({\r\n backgroundColor: theme.palette.light.main,\r\n borderRadius: (typeof theme.shape.borderRadius === 'string'\r\n ? parseInt(theme.shape.borderRadius, 10)\r\n : theme.shape.borderRadius \|\| 4) * 2,\r\n fontSize: '1rem',\r\n color: theme.palette.dark.main,\r\n '& .MuiOutlinedInput-notchedOutline': {\r\n borderColor: error ? theme.palette.accent.main : `${theme.palette.dark.main}33`,\r\n },\r\n '&:hover .MuiOutlinedInput-notchedOutline': {\r\n borderColor: error ? theme.palette.accent.main : theme.palette.primary.main,\r\n },\r\n '&.Mui-focused .MuiOutlinedInput-notchedOutline': {\r\n borderWidth: 2,\r\n borderColor: error ? theme.palette.accent.main : theme.palette.primary.main,\r\n },\r\n '&.Mui-disabled': {\r\n backgroundColor: `${theme.palette.dark.main}0D`,\r\n '& .MuiSelect-select': {\r\n color: `${theme.palette.dark.main}80`,\r\n cursor: 'not-allowed',\r\n },\r\n },\r\n '& .MuiSelect-icon': {\r\n color: `${theme.palette.dark.main}66`,\r\n },\r\n}));\r\n\r\nexport const Select: React.FC<SelectProps> = ({\r\n label,\r\n error,\r\n helperText,\r\n fullWidth = false,\r\n options,\r\n className = '',\r\n id,\r\n value,\r\n onChange,\r\n disabled,\r\n name,\r\n}) => {\r\n const theme = useTheme();\r\n const selectId = id \|\| `select-${Math.random().toString(36).substr(2, 9)}`;\r\n\r\n const handleChange = (event: any) => {\r\n if (onChange) {\r\n // Create a synthetic event that matches React.ChangeEvent<HTMLSelectElement>\r\n const syntheticEvent = {\r\n target: {\r\n value: event.target.value,\r\n name: name \|\| '',\r\n },\r\n currentTarget: event.currentTarget,\r\n } as React.ChangeEvent<HTMLSelectElement>;\r\n onChange(syntheticEvent);\r\n }\r\n };\r\n\r\n return (\r\n <FormControl \r\n fullWidth={fullWidth} \r\n error={!!error}\r\n className={className}\r\n >\r\n {label && (\r\n <StyledLabel htmlFor={selectId} shrink={false}>\r\n {label}\r\n </StyledLabel>\r\n )}\r\n <StyledSelect\r\n id={selectId}\r\n name={name}\r\n value={value \|\| ''}\r\n onChange={handleChange}\r\n disabled={disabled}\r\n error={!!error}\r\n IconComponent={ExpandMoreRounded}\r\n MenuProps={{\r\n PaperProps: {\r\n sx: {\r\n mt: 1,\r\n borderRadius: 2,\r\n boxShadow: '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',\r\n },\r\n },\r\n }}\r\n >\r\n {options.map((option) => (\r\n <MenuItem \r\n key={option.value} \r\n value={option.value}\r\n sx={{\r\n fontSize: '1rem',\r\n color: theme.palette.dark.main,\r\n '&:hover': {\r\n backgroundColor: `${theme.palette.primary.main}1A`,\r\n },\r\n '&.Mui-selected': {\r\n backgroundColor: `${theme.palette.primary.main}26`,\r\n '&:hover': {\r\n backgroundColor: `${theme.palette.primary.main}33`,\r\n },\r\n },\r\n }}\r\n >\r\n {option.label}\r\n </MenuItem>\r\n ))}\r\n </StyledSelect>\r\n {error && (\r\n <FormHelperText\r\n sx={{\r\n mt: 0.75,\r\n fontSize: '0.875rem',\r\n color: theme.palette.accent.main,\r\n }}\r\n >\r\n {error}\r\n </FormHelperText>\r\n )}\r\n {helperText && !error && (\r\n <FormHelperText\r\n sx={{\r\n mt: 0.75,\r\n fontSize: '0.875rem',\r\n color: `${theme.palette.dark.main}99`,\r\n }}\r\n >\r\n {helperText}\r\n </FormHelperText>\r\n )}\r\n </FormControl>\r\n );\r\n};"],"names":["MuiSelect","_jsxs","_jsx"],"mappings":"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"}