@flipdish/portal-library 6.0.0 → 6.0.2

package/dist/components/atoms/Slider/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/Slider/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport MuiSlider, { type SliderProps as MuiSliderProps } from '@mui/material/Slider';\n\nimport Box from \"@fd/components/atoms/Box\"\nimport Typography from '@fd/components/atoms/Typography';\nimport styled from '@fd/utilities/styledUtilities';\n\nexport interface SliderProps extends Omit<MuiSliderProps, 'color'> {\n  className?: string;\n  fdKey: string;\n  label?: string;\n  showLabel?: boolean;\n  showValue?: boolean;\n  valueFormat?: 'number' | 'percentage';\n  valueSuffix?: string;\n}\n\nconst StyledSlider = styled(MuiSlider)(({ theme }) => ({\n  color: theme.palette.semantic.fill['fill-primary-strong'],\n  height: theme.spacing(1),\n  display: 'flex',\n  alignItems: 'center',\n  margin: theme.spacing(0),\n  padding: theme.spacing(0),\n\n  // Rail (background track)\n  '& .MuiSlider-rail': {\n    height: theme.spacing(1),\n    backgroundColor: theme.palette.semantic.fill['fill-weak'],\n    border: `1px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n    borderRadius: theme.radius['radius-8'],\n    boxShadow: theme.customShadows?.sunken,\n    opacity: 1,\n    boxSizing: 'border-box'\n  },\n\n  // Track (active portion)\n  '& .MuiSlider-track': {\n    height: theme.spacing(1),\n    backgroundColor: theme.palette.semantic.fill['fill-primary-strong'],\n    border: 'none',\n    borderRadius: theme.radius['radius-8'],\n    boxShadow: theme.customShadows?.sunken,\n    paddingLeft: theme.spacing(0.5),\n  },\n\n  // Thumb (draggable handle)\n  '& .MuiSlider-thumb': {\n    width: theme.spacing(3),\n    height: theme.spacing(3),\n    flexShrink: 0,\n    aspectRatio: '1/1',\n    backgroundColor: theme.palette.semantic.background['background-overlay'],\n    border: `1px solid ${theme.palette.semantic.stroke['stroke-strong']}`,\n    borderRadius: theme.radius['radius-24'],\n    boxShadow: theme.customShadows?.overlay,\n    transition: 'all 0.2s ease-in-out',\n\n    '&:hover': {\n      backgroundColor: theme.palette.semantic.background['background-overlay'],\n      boxShadow: theme.customShadows?.overlay,\n    },\n\n    '&:active': {\n      backgroundColor: theme.palette.semantic.background['background-overlay'],\n      boxShadow: theme.customShadows?.overlay,\n    },\n\n    '&.Mui-disabled': {\n      width: theme.spacing(3),\n      height: theme.spacing(3),\n      backgroundColor: theme.palette.semantic.fill['fill-disabled'],\n      border: `1px solid ${theme.palette.semantic.stroke['stroke-disabled']}`,\n      boxShadow: 'none',\n    },\n  },\n\n  // Mark labels\n  '& .MuiSlider-markLabel': {\n    color: theme.palette.semantic.text['text-weak'],\n    fontSize: theme.typography.captionWeak.fontSize,\n    fontWeight: theme.typography.captionWeak.fontWeight,\n    lineHeight: theme.typography.captionWeak.lineHeight,\n  },\n\n  // Value label (tooltip)\n  '& .MuiSlider-valueLabel': {\n    backgroundColor: theme.palette.semantic.background['background-inverse'],\n    color: theme.palette.semantic.text['text-inverse-strong'],\n    borderRadius: theme.radius['radius-8'],\n    padding: theme.spacing(0.5, 1),\n    fontSize: theme.typography.captionStrong.fontSize,\n    fontWeight: theme.typography.captionStrong.fontWeight,\n    lineHeight: theme.typography.captionStrong.lineHeight,\n  },\n\n  // Disabled state\n  '&.Mui-disabled': {\n    color: theme.palette.semantic.fill['fill-disabled'],\n\n    '& .MuiSlider-rail': {\n      backgroundColor: theme.palette.semantic.fill['fill-disabled'],\n    },\n\n    '& .MuiSlider-track': {\n      backgroundColor: theme.palette.semantic.fill['fill-disabled'],\n    },\n\n    '& .MuiSlider-markLabel': {\n      color: theme.palette.semantic.text['text-disabled'],\n    },\n  },\n}));\n\nconst SliderContainer = styled(Box)(({ theme }) => ({\n  width: '100%',\n  display: 'flex',\n  padding: theme.spacing(0),\n  flexDirection: 'column',\n  alignItems: 'flex-start',\n  gap: theme.spacing(1),\n  backgroundColor: 'transparent',\n}));\n\nconst SliderLabel = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-strong'],\n  fontSize: theme.typography.b1Weak.fontSize,\n  fontWeight: theme.typography.b1Weak.fontWeight,\n  lineHeight: theme.typography.b1Weak.lineHeight,\n  fontStyle: theme.typography.b1Weak.fontStyle,\n  margin: theme.spacing(0),\n  padding: theme.spacing(0),\n}));\n\nconst SliderValue = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-weak'],\n  fontSize: theme.typography.b1Weak.fontSize,\n  fontWeight: theme.typography.b1Weak.fontWeight,\n  lineHeight: theme.typography.b1Weak.lineHeight,\n  fontStyle: theme.typography.b1Weak.fontStyle,\n  textAlign: 'right',\n  margin: theme.spacing(0),\n  padding: theme.spacing(0),\n}));\n\nconst Slider = React.memo(\n  ({\n    className,\n    fdKey,\n    label,\n    showLabel = true,\n    showValue = false,\n    valueFormat = 'number',\n    valueSuffix = '',\n    value,\n    defaultValue,\n    min = 0,\n    max = 100,\n    onChange,\n    ...rest\n  }: SliderProps) => {\n    const [internalValue, setInternalValue] = React.useState<number[] | number>(\n      value ?? defaultValue ?? 0\n    );\n\n    // Update internal value when controlled value changes\n    React.useEffect(() => {\n      if (value !== undefined) {\n        setInternalValue(value);\n      }\n    }, [value]);\n\n    const handleChange = (event: Event, newValue: number[] | number, activeThumb: number): void => {\n      if (value === undefined) {\n        setInternalValue(newValue);\n      }\n      onChange?.(event, newValue, activeThumb);\n    };\n\n    const formatValue = (val: number[] | number): string => {\n      if (Array.isArray(val)) {\n        // For range sliders, show both values\n        if (valueFormat === 'percentage') {\n          return `${val[0]}% - ${val[1]}%`;\n        }\n        return `${val[0]}${valueSuffix} - ${val[1]}${valueSuffix}`;\n      }\n\n      if (valueFormat === 'percentage') {\n        return `${val}%`;\n      }\n      return `${val}${valueSuffix}`;\n    };\n\n    const displayValue = value !== undefined ? value : internalValue;\n\n    const shouldShowHeader = showLabel && (label || showValue);\n\n    return (\n      <SliderContainer className={className}>\n        {shouldShowHeader && (\n          <Box alignItems='center' display='flex' justifyContent='space-between' width='100%'>\n            {label && <SliderLabel>{label}</SliderLabel>}\n            {showValue && <SliderValue>{formatValue(displayValue)}</SliderValue>}\n          </Box>\n        )}\n        <StyledSlider\n          data-fd={fdKey}\n          id={fdKey}\n          max={max}\n          min={min}\n          onChange={handleChange}\n          value={displayValue}\n          {...rest}\n        />\n      </SliderContainer>\n    );\n  }\n);\n\nSlider.displayName = 'Slider';\n\nexport default Slider;\n"],"names":["StyledSlider","styled","MuiSlider","theme","color","palette","semantic","fill","height","spacing","display","alignItems","margin","padding","backgroundColor","border","stroke","borderRadius","radius","boxShadow","customShadows","sunken","opacity","boxSizing","paddingLeft","width","flexShrink","aspectRatio","background","overlay","transition","text","fontSize","typography","captionWeak","fontWeight","lineHeight","captionStrong","SliderContainer","Box","flexDirection","gap","SliderLabel","Typography","b1Weak","fontStyle","SliderValue","textAlign","Slider","React","memo","className","fdKey","label","showLabel","showValue","valueFormat","valueSuffix","value","defaultValue","min","max","onChange","rest","internalValue","setInternalValue","useState","useEffect","undefined","displayValue","shouldShowHeader","_jsxs","children","justifyContent","_jsx","val","Array","isArray","id","event","newValue","activeThumb","displayName"],"mappings":"4MAkBA,MAAMA,EAAeC,EAAAA,OAAOC,EAAPD,EAAkB,EAAGE,YAAO,CAC/CC,MAAOD,EAAME,QAAQC,SAASC,KAAK,uBACnCC,OAAQL,EAAMM,QAAQ,GACtBC,QAAS,OACTC,WAAY,SACZC,OAAQT,EAAMM,QAAQ,GACtBI,QAASV,EAAMM,QAAQ,GAGvB,oBAAqB,CACnBD,OAAQL,EAAMM,QAAQ,GACtBK,gBAAiBX,EAAME,QAAQC,SAASC,KAAK,aAC7CQ,OAAQ,aAAaZ,EAAME,QAAQC,SAASU,OAAO,iBACnDC,aAAcd,EAAMe,OAAO,YAC3BC,UAAWhB,EAAMiB,eAAeC,OAChCC,QAAS,EACTC,UAAW,cAIb,qBAAsB,CACpBf,OAAQL,EAAMM,QAAQ,GACtBK,gBAAiBX,EAAME,QAAQC,SAASC,KAAK,uBAC7CQ,OAAQ,OACRE,aAAcd,EAAMe,OAAO,YAC3BC,UAAWhB,EAAMiB,eAAeC,OAChCG,YAAarB,EAAMM,QAAQ,KAI7B,qBAAsB,CACpBgB,MAAOtB,EAAMM,QAAQ,GACrBD,OAAQL,EAAMM,QAAQ,GACtBiB,WAAY,EACZC,YAAa,MACbb,gBAAiBX,EAAME,QAAQC,SAASsB,WAAW,sBACnDb,OAAQ,aAAaZ,EAAME,QAAQC,SAASU,OAAO,mBACnDC,aAAcd,EAAMe,OAAO,aAC3BC,UAAWhB,EAAMiB,eAAeS,QAChCC,WAAY,uBAEZ,UAAW,CACThB,gBAAiBX,EAAME,QAAQC,SAASsB,WAAW,sBACnDT,UAAWhB,EAAMiB,eAAeS,SAGlC,WAAY,CACVf,gBAAiBX,EAAME,QAAQC,SAASsB,WAAW,sBACnDT,UAAWhB,EAAMiB,eAAeS,SAGlC,iBAAkB,CAChBJ,MAAOtB,EAAMM,QAAQ,GACrBD,OAAQL,EAAMM,QAAQ,GACtBK,gBAAiBX,EAAME,QAAQC,SAASC,KAAK,iBAC7CQ,OAAQ,aAAaZ,EAAME,QAAQC,SAASU,OAAO,qBACnDG,UAAW,SAKf,yBAA0B,CACxBf,MAAOD,EAAME,QAAQC,SAASyB,KAAK,aACnCC,SAAU7B,EAAM8B,WAAWC,YAAYF,SACvCG,WAAYhC,EAAM8B,WAAWC,YAAYC,WACzCC,WAAYjC,EAAM8B,WAAWC,YAAYE,YAI3C,0BAA2B,CACzBtB,gBAAiBX,EAAME,QAAQC,SAASsB,WAAW,sBACnDxB,MAAOD,EAAME,QAAQC,SAASyB,KAAK,uBACnCd,aAAcd,EAAMe,OAAO,YAC3BL,QAASV,EAAMM,QAAQ,GAAK,GAC5BuB,SAAU7B,EAAM8B,WAAWI,cAAcL,SACzCG,WAAYhC,EAAM8B,WAAWI,cAAcF,WAC3CC,WAAYjC,EAAM8B,WAAWI,cAAcD,YAI7C,iBAAkB,CAChBhC,MAAOD,EAAME,QAAQC,SAASC,KAAK,iBAEnC,oBAAqB,CACnBO,gBAAiBX,EAAME,QAAQC,SAASC,KAAK,kBAG/C,qBAAsB,CACpBO,gBAAiBX,EAAME,QAAQC,SAASC,KAAK,kBAG/C,yBAA0B,CACxBH,MAAOD,EAAME,QAAQC,SAASyB,KAAK,uBAKnCO,EAAkBrC,EAAAA,OAAOsC,EAAPtC,EAAY,EAAGE,YAAO,CAC5CsB,MAAO,OACPf,QAAS,OACTG,QAASV,EAAMM,QAAQ,GACvB+B,cAAe,SACf7B,WAAY,aACZ8B,IAAKtC,EAAMM,QAAQ,GACnBK,gBAAiB,kBAGb4B,EAAczC,EAAAA,OAAO0C,EAAP1C,EAAmB,EAAGE,YAAO,CAC/CC,MAAOD,EAAME,QAAQC,SAASyB,KAAK,eACnCC,SAAU7B,EAAM8B,WAAWW,OAAOZ,SAClCG,WAAYhC,EAAM8B,WAAWW,OAAOT,WACpCC,WAAYjC,EAAM8B,WAAWW,OAAOR,WACpCS,UAAW1C,EAAM8B,WAAWW,OAAOC,UACnCjC,OAAQT,EAAMM,QAAQ,GACtBI,QAASV,EAAMM,QAAQ,OAGnBqC,EAAc7C,EAAAA,OAAO0C,EAAP1C,EAAmB,EAAGE,YAAO,CAC/CC,MAAOD,EAAME,QAAQC,SAASyB,KAAK,aACnCC,SAAU7B,EAAM8B,WAAWW,OAAOZ,SAClCG,WAAYhC,EAAM8B,WAAWW,OAAOT,WACpCC,WAAYjC,EAAM8B,WAAWW,OAAOR,WACpCS,UAAW1C,EAAM8B,WAAWW,OAAOC,UACnCE,UAAW,QACXnC,OAAQT,EAAMM,QAAQ,GACtBI,QAASV,EAAMM,QAAQ,OAGnBuC,EAASC,EAAMC,MACnB,EACEC,YACAC,QACAC,QACAC,aAAY,EACZC,aAAY,EACZC,cAAc,SACdC,cAAc,GACdC,QACAC,eACAC,MAAM,EACNC,MAAM,IACNC,cACGC,MAEH,MAAOC,EAAeC,GAAoBhB,EAAMiB,SAC9CR,GAASC,GAAgB,GAI3BV,EAAMkB,WAAU,UACAC,IAAVV,GACFO,EAAiBP,KAElB,CAACA,IAEJ,MAsBMW,OAAyBD,IAAVV,EAAsBA,EAAQM,EAE7CM,EAAmBhB,IAAcD,GAASE,GAEhD,OACEgB,OAACjC,EAAe,CAACa,UAAWA,EAASqB,SAAA,CAClCF,GACCC,EAAAA,KAAChC,GAAI5B,WAAW,SAASD,QAAQ,OAAO+D,eAAe,gBAAgBhD,MAAM,OAAM+C,SAAA,CAChFnB,GAASqB,EAAAA,IAAChC,YAAaW,IACvBE,GAAamB,EAAAA,IAAC5B,aAxBF6B,EAwB2BN,EAvB1CO,MAAMC,QAAQF,GAEI,eAAhBnB,EACK,GAAGmB,EAAI,SAASA,EAAI,MAEtB,GAAGA,EAAI,KAAKlB,OAAiBkB,EAAI,KAAKlB,IAG3B,eAAhBD,EACK,GAAGmB,KAEL,GAAGA,IAAMlB,UAediB,EAAAA,IAAC1E,EAAY,CAAA,UACFoD,EACT0B,GAAI1B,EACJS,IAAKA,EACLD,IAAKA,EACLE,SAvCe,CAACiB,EAAcC,EAA6BC,UACjDb,IAAVV,GACFO,EAAiBe,GAEnBlB,IAAWiB,EAAOC,EAAUC,IAoCxBvB,MAAOW,KACHN,OAlCU,IAACY,KAyCzB3B,EAAOkC,YAAc"}

package/dist/components/atoms/Slider/index.d.ts

@@ -0,0 +1,17 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import react__default from 'react';
+import { SliderProps as SliderProps$1 } from '@mui/material/Slider';
+
+interface SliderProps extends Omit<SliderProps$1, 'color'> {
+    className?: string;
+    fdKey: string;
+    label?: string;
+    showLabel?: boolean;
+    showValue?: boolean;
+    valueFormat?: 'number' | 'percentage';
+    valueSuffix?: string;
+}
+declare const Slider: react__default.MemoExoticComponent<({ className, fdKey, label, showLabel, showValue, valueFormat, valueSuffix, value, defaultValue, min, max, onChange, ...rest }: SliderProps) => react_jsx_runtime.JSX.Element>;
+
+export { Slider as default };
+export type { SliderProps };

package/dist/components/atoms/Slider/index.js

@@ -0,0 +1,2 @@
+import{jsxs as e,jsx as a}from"react/jsx-runtime";import t from"react";import i from"@mui/material/Slider";import o from"@mui/material/Box";import r from"@mui/material/Typography";import{styled as n}from"@mui/material/styles";const l=n(i)((({theme:e})=>({color:e.palette.semantic.fill["fill-primary-strong"],height:e.spacing(1),display:"flex",alignItems:"center",margin:e.spacing(0),padding:e.spacing(0),"& .MuiSlider-rail":{height:e.spacing(1),backgroundColor:e.palette.semantic.fill["fill-weak"],border:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`,borderRadius:e.radius["radius-8"],boxShadow:e.customShadows?.sunken,opacity:1,boxSizing:"border-box"},"& .MuiSlider-track":{height:e.spacing(1),backgroundColor:e.palette.semantic.fill["fill-primary-strong"],border:"none",borderRadius:e.radius["radius-8"],boxShadow:e.customShadows?.sunken,paddingLeft:e.spacing(.5)},"& .MuiSlider-thumb":{width:e.spacing(3),height:e.spacing(3),flexShrink:0,aspectRatio:"1/1",backgroundColor:e.palette.semantic.background["background-overlay"],border:`1px solid ${e.palette.semantic.stroke["stroke-strong"]}`,borderRadius:e.radius["radius-24"],boxShadow:e.customShadows?.overlay,transition:"all 0.2s ease-in-out","&:hover":{backgroundColor:e.palette.semantic.background["background-overlay"],boxShadow:e.customShadows?.overlay},"&:active":{backgroundColor:e.palette.semantic.background["background-overlay"],boxShadow:e.customShadows?.overlay},"&.Mui-disabled":{width:e.spacing(3),height:e.spacing(3),backgroundColor:e.palette.semantic.fill["fill-disabled"],border:`1px solid ${e.palette.semantic.stroke["stroke-disabled"]}`,boxShadow:"none"}},"& .MuiSlider-markLabel":{color:e.palette.semantic.text["text-weak"],fontSize:e.typography.captionWeak.fontSize,fontWeight:e.typography.captionWeak.fontWeight,lineHeight:e.typography.captionWeak.lineHeight},"& .MuiSlider-valueLabel":{backgroundColor:e.palette.semantic.background["background-inverse"],color:e.palette.semantic.text["text-inverse-strong"],borderRadius:e.radius["radius-8"],padding:e.spacing(.5,1),fontSize:e.typography.captionStrong.fontSize,fontWeight:e.typography.captionStrong.fontWeight,lineHeight:e.typography.captionStrong.lineHeight},"&.Mui-disabled":{color:e.palette.semantic.fill["fill-disabled"],"& .MuiSlider-rail":{backgroundColor:e.palette.semantic.fill["fill-disabled"]},"& .MuiSlider-track":{backgroundColor:e.palette.semantic.fill["fill-disabled"]},"& .MuiSlider-markLabel":{color:e.palette.semantic.text["text-disabled"]}}}))),s=n(o)((({theme:e})=>({width:"100%",display:"flex",padding:e.spacing(0),flexDirection:"column",alignItems:"flex-start",gap:e.spacing(1),backgroundColor:"transparent"}))),d=n(r)((({theme:e})=>({color:e.palette.semantic.text["text-strong"],fontSize:e.typography.b1Weak.fontSize,fontWeight:e.typography.b1Weak.fontWeight,lineHeight:e.typography.b1Weak.lineHeight,fontStyle:e.typography.b1Weak.fontStyle,margin:e.spacing(0),padding:e.spacing(0)}))),p=n(r)((({theme:e})=>({color:e.palette.semantic.text["text-weak"],fontSize:e.typography.b1Weak.fontSize,fontWeight:e.typography.b1Weak.fontWeight,lineHeight:e.typography.b1Weak.lineHeight,fontStyle:e.typography.b1Weak.fontStyle,textAlign:"right",margin:e.spacing(0),padding:e.spacing(0)}))),g=t.memo((({className:i,fdKey:r,label:n,showLabel:g=!0,showValue:c=!1,valueFormat:h="number",valueSuffix:m="",value:u,defaultValue:b,min:f=0,max:y=100,onChange:k,...S})=>{const[x,w]=t.useState(u??b??0);t.useEffect((()=>{void 0!==u&&w(u)}),[u]);const v=void 0!==u?u:x;return e(s,{className:i,children:[g&&(n||c)&&e(o,{alignItems:"center",display:"flex",justifyContent:"space-between",width:"100%",children:[n&&a(d,{children:n}),c&&a(p,{children:(W=v,Array.isArray(W)?"percentage"===h?`${W[0]}% - ${W[1]}%`:`${W[0]}${m} - ${W[1]}${m}`:"percentage"===h?`${W}%`:`${W}${m}`)})]}),a(l,{"data-fd":r,id:r,max:y,min:f,onChange:(e,a,t)=>{void 0===u&&w(a),k?.(e,a,t)},value:v,...S})]});var W}));g.displayName="Slider";export{g as default};
+//# sourceMappingURL=index.js.map

package/dist/components/atoms/Slider/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/Slider/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport MuiSlider, { type SliderProps as MuiSliderProps } from '@mui/material/Slider';\n\nimport Box from \"@fd/components/atoms/Box\"\nimport Typography from '@fd/components/atoms/Typography';\nimport styled from '@fd/utilities/styledUtilities';\n\nexport interface SliderProps extends Omit<MuiSliderProps, 'color'> {\n  className?: string;\n  fdKey: string;\n  label?: string;\n  showLabel?: boolean;\n  showValue?: boolean;\n  valueFormat?: 'number' | 'percentage';\n  valueSuffix?: string;\n}\n\nconst StyledSlider = styled(MuiSlider)(({ theme }) => ({\n  color: theme.palette.semantic.fill['fill-primary-strong'],\n  height: theme.spacing(1),\n  display: 'flex',\n  alignItems: 'center',\n  margin: theme.spacing(0),\n  padding: theme.spacing(0),\n\n  // Rail (background track)\n  '& .MuiSlider-rail': {\n    height: theme.spacing(1),\n    backgroundColor: theme.palette.semantic.fill['fill-weak'],\n    border: `1px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n    borderRadius: theme.radius['radius-8'],\n    boxShadow: theme.customShadows?.sunken,\n    opacity: 1,\n    boxSizing: 'border-box'\n  },\n\n  // Track (active portion)\n  '& .MuiSlider-track': {\n    height: theme.spacing(1),\n    backgroundColor: theme.palette.semantic.fill['fill-primary-strong'],\n    border: 'none',\n    borderRadius: theme.radius['radius-8'],\n    boxShadow: theme.customShadows?.sunken,\n    paddingLeft: theme.spacing(0.5),\n  },\n\n  // Thumb (draggable handle)\n  '& .MuiSlider-thumb': {\n    width: theme.spacing(3),\n    height: theme.spacing(3),\n    flexShrink: 0,\n    aspectRatio: '1/1',\n    backgroundColor: theme.palette.semantic.background['background-overlay'],\n    border: `1px solid ${theme.palette.semantic.stroke['stroke-strong']}`,\n    borderRadius: theme.radius['radius-24'],\n    boxShadow: theme.customShadows?.overlay,\n    transition: 'all 0.2s ease-in-out',\n\n    '&:hover': {\n      backgroundColor: theme.palette.semantic.background['background-overlay'],\n      boxShadow: theme.customShadows?.overlay,\n    },\n\n    '&:active': {\n      backgroundColor: theme.palette.semantic.background['background-overlay'],\n      boxShadow: theme.customShadows?.overlay,\n    },\n\n    '&.Mui-disabled': {\n      width: theme.spacing(3),\n      height: theme.spacing(3),\n      backgroundColor: theme.palette.semantic.fill['fill-disabled'],\n      border: `1px solid ${theme.palette.semantic.stroke['stroke-disabled']}`,\n      boxShadow: 'none',\n    },\n  },\n\n  // Mark labels\n  '& .MuiSlider-markLabel': {\n    color: theme.palette.semantic.text['text-weak'],\n    fontSize: theme.typography.captionWeak.fontSize,\n    fontWeight: theme.typography.captionWeak.fontWeight,\n    lineHeight: theme.typography.captionWeak.lineHeight,\n  },\n\n  // Value label (tooltip)\n  '& .MuiSlider-valueLabel': {\n    backgroundColor: theme.palette.semantic.background['background-inverse'],\n    color: theme.palette.semantic.text['text-inverse-strong'],\n    borderRadius: theme.radius['radius-8'],\n    padding: theme.spacing(0.5, 1),\n    fontSize: theme.typography.captionStrong.fontSize,\n    fontWeight: theme.typography.captionStrong.fontWeight,\n    lineHeight: theme.typography.captionStrong.lineHeight,\n  },\n\n  // Disabled state\n  '&.Mui-disabled': {\n    color: theme.palette.semantic.fill['fill-disabled'],\n\n    '& .MuiSlider-rail': {\n      backgroundColor: theme.palette.semantic.fill['fill-disabled'],\n    },\n\n    '& .MuiSlider-track': {\n      backgroundColor: theme.palette.semantic.fill['fill-disabled'],\n    },\n\n    '& .MuiSlider-markLabel': {\n      color: theme.palette.semantic.text['text-disabled'],\n    },\n  },\n}));\n\nconst SliderContainer = styled(Box)(({ theme }) => ({\n  width: '100%',\n  display: 'flex',\n  padding: theme.spacing(0),\n  flexDirection: 'column',\n  alignItems: 'flex-start',\n  gap: theme.spacing(1),\n  backgroundColor: 'transparent',\n}));\n\nconst SliderLabel = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-strong'],\n  fontSize: theme.typography.b1Weak.fontSize,\n  fontWeight: theme.typography.b1Weak.fontWeight,\n  lineHeight: theme.typography.b1Weak.lineHeight,\n  fontStyle: theme.typography.b1Weak.fontStyle,\n  margin: theme.spacing(0),\n  padding: theme.spacing(0),\n}));\n\nconst SliderValue = styled(Typography)(({ theme }) => ({\n  color: theme.palette.semantic.text['text-weak'],\n  fontSize: theme.typography.b1Weak.fontSize,\n  fontWeight: theme.typography.b1Weak.fontWeight,\n  lineHeight: theme.typography.b1Weak.lineHeight,\n  fontStyle: theme.typography.b1Weak.fontStyle,\n  textAlign: 'right',\n  margin: theme.spacing(0),\n  padding: theme.spacing(0),\n}));\n\nconst Slider = React.memo(\n  ({\n    className,\n    fdKey,\n    label,\n    showLabel = true,\n    showValue = false,\n    valueFormat = 'number',\n    valueSuffix = '',\n    value,\n    defaultValue,\n    min = 0,\n    max = 100,\n    onChange,\n    ...rest\n  }: SliderProps) => {\n    const [internalValue, setInternalValue] = React.useState<number[] | number>(\n      value ?? defaultValue ?? 0\n    );\n\n    // Update internal value when controlled value changes\n    React.useEffect(() => {\n      if (value !== undefined) {\n        setInternalValue(value);\n      }\n    }, [value]);\n\n    const handleChange = (event: Event, newValue: number[] | number, activeThumb: number): void => {\n      if (value === undefined) {\n        setInternalValue(newValue);\n      }\n      onChange?.(event, newValue, activeThumb);\n    };\n\n    const formatValue = (val: number[] | number): string => {\n      if (Array.isArray(val)) {\n        // For range sliders, show both values\n        if (valueFormat === 'percentage') {\n          return `${val[0]}% - ${val[1]}%`;\n        }\n        return `${val[0]}${valueSuffix} - ${val[1]}${valueSuffix}`;\n      }\n\n      if (valueFormat === 'percentage') {\n        return `${val}%`;\n      }\n      return `${val}${valueSuffix}`;\n    };\n\n    const displayValue = value !== undefined ? value : internalValue;\n\n    const shouldShowHeader = showLabel && (label || showValue);\n\n    return (\n      <SliderContainer className={className}>\n        {shouldShowHeader && (\n          <Box alignItems='center' display='flex' justifyContent='space-between' width='100%'>\n            {label && <SliderLabel>{label}</SliderLabel>}\n            {showValue && <SliderValue>{formatValue(displayValue)}</SliderValue>}\n          </Box>\n        )}\n        <StyledSlider\n          data-fd={fdKey}\n          id={fdKey}\n          max={max}\n          min={min}\n          onChange={handleChange}\n          value={displayValue}\n          {...rest}\n        />\n      </SliderContainer>\n    );\n  }\n);\n\nSlider.displayName = 'Slider';\n\nexport default Slider;\n"],"names":["StyledSlider","styled","MuiSlider","theme","color","palette","semantic","fill","height","spacing","display","alignItems","margin","padding","backgroundColor","border","stroke","borderRadius","radius","boxShadow","customShadows","sunken","opacity","boxSizing","paddingLeft","width","flexShrink","aspectRatio","background","overlay","transition","text","fontSize","typography","captionWeak","fontWeight","lineHeight","captionStrong","SliderContainer","Box","flexDirection","gap","SliderLabel","Typography","b1Weak","fontStyle","SliderValue","textAlign","Slider","React","memo","className","fdKey","label","showLabel","showValue","valueFormat","valueSuffix","value","defaultValue","min","max","onChange","rest","internalValue","setInternalValue","useState","useEffect","undefined","displayValue","_jsxs","children","justifyContent","_jsx","val","Array","isArray","id","event","newValue","activeThumb","displayName"],"mappings":"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"}

package/dist/components/atoms/Slot/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react/jsx-runtime"),t=require("@mui/material/Box"),i=require("@mui/material/Typography"),r=require("@mui/material/styles");const a=r.styled(t)((({theme:e})=>({border:`1px dashed ${e.palette.semantic.stroke["stroke-strong"]}`,padding:`${e.spacing(3)} ${e.spacing(4)}`,display:"flex",justifyContent:"center",alignItems:"center",background:e.palette.semantic.fill["fill-weaker"],borderRadius:e.radius["radius-8"],height:"100%"}))),s=r.styled(i)((({theme:e})=>({color:e.palette.semantic.text["text-weak"],textAlign:"center",fontSize:"14px",fontWeight:"400",lineHeight:"20px"})));module.exports=()=>e.jsx(a,{children:e.jsx(s,{children:"Swap with your component"})});
+//# sourceMappingURL=index.cjs.js.map

package/dist/components/atoms/Slot/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/Slot/index.tsx"],"sourcesContent":["import Box from \"@mui/material/Box\";\nimport Typography from \"@mui/material/Typography\";\n\nimport styled from \"@fd/utilities/styledUtilities\";\n\nconst StyledBox = styled(Box)(({ theme }) => ({\n\tborder: `1px dashed ${theme.palette.semantic.stroke[\"stroke-strong\"]}`,\n\tpadding: `${theme.spacing(3)} ${theme.spacing(4)}`,\n\tdisplay: \"flex\",\n\tjustifyContent: \"center\",\n\talignItems: \"center\",\n\tbackground: theme.palette.semantic.fill[\"fill-weaker\"],\n\tborderRadius: theme.radius[\"radius-8\"],\n\theight: \"100%\",\n}));\n\nconst StyledTypography = styled(Typography)(({ theme }) => ({\n\tcolor: theme.palette.semantic.text[\"text-weak\"],\n\ttextAlign: \"center\",\n\tfontSize: \"14px\",\n\tfontWeight: \"400\",\n\tlineHeight: \"20px\",\n}));\n\nconst Slot: React.FC = () => {\n\treturn (\n\t\t<StyledBox>\n\t\t\t<StyledTypography>Swap with your component</StyledTypography>\n\t\t</StyledBox>\n\t);\n};\n\nexport default Slot;\n"],"names":["StyledBox","styled","Box","theme","border","palette","semantic","stroke","padding","spacing","display","justifyContent","alignItems","background","fill","borderRadius","radius","height","StyledTypography","Typography","color","text","textAlign","fontSize","fontWeight","lineHeight","_jsx","children"],"mappings":"uJAKA,MAAMA,EAAYC,EAAAA,OAAOC,EAAPD,EAAY,EAAGE,YAAO,CACvCC,OAAQ,cAAcD,EAAME,QAAQC,SAASC,OAAO,mBACpDC,QAAS,GAAGL,EAAMM,QAAQ,MAAMN,EAAMM,QAAQ,KAC9CC,QAAS,OACTC,eAAgB,SAChBC,WAAY,SACZC,WAAYV,EAAME,QAAQC,SAASQ,KAAK,eACxCC,aAAcZ,EAAMa,OAAO,YAC3BC,OAAQ,WAGHC,EAAmBjB,EAAAA,OAAOkB,EAAPlB,EAAmB,EAAGE,YAAO,CACrDiB,MAAOjB,EAAME,QAAQC,SAASe,KAAK,aACnCC,UAAW,SACXC,SAAU,OACVC,WAAY,MACZC,WAAY,0BAGU,IAErBC,EAAAA,IAAC1B,EAAS,CAAA2B,SACTD,EAAAA,IAACR,EAAgB,CAAAS,SAAA"}

package/dist/components/atoms/Slot/index.d.ts

@@ -0,0 +1,3 @@
+declare const Slot: React.FC;
+
+export { Slot as default };

package/dist/components/atoms/Slot/index.js

@@ -0,0 +1,2 @@
+import{jsx as e}from"react/jsx-runtime";import t from"@mui/material/Box";import i from"@mui/material/Typography";import{styled as r}from"@mui/material/styles";const a=r(t)((({theme:e})=>({border:`1px dashed ${e.palette.semantic.stroke["stroke-strong"]}`,padding:`${e.spacing(3)} ${e.spacing(4)}`,display:"flex",justifyContent:"center",alignItems:"center",background:e.palette.semantic.fill["fill-weaker"],borderRadius:e.radius["radius-8"],height:"100%"}))),o=r(i)((({theme:e})=>({color:e.palette.semantic.text["text-weak"],textAlign:"center",fontSize:"14px",fontWeight:"400",lineHeight:"20px"}))),n=()=>e(a,{children:e(o,{children:"Swap with your component"})});export{n as default};
+//# sourceMappingURL=index.js.map

package/dist/components/atoms/Slot/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/Slot/index.tsx"],"sourcesContent":["import Box from \"@mui/material/Box\";\nimport Typography from \"@mui/material/Typography\";\n\nimport styled from \"@fd/utilities/styledUtilities\";\n\nconst StyledBox = styled(Box)(({ theme }) => ({\n\tborder: `1px dashed ${theme.palette.semantic.stroke[\"stroke-strong\"]}`,\n\tpadding: `${theme.spacing(3)} ${theme.spacing(4)}`,\n\tdisplay: \"flex\",\n\tjustifyContent: \"center\",\n\talignItems: \"center\",\n\tbackground: theme.palette.semantic.fill[\"fill-weaker\"],\n\tborderRadius: theme.radius[\"radius-8\"],\n\theight: \"100%\",\n}));\n\nconst StyledTypography = styled(Typography)(({ theme }) => ({\n\tcolor: theme.palette.semantic.text[\"text-weak\"],\n\ttextAlign: \"center\",\n\tfontSize: \"14px\",\n\tfontWeight: \"400\",\n\tlineHeight: \"20px\",\n}));\n\nconst Slot: React.FC = () => {\n\treturn (\n\t\t<StyledBox>\n\t\t\t<StyledTypography>Swap with your component</StyledTypography>\n\t\t</StyledBox>\n\t);\n};\n\nexport default Slot;\n"],"names":["StyledBox","styled","Box","theme","border","palette","semantic","stroke","padding","spacing","display","justifyContent","alignItems","background","fill","borderRadius","radius","height","StyledTypography","Typography","color","text","textAlign","fontSize","fontWeight","lineHeight","Slot","_jsx","children"],"mappings":"+JAKA,MAAMA,EAAYC,EAAOC,EAAPD,EAAY,EAAGE,YAAO,CACvCC,OAAQ,cAAcD,EAAME,QAAQC,SAASC,OAAO,mBACpDC,QAAS,GAAGL,EAAMM,QAAQ,MAAMN,EAAMM,QAAQ,KAC9CC,QAAS,OACTC,eAAgB,SAChBC,WAAY,SACZC,WAAYV,EAAME,QAAQC,SAASQ,KAAK,eACxCC,aAAcZ,EAAMa,OAAO,YAC3BC,OAAQ,WAGHC,EAAmBjB,EAAOkB,EAAPlB,EAAmB,EAAGE,YAAO,CACrDiB,MAAOjB,EAAME,QAAQC,SAASe,KAAK,aACnCC,UAAW,SACXC,SAAU,OACVC,WAAY,MACZC,WAAY,WAGPC,EAAiB,IAErBC,EAAC3B,EAAS,CAAA4B,SACTD,EAACT,EAAgB,CAAAU,SAAA"}

package/dist/components/atoms/Text/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react/jsx-runtime"),r=require("@mui/material/Box"),t=require("../../../themes/tokens/typography/line-height.cjs.js");require("../../../themes/typography.cjs.js");var i=require("@mui/material/styles"),a=require("@mui/material/Typography");const h=i.styled(r,{shouldForwardProp:e=>"variant"!==e})((({variant:e})=>({flex:"1 0 0",height:t.lineHeight.desktop[{h1:"h1",h2:"h2",h3:"h3",h4:"h4",body:"b1",caption:"caption"}[e]],display:"flex"})));module.exports=({variant:r,children:t})=>e.jsx(h,{variant:r,children:e.jsx(a,{variant:{h1:"h1Strong",h2:"h2Strong",h3:"h3Strong",h4:"h4Strong",body:"b1Weak",caption:"captionWeak"}[r],children:t})});
+//# sourceMappingURL=index.cjs.js.map

package/dist/components/atoms/Text/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/Text/index.tsx"],"sourcesContent":["import Box from '@fd/components/atoms/Box';\nimport { lineHeight } from '@fd/themes/tokens/typography/line-height';\nimport { typography } from '@fd/themes/typography';\nimport styled from '@fd/utilities/styledUtilities';\n\nimport Typography from '../Typography';\n\nexport type TextVariant = 'body' | 'caption' | 'h1' | 'h2' | 'h3' | 'h4';\n\nexport interface TextProps {\n  variant: TextVariant;\n  children: React.ReactNode;\n}\n\ntype TypographyVariant = keyof typeof typography;\n\nconst TextFrame = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'variant',\n})<{ variant: TextVariant }>(({ variant }) => {\n  const lineHeightMap: Record<TextVariant, keyof typeof lineHeight.desktop> = {\n    h1: 'h1',\n    h2: 'h2',\n    h3: 'h3',\n    h4: 'h4',\n    body: 'b1',\n    caption: 'caption',\n  };\n\n  return {\n    flex: '1 0 0',\n    height: lineHeight.desktop[lineHeightMap[variant]],\n    display: 'flex',\n  };\n});\n\nconst Text: React.FC<TextProps> = ({ variant, children }) => {\n  const variantMap: Record<TextVariant, TypographyVariant> = {\n    h1: 'h1Strong',\n    h2: 'h2Strong',\n    h3: 'h3Strong',\n    h4: 'h4Strong',\n    body: 'b1Weak',\n    caption: 'captionWeak',\n  };\n\n  return (\n    <TextFrame variant={variant}>\n      <Typography variant={variantMap[variant]}>{children}</Typography>\n    </TextFrame>\n  );\n};\n\nexport default Text;\n"],"names":["TextFrame","styled","Box","shouldForwardProp","prop","variant","flex","height","lineHeight","desktop","h1","h2","h3","h4","body","caption","display","children","_jsx","Typography"],"mappings":"0QAgBA,MAAMA,EAAYC,EAAAA,OAAOC,EAAK,CAC5BC,kBAAoBC,GAAkB,YAATA,GADbH,EAEW,EAAGI,cAUvB,CACLC,KAAM,QACNC,OAAQC,EAAAA,WAAWC,QAXuD,CAC1EC,GAAI,KACJC,GAAI,KACJC,GAAI,KACJC,GAAI,KACJC,KAAM,KACNC,QAAS,WAKgCV,IACzCW,QAAS,0BAIqB,EAAGX,UAASY,cAW1CC,EAAAA,IAAClB,EAAS,CAACK,QAASA,EAAOY,SACzBC,MAACC,EAAU,CAACd,QAX2C,CACzDK,GAAI,WACJC,GAAI,WACJC,GAAI,WACJC,GAAI,WACJC,KAAM,SACNC,QAAS,eAKyBV,YAAWY"}

package/dist/components/atoms/Text/index.d.ts

@@ -0,0 +1,9 @@
+type TextVariant = 'body' | 'caption' | 'h1' | 'h2' | 'h3' | 'h4';
+interface TextProps {
+    variant: TextVariant;
+    children: React.ReactNode;
+}
+declare const Text: React.FC<TextProps>;
+
+export { Text as default };
+export type { TextProps, TextVariant };

package/dist/components/atoms/Text/index.js

@@ -0,0 +1,2 @@
+import{jsx as t}from"react/jsx-runtime";import r from"@mui/material/Box";import{lineHeight as o}from"../../../themes/tokens/typography/line-height.js";import"../../../themes/typography.js";import{styled as a}from"@mui/material/styles";import h from"@mui/material/Typography";const i=a(r,{shouldForwardProp:t=>"variant"!==t})((({variant:t})=>({flex:"1 0 0",height:o.desktop[{h1:"h1",h2:"h2",h3:"h3",h4:"h4",body:"b1",caption:"caption"}[t]],display:"flex"}))),e=({variant:r,children:o})=>t(i,{variant:r,children:t(h,{variant:{h1:"h1Strong",h2:"h2Strong",h3:"h3Strong",h4:"h4Strong",body:"b1Weak",caption:"captionWeak"}[r],children:o})});export{e as default};
+//# sourceMappingURL=index.js.map

package/dist/components/atoms/Text/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/Text/index.tsx"],"sourcesContent":["import Box from '@fd/components/atoms/Box';\nimport { lineHeight } from '@fd/themes/tokens/typography/line-height';\nimport { typography } from '@fd/themes/typography';\nimport styled from '@fd/utilities/styledUtilities';\n\nimport Typography from '../Typography';\n\nexport type TextVariant = 'body' | 'caption' | 'h1' | 'h2' | 'h3' | 'h4';\n\nexport interface TextProps {\n  variant: TextVariant;\n  children: React.ReactNode;\n}\n\ntype TypographyVariant = keyof typeof typography;\n\nconst TextFrame = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'variant',\n})<{ variant: TextVariant }>(({ variant }) => {\n  const lineHeightMap: Record<TextVariant, keyof typeof lineHeight.desktop> = {\n    h1: 'h1',\n    h2: 'h2',\n    h3: 'h3',\n    h4: 'h4',\n    body: 'b1',\n    caption: 'caption',\n  };\n\n  return {\n    flex: '1 0 0',\n    height: lineHeight.desktop[lineHeightMap[variant]],\n    display: 'flex',\n  };\n});\n\nconst Text: React.FC<TextProps> = ({ variant, children }) => {\n  const variantMap: Record<TextVariant, TypographyVariant> = {\n    h1: 'h1Strong',\n    h2: 'h2Strong',\n    h3: 'h3Strong',\n    h4: 'h4Strong',\n    body: 'b1Weak',\n    caption: 'captionWeak',\n  };\n\n  return (\n    <TextFrame variant={variant}>\n      <Typography variant={variantMap[variant]}>{children}</Typography>\n    </TextFrame>\n  );\n};\n\nexport default Text;\n"],"names":["TextFrame","styled","Box","shouldForwardProp","prop","variant","flex","height","lineHeight","desktop","h1","h2","h3","h4","body","caption","display","Text","children","_jsx","Typography"],"mappings":"mRAgBA,MAAMA,EAAYC,EAAOC,EAAK,CAC5BC,kBAAoBC,GAAkB,YAATA,GADbH,EAEW,EAAGI,cAUvB,CACLC,KAAM,QACNC,OAAQC,EAAWC,QAXuD,CAC1EC,GAAI,KACJC,GAAI,KACJC,GAAI,KACJC,GAAI,KACJC,KAAM,KACNC,QAAS,WAKgCV,IACzCW,QAAS,WAIPC,EAA4B,EAAGZ,UAASa,cAW1CC,EAACnB,EAAS,CAACK,QAASA,EAAOa,SACzBC,EAACC,EAAU,CAACf,QAX2C,CACzDK,GAAI,WACJC,GAAI,WACJC,GAAI,WACJC,GAAI,WACJC,KAAM,SACNC,QAAS,eAKyBV,YAAWa"}

package/dist/components/atoms/TextArea/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../TextField/index.cjs.js");const r=({fdKey:r,rows:s=6,...i})=>e.jsx(t.TextField,{...i,multiline:!0,fdKey:r,rows:s,type:"text"});exports.TextArea=r,exports.default=r;
+//# sourceMappingURL=index.cjs.js.map

package/dist/components/atoms/TextArea/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/TextArea/index.tsx"],"sourcesContent":["import TextField, { type TextFieldProps } from '../TextField';\n\nexport type TextAreaProps = Omit<\n  TextFieldProps,\n  'hidePasswordAriaLabel' | 'multiline' | 'showPasswordAriaLabel' | 'type'\n> & {\n  rows?: number;\n};\n\nexport const TextArea = ({ fdKey, rows = 6, ...props }: TextAreaProps): JSX.Element => {\n  return <TextField {...props} multiline fdKey={fdKey} rows={rows} type=\"text\" />;\n};\n\nexport default TextArea;\n"],"names":["TextArea","fdKey","rows","props","_jsx","TextField","multiline","type"],"mappings":"8IASO,MAAMA,EAAW,EAAGC,QAAOC,OAAO,KAAMC,KACtCC,EAAAA,IAACC,EAAAA,UAAS,IAAKF,EAAOG,aAAUL,MAAOA,EAAOC,KAAMA,EAAMK,KAAK"}

package/dist/components/atoms/TextArea/index.d.ts

@@ -0,0 +1,9 @@
+import { TextFieldProps } from '../TextField/index.js';
+
+type TextAreaProps = Omit<TextFieldProps, 'hidePasswordAriaLabel' | 'multiline' | 'showPasswordAriaLabel' | 'type'> & {
+    rows?: number;
+};
+declare const TextArea: ({ fdKey, rows, ...props }: TextAreaProps) => JSX.Element;
+
+export { TextArea, TextArea as default };
+export type { TextAreaProps };

package/dist/components/atoms/TextArea/index.js

@@ -0,0 +1,2 @@
+import{jsx as e}from"react/jsx-runtime";import{TextField as t}from"../TextField/index.js";const r=({fdKey:r,rows:o=6,...i})=>e(t,{...i,multiline:!0,fdKey:r,rows:o,type:"text"});export{r as TextArea,r as default};
+//# sourceMappingURL=index.js.map

package/dist/components/atoms/TextArea/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/TextArea/index.tsx"],"sourcesContent":["import TextField, { type TextFieldProps } from '../TextField';\n\nexport type TextAreaProps = Omit<\n  TextFieldProps,\n  'hidePasswordAriaLabel' | 'multiline' | 'showPasswordAriaLabel' | 'type'\n> & {\n  rows?: number;\n};\n\nexport const TextArea = ({ fdKey, rows = 6, ...props }: TextAreaProps): JSX.Element => {\n  return <TextField {...props} multiline fdKey={fdKey} rows={rows} type=\"text\" />;\n};\n\nexport default TextArea;\n"],"names":["TextArea","fdKey","rows","props","_jsx","TextField","multiline","type"],"mappings":"0FASO,MAAMA,EAAW,EAAGC,QAAOC,OAAO,KAAMC,KACtCC,EAACC,EAAS,IAAKF,EAAOG,aAAUL,MAAOA,EAAOC,KAAMA,EAAMK,KAAK"}

package/dist/components/atoms/TextField/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),i=require("@mui/material/Box"),t=require("@mui/material/FormHelperText"),l=require("@mui/material/InputAdornment"),d=require("@mui/material/InputLabel"),s=require("@mui/material/styles"),n=require("@mui/material/TextField"),a=require("../../../icons/CancelCircle/index.cjs.js"),o=require("../../../icons/View/index.cjs.js"),u=require("../../../icons/ViewOff/index.cjs.js"),x=require("../IconButton/index.cjs.js");const c=s.styled(i,{shouldForwardProp:e=>"fullWidth"!==e})((({theme:e,fullWidth:r=!1})=>({display:"flex",flexDirection:"column",gap:e.spacing(.5),width:r?"100%":"min(364px, 100%)"}))),m=s.styled(n,{shouldForwardProp:e=>"fullWidth"!==e})((({fullWidth:e=!1})=>({display:"flex",width:e?"100%":"auto"})));module.exports=({disabled:i=!1,errorText:s,fdKey:n,fullWidth:h=!1,helperText:p,hidePasswordAriaLabel:j,label:f,multiline:q=!1,required:b=!1,showPasswordAriaLabel:w,type:y="text",startAdornment:A="",endAdornment:W="",...v})=>{const[F,I]=r.useState(!1),P=p?`${n}-helper-text`:void 0,B=s?`${n}-error-message`:void 0,T=[P,B].filter(Boolean).join(" ")||void 0,g=!!s&&!i,C="password"===y,L=()=>I((e=>!e));return e.jsxs(c,{fullWidth:h,children:[f&&e.jsx(d,{disabled:i,htmlFor:n,required:b,children:f}),p&&e.jsx(t,{disabled:i,id:P,children:p}),g&&e.jsxs(t,{error:!0,id:B,children:[e.jsx(a,{}),s]}),e.jsx(m,{"data-fd":n,disabled:i,error:g,fullWidth:h,id:n,label:"",multiline:q,required:b,slotProps:{input:{endAdornment:(()=>{if(C){if(!w||!j)return;return e.jsx(l,{position:"end",children:e.jsx(x.IconButton,{"aria-label":F?j:w,disabled:i,onClick:L,size:"small",tone:"neutral",variant:"tertiary",children:F?e.jsx(u,{}):e.jsx(o,{})})})}if(W)return e.jsx(l,{position:"end",children:W})})(),startAdornment:(()=>{if(A)return e.jsx(l,{position:"start",children:A})})()},htmlInput:{"aria-describedby":T}},type:C?F?"text":"password":y,variant:"outlined",...v})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),i=require("@mui/material/Box"),t=require("@mui/material/FormHelperText"),l=require("@mui/material/InputAdornment"),d=require("@mui/material/InputLabel"),s=require("@mui/material/styles"),n=require("@mui/material/TextField"),a=require("../../../icons/CancelCircle/index.cjs.js"),o=require("../../../icons/View/index.cjs.js"),u=require("../../../icons/ViewOff/index.cjs.js"),x=require("../IconButton/index.cjs.js");const c=s.styled(i,{shouldForwardProp:e=>"fullWidth"!==e})((({theme:e,fullWidth:r=!1})=>({display:"flex",flexDirection:"column",gap:e.spacing(.5),width:r?"100%":"min(364px, 100%)"}))),m=s.styled(n,{shouldForwardProp:e=>"fullWidth"!==e})((({fullWidth:e=!1})=>({display:"flex",width:e?"100%":"auto"}))),h=({disabled:s=!1,endAdornment:n,errorText:h,fdKey:p,fullWidth:j=!1,helperText:f,hidePasswordAriaLabel:q,label:b,multiline:w=!1,required:y=!1,showPasswordAriaLabel:v,startAdornment:A,type:W="text",...F})=>{const[P,I]=r.useState(!1),T=f?`${p}-helper-text`:void 0,B=h?`${p}-error-message`:void 0,g=[T,B].filter(Boolean).join(" ")||void 0,C=!!h&&!s,L="password"===W,O=()=>I((e=>!e));return e.jsxs(c,{fullWidth:j,children:[e.jsxs(i,{children:[b&&e.jsx(d,{disabled:s,htmlFor:p,required:y,children:b}),f&&e.jsx(t,{disabled:s,id:T,children:f})]}),C&&e.jsxs(t,{error:!0,id:B,children:[e.jsx(a,{}),h]}),e.jsx(m,{"data-fd":p,disabled:s,error:C,fullWidth:j,id:p,label:"",multiline:w,required:y,slotProps:{input:{endAdornment:(()=>{if(L){if(!v||!q)return;return e.jsx(l,{position:"end",children:e.jsx(x.IconButton,{"aria-label":P?q:v,disabled:s,onClick:O,size:"small",tone:"neutral",variant:"tertiary",children:P?e.jsx(u,{}):e.jsx(o,{})})})}if(n)return e.jsx(l,{position:"end",children:n})})(),startAdornment:(()=>{if(A)return e.jsx(l,{position:"start",children:A})})()},htmlInput:{"aria-describedby":g}},type:L?P?"text":"password":W,variant:"outlined",...F})]})};exports.TextField=h,exports.default=h;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/atoms/TextField/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/TextField/index.tsx"],"sourcesContent":["import { type ReactNode, useState } from 'react';\n\nimport Box from '@mui/material/Box';\nimport MuiFormHelperText from '@mui/material/FormHelperText';\nimport MuiInputAdornment from '@mui/material/InputAdornment';\nimport MuiInputLabel from '@mui/material/InputLabel';\nimport { styled } from '@mui/material/styles';\nimport MuiTextField, { type TextFieldProps as MuiTextFieldProps } from '@mui/material/TextField';\n\nimport CancelCircleIcon from '@fd/icons/CancelCircle';\nimport ViewIcon from '@fd/icons/View';\nimport ViewOffIcon from '@fd/icons/ViewOff';\n\nimport IconButton from '../IconButton';\n\n// Common props for all TextField variants\ntype BaseTextFieldProps = Omit<MuiTextFieldProps, 'error' | 'id' | 'type' | 'variant'> & {\n  errorText?: string;\n  fdKey: string;\n};\n\n// Password TextField variant - requires aria labels\ntype PasswordTextFieldProps = BaseTextFieldProps & {\n  type: 'password';\n  showPasswordAriaLabel: string;\n  hidePasswordAriaLabel: string;\n  startAdornment?: ReactNode;\n  endAdornment?: ReactNode;\n};\n\n// Generic TextField variant - for all other input types\ntype GenericTextFieldProps = BaseTextFieldProps & {\n  type?: Exclude<MuiTextFieldProps['type'], 'password'>;\n  showPasswordAriaLabel?: never;\n  hidePasswordAriaLabel?: never;\n  startAdornment?: ReactNode;\n  endAdornment?: ReactNode;\n};\n\nexport type TextFieldProps = GenericTextFieldProps | PasswordTextFieldProps;\n\nconst StyledContainer = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'fullWidth',\n})<{ fullWidth?: boolean }>(({ theme, fullWidth = false }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(0.5),\n  width: fullWidth ? '100%' : 'min(364px, 100%)', // Constrain width to a maximum of 100% of the container width\n}));\n\nconst StyledTextField = styled(MuiTextField, {\n  shouldForwardProp: (prop) => prop !== 'fullWidth',\n})<{ fullWidth?: boolean }>(({ fullWidth = false }) => ({\n  display: 'flex',\n  width: fullWidth ? '100%' : 'auto',\n}));\n\nconst TextField = ({\n  disabled = false,\n  errorText,\n  fdKey,\n  fullWidth = false,\n  helperText,\n  hidePasswordAriaLabel,\n  label,\n  multiline = false,\n  required = false,\n  showPasswordAriaLabel,\n  type = 'text',\n  startAdornment = '',\n  endAdornment = '',\n  ...props\n}: TextFieldProps): JSX.Element => {\n  const [showPassword, setShowPassword] = useState<boolean>(false);\n\n  const helperTextId = helperText ? `${fdKey}-helper-text` : undefined;\n  const errorMessageId = errorText ? `${fdKey}-error-message` : undefined;\n\n  // Combine helper text and error message IDs for aria-describedby\n  const ariaDescribedBy = [helperTextId, errorMessageId].filter(Boolean).join(' ') || undefined;\n\n  const isError = !!errorText && !disabled;\n  const isPassword = type === 'password';\n\n  const handleClickShowPassword = (): void => setShowPassword((show) => !show);\n\n  const getFieldType = (): MuiTextFieldProps['type'] => {\n    if (isPassword) {\n      return showPassword ? 'text' : 'password';\n    }\n\n    return type;\n  };\n\n  const renderEndAdornment = (): React.ReactNode => {\n    if (isPassword) {\n      if (!showPasswordAriaLabel || !hidePasswordAriaLabel) {\n        return undefined;\n      }\n\n      return (\n        <MuiInputAdornment position=\"end\">\n          <IconButton\n            aria-label={showPassword ? hidePasswordAriaLabel : showPasswordAriaLabel}\n            disabled={disabled}\n            onClick={handleClickShowPassword}\n            size=\"small\"\n            tone=\"neutral\"\n            variant=\"tertiary\"\n          >\n            {showPassword ? <ViewOffIcon /> : <ViewIcon />}\n          </IconButton>\n        </MuiInputAdornment>\n      );\n    }\n    if (endAdornment) {\n      return (\n        <MuiInputAdornment position=\"end\">\n          {endAdornment}\n        </MuiInputAdornment>\n      )\n    }\n\n    return undefined;\n  };\n\n  const renderStartAdornment = (): React.ReactNode => {\n    if(startAdornment) {\n      return (\n        <MuiInputAdornment position=\"start\" >\n          {startAdornment}\n        </MuiInputAdornment>\n      )\n    }\n    return undefined;\n  }\n\n  return (\n    <StyledContainer fullWidth={fullWidth}>\n      {label && (\n        <MuiInputLabel disabled={disabled} htmlFor={fdKey} required={required}>\n          {label}\n        </MuiInputLabel>\n      )}\n\n      {helperText && (\n        <MuiFormHelperText disabled={disabled} id={helperTextId}>\n          {helperText}\n        </MuiFormHelperText>\n      )}\n\n      {isError && (\n        <MuiFormHelperText error id={errorMessageId}>\n          <CancelCircleIcon />\n\n          {errorText}\n        </MuiFormHelperText>\n      )}\n\n      <StyledTextField\n        data-fd={fdKey}\n        disabled={disabled}\n        error={isError}\n        fullWidth={fullWidth}\n        id={fdKey}\n        label=\"\" // Remove label from TextField since we're rendering it separately\n        multiline={multiline}\n        required={required}\n        slotProps={{\n          input: {\n            endAdornment: renderEndAdornment(),\n            startAdornment: renderStartAdornment(),\n          },\n          htmlInput: {\n            'aria-describedby': ariaDescribedBy,\n          },\n        }}\n        type={getFieldType()}\n        variant=\"outlined\"\n        {...props}\n      />\n    </StyledContainer>\n  );\n};\n\nexport default TextField;\n"],"names":["StyledContainer","styled","Box","shouldForwardProp","prop","theme","fullWidth","display","flexDirection","gap","spacing","width","StyledTextField","MuiTextField","disabled","errorText","fdKey","helperText","hidePasswordAriaLabel","label","multiline","required","showPasswordAriaLabel","type","startAdornment","endAdornment","props","showPassword","setShowPassword","useState","helperTextId","undefined","errorMessageId","ariaDescribedBy","filter","Boolean","join","isError","isPassword","handleClickShowPassword","show","_jsxs","_jsx","MuiInputLabel","htmlFor","MuiFormHelperText","id","error","children","CancelCircleIcon","slotProps","input","MuiInputAdornment","position","IconButton","onClick","size","tone","variant","ViewOffIcon","ViewIcon","renderEndAdornment","renderStartAdornment","htmlInput"],"mappings":"geAyCA,MAAMA,EAAkBC,EAAAA,OAAOC,EAAK,CAClCC,kBAAoBC,GAAkB,cAATA,GADPH,EAEI,EAAGI,QAAOC,aAAY,MAAO,CACvDC,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,IACnBC,MAAOL,EAAY,OAAS,uBAGxBM,EAAkBX,EAAAA,OAAOY,EAAc,CAC3CV,kBAAoBC,GAAkB,cAATA,GADPH,EAEI,EAAGK,aAAY,MAAO,CAChDC,QAAS,OACTI,MAAOL,EAAY,OAAS,0BAGZ,EAChBQ,YAAW,EACXC,YACAC,QACAV,aAAY,EACZW,aACAC,wBACAC,QACAC,aAAY,EACZC,YAAW,EACXC,wBACAC,OAAO,OACPC,iBAAiB,GACjBC,eAAe,MACZC,MAEH,MAAOC,EAAcC,GAAmBC,EAAAA,UAAkB,GAEpDC,EAAeb,EAAa,GAAGD,qBAAsBe,EACrDC,EAAiBjB,EAAY,GAAGC,uBAAwBe,EAGxDE,EAAkB,CAACH,EAAcE,GAAgBE,OAAOC,SAASC,KAAK,WAAQL,EAE9EM,IAAYtB,IAAcD,EAC1BwB,EAAsB,aAATf,EAEbgB,EAA0B,IAAYX,GAAiBY,IAAUA,IAqDvE,OACEC,EAAAA,KAACzC,EAAe,CAACM,UAAWA,YACzBa,GACCuB,EAAAA,IAACC,GAAc7B,SAAUA,EAAU8B,QAAS5B,EAAOK,SAAUA,WAC1DF,IAIJF,GACCyB,EAAAA,IAACG,EAAiB,CAAC/B,SAAUA,EAAUgC,GAAIhB,WACxCb,IAIJoB,GACCI,EAAAA,KAACI,EAAiB,CAACE,SAAMD,GAAId,EAAcgB,SAAA,CACzCN,EAAAA,IAACO,EAAgB,CAAA,GAEhBlC,KAIL2B,EAAAA,IAAC9B,aACUI,EACTF,SAAUA,EACViC,MAAOV,EACP/B,UAAWA,EACXwC,GAAI9B,EACJG,MAAM,GACNC,UAAWA,EACXC,SAAUA,EACV6B,UAAW,CACTC,MAAO,CACL1B,aA5EiB,MACzB,GAAIa,EAAY,CACd,IAAKhB,IAA0BJ,EAC7B,OAGF,OACEwB,EAAAA,IAACU,EAAiB,CAACC,SAAS,MAAKL,SAC/BN,MAACY,EAAAA,WAAU,CAAA,aACG3B,EAAeT,EAAwBI,EACnDR,SAAUA,EACVyC,QAAShB,EACTiB,KAAK,QACLC,KAAK,UACLC,QAAQ,WAAUV,SAEjBrB,EAAee,EAAAA,IAACiB,EAAW,CAAA,GAAMjB,EAAAA,IAACkB,EAAQ,CAAA,MAInD,CACA,GAAInC,EACF,OACEiB,EAAAA,IAACU,EAAiB,CAACC,SAAS,MAAKL,SAC9BvB,KAoDeoC,GACdrC,eA7CmB,MAC3B,GAAGA,EACD,OACEkB,EAAAA,IAACU,EAAiB,CAACC,SAAS,QAAOL,SAChCxB,KAyCiBsC,IAElBC,UAAW,CACT,mBAAoB9B,IAGxBV,KA1FAe,EACKX,EAAe,OAAS,WAG1BJ,EAuFHmC,QAAQ,cACJhC"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/atoms/TextField/index.tsx"],"sourcesContent":["import { type ReactNode, useState } from 'react';\n\nimport Box from '@mui/material/Box';\nimport MuiFormHelperText from '@mui/material/FormHelperText';\nimport MuiInputAdornment from '@mui/material/InputAdornment';\nimport MuiInputLabel from '@mui/material/InputLabel';\nimport { styled } from '@mui/material/styles';\nimport MuiTextField, { type TextFieldProps as MuiTextFieldProps } from '@mui/material/TextField';\n\nimport CancelCircleIcon from '@fd/icons/CancelCircle';\nimport ViewIcon from '@fd/icons/View';\nimport ViewOffIcon from '@fd/icons/ViewOff';\n\nimport IconButton from '../IconButton';\n\n// Common props for all TextField variants\ntype BaseTextFieldProps = Omit<MuiTextFieldProps, 'error' | 'id' | 'type' | 'variant'> & {\n  endAdornment?: ReactNode;\n  errorText?: string;\n  fdKey: string;\n  startAdornment?: ReactNode;\n};\n\n// Password TextField variant - requires aria labels\ntype PasswordTextFieldProps = BaseTextFieldProps & {\n  type: 'password';\n  hidePasswordAriaLabel: string;\n  showPasswordAriaLabel: string;\n};\n\n// Generic TextField variant - for all other input types\ntype GenericTextFieldProps = BaseTextFieldProps & {\n  type?: Exclude<MuiTextFieldProps['type'], 'password'>;\n  hidePasswordAriaLabel?: never;\n  showPasswordAriaLabel?: never;\n};\n\nexport type TextFieldProps = GenericTextFieldProps | PasswordTextFieldProps;\n\nconst StyledContainer = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'fullWidth',\n})<{ fullWidth?: boolean }>(({ theme, fullWidth = false }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(0.5),\n  width: fullWidth ? '100%' : 'min(364px, 100%)', // Constrain width to a maximum of 100% of the container width\n}));\n\nconst StyledTextField = styled(MuiTextField, {\n  shouldForwardProp: (prop) => prop !== 'fullWidth',\n})<{ fullWidth?: boolean }>(({ fullWidth = false }) => ({\n  display: 'flex',\n  width: fullWidth ? '100%' : 'auto',\n}));\n\nexport const TextField = ({\n  disabled = false,\n  endAdornment = undefined,\n  errorText,\n  fdKey,\n  fullWidth = false,\n  helperText,\n  hidePasswordAriaLabel,\n  label,\n  multiline = false,\n  required = false,\n  showPasswordAriaLabel,\n  startAdornment = undefined,\n  type = 'text',\n  ...props\n}: TextFieldProps): JSX.Element => {\n  const [showPassword, setShowPassword] = useState<boolean>(false);\n\n  const helperTextId = helperText ? `${fdKey}-helper-text` : undefined;\n  const errorMessageId = errorText ? `${fdKey}-error-message` : undefined;\n\n  // Combine helper text and error message IDs for aria-describedby\n  const ariaDescribedBy = [helperTextId, errorMessageId].filter(Boolean).join(' ') || undefined;\n\n  const isError = !!errorText && !disabled;\n  const isPassword = type === 'password';\n\n  const handleClickShowPassword = (): void => setShowPassword((show) => !show);\n\n  const getFieldType = (): MuiTextFieldProps['type'] => {\n    if (isPassword) {\n      return showPassword ? 'text' : 'password';\n    }\n\n    return type;\n  };\n\n  const renderEndAdornment = (): React.ReactNode => {\n    if (isPassword) {\n      if (!showPasswordAriaLabel || !hidePasswordAriaLabel) {\n        return undefined;\n      }\n\n      return (\n        <MuiInputAdornment position=\"end\">\n          <IconButton\n            aria-label={showPassword ? hidePasswordAriaLabel : showPasswordAriaLabel}\n            disabled={disabled}\n            onClick={handleClickShowPassword}\n            size=\"small\"\n            tone=\"neutral\"\n            variant=\"tertiary\"\n          >\n            {showPassword ? <ViewOffIcon /> : <ViewIcon />}\n          </IconButton>\n        </MuiInputAdornment>\n      );\n    }\n    if (endAdornment) {\n      return <MuiInputAdornment position=\"end\">{endAdornment}</MuiInputAdornment>;\n    }\n\n    return undefined;\n  };\n\n  const renderStartAdornment = (): React.ReactNode => {\n    if (startAdornment) {\n      return <MuiInputAdornment position=\"start\">{startAdornment}</MuiInputAdornment>;\n    }\n\n    return undefined;\n  };\n\n  return (\n    <StyledContainer fullWidth={fullWidth}>\n      <Box>\n        {label && (\n          <MuiInputLabel disabled={disabled} htmlFor={fdKey} required={required}>\n            {label}\n          </MuiInputLabel>\n        )}\n\n        {helperText && (\n          <MuiFormHelperText disabled={disabled} id={helperTextId}>\n            {helperText}\n          </MuiFormHelperText>\n        )}\n      </Box>\n\n      {isError && (\n        <MuiFormHelperText error id={errorMessageId}>\n          <CancelCircleIcon />\n\n          {errorText}\n        </MuiFormHelperText>\n      )}\n\n      <StyledTextField\n        data-fd={fdKey}\n        disabled={disabled}\n        error={isError}\n        fullWidth={fullWidth}\n        id={fdKey}\n        label=\"\" // Remove label from TextField since we're rendering it separately\n        multiline={multiline}\n        required={required}\n        slotProps={{\n          input: {\n            endAdornment: renderEndAdornment(),\n            startAdornment: renderStartAdornment(),\n          },\n          htmlInput: {\n            'aria-describedby': ariaDescribedBy,\n          },\n        }}\n        type={getFieldType()}\n        variant=\"outlined\"\n        {...props}\n      />\n    </StyledContainer>\n  );\n};\n\nexport default TextField;\n"],"names":["StyledContainer","styled","Box","shouldForwardProp","prop","theme","fullWidth","display","flexDirection","gap","spacing","width","StyledTextField","MuiTextField","TextField","disabled","endAdornment","errorText","fdKey","helperText","hidePasswordAriaLabel","label","multiline","required","showPasswordAriaLabel","startAdornment","type","props","showPassword","setShowPassword","useState","helperTextId","undefined","errorMessageId","ariaDescribedBy","filter","Boolean","join","isError","isPassword","handleClickShowPassword","show","_jsxs","_jsx","MuiInputLabel","htmlFor","children","MuiFormHelperText","id","error","CancelCircleIcon","slotProps","input","MuiInputAdornment","position","IconButton","onClick","size","tone","variant","ViewOffIcon","ViewIcon","renderEndAdornment","renderStartAdornment","htmlInput"],"mappings":"uhBAuCA,MAAMA,EAAkBC,EAAAA,OAAOC,EAAK,CAClCC,kBAAoBC,GAAkB,cAATA,GADPH,EAEI,EAAGI,QAAOC,aAAY,MAAO,CACvDC,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,IACnBC,MAAOL,EAAY,OAAS,uBAGxBM,EAAkBX,EAAAA,OAAOY,EAAc,CAC3CV,kBAAoBC,GAAkB,cAATA,GADPH,EAEI,EAAGK,aAAY,MAAO,CAChDC,QAAS,OACTI,MAAOL,EAAY,OAAS,WAGjBQ,EAAY,EACvBC,YAAW,EACXC,eACAC,YACAC,QACAZ,aAAY,EACZa,aACAC,wBACAC,QACAC,aAAY,EACZC,YAAW,EACXC,wBACAC,iBACAC,OAAO,UACJC,MAEH,MAAOC,EAAcC,GAAmBC,EAAAA,UAAkB,GAEpDC,EAAeZ,EAAa,GAAGD,qBAAsBc,EACrDC,EAAiBhB,EAAY,GAAGC,uBAAwBc,EAGxDE,EAAkB,CAACH,EAAcE,GAAgBE,OAAOC,SAASC,KAAK,WAAQL,EAE9EM,IAAYrB,IAAcF,EAC1BwB,EAAsB,aAATb,EAEbc,EAA0B,IAAYX,GAAiBY,IAAUA,IA8CvE,OACEC,EAAAA,KAAC1C,EAAe,CAACM,UAAWA,YAC1BoC,EAAAA,KAACxC,aACEmB,GACCsB,EAAAA,IAACC,GAAc7B,SAAUA,EAAU8B,QAAS3B,EAAOK,SAAUA,EAAQuB,SAClEzB,IAIJF,GACCwB,EAAAA,IAACI,GAAkBhC,SAAUA,EAAUiC,GAAIjB,EAAYe,SACpD3B,OAKNmB,GACCI,EAAAA,KAACK,GAAkBE,OAAK,EAACD,GAAIf,YAC3BU,EAAAA,IAACO,MAEAjC,KAIL0B,EAAAA,IAAC/B,EAAe,CAAA,UACLM,EACTH,SAAUA,EACVkC,MAAOX,EACPhC,UAAWA,EACX0C,GAAI9B,EACJG,MAAM,GACNC,UAAWA,EACXC,SAAUA,EACV4B,UAAW,CACTC,MAAO,CACLpC,aAvEiB,MACzB,GAAIuB,EAAY,CACd,IAAKf,IAA0BJ,EAC7B,OAGF,OACEuB,EAAAA,IAACU,EAAiB,CAACC,SAAS,MAAKR,SAC/BH,MAACY,EAAAA,WAAU,CAAA,aACG3B,EAAeR,EAAwBI,EACnDT,SAAUA,EACVyC,QAAShB,EACTiB,KAAK,QACLC,KAAK,UACLC,QAAQ,WAAUb,SAEjBlB,EAAee,EAAAA,IAACiB,EAAW,CAAA,GAAMjB,EAAAA,IAACkB,EAAQ,CAAA,MAInD,CACA,GAAI7C,EACF,OAAO2B,EAAAA,IAACU,EAAiB,CAACC,SAAS,MAAKR,SAAE9B,KAiDtB8C,GACdrC,eA5CmB,MAC3B,GAAIA,EACF,OAAOkB,EAAAA,IAACU,EAAiB,CAACC,SAAS,QAAOR,SAAErB,KA0CtBsC,IAElBC,UAAW,CACT,mBAAoB9B,IAGxBR,KArFAa,EACKX,EAAe,OAAS,WAG1BF,EAkFHiC,QAAQ,cACJhC"}

package/dist/components/atoms/TextField/index.d.ts

@@ -2,25 +2,23 @@ import { ReactNode } from 'react';
 import { TextFieldProps as TextFieldProps$1 } from '@mui/material/TextField';
 
 type BaseTextFieldProps = Omit<TextFieldProps$1, 'error' | 'id' | 'type' | 'variant'> & {
+    endAdornment?: ReactNode;
     errorText?: string;
     fdKey: string;
+    startAdornment?: ReactNode;
 };
 type PasswordTextFieldProps = BaseTextFieldProps & {
     type: 'password';
-    showPasswordAriaLabel: string;
     hidePasswordAriaLabel: string;
-    startAdornment?: ReactNode;
-    endAdornment?: ReactNode;
+    showPasswordAriaLabel: string;
 };
 type GenericTextFieldProps = BaseTextFieldProps & {
     type?: Exclude<TextFieldProps$1['type'], 'password'>;
-    showPasswordAriaLabel?: never;
     hidePasswordAriaLabel?: never;
-    startAdornment?: ReactNode;
-    endAdornment?: ReactNode;
+    showPasswordAriaLabel?: never;
 };
 type TextFieldProps = GenericTextFieldProps | PasswordTextFieldProps;
-declare const TextField: ({ disabled, errorText, fdKey, fullWidth, helperText, hidePasswordAriaLabel, label, multiline, required, showPasswordAriaLabel, type, startAdornment, endAdornment, ...props }: TextFieldProps) => JSX.Element;
+declare const TextField: ({ disabled, endAdornment, errorText, fdKey, fullWidth, helperText, hidePasswordAriaLabel, label, multiline, required, showPasswordAriaLabel, startAdornment, type, ...props }: TextFieldProps) => JSX.Element;
 
-export { TextField as default };
+export { TextField, TextField as default };
 export type { TextFieldProps };

package/dist/components/atoms/TextField/index.js

@@ -1,2 +1,2 @@
-import{jsxs as r,jsx as i}from"react/jsx-runtime";import{useState as e}from"react";import t from"@mui/material/Box";import o from"@mui/material/FormHelperText";import l from"@mui/material/InputAdornment";import d from"@mui/material/InputLabel";import{styled as n}from"@mui/material/styles";import a from"@mui/material/TextField";import m from"../../../icons/CancelCircle/index.js";import s from"../../../icons/View/index.js";import u from"../../../icons/ViewOff/index.js";import{IconButton as p}from"../IconButton/index.js";const f=n(t,{shouldForwardProp:r=>"fullWidth"!==r})((({theme:r,fullWidth:i=!1})=>({display:"flex",flexDirection:"column",gap:r.spacing(.5),width:i?"100%":"min(364px, 100%)"}))),h=n(a,{shouldForwardProp:r=>"fullWidth"!==r})((({fullWidth:r=!1})=>({display:"flex",width:r?"100%":"auto"}))),c=({disabled:t=!1,errorText:n,fdKey:a,fullWidth:c=!1,helperText:x,hidePasswordAriaLabel:b,label:w,multiline:y=!1,required:A=!1,showPasswordAriaLabel:W,type:j="text",startAdornment:v="",endAdornment:F="",...P})=>{const[I,T]=e(!1),g=x?`${a}-helper-text`:void 0,q=n?`${a}-error-message`:void 0,B=[g,q].filter(Boolean).join(" ")||void 0,C=!!n&&!t,L="password"===j,V=()=>T((r=>!r));return r(f,{fullWidth:c,children:[w&&i(d,{disabled:t,htmlFor:a,required:A,children:w}),x&&i(o,{disabled:t,id:g,children:x}),C&&r(o,{error:!0,id:q,children:[i(m,{}),n]}),i(h,{"data-fd":a,disabled:t,error:C,fullWidth:c,id:a,label:"",multiline:y,required:A,slotProps:{input:{endAdornment:(()=>{if(L){if(!W||!b)return;return i(l,{position:"end",children:i(p,{"aria-label":I?b:W,disabled:t,onClick:V,size:"small",tone:"neutral",variant:"tertiary",children:i(I?u:s,{})})})}if(F)return i(l,{position:"end",children:F})})(),startAdornment:(()=>{if(v)return i(l,{position:"start",children:v})})()},htmlInput:{"aria-describedby":B}},type:L?I?"text":"password":j,variant:"outlined",...P})]})};export{c as default};
+import{jsxs as r,jsx as i}from"react/jsx-runtime";import{useState as e}from"react";import t from"@mui/material/Box";import o from"@mui/material/FormHelperText";import l from"@mui/material/InputAdornment";import d from"@mui/material/InputLabel";import{styled as n}from"@mui/material/styles";import a from"@mui/material/TextField";import m from"../../../icons/CancelCircle/index.js";import s from"../../../icons/View/index.js";import u from"../../../icons/ViewOff/index.js";import{IconButton as p}from"../IconButton/index.js";const f=n(t,{shouldForwardProp:r=>"fullWidth"!==r})((({theme:r,fullWidth:i=!1})=>({display:"flex",flexDirection:"column",gap:r.spacing(.5),width:i?"100%":"min(364px, 100%)"}))),h=n(a,{shouldForwardProp:r=>"fullWidth"!==r})((({fullWidth:r=!1})=>({display:"flex",width:r?"100%":"auto"}))),c=({disabled:n=!1,endAdornment:a,errorText:c,fdKey:x,fullWidth:b=!1,helperText:w,hidePasswordAriaLabel:y,label:A,multiline:W=!1,required:j=!1,showPasswordAriaLabel:v,startAdornment:F,type:P="text",...I})=>{const[T,g]=e(!1),q=w?`${x}-helper-text`:void 0,B=c?`${x}-error-message`:void 0,C=[q,B].filter(Boolean).join(" ")||void 0,L=!!c&&!n,V="password"===P,$=()=>g((r=>!r));return r(f,{fullWidth:b,children:[r(t,{children:[A&&i(d,{disabled:n,htmlFor:x,required:j,children:A}),w&&i(o,{disabled:n,id:q,children:w})]}),L&&r(o,{error:!0,id:B,children:[i(m,{}),c]}),i(h,{"data-fd":x,disabled:n,error:L,fullWidth:b,id:x,label:"",multiline:W,required:j,slotProps:{input:{endAdornment:(()=>{if(V){if(!v||!y)return;return i(l,{position:"end",children:i(p,{"aria-label":T?y:v,disabled:n,onClick:$,size:"small",tone:"neutral",variant:"tertiary",children:i(T?u:s,{})})})}if(a)return i(l,{position:"end",children:a})})(),startAdornment:(()=>{if(F)return i(l,{position:"start",children:F})})()},htmlInput:{"aria-describedby":C}},type:V?T?"text":"password":P,variant:"outlined",...I})]})};export{c as TextField,c as default};
 //# sourceMappingURL=index.js.map

package/dist/components/atoms/TextField/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/TextField/index.tsx"],"sourcesContent":["import { type ReactNode, useState } from 'react';\n\nimport Box from '@mui/material/Box';\nimport MuiFormHelperText from '@mui/material/FormHelperText';\nimport MuiInputAdornment from '@mui/material/InputAdornment';\nimport MuiInputLabel from '@mui/material/InputLabel';\nimport { styled } from '@mui/material/styles';\nimport MuiTextField, { type TextFieldProps as MuiTextFieldProps } from '@mui/material/TextField';\n\nimport CancelCircleIcon from '@fd/icons/CancelCircle';\nimport ViewIcon from '@fd/icons/View';\nimport ViewOffIcon from '@fd/icons/ViewOff';\n\nimport IconButton from '../IconButton';\n\n// Common props for all TextField variants\ntype BaseTextFieldProps = Omit<MuiTextFieldProps, 'error' | 'id' | 'type' | 'variant'> & {\n  errorText?: string;\n  fdKey: string;\n};\n\n// Password TextField variant - requires aria labels\ntype PasswordTextFieldProps = BaseTextFieldProps & {\n  type: 'password';\n  showPasswordAriaLabel: string;\n  hidePasswordAriaLabel: string;\n  startAdornment?: ReactNode;\n  endAdornment?: ReactNode;\n};\n\n// Generic TextField variant - for all other input types\ntype GenericTextFieldProps = BaseTextFieldProps & {\n  type?: Exclude<MuiTextFieldProps['type'], 'password'>;\n  showPasswordAriaLabel?: never;\n  hidePasswordAriaLabel?: never;\n  startAdornment?: ReactNode;\n  endAdornment?: ReactNode;\n};\n\nexport type TextFieldProps = GenericTextFieldProps | PasswordTextFieldProps;\n\nconst StyledContainer = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'fullWidth',\n})<{ fullWidth?: boolean }>(({ theme, fullWidth = false }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(0.5),\n  width: fullWidth ? '100%' : 'min(364px, 100%)', // Constrain width to a maximum of 100% of the container width\n}));\n\nconst StyledTextField = styled(MuiTextField, {\n  shouldForwardProp: (prop) => prop !== 'fullWidth',\n})<{ fullWidth?: boolean }>(({ fullWidth = false }) => ({\n  display: 'flex',\n  width: fullWidth ? '100%' : 'auto',\n}));\n\nconst TextField = ({\n  disabled = false,\n  errorText,\n  fdKey,\n  fullWidth = false,\n  helperText,\n  hidePasswordAriaLabel,\n  label,\n  multiline = false,\n  required = false,\n  showPasswordAriaLabel,\n  type = 'text',\n  startAdornment = '',\n  endAdornment = '',\n  ...props\n}: TextFieldProps): JSX.Element => {\n  const [showPassword, setShowPassword] = useState<boolean>(false);\n\n  const helperTextId = helperText ? `${fdKey}-helper-text` : undefined;\n  const errorMessageId = errorText ? `${fdKey}-error-message` : undefined;\n\n  // Combine helper text and error message IDs for aria-describedby\n  const ariaDescribedBy = [helperTextId, errorMessageId].filter(Boolean).join(' ') || undefined;\n\n  const isError = !!errorText && !disabled;\n  const isPassword = type === 'password';\n\n  const handleClickShowPassword = (): void => setShowPassword((show) => !show);\n\n  const getFieldType = (): MuiTextFieldProps['type'] => {\n    if (isPassword) {\n      return showPassword ? 'text' : 'password';\n    }\n\n    return type;\n  };\n\n  const renderEndAdornment = (): React.ReactNode => {\n    if (isPassword) {\n      if (!showPasswordAriaLabel || !hidePasswordAriaLabel) {\n        return undefined;\n      }\n\n      return (\n        <MuiInputAdornment position=\"end\">\n          <IconButton\n            aria-label={showPassword ? hidePasswordAriaLabel : showPasswordAriaLabel}\n            disabled={disabled}\n            onClick={handleClickShowPassword}\n            size=\"small\"\n            tone=\"neutral\"\n            variant=\"tertiary\"\n          >\n            {showPassword ? <ViewOffIcon /> : <ViewIcon />}\n          </IconButton>\n        </MuiInputAdornment>\n      );\n    }\n    if (endAdornment) {\n      return (\n        <MuiInputAdornment position=\"end\">\n          {endAdornment}\n        </MuiInputAdornment>\n      )\n    }\n\n    return undefined;\n  };\n\n  const renderStartAdornment = (): React.ReactNode => {\n    if(startAdornment) {\n      return (\n        <MuiInputAdornment position=\"start\" >\n          {startAdornment}\n        </MuiInputAdornment>\n      )\n    }\n    return undefined;\n  }\n\n  return (\n    <StyledContainer fullWidth={fullWidth}>\n      {label && (\n        <MuiInputLabel disabled={disabled} htmlFor={fdKey} required={required}>\n          {label}\n        </MuiInputLabel>\n      )}\n\n      {helperText && (\n        <MuiFormHelperText disabled={disabled} id={helperTextId}>\n          {helperText}\n        </MuiFormHelperText>\n      )}\n\n      {isError && (\n        <MuiFormHelperText error id={errorMessageId}>\n          <CancelCircleIcon />\n\n          {errorText}\n        </MuiFormHelperText>\n      )}\n\n      <StyledTextField\n        data-fd={fdKey}\n        disabled={disabled}\n        error={isError}\n        fullWidth={fullWidth}\n        id={fdKey}\n        label=\"\" // Remove label from TextField since we're rendering it separately\n        multiline={multiline}\n        required={required}\n        slotProps={{\n          input: {\n            endAdornment: renderEndAdornment(),\n            startAdornment: renderStartAdornment(),\n          },\n          htmlInput: {\n            'aria-describedby': ariaDescribedBy,\n          },\n        }}\n        type={getFieldType()}\n        variant=\"outlined\"\n        {...props}\n      />\n    </StyledContainer>\n  );\n};\n\nexport default TextField;\n"],"names":["StyledContainer","styled","Box","shouldForwardProp","prop","theme","fullWidth","display","flexDirection","gap","spacing","width","StyledTextField","MuiTextField","TextField","disabled","errorText","fdKey","helperText","hidePasswordAriaLabel","label","multiline","required","showPasswordAriaLabel","type","startAdornment","endAdornment","props","showPassword","setShowPassword","useState","helperTextId","undefined","errorMessageId","ariaDescribedBy","filter","Boolean","join","isError","isPassword","handleClickShowPassword","show","_jsxs","_jsx","MuiInputLabel","htmlFor","MuiFormHelperText","id","error","children","CancelCircleIcon","slotProps","input","MuiInputAdornment","position","IconButton","onClick","size","tone","variant","ViewOffIcon","ViewIcon","renderEndAdornment","renderStartAdornment","htmlInput"],"mappings":"4gBAyCA,MAAMA,EAAkBC,EAAOC,EAAK,CAClCC,kBAAoBC,GAAkB,cAATA,GADPH,EAEI,EAAGI,QAAOC,aAAY,MAAO,CACvDC,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,IACnBC,MAAOL,EAAY,OAAS,uBAGxBM,EAAkBX,EAAOY,EAAc,CAC3CV,kBAAoBC,GAAkB,cAATA,GADPH,EAEI,EAAGK,aAAY,MAAO,CAChDC,QAAS,OACTI,MAAOL,EAAY,OAAS,WAGxBQ,EAAY,EAChBC,YAAW,EACXC,YACAC,QACAX,aAAY,EACZY,aACAC,wBACAC,QACAC,aAAY,EACZC,YAAW,EACXC,wBACAC,OAAO,OACPC,iBAAiB,GACjBC,eAAe,MACZC,MAEH,MAAOC,EAAcC,GAAmBC,GAAkB,GAEpDC,EAAeb,EAAa,GAAGD,qBAAsBe,EACrDC,EAAiBjB,EAAY,GAAGC,uBAAwBe,EAGxDE,EAAkB,CAACH,EAAcE,GAAgBE,OAAOC,SAASC,KAAK,WAAQL,EAE9EM,IAAYtB,IAAcD,EAC1BwB,EAAsB,aAATf,EAEbgB,EAA0B,IAAYX,GAAiBY,IAAUA,IAqDvE,OACEC,EAAC1C,EAAe,CAACM,UAAWA,YACzBc,GACCuB,EAACC,GAAc7B,SAAUA,EAAU8B,QAAS5B,EAAOK,SAAUA,WAC1DF,IAIJF,GACCyB,EAACG,EAAiB,CAAC/B,SAAUA,EAAUgC,GAAIhB,WACxCb,IAIJoB,GACCI,EAACI,EAAiB,CAACE,SAAMD,GAAId,EAAcgB,SAAA,CACzCN,EAACO,EAAgB,CAAA,GAEhBlC,KAIL2B,EAAC/B,aACUK,EACTF,SAAUA,EACViC,MAAOV,EACPhC,UAAWA,EACXyC,GAAI9B,EACJG,MAAM,GACNC,UAAWA,EACXC,SAAUA,EACV6B,UAAW,CACTC,MAAO,CACL1B,aA5EiB,MACzB,GAAIa,EAAY,CACd,IAAKhB,IAA0BJ,EAC7B,OAGF,OACEwB,EAACU,EAAiB,CAACC,SAAS,MAAKL,SAC/BN,EAACY,EAAU,CAAA,aACG3B,EAAeT,EAAwBI,EACnDR,SAAUA,EACVyC,QAAShB,EACTiB,KAAK,QACLC,KAAK,UACLC,QAAQ,WAAUV,SAEFN,EAAff,EAAgBgC,EAAkBC,EAAP,CAAA,MAIpC,CACA,GAAInC,EACF,OACEiB,EAACU,EAAiB,CAACC,SAAS,MAAKL,SAC9BvB,KAoDeoC,GACdrC,eA7CmB,MAC3B,GAAGA,EACD,OACEkB,EAACU,EAAiB,CAACC,SAAS,QAAOL,SAChCxB,KAyCiBsC,IAElBC,UAAW,CACT,mBAAoB9B,IAGxBV,KA1FAe,EACKX,EAAe,OAAS,WAG1BJ,EAuFHmC,QAAQ,cACJhC"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/atoms/TextField/index.tsx"],"sourcesContent":["import { type ReactNode, useState } from 'react';\n\nimport Box from '@mui/material/Box';\nimport MuiFormHelperText from '@mui/material/FormHelperText';\nimport MuiInputAdornment from '@mui/material/InputAdornment';\nimport MuiInputLabel from '@mui/material/InputLabel';\nimport { styled } from '@mui/material/styles';\nimport MuiTextField, { type TextFieldProps as MuiTextFieldProps } from '@mui/material/TextField';\n\nimport CancelCircleIcon from '@fd/icons/CancelCircle';\nimport ViewIcon from '@fd/icons/View';\nimport ViewOffIcon from '@fd/icons/ViewOff';\n\nimport IconButton from '../IconButton';\n\n// Common props for all TextField variants\ntype BaseTextFieldProps = Omit<MuiTextFieldProps, 'error' | 'id' | 'type' | 'variant'> & {\n  endAdornment?: ReactNode;\n  errorText?: string;\n  fdKey: string;\n  startAdornment?: ReactNode;\n};\n\n// Password TextField variant - requires aria labels\ntype PasswordTextFieldProps = BaseTextFieldProps & {\n  type: 'password';\n  hidePasswordAriaLabel: string;\n  showPasswordAriaLabel: string;\n};\n\n// Generic TextField variant - for all other input types\ntype GenericTextFieldProps = BaseTextFieldProps & {\n  type?: Exclude<MuiTextFieldProps['type'], 'password'>;\n  hidePasswordAriaLabel?: never;\n  showPasswordAriaLabel?: never;\n};\n\nexport type TextFieldProps = GenericTextFieldProps | PasswordTextFieldProps;\n\nconst StyledContainer = styled(Box, {\n  shouldForwardProp: (prop) => prop !== 'fullWidth',\n})<{ fullWidth?: boolean }>(({ theme, fullWidth = false }) => ({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: theme.spacing(0.5),\n  width: fullWidth ? '100%' : 'min(364px, 100%)', // Constrain width to a maximum of 100% of the container width\n}));\n\nconst StyledTextField = styled(MuiTextField, {\n  shouldForwardProp: (prop) => prop !== 'fullWidth',\n})<{ fullWidth?: boolean }>(({ fullWidth = false }) => ({\n  display: 'flex',\n  width: fullWidth ? '100%' : 'auto',\n}));\n\nexport const TextField = ({\n  disabled = false,\n  endAdornment = undefined,\n  errorText,\n  fdKey,\n  fullWidth = false,\n  helperText,\n  hidePasswordAriaLabel,\n  label,\n  multiline = false,\n  required = false,\n  showPasswordAriaLabel,\n  startAdornment = undefined,\n  type = 'text',\n  ...props\n}: TextFieldProps): JSX.Element => {\n  const [showPassword, setShowPassword] = useState<boolean>(false);\n\n  const helperTextId = helperText ? `${fdKey}-helper-text` : undefined;\n  const errorMessageId = errorText ? `${fdKey}-error-message` : undefined;\n\n  // Combine helper text and error message IDs for aria-describedby\n  const ariaDescribedBy = [helperTextId, errorMessageId].filter(Boolean).join(' ') || undefined;\n\n  const isError = !!errorText && !disabled;\n  const isPassword = type === 'password';\n\n  const handleClickShowPassword = (): void => setShowPassword((show) => !show);\n\n  const getFieldType = (): MuiTextFieldProps['type'] => {\n    if (isPassword) {\n      return showPassword ? 'text' : 'password';\n    }\n\n    return type;\n  };\n\n  const renderEndAdornment = (): React.ReactNode => {\n    if (isPassword) {\n      if (!showPasswordAriaLabel || !hidePasswordAriaLabel) {\n        return undefined;\n      }\n\n      return (\n        <MuiInputAdornment position=\"end\">\n          <IconButton\n            aria-label={showPassword ? hidePasswordAriaLabel : showPasswordAriaLabel}\n            disabled={disabled}\n            onClick={handleClickShowPassword}\n            size=\"small\"\n            tone=\"neutral\"\n            variant=\"tertiary\"\n          >\n            {showPassword ? <ViewOffIcon /> : <ViewIcon />}\n          </IconButton>\n        </MuiInputAdornment>\n      );\n    }\n    if (endAdornment) {\n      return <MuiInputAdornment position=\"end\">{endAdornment}</MuiInputAdornment>;\n    }\n\n    return undefined;\n  };\n\n  const renderStartAdornment = (): React.ReactNode => {\n    if (startAdornment) {\n      return <MuiInputAdornment position=\"start\">{startAdornment}</MuiInputAdornment>;\n    }\n\n    return undefined;\n  };\n\n  return (\n    <StyledContainer fullWidth={fullWidth}>\n      <Box>\n        {label && (\n          <MuiInputLabel disabled={disabled} htmlFor={fdKey} required={required}>\n            {label}\n          </MuiInputLabel>\n        )}\n\n        {helperText && (\n          <MuiFormHelperText disabled={disabled} id={helperTextId}>\n            {helperText}\n          </MuiFormHelperText>\n        )}\n      </Box>\n\n      {isError && (\n        <MuiFormHelperText error id={errorMessageId}>\n          <CancelCircleIcon />\n\n          {errorText}\n        </MuiFormHelperText>\n      )}\n\n      <StyledTextField\n        data-fd={fdKey}\n        disabled={disabled}\n        error={isError}\n        fullWidth={fullWidth}\n        id={fdKey}\n        label=\"\" // Remove label from TextField since we're rendering it separately\n        multiline={multiline}\n        required={required}\n        slotProps={{\n          input: {\n            endAdornment: renderEndAdornment(),\n            startAdornment: renderStartAdornment(),\n          },\n          htmlInput: {\n            'aria-describedby': ariaDescribedBy,\n          },\n        }}\n        type={getFieldType()}\n        variant=\"outlined\"\n        {...props}\n      />\n    </StyledContainer>\n  );\n};\n\nexport default TextField;\n"],"names":["StyledContainer","styled","Box","shouldForwardProp","prop","theme","fullWidth","display","flexDirection","gap","spacing","width","StyledTextField","MuiTextField","TextField","disabled","endAdornment","errorText","fdKey","helperText","hidePasswordAriaLabel","label","multiline","required","showPasswordAriaLabel","startAdornment","type","props","showPassword","setShowPassword","useState","helperTextId","undefined","errorMessageId","ariaDescribedBy","filter","Boolean","join","isError","isPassword","handleClickShowPassword","show","_jsxs","_jsx","MuiInputLabel","htmlFor","children","MuiFormHelperText","id","error","CancelCircleIcon","slotProps","input","MuiInputAdornment","position","IconButton","onClick","size","tone","variant","ViewOffIcon","ViewIcon","renderEndAdornment","renderStartAdornment","htmlInput"],"mappings":"4gBAuCA,MAAMA,EAAkBC,EAAOC,EAAK,CAClCC,kBAAoBC,GAAkB,cAATA,GADPH,EAEI,EAAGI,QAAOC,aAAY,MAAO,CACvDC,QAAS,OACTC,cAAe,SACfC,IAAKJ,EAAMK,QAAQ,IACnBC,MAAOL,EAAY,OAAS,uBAGxBM,EAAkBX,EAAOY,EAAc,CAC3CV,kBAAoBC,GAAkB,cAATA,GADPH,EAEI,EAAGK,aAAY,MAAO,CAChDC,QAAS,OACTI,MAAOL,EAAY,OAAS,WAGjBQ,EAAY,EACvBC,YAAW,EACXC,eACAC,YACAC,QACAZ,aAAY,EACZa,aACAC,wBACAC,QACAC,aAAY,EACZC,YAAW,EACXC,wBACAC,iBACAC,OAAO,UACJC,MAEH,MAAOC,EAAcC,GAAmBC,GAAkB,GAEpDC,EAAeZ,EAAa,GAAGD,qBAAsBc,EACrDC,EAAiBhB,EAAY,GAAGC,uBAAwBc,EAGxDE,EAAkB,CAACH,EAAcE,GAAgBE,OAAOC,SAASC,KAAK,WAAQL,EAE9EM,IAAYrB,IAAcF,EAC1BwB,EAAsB,aAATb,EAEbc,EAA0B,IAAYX,GAAiBY,IAAUA,IA8CvE,OACEC,EAAC1C,EAAe,CAACM,UAAWA,YAC1BoC,EAACxC,aACEmB,GACCsB,EAACC,GAAc7B,SAAUA,EAAU8B,QAAS3B,EAAOK,SAAUA,EAAQuB,SAClEzB,IAIJF,GACCwB,EAACI,GAAkBhC,SAAUA,EAAUiC,GAAIjB,EAAYe,SACpD3B,OAKNmB,GACCI,EAACK,GAAkBE,OAAK,EAACD,GAAIf,YAC3BU,EAACO,MAEAjC,KAIL0B,EAAC/B,EAAe,CAAA,UACLM,EACTH,SAAUA,EACVkC,MAAOX,EACPhC,UAAWA,EACX0C,GAAI9B,EACJG,MAAM,GACNC,UAAWA,EACXC,SAAUA,EACV4B,UAAW,CACTC,MAAO,CACLpC,aAvEiB,MACzB,GAAIuB,EAAY,CACd,IAAKf,IAA0BJ,EAC7B,OAGF,OACEuB,EAACU,EAAiB,CAACC,SAAS,MAAKR,SAC/BH,EAACY,EAAU,CAAA,aACG3B,EAAeR,EAAwBI,EACnDT,SAAUA,EACVyC,QAAShB,EACTiB,KAAK,QACLC,KAAK,UACLC,QAAQ,WAAUb,SAEFH,EAAff,EAAgBgC,EAAkBC,EAAP,CAAA,MAIpC,CACA,GAAI7C,EACF,OAAO2B,EAACU,EAAiB,CAACC,SAAS,MAAKR,SAAE9B,KAiDtB8C,GACdrC,eA5CmB,MAC3B,GAAIA,EACF,OAAOkB,EAACU,EAAiB,CAACC,SAAS,QAAOR,SAAErB,KA0CtBsC,IAElBC,UAAW,CACT,mBAAoB9B,IAGxBR,KArFAa,EACKX,EAAe,OAAS,WAG1BF,EAkFHiC,QAAQ,cACJhC"}

package/dist/components/molecules/Alert/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),a=require("@mui/material/Alert"),r=require("@mui/material/AlertTitle"),i=require("@mui/material/Box"),n=require("@mui/material/styles"),s=require("../../../icons/Alert/index.cjs.js"),l=require("../../../icons/CancelCircle/index.cjs.js"),o=require("../../../icons/CheckmarkCircle/index.cjs.js"),c=require("../../../icons/Diamond/index.cjs.js"),m=require("../../../icons/InformationCircle/index.cjs.js"),d=require("../../atoms/Button/index.cjs.js");const u={neutral:t=>e.jsx(c,{color:t.palette.semantic.icon["icon-strong"]}),brand:t=>e.jsx(c,{color:t.palette.semantic.icon["icon-primary"]}),destructive:t=>e.jsx(l,{color:t.palette.semantic.icon["icon-error"]}),warning:t=>e.jsx(s,{color:t.palette.semantic.icon["icon-warning"]}),information:t=>e.jsx(m,{color:t.palette.semantic.icon["icon-information"]}),"neutral-inverse":t=>e.jsx(c,{color:t.palette.semantic.icon["icon-inverse"]}),"brand-inverse":t=>e.jsx(c,{color:t.palette.semantic.icon["icon-inverse"]}),success:t=>e.jsx(o,{color:t.palette.semantic.icon["icon-success"]})},x={background:{neutral:e=>e.palette.semantic.fill["fill-weak"],brand:e=>e.palette.semantic.fill["fill-primary-weak"],destructive:e=>e.palette.semantic.fill["fill-error-weak"],warning:e=>e.palette.semantic.fill["fill-warning-weak"],success:e=>e.palette.semantic.fill["fill-success-weak"],information:e=>e.palette.semantic.fill["fill-information-weak"],"neutral-inverse":e=>e.palette.semantic.background["background-inverse"],"brand-inverse":e=>e.palette.semantic.fill["fill-primary-strong"]},border:{neutral:e=>e.palette.semantic.stroke["stroke-weak"],brand:e=>e.palette.semantic.stroke["stroke-primary-weak"],destructive:e=>e.palette.semantic.stroke["stroke-error-weak"],warning:e=>e.palette.semantic.stroke["stroke-warning-weak"],success:e=>e.palette.semantic.stroke["stroke-success-weak"],information:e=>e.palette.semantic.stroke["stroke-information-weak"],"neutral-inverse":()=>"transparant","brand-inverse":()=>"transparant"},header:{neutral:e=>e.palette.semantic.text["text-strong"],brand:e=>e.palette.semantic.text["text-strong"],destructive:e=>e.palette.semantic.text["text-strong"],warning:e=>e.palette.semantic.text["text-strong"],success:e=>e.palette.semantic.text["text-strong"],information:e=>e.palette.semantic.text["text-strong"],"neutral-inverse":e=>e.palette.semantic.text["text-inverse-strong"],"brand-inverse":e=>e.palette.semantic.text["text-inverse-strong"]},text:{neutral:e=>e.palette.semantic.text["text-weak"],brand:e=>e.palette.semantic.text["text-weak"],destructive:e=>e.palette.semantic.text["text-weak"],warning:e=>e.palette.semantic.text["text-weak"],success:e=>e.palette.semantic.text["text-weak"],information:e=>e.palette.semantic.text["text-weak"],"neutral-inverse":e=>e.palette.semantic.text["text-inverse-weak"],"brand-inverse":e=>e.palette.semantic.text["text-inverse-weak"]}},p=(e,t)=>u[t](e),k=(e,t)=>x.background[t](e),w=(e,t)=>x.border[t](e),b=(e,t)=>x.header[t](e),f=(e,t)=>x.text[t](e),j=n.styled(i)((()=>({marginTop:"16px"}))),g=n.styled(a,{shouldForwardProp:e=>!["tone"].includes(e)})((({theme:e,tone:t})=>({backgroundColor:k(e,t),border:"1px solid",borderColor:w(e,t),color:f(e,t)}))),v=t.memo((({title:t,description:a,tone:s="neutral",onClose:l,className:o,"data-testid":c,action:m})=>{const u=n.useTheme();return e.jsxs(g,{"aria-describedby":`alert-description-${c??"default"}`,"aria-labelledby":`alert-title-${c??"default"}`,className:o,"data-testid":c,icon:p(u,s),role:"alert",tone:s,onClose:l,children:[e.jsx(r,{color:b(u,s),id:`alert-title-${c??"default"}`,children:t}),e.jsx(i,{id:`alert-description-${c??"default"}`,children:a}),(()=>{if(!m)return null;const a=m["data-testid"]??`action-button-${m.label.replace(/\s+/g,"-").toLowerCase()}`;return e.jsx(j,{children:e.jsx(d.Button,{"aria-label":`${m.label} - ${t}`,"data-testid":a,fdKey:m.label,size:"small",variant:m.type??"primary",onClick:m.onClick,children:m.label})})})()]})}));v.displayName="Alert",module.exports=v;
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),a=require("@mui/material/Alert"),r=require("@mui/material/AlertTitle"),i=require("@mui/material/Box"),n=require("@mui/material/styles"),s=require("../../../icons/Alert/index.cjs.js"),l=require("../../../icons/CancelCircle/index.cjs.js"),o=require("../../../icons/CheckmarkCircle/index.cjs.js"),c=require("../../../icons/Diamond/index.cjs.js"),m=require("../../../icons/InformationCircle/index.cjs.js"),d=require("../../atoms/Button/index.cjs.js");const u={neutral:t=>e.jsx(c,{color:t.palette.semantic.icon["icon-strong"]}),brand:t=>e.jsx(c,{color:t.palette.semantic.icon["icon-primary"]}),destructive:t=>e.jsx(l,{color:t.palette.semantic.icon["icon-error"]}),warning:t=>e.jsx(s,{color:t.palette.semantic.icon["icon-warning"]}),information:t=>e.jsx(m,{color:t.palette.semantic.icon["icon-information"]}),"neutral-inverse":t=>e.jsx(c,{color:t.palette.semantic.icon["icon-inverse"]}),"brand-inverse":t=>e.jsx(c,{color:t.palette.semantic.icon["icon-inverse"]}),success:t=>e.jsx(o,{color:t.palette.semantic.icon["icon-success"]})},x={background:{neutral:e=>e.palette.semantic.fill["fill-weak"],brand:e=>e.palette.semantic.fill["fill-primary-weak"],destructive:e=>e.palette.semantic.fill["fill-error-weak"],warning:e=>e.palette.semantic.fill["fill-warning-weak"],success:e=>e.palette.semantic.fill["fill-success-weak"],information:e=>e.palette.semantic.fill["fill-information-weak"],"neutral-inverse":e=>e.palette.semantic.background["background-inverse"],"brand-inverse":e=>e.palette.semantic.fill["fill-primary-strong"]},border:{neutral:e=>e.palette.semantic.stroke["stroke-weak"],brand:e=>e.palette.semantic.stroke["stroke-primary-weak"],destructive:e=>e.palette.semantic.stroke["stroke-error-weak"],warning:e=>e.palette.semantic.stroke["stroke-warning-weak"],success:e=>e.palette.semantic.stroke["stroke-success-weak"],information:e=>e.palette.semantic.stroke["stroke-information-weak"],"neutral-inverse":()=>"transparant","brand-inverse":()=>"transparant"},header:{neutral:e=>e.palette.semantic.text["text-strong"],brand:e=>e.palette.semantic.text["text-strong"],destructive:e=>e.palette.semantic.text["text-strong"],warning:e=>e.palette.semantic.text["text-strong"],success:e=>e.palette.semantic.text["text-strong"],information:e=>e.palette.semantic.text["text-strong"],"neutral-inverse":e=>e.palette.semantic.text["text-inverse-strong"],"brand-inverse":e=>e.palette.semantic.text["text-inverse-strong"]},text:{neutral:e=>e.palette.semantic.text["text-weak"],brand:e=>e.palette.semantic.text["text-weak"],destructive:e=>e.palette.semantic.text["text-weak"],warning:e=>e.palette.semantic.text["text-weak"],success:e=>e.palette.semantic.text["text-weak"],information:e=>e.palette.semantic.text["text-weak"],"neutral-inverse":e=>e.palette.semantic.text["text-inverse-weak"],"brand-inverse":e=>e.palette.semantic.text["text-inverse-weak"]}},p=(e,t)=>u[t](e),k=(e,t)=>x.background[t](e),w=(e,t)=>x.border[t](e),b=(e,t)=>x.header[t](e),f=(e,t)=>x.text[t](e),j=n.styled(i)((()=>({marginTop:"16px"}))),g=n.styled(a,{shouldForwardProp:e=>!["tone"].includes(e)})((({theme:e,tone:t})=>({backgroundColor:k(e,t),border:"1px solid",borderColor:w(e,t),color:f(e,t)}))),v=t.memo((({title:t,description:a,tone:s="neutral",onClose:l,className:o,"data-testid":c,action:m})=>{const u=n.useTheme();return e.jsxs(g,{"aria-describedby":`alert-description-${c??"default"}`,"aria-labelledby":`alert-title-${c??"default"}`,className:o,"data-testid":c,icon:p(u,s),onClose:l,role:"alert",tone:s,children:[e.jsx(r,{color:b(u,s),id:`alert-title-${c??"default"}`,children:t}),e.jsx(i,{id:`alert-description-${c??"default"}`,children:a}),(()=>{if(!m)return null;const a=m["data-testid"]??`action-button-${m.label.replace(/\s+/g,"-").toLowerCase()}`;return e.jsx(j,{children:e.jsx(d.Button,{"aria-label":`${m.label} - ${t}`,"data-testid":a,fdKey:m.label,onClick:m.onClick,size:"small",variant:m.type??"primary",children:m.label})})})()]})}));v.displayName="Alert",module.exports=v;
 //# sourceMappingURL=index.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/Alert/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n// eslint-disable-next-line @typescript-eslint/explicit-function-return-type\nimport { memo } from 'react';\n\nimport MuiAlert from '@mui/material/Alert';\nimport MuiAlertTitle from '@mui/material/AlertTitle';\nimport Box from '@mui/material/Box';\nimport { styled, type Theme, useTheme } from '@mui/material/styles';\n\nimport AlertIcon from '../../../icons/Alert';\nimport CancelCircleIcon from '../../../icons/CancelCircle';\nimport CheckmarkCircleIcon from '../../../icons/CheckmarkCircle';\nimport DiamondIcon from '../../../icons/Diamond';\nimport InformationCircleIcon from '../../../icons/InformationCircle';\nimport Button from '../../atoms/Button';\nimport type { ButtonType } from '../../atoms/Button/getButtonStyles';\n\n/** Visual tone of the alert */\nexport type AlertTones =\n  | 'brand-inverse'\n  | 'brand'\n  | 'destructive'\n  | 'information'\n  | 'neutral-inverse'\n  | 'neutral'\n  | 'success'\n  | 'warning';\n\n/** Props for the Alert component */\nexport interface AlertProps {\n  /** Main heading text of the alert */\n  title: string;\n  /** Detailed description text of the alert */\n  description: string;\n  /** Visual tone of the alert */\n  tone?: AlertTones;\n  /** Callback function when the alert is closed */\n  onClose?: () => void;\n  /** Action button configuration */\n  action?: {\n    /** Text label for the action button */\n    label: string;\n    /** Visual style of the action button */\n    type?: ButtonType;\n    /** Callback function when the action button is clicked */\n    onClick: () => void;\n    /** Test ID for the action button */\n    'data-testid'?: string;\n  };\n  /** Additional CSS class names */\n  className?: string;\n  /** Test ID for testing and automation */\n  'data-testid'?: string;\n}\n\nconst ICONS = {\n  neutral: (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-strong']} />,\n  brand: (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-primary']} />,\n  destructive: (theme: Theme) => <CancelCircleIcon color={theme.palette.semantic.icon['icon-error']} />,\n  warning: (theme: Theme) => <AlertIcon color={theme.palette.semantic.icon['icon-warning']} />,\n  information: (theme: Theme) => (\n    <InformationCircleIcon color={theme.palette.semantic.icon['icon-information']} />\n  ),\n  'neutral-inverse': (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-inverse']} />,\n  'brand-inverse': (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-inverse']} />,\n  success: (theme: Theme) => <CheckmarkCircleIcon color={theme.palette.semantic.icon['icon-success']} />,\n};\n\nconst COLOURS = {\n  background: {\n    neutral: (theme: Theme) => theme.palette.semantic.fill['fill-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.fill['fill-primary-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.fill['fill-error-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.fill['fill-warning-weak'],\n    success: (theme: Theme) => theme.palette.semantic.fill['fill-success-weak'],\n    information: (theme: Theme) => theme.palette.semantic.fill['fill-information-weak'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.background['background-inverse'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.fill['fill-primary-strong'],\n  },\n  border: {\n    neutral: (theme: Theme) => theme.palette.semantic.stroke['stroke-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.stroke['stroke-primary-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.stroke['stroke-error-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.stroke['stroke-warning-weak'],\n    success: (theme: Theme) => theme.palette.semantic.stroke['stroke-success-weak'],\n    information: (theme: Theme) => theme.palette.semantic.stroke['stroke-information-weak'],\n    'neutral-inverse': () => 'transparant',\n    'brand-inverse': () => 'transparant',\n  },\n  header: {\n    neutral: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    brand: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    destructive: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    warning: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    success: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    information: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-strong'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-strong'],\n  },\n  text: {\n    neutral: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    success: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    information: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-weak'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-weak'],\n  },\n};\n\nconst getIcon = (theme: Theme, tone: AlertTones): JSX.Element => {\n  return ICONS[tone](theme);\n};\n\nconst getBackgroundColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.background[tone](theme);\n};\n\nconst getBorderColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.border[tone](theme);\n};\n\nconst getHeaderColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.header[tone](theme);\n};\n\nconst getTextColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.text[tone](theme);\n};\n\ninterface StyledAlertProps {\n  tone: AlertTones;\n}\n\nconst StyledActionContainer = styled(Box)(() => ({\n  marginTop: '16px',\n}));\n\nconst StyledAlert = styled(MuiAlert, {\n  shouldForwardProp: (prop) => !['tone'].includes(prop as string),\n})<StyledAlertProps>(({ theme, tone }) => ({\n  backgroundColor: getBackgroundColour(theme, tone),\n  border: '1px solid',\n  borderColor: getBorderColour(theme, tone),\n  color: getTextColour(theme, tone),\n}));\n\n/**\n * Alert component is used to display important messages or notifications to users.\n * It supports different visual tones to convey different semantic meanings and can include\n * an optional action button and close button.\n *\n * The component is wrapped with React.memo to optimize performance by preventing unnecessary\n * re-renders when the component's props haven't changed, which is beneficial for components\n * that may be used frequently throughout the application.\n */\nconst Alert = memo(\n  ({\n    title,\n    description,\n    tone = 'neutral',\n    onClose,\n    className,\n    'data-testid': dataTestId,\n    action,\n  }: AlertProps) => {\n    const theme = useTheme();\n\n    const renderAction = (): JSX.Element | null => {\n      if (!action) {\n        return null;\n      }\n\n      const actionTestId =\n        action['data-testid'] ?? `action-button-${action.label.replace(/\\s+/g, '-').toLowerCase()}`;\n\n      return (\n        <StyledActionContainer>\n          <Button\n            aria-label={`${action.label} - ${title}`}\n            data-testid={actionTestId}\n            fdKey={action.label}\n            size=\"small\"\n            variant={action.type ?? 'primary'}\n            onClick={action.onClick}\n          >\n            {action.label}\n          </Button>\n        </StyledActionContainer>\n      );\n    };\n\n    return (\n      <StyledAlert\n        aria-describedby={`alert-description-${dataTestId ?? 'default'}`}\n        aria-labelledby={`alert-title-${dataTestId ?? 'default'}`}\n        className={className}\n        data-testid={dataTestId}\n        icon={getIcon(theme, tone)}\n        role=\"alert\"\n        tone={tone}\n        onClose={onClose}\n      >\n        <MuiAlertTitle color={getHeaderColour(theme, tone)} id={`alert-title-${dataTestId ?? 'default'}`}>\n          {title}\n        </MuiAlertTitle>\n        <Box id={`alert-description-${dataTestId ?? 'default'}`}>{description}</Box>\n        {renderAction()}\n      </StyledAlert>\n    );\n  },\n);\n\nAlert.displayName = 'Alert';\n\nexport default Alert;\n"],"names":["ICONS","neutral","theme","_jsx","DiamondIcon","color","palette","semantic","icon","brand","destructive","CancelCircleIcon","warning","AlertIcon","information","InformationCircleIcon","success","CheckmarkCircleIcon","COLOURS","background","fill","border","stroke","header","text","getIcon","tone","getBackgroundColour","getBorderColour","getHeaderColour","getTextColour","StyledActionContainer","styled","Box","marginTop","StyledAlert","MuiAlert","shouldForwardProp","prop","includes","backgroundColor","borderColor","Alert","memo","title","description","onClose","className","dataTestId","action","useTheme","_jsxs","role","children","MuiAlertTitle","id","actionTestId","label","replace","toLowerCase","Button","fdKey","size","variant","type","onClick","renderAction","displayName"],"mappings":"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"}
+{"version":3,"file":"index.cjs.js","sources":["../../../../src/components/molecules/Alert/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n// eslint-disable-next-line @typescript-eslint/explicit-function-return-type\nimport { memo } from 'react';\n\nimport MuiAlert from '@mui/material/Alert';\nimport MuiAlertTitle from '@mui/material/AlertTitle';\nimport Box from '@mui/material/Box';\nimport { styled, type Theme, useTheme } from '@mui/material/styles';\n\nimport AlertIcon from '../../../icons/Alert';\nimport CancelCircleIcon from '../../../icons/CancelCircle';\nimport CheckmarkCircleIcon from '../../../icons/CheckmarkCircle';\nimport DiamondIcon from '../../../icons/Diamond';\nimport InformationCircleIcon from '../../../icons/InformationCircle';\nimport Button from '../../atoms/Button';\nimport type { ButtonType } from '../../atoms/Button/getButtonStyles';\n\n/** Visual tone of the alert */\nexport type AlertTones =\n  | 'brand-inverse'\n  | 'brand'\n  | 'destructive'\n  | 'information'\n  | 'neutral-inverse'\n  | 'neutral'\n  | 'success'\n  | 'warning';\n\n/** Props for the Alert component */\nexport interface AlertProps {\n  /** Main heading text of the alert */\n  title: string;\n  /** Detailed description text of the alert */\n  description: string;\n  /** Visual tone of the alert */\n  tone?: AlertTones;\n  /** Callback function when the alert is closed */\n  onClose?: () => void;\n  /** Action button configuration */\n  action?: {\n    /** Text label for the action button */\n    label: string;\n    /** Visual style of the action button */\n    type?: ButtonType;\n    /** Callback function when the action button is clicked */\n    onClick: () => void;\n    /** Test ID for the action button */\n    'data-testid'?: string;\n  };\n  /** Additional CSS class names */\n  className?: string;\n  /** Test ID for testing and automation */\n  'data-testid'?: string;\n}\n\nconst ICONS = {\n  neutral: (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-strong']} />,\n  brand: (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-primary']} />,\n  destructive: (theme: Theme) => <CancelCircleIcon color={theme.palette.semantic.icon['icon-error']} />,\n  warning: (theme: Theme) => <AlertIcon color={theme.palette.semantic.icon['icon-warning']} />,\n  information: (theme: Theme) => (\n    <InformationCircleIcon color={theme.palette.semantic.icon['icon-information']} />\n  ),\n  'neutral-inverse': (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-inverse']} />,\n  'brand-inverse': (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-inverse']} />,\n  success: (theme: Theme) => <CheckmarkCircleIcon color={theme.palette.semantic.icon['icon-success']} />,\n};\n\nconst COLOURS = {\n  background: {\n    neutral: (theme: Theme) => theme.palette.semantic.fill['fill-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.fill['fill-primary-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.fill['fill-error-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.fill['fill-warning-weak'],\n    success: (theme: Theme) => theme.palette.semantic.fill['fill-success-weak'],\n    information: (theme: Theme) => theme.palette.semantic.fill['fill-information-weak'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.background['background-inverse'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.fill['fill-primary-strong'],\n  },\n  border: {\n    neutral: (theme: Theme) => theme.palette.semantic.stroke['stroke-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.stroke['stroke-primary-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.stroke['stroke-error-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.stroke['stroke-warning-weak'],\n    success: (theme: Theme) => theme.palette.semantic.stroke['stroke-success-weak'],\n    information: (theme: Theme) => theme.palette.semantic.stroke['stroke-information-weak'],\n    'neutral-inverse': () => 'transparant',\n    'brand-inverse': () => 'transparant',\n  },\n  header: {\n    neutral: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    brand: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    destructive: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    warning: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    success: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    information: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-strong'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-strong'],\n  },\n  text: {\n    neutral: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    success: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    information: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-weak'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-weak'],\n  },\n};\n\nconst getIcon = (theme: Theme, tone: AlertTones): JSX.Element => {\n  return ICONS[tone](theme);\n};\n\nconst getBackgroundColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.background[tone](theme);\n};\n\nconst getBorderColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.border[tone](theme);\n};\n\nconst getHeaderColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.header[tone](theme);\n};\n\nconst getTextColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.text[tone](theme);\n};\n\ninterface StyledAlertProps {\n  tone: AlertTones;\n}\n\nconst StyledActionContainer = styled(Box)(() => ({\n  marginTop: '16px',\n}));\n\nconst StyledAlert = styled(MuiAlert, {\n  shouldForwardProp: (prop) => !['tone'].includes(prop as string),\n})<StyledAlertProps>(({ theme, tone }) => ({\n  backgroundColor: getBackgroundColour(theme, tone),\n  border: '1px solid',\n  borderColor: getBorderColour(theme, tone),\n  color: getTextColour(theme, tone),\n}));\n\n/**\n * Alert component is used to display important messages or notifications to users.\n * It supports different visual tones to convey different semantic meanings and can include\n * an optional action button and close button.\n *\n * The component is wrapped with React.memo to optimize performance by preventing unnecessary\n * re-renders when the component's props haven't changed, which is beneficial for components\n * that may be used frequently throughout the application.\n */\nconst Alert = memo(\n  ({\n    title,\n    description,\n    tone = 'neutral',\n    onClose,\n    className,\n    'data-testid': dataTestId,\n    action,\n  }: AlertProps) => {\n    const theme = useTheme();\n\n    const renderAction = (): JSX.Element | null => {\n      if (!action) {\n        return null;\n      }\n\n      const actionTestId =\n        action['data-testid'] ?? `action-button-${action.label.replace(/\\s+/g, '-').toLowerCase()}`;\n\n      return (\n        <StyledActionContainer>\n          <Button\n            aria-label={`${action.label} - ${title}`}\n            data-testid={actionTestId}\n            fdKey={action.label}\n            onClick={action.onClick}\n            size=\"small\"\n            variant={action.type ?? 'primary'}\n          >\n            {action.label}\n          </Button>\n        </StyledActionContainer>\n      );\n    };\n\n    return (\n      <StyledAlert\n        aria-describedby={`alert-description-${dataTestId ?? 'default'}`}\n        aria-labelledby={`alert-title-${dataTestId ?? 'default'}`}\n        className={className}\n        data-testid={dataTestId}\n        icon={getIcon(theme, tone)}\n        onClose={onClose}\n        role=\"alert\"\n        tone={tone}\n      >\n        <MuiAlertTitle color={getHeaderColour(theme, tone)} id={`alert-title-${dataTestId ?? 'default'}`}>\n          {title}\n        </MuiAlertTitle>\n        <Box id={`alert-description-${dataTestId ?? 'default'}`}>{description}</Box>\n        {renderAction()}\n      </StyledAlert>\n    );\n  },\n);\n\nAlert.displayName = 'Alert';\n\nexport default Alert;\n"],"names":["ICONS","neutral","theme","_jsx","DiamondIcon","color","palette","semantic","icon","brand","destructive","CancelCircleIcon","warning","AlertIcon","information","InformationCircleIcon","success","CheckmarkCircleIcon","COLOURS","background","fill","border","stroke","header","text","getIcon","tone","getBackgroundColour","getBorderColour","getHeaderColour","getTextColour","StyledActionContainer","styled","Box","marginTop","StyledAlert","MuiAlert","shouldForwardProp","prop","includes","backgroundColor","borderColor","Alert","memo","title","description","onClose","className","dataTestId","action","useTheme","_jsxs","role","children","MuiAlertTitle","id","actionTestId","label","replace","toLowerCase","Button","fdKey","onClick","size","variant","type","renderAction","displayName"],"mappings":"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"}

package/dist/components/molecules/Alert/index.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{memo as a}from"react";import r from"@mui/material/Alert";import i from"@mui/material/AlertTitle";import n from"@mui/material/Box";import{styled as o,useTheme as l}from"@mui/material/styles";import s from"../../../icons/Alert/index.js";import c from"../../../icons/CancelCircle/index.js";import m from"../../../icons/CheckmarkCircle/index.js";import p from"../../../icons/Diamond/index.js";import d from"../../../icons/InformationCircle/index.js";import{Button as u}from"../../atoms/Button/index.js";const x={neutral:e=>t(p,{color:e.palette.semantic.icon["icon-strong"]}),brand:e=>t(p,{color:e.palette.semantic.icon["icon-primary"]}),destructive:e=>t(c,{color:e.palette.semantic.icon["icon-error"]}),warning:e=>t(s,{color:e.palette.semantic.icon["icon-warning"]}),information:e=>t(d,{color:e.palette.semantic.icon["icon-information"]}),"neutral-inverse":e=>t(p,{color:e.palette.semantic.icon["icon-inverse"]}),"brand-inverse":e=>t(p,{color:e.palette.semantic.icon["icon-inverse"]}),success:e=>t(m,{color:e.palette.semantic.icon["icon-success"]})},f={background:{neutral:e=>e.palette.semantic.fill["fill-weak"],brand:e=>e.palette.semantic.fill["fill-primary-weak"],destructive:e=>e.palette.semantic.fill["fill-error-weak"],warning:e=>e.palette.semantic.fill["fill-warning-weak"],success:e=>e.palette.semantic.fill["fill-success-weak"],information:e=>e.palette.semantic.fill["fill-information-weak"],"neutral-inverse":e=>e.palette.semantic.background["background-inverse"],"brand-inverse":e=>e.palette.semantic.fill["fill-primary-strong"]},border:{neutral:e=>e.palette.semantic.stroke["stroke-weak"],brand:e=>e.palette.semantic.stroke["stroke-primary-weak"],destructive:e=>e.palette.semantic.stroke["stroke-error-weak"],warning:e=>e.palette.semantic.stroke["stroke-warning-weak"],success:e=>e.palette.semantic.stroke["stroke-success-weak"],information:e=>e.palette.semantic.stroke["stroke-information-weak"],"neutral-inverse":()=>"transparant","brand-inverse":()=>"transparant"},header:{neutral:e=>e.palette.semantic.text["text-strong"],brand:e=>e.palette.semantic.text["text-strong"],destructive:e=>e.palette.semantic.text["text-strong"],warning:e=>e.palette.semantic.text["text-strong"],success:e=>e.palette.semantic.text["text-strong"],information:e=>e.palette.semantic.text["text-strong"],"neutral-inverse":e=>e.palette.semantic.text["text-inverse-strong"],"brand-inverse":e=>e.palette.semantic.text["text-inverse-strong"]},text:{neutral:e=>e.palette.semantic.text["text-weak"],brand:e=>e.palette.semantic.text["text-weak"],destructive:e=>e.palette.semantic.text["text-weak"],warning:e=>e.palette.semantic.text["text-weak"],success:e=>e.palette.semantic.text["text-weak"],information:e=>e.palette.semantic.text["text-weak"],"neutral-inverse":e=>e.palette.semantic.text["text-inverse-weak"],"brand-inverse":e=>e.palette.semantic.text["text-inverse-weak"]}},k=(e,t)=>x[t](e),w=(e,t)=>f.background[t](e),b=(e,t)=>f.border[t](e),g=(e,t)=>f.header[t](e),v=(e,t)=>f.text[t](e),C=o(n)((()=>({marginTop:"16px"}))),y=o(r,{shouldForwardProp:e=>!["tone"].includes(e)})((({theme:e,tone:t})=>({backgroundColor:w(e,t),border:"1px solid",borderColor:b(e,t),color:v(e,t)}))),h=a((({title:a,description:r,tone:o="neutral",onClose:s,className:c,"data-testid":m,action:p})=>{const d=l();return e(y,{"aria-describedby":`alert-description-${m??"default"}`,"aria-labelledby":`alert-title-${m??"default"}`,className:c,"data-testid":m,icon:k(d,o),role:"alert",tone:o,onClose:s,children:[t(i,{color:g(d,o),id:`alert-title-${m??"default"}`,children:a}),t(n,{id:`alert-description-${m??"default"}`,children:r}),(()=>{if(!p)return null;const e=p["data-testid"]??`action-button-${p.label.replace(/\s+/g,"-").toLowerCase()}`;return t(C,{children:t(u,{"aria-label":`${p.label} - ${a}`,"data-testid":e,fdKey:p.label,size:"small",variant:p.type??"primary",onClick:p.onClick,children:p.label})})})()]})}));h.displayName="Alert";export{h as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{memo as a}from"react";import r from"@mui/material/Alert";import i from"@mui/material/AlertTitle";import n from"@mui/material/Box";import{styled as o,useTheme as l}from"@mui/material/styles";import s from"../../../icons/Alert/index.js";import c from"../../../icons/CancelCircle/index.js";import m from"../../../icons/CheckmarkCircle/index.js";import p from"../../../icons/Diamond/index.js";import d from"../../../icons/InformationCircle/index.js";import{Button as u}from"../../atoms/Button/index.js";const x={neutral:e=>t(p,{color:e.palette.semantic.icon["icon-strong"]}),brand:e=>t(p,{color:e.palette.semantic.icon["icon-primary"]}),destructive:e=>t(c,{color:e.palette.semantic.icon["icon-error"]}),warning:e=>t(s,{color:e.palette.semantic.icon["icon-warning"]}),information:e=>t(d,{color:e.palette.semantic.icon["icon-information"]}),"neutral-inverse":e=>t(p,{color:e.palette.semantic.icon["icon-inverse"]}),"brand-inverse":e=>t(p,{color:e.palette.semantic.icon["icon-inverse"]}),success:e=>t(m,{color:e.palette.semantic.icon["icon-success"]})},f={background:{neutral:e=>e.palette.semantic.fill["fill-weak"],brand:e=>e.palette.semantic.fill["fill-primary-weak"],destructive:e=>e.palette.semantic.fill["fill-error-weak"],warning:e=>e.palette.semantic.fill["fill-warning-weak"],success:e=>e.palette.semantic.fill["fill-success-weak"],information:e=>e.palette.semantic.fill["fill-information-weak"],"neutral-inverse":e=>e.palette.semantic.background["background-inverse"],"brand-inverse":e=>e.palette.semantic.fill["fill-primary-strong"]},border:{neutral:e=>e.palette.semantic.stroke["stroke-weak"],brand:e=>e.palette.semantic.stroke["stroke-primary-weak"],destructive:e=>e.palette.semantic.stroke["stroke-error-weak"],warning:e=>e.palette.semantic.stroke["stroke-warning-weak"],success:e=>e.palette.semantic.stroke["stroke-success-weak"],information:e=>e.palette.semantic.stroke["stroke-information-weak"],"neutral-inverse":()=>"transparant","brand-inverse":()=>"transparant"},header:{neutral:e=>e.palette.semantic.text["text-strong"],brand:e=>e.palette.semantic.text["text-strong"],destructive:e=>e.palette.semantic.text["text-strong"],warning:e=>e.palette.semantic.text["text-strong"],success:e=>e.palette.semantic.text["text-strong"],information:e=>e.palette.semantic.text["text-strong"],"neutral-inverse":e=>e.palette.semantic.text["text-inverse-strong"],"brand-inverse":e=>e.palette.semantic.text["text-inverse-strong"]},text:{neutral:e=>e.palette.semantic.text["text-weak"],brand:e=>e.palette.semantic.text["text-weak"],destructive:e=>e.palette.semantic.text["text-weak"],warning:e=>e.palette.semantic.text["text-weak"],success:e=>e.palette.semantic.text["text-weak"],information:e=>e.palette.semantic.text["text-weak"],"neutral-inverse":e=>e.palette.semantic.text["text-inverse-weak"],"brand-inverse":e=>e.palette.semantic.text["text-inverse-weak"]}},k=(e,t)=>x[t](e),w=(e,t)=>f.background[t](e),b=(e,t)=>f.border[t](e),g=(e,t)=>f.header[t](e),v=(e,t)=>f.text[t](e),C=o(n)((()=>({marginTop:"16px"}))),y=o(r,{shouldForwardProp:e=>!["tone"].includes(e)})((({theme:e,tone:t})=>({backgroundColor:w(e,t),border:"1px solid",borderColor:b(e,t),color:v(e,t)}))),h=a((({title:a,description:r,tone:o="neutral",onClose:s,className:c,"data-testid":m,action:p})=>{const d=l();return e(y,{"aria-describedby":`alert-description-${m??"default"}`,"aria-labelledby":`alert-title-${m??"default"}`,className:c,"data-testid":m,icon:k(d,o),onClose:s,role:"alert",tone:o,children:[t(i,{color:g(d,o),id:`alert-title-${m??"default"}`,children:a}),t(n,{id:`alert-description-${m??"default"}`,children:r}),(()=>{if(!p)return null;const e=p["data-testid"]??`action-button-${p.label.replace(/\s+/g,"-").toLowerCase()}`;return t(C,{children:t(u,{"aria-label":`${p.label} - ${a}`,"data-testid":e,fdKey:p.label,onClick:p.onClick,size:"small",variant:p.type??"primary",children:p.label})})})()]})}));h.displayName="Alert";export{h as default};
 //# sourceMappingURL=index.js.map

package/dist/components/molecules/Alert/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/molecules/Alert/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n// eslint-disable-next-line @typescript-eslint/explicit-function-return-type\nimport { memo } from 'react';\n\nimport MuiAlert from '@mui/material/Alert';\nimport MuiAlertTitle from '@mui/material/AlertTitle';\nimport Box from '@mui/material/Box';\nimport { styled, type Theme, useTheme } from '@mui/material/styles';\n\nimport AlertIcon from '../../../icons/Alert';\nimport CancelCircleIcon from '../../../icons/CancelCircle';\nimport CheckmarkCircleIcon from '../../../icons/CheckmarkCircle';\nimport DiamondIcon from '../../../icons/Diamond';\nimport InformationCircleIcon from '../../../icons/InformationCircle';\nimport Button from '../../atoms/Button';\nimport type { ButtonType } from '../../atoms/Button/getButtonStyles';\n\n/** Visual tone of the alert */\nexport type AlertTones =\n  | 'brand-inverse'\n  | 'brand'\n  | 'destructive'\n  | 'information'\n  | 'neutral-inverse'\n  | 'neutral'\n  | 'success'\n  | 'warning';\n\n/** Props for the Alert component */\nexport interface AlertProps {\n  /** Main heading text of the alert */\n  title: string;\n  /** Detailed description text of the alert */\n  description: string;\n  /** Visual tone of the alert */\n  tone?: AlertTones;\n  /** Callback function when the alert is closed */\n  onClose?: () => void;\n  /** Action button configuration */\n  action?: {\n    /** Text label for the action button */\n    label: string;\n    /** Visual style of the action button */\n    type?: ButtonType;\n    /** Callback function when the action button is clicked */\n    onClick: () => void;\n    /** Test ID for the action button */\n    'data-testid'?: string;\n  };\n  /** Additional CSS class names */\n  className?: string;\n  /** Test ID for testing and automation */\n  'data-testid'?: string;\n}\n\nconst ICONS = {\n  neutral: (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-strong']} />,\n  brand: (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-primary']} />,\n  destructive: (theme: Theme) => <CancelCircleIcon color={theme.palette.semantic.icon['icon-error']} />,\n  warning: (theme: Theme) => <AlertIcon color={theme.palette.semantic.icon['icon-warning']} />,\n  information: (theme: Theme) => (\n    <InformationCircleIcon color={theme.palette.semantic.icon['icon-information']} />\n  ),\n  'neutral-inverse': (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-inverse']} />,\n  'brand-inverse': (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-inverse']} />,\n  success: (theme: Theme) => <CheckmarkCircleIcon color={theme.palette.semantic.icon['icon-success']} />,\n};\n\nconst COLOURS = {\n  background: {\n    neutral: (theme: Theme) => theme.palette.semantic.fill['fill-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.fill['fill-primary-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.fill['fill-error-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.fill['fill-warning-weak'],\n    success: (theme: Theme) => theme.palette.semantic.fill['fill-success-weak'],\n    information: (theme: Theme) => theme.palette.semantic.fill['fill-information-weak'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.background['background-inverse'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.fill['fill-primary-strong'],\n  },\n  border: {\n    neutral: (theme: Theme) => theme.palette.semantic.stroke['stroke-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.stroke['stroke-primary-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.stroke['stroke-error-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.stroke['stroke-warning-weak'],\n    success: (theme: Theme) => theme.palette.semantic.stroke['stroke-success-weak'],\n    information: (theme: Theme) => theme.palette.semantic.stroke['stroke-information-weak'],\n    'neutral-inverse': () => 'transparant',\n    'brand-inverse': () => 'transparant',\n  },\n  header: {\n    neutral: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    brand: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    destructive: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    warning: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    success: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    information: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-strong'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-strong'],\n  },\n  text: {\n    neutral: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    success: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    information: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-weak'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-weak'],\n  },\n};\n\nconst getIcon = (theme: Theme, tone: AlertTones): JSX.Element => {\n  return ICONS[tone](theme);\n};\n\nconst getBackgroundColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.background[tone](theme);\n};\n\nconst getBorderColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.border[tone](theme);\n};\n\nconst getHeaderColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.header[tone](theme);\n};\n\nconst getTextColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.text[tone](theme);\n};\n\ninterface StyledAlertProps {\n  tone: AlertTones;\n}\n\nconst StyledActionContainer = styled(Box)(() => ({\n  marginTop: '16px',\n}));\n\nconst StyledAlert = styled(MuiAlert, {\n  shouldForwardProp: (prop) => !['tone'].includes(prop as string),\n})<StyledAlertProps>(({ theme, tone }) => ({\n  backgroundColor: getBackgroundColour(theme, tone),\n  border: '1px solid',\n  borderColor: getBorderColour(theme, tone),\n  color: getTextColour(theme, tone),\n}));\n\n/**\n * Alert component is used to display important messages or notifications to users.\n * It supports different visual tones to convey different semantic meanings and can include\n * an optional action button and close button.\n *\n * The component is wrapped with React.memo to optimize performance by preventing unnecessary\n * re-renders when the component's props haven't changed, which is beneficial for components\n * that may be used frequently throughout the application.\n */\nconst Alert = memo(\n  ({\n    title,\n    description,\n    tone = 'neutral',\n    onClose,\n    className,\n    'data-testid': dataTestId,\n    action,\n  }: AlertProps) => {\n    const theme = useTheme();\n\n    const renderAction = (): JSX.Element | null => {\n      if (!action) {\n        return null;\n      }\n\n      const actionTestId =\n        action['data-testid'] ?? `action-button-${action.label.replace(/\\s+/g, '-').toLowerCase()}`;\n\n      return (\n        <StyledActionContainer>\n          <Button\n            aria-label={`${action.label} - ${title}`}\n            data-testid={actionTestId}\n            fdKey={action.label}\n            size=\"small\"\n            variant={action.type ?? 'primary'}\n            onClick={action.onClick}\n          >\n            {action.label}\n          </Button>\n        </StyledActionContainer>\n      );\n    };\n\n    return (\n      <StyledAlert\n        aria-describedby={`alert-description-${dataTestId ?? 'default'}`}\n        aria-labelledby={`alert-title-${dataTestId ?? 'default'}`}\n        className={className}\n        data-testid={dataTestId}\n        icon={getIcon(theme, tone)}\n        role=\"alert\"\n        tone={tone}\n        onClose={onClose}\n      >\n        <MuiAlertTitle color={getHeaderColour(theme, tone)} id={`alert-title-${dataTestId ?? 'default'}`}>\n          {title}\n        </MuiAlertTitle>\n        <Box id={`alert-description-${dataTestId ?? 'default'}`}>{description}</Box>\n        {renderAction()}\n      </StyledAlert>\n    );\n  },\n);\n\nAlert.displayName = 'Alert';\n\nexport default Alert;\n"],"names":["ICONS","neutral","theme","_jsx","DiamondIcon","color","palette","semantic","icon","brand","destructive","CancelCircleIcon","warning","AlertIcon","information","InformationCircleIcon","success","CheckmarkCircleIcon","COLOURS","background","fill","border","stroke","header","text","getIcon","tone","getBackgroundColour","getBorderColour","getHeaderColour","getTextColour","StyledActionContainer","styled","Box","marginTop","StyledAlert","MuiAlert","shouldForwardProp","prop","includes","backgroundColor","borderColor","Alert","memo","title","description","onClose","className","dataTestId","action","useTheme","_jsxs","role","children","MuiAlertTitle","id","actionTestId","label","replace","toLowerCase","Button","fdKey","size","variant","type","onClick","renderAction","displayName"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/molecules/Alert/index.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n// eslint-disable-next-line @typescript-eslint/explicit-function-return-type\nimport { memo } from 'react';\n\nimport MuiAlert from '@mui/material/Alert';\nimport MuiAlertTitle from '@mui/material/AlertTitle';\nimport Box from '@mui/material/Box';\nimport { styled, type Theme, useTheme } from '@mui/material/styles';\n\nimport AlertIcon from '../../../icons/Alert';\nimport CancelCircleIcon from '../../../icons/CancelCircle';\nimport CheckmarkCircleIcon from '../../../icons/CheckmarkCircle';\nimport DiamondIcon from '../../../icons/Diamond';\nimport InformationCircleIcon from '../../../icons/InformationCircle';\nimport Button from '../../atoms/Button';\nimport type { ButtonType } from '../../atoms/Button/getButtonStyles';\n\n/** Visual tone of the alert */\nexport type AlertTones =\n  | 'brand-inverse'\n  | 'brand'\n  | 'destructive'\n  | 'information'\n  | 'neutral-inverse'\n  | 'neutral'\n  | 'success'\n  | 'warning';\n\n/** Props for the Alert component */\nexport interface AlertProps {\n  /** Main heading text of the alert */\n  title: string;\n  /** Detailed description text of the alert */\n  description: string;\n  /** Visual tone of the alert */\n  tone?: AlertTones;\n  /** Callback function when the alert is closed */\n  onClose?: () => void;\n  /** Action button configuration */\n  action?: {\n    /** Text label for the action button */\n    label: string;\n    /** Visual style of the action button */\n    type?: ButtonType;\n    /** Callback function when the action button is clicked */\n    onClick: () => void;\n    /** Test ID for the action button */\n    'data-testid'?: string;\n  };\n  /** Additional CSS class names */\n  className?: string;\n  /** Test ID for testing and automation */\n  'data-testid'?: string;\n}\n\nconst ICONS = {\n  neutral: (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-strong']} />,\n  brand: (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-primary']} />,\n  destructive: (theme: Theme) => <CancelCircleIcon color={theme.palette.semantic.icon['icon-error']} />,\n  warning: (theme: Theme) => <AlertIcon color={theme.palette.semantic.icon['icon-warning']} />,\n  information: (theme: Theme) => (\n    <InformationCircleIcon color={theme.palette.semantic.icon['icon-information']} />\n  ),\n  'neutral-inverse': (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-inverse']} />,\n  'brand-inverse': (theme: Theme) => <DiamondIcon color={theme.palette.semantic.icon['icon-inverse']} />,\n  success: (theme: Theme) => <CheckmarkCircleIcon color={theme.palette.semantic.icon['icon-success']} />,\n};\n\nconst COLOURS = {\n  background: {\n    neutral: (theme: Theme) => theme.palette.semantic.fill['fill-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.fill['fill-primary-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.fill['fill-error-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.fill['fill-warning-weak'],\n    success: (theme: Theme) => theme.palette.semantic.fill['fill-success-weak'],\n    information: (theme: Theme) => theme.palette.semantic.fill['fill-information-weak'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.background['background-inverse'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.fill['fill-primary-strong'],\n  },\n  border: {\n    neutral: (theme: Theme) => theme.palette.semantic.stroke['stroke-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.stroke['stroke-primary-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.stroke['stroke-error-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.stroke['stroke-warning-weak'],\n    success: (theme: Theme) => theme.palette.semantic.stroke['stroke-success-weak'],\n    information: (theme: Theme) => theme.palette.semantic.stroke['stroke-information-weak'],\n    'neutral-inverse': () => 'transparant',\n    'brand-inverse': () => 'transparant',\n  },\n  header: {\n    neutral: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    brand: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    destructive: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    warning: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    success: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    information: (theme: Theme) => theme.palette.semantic.text['text-strong'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-strong'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-strong'],\n  },\n  text: {\n    neutral: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    brand: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    destructive: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    warning: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    success: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    information: (theme: Theme) => theme.palette.semantic.text['text-weak'],\n    'neutral-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-weak'],\n    'brand-inverse': (theme: Theme) => theme.palette.semantic.text['text-inverse-weak'],\n  },\n};\n\nconst getIcon = (theme: Theme, tone: AlertTones): JSX.Element => {\n  return ICONS[tone](theme);\n};\n\nconst getBackgroundColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.background[tone](theme);\n};\n\nconst getBorderColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.border[tone](theme);\n};\n\nconst getHeaderColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.header[tone](theme);\n};\n\nconst getTextColour = (theme: Theme, tone: AlertTones): string => {\n  return COLOURS.text[tone](theme);\n};\n\ninterface StyledAlertProps {\n  tone: AlertTones;\n}\n\nconst StyledActionContainer = styled(Box)(() => ({\n  marginTop: '16px',\n}));\n\nconst StyledAlert = styled(MuiAlert, {\n  shouldForwardProp: (prop) => !['tone'].includes(prop as string),\n})<StyledAlertProps>(({ theme, tone }) => ({\n  backgroundColor: getBackgroundColour(theme, tone),\n  border: '1px solid',\n  borderColor: getBorderColour(theme, tone),\n  color: getTextColour(theme, tone),\n}));\n\n/**\n * Alert component is used to display important messages or notifications to users.\n * It supports different visual tones to convey different semantic meanings and can include\n * an optional action button and close button.\n *\n * The component is wrapped with React.memo to optimize performance by preventing unnecessary\n * re-renders when the component's props haven't changed, which is beneficial for components\n * that may be used frequently throughout the application.\n */\nconst Alert = memo(\n  ({\n    title,\n    description,\n    tone = 'neutral',\n    onClose,\n    className,\n    'data-testid': dataTestId,\n    action,\n  }: AlertProps) => {\n    const theme = useTheme();\n\n    const renderAction = (): JSX.Element | null => {\n      if (!action) {\n        return null;\n      }\n\n      const actionTestId =\n        action['data-testid'] ?? `action-button-${action.label.replace(/\\s+/g, '-').toLowerCase()}`;\n\n      return (\n        <StyledActionContainer>\n          <Button\n            aria-label={`${action.label} - ${title}`}\n            data-testid={actionTestId}\n            fdKey={action.label}\n            onClick={action.onClick}\n            size=\"small\"\n            variant={action.type ?? 'primary'}\n          >\n            {action.label}\n          </Button>\n        </StyledActionContainer>\n      );\n    };\n\n    return (\n      <StyledAlert\n        aria-describedby={`alert-description-${dataTestId ?? 'default'}`}\n        aria-labelledby={`alert-title-${dataTestId ?? 'default'}`}\n        className={className}\n        data-testid={dataTestId}\n        icon={getIcon(theme, tone)}\n        onClose={onClose}\n        role=\"alert\"\n        tone={tone}\n      >\n        <MuiAlertTitle color={getHeaderColour(theme, tone)} id={`alert-title-${dataTestId ?? 'default'}`}>\n          {title}\n        </MuiAlertTitle>\n        <Box id={`alert-description-${dataTestId ?? 'default'}`}>{description}</Box>\n        {renderAction()}\n      </StyledAlert>\n    );\n  },\n);\n\nAlert.displayName = 'Alert';\n\nexport default Alert;\n"],"names":["ICONS","neutral","theme","_jsx","DiamondIcon","color","palette","semantic","icon","brand","destructive","CancelCircleIcon","warning","AlertIcon","information","InformationCircleIcon","success","CheckmarkCircleIcon","COLOURS","background","fill","border","stroke","header","text","getIcon","tone","getBackgroundColour","getBorderColour","getHeaderColour","getTextColour","StyledActionContainer","styled","Box","marginTop","StyledAlert","MuiAlert","shouldForwardProp","prop","includes","backgroundColor","borderColor","Alert","memo","title","description","onClose","className","dataTestId","action","useTheme","_jsxs","role","children","MuiAlertTitle","id","actionTestId","label","replace","toLowerCase","Button","fdKey","onClick","size","variant","type","renderAction","displayName"],"mappings":"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"}