npm - @flipdish/portal-library - Versions diffs - 8.5.7 → 8.6.0 - Mend

@flipdish/portal-library 8.5.7 → 8.6.0

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

Files changed (2302) hide show

package/dist/components/organisms/FileUpload/components/FileItem.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileItem.cjs.js","sources":["../../../../../src/components/organisms/FileUpload/components/FileItem.tsx"],"sourcesContent":["import React from 'react';\n\nimport Box from '@mui/material/Box';\nimport styled from '@mui/material/styles/styled';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport IconButton from '@fd/components/atoms/IconButton';\nimport LinearProgress from '@fd/components/atoms/LinearProgress';\nimport Typography from '@fd/components/atoms/Typography';\nimport CancelIcon from '@fd/icons/Cancel';\nimport { useTranslation } from '@fd/providers/TranslationProvider';\n\nimport FileThumbnail from './FileThumbnail';\n\nconst StyledFileItemContainer = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'hasError',\n})<{ hasError?: boolean }>(({ theme, hasError }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(2),\n padding: theme.spacing(2),\n borderBottom: `1px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n backgroundColor: hasError\n ? theme.palette.semantic.fill['fill-error-weak']\n : theme.palette.semantic.background['background-raised'],\n}));\n\nconst StyledFileItemInformationContainer = styled(Box)(({ theme }) => ({\n flex: 1,\n display: 'flex',\n flexDirection: 'row',\n gap: theme.spacing(1),\n overflow: 'hidden',\n minWidth: 0,\n}));\n\nconst StyledFileItemInformationContent = styled(Box)(() => ({\n flex: 1,\n display: 'flex',\n overflow: 'hidden',\n flexDirection: 'column',\n minWidth: 0,\n}));\n\nconst StyledFileItemContent = styled(Box)(() => ({\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'flex-end',\n}));\nconst StyledFileName = styled(Typography)(() => ({\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n}));\n\nconst StyledLinearProgress = styled(LinearProgress)({\n width: '250px',\n});\n\nexport interface FileItemProps {\n file: File;\n error?: string \| null;\n isUploading?: boolean;\n onRemove: (file: File) => void;\n}\n\nconst FileItem: React.FC<FileItemProps> = ({ file, error = null, isUploading = false, onRemove }) => {\n const theme = useTheme();\n const { translate } = useTranslation();\n\n const handleRemoveClick = (): void => {\n onRemove(file);\n };\n\n const formatFileSize = (bytes: number): string => {\n if (bytes === 0) return '0 Bytes';\n const k = 1024;\n const sizes = ['B', 'KB', 'MB', 'GB'];\n const i = Math.floor(Math.log(bytes) / Math.log(k));\n return `${Math.round((bytes / Math.pow(k, i)) * 100) / 100} ${sizes[i]}`;\n };\n\n return (\n <StyledFileItemContainer hasError={!!error}>\n <FileThumbnail file={file} />\n\n <StyledFileItemInformationContainer>\n <StyledFileItemInformationContent>\n <StyledFileName color={theme.palette.semantic.text['text-strong']} variant=\"captionWeak\">\n {file.name}\n </StyledFileName>\n <Typography color={theme.palette.semantic.text['text-weak']} variant=\"captionWeak\">\n {formatFileSize(file.size)}\n </Typography>\n </StyledFileItemInformationContent>\n\n <StyledFileItemContent>\n {error && (\n <Typography color={theme.palette.semantic.text['text-error']} variant=\"captionWeak\">\n {error}\n </Typography>\n )}\n {isUploading && <StyledLinearProgress />}\n </StyledFileItemContent>\n </StyledFileItemInformationContainer>\n\n <IconButton\n aria-label={translate('Remove_file')}\n onClick={handleRemoveClick}\n size=\"small\"\n tone=\"neutral\"\n variant=\"tertiary\"\n >\n <CancelIcon />\n </IconButton>\n </StyledFileItemContainer>\n );\n};\n\nexport default FileItem;\n"],"names":["StyledFileItemContainer","styled","Box","shouldForwardProp","prop","theme","hasError","display","alignItems","gap","spacing","padding","borderBottom","palette","semantic","stroke","backgroundColor","fill","background","StyledFileItemInformationContainer","flex","flexDirection","overflow","minWidth","StyledFileItemInformationContent","StyledFileItemContent","justifyContent","StyledFileName","Typography","textOverflow","whiteSpace","StyledLinearProgress","LinearProgress","width","file","error","isUploading","onRemove","useTheme","translate","useTranslation","_jsxs","children","_jsx","FileThumbnail","color","text","variant","name","bytes","i","Math","floor","log","round","pow","formatFileSize","size","IconButton","onClick","tone","CancelIcon"],"mappings":"+dAcA,MAAMA,EAA0BC,EAAOC,EAAK,CAC1CC,kBAAoBC,GAAkB,aAATA,GADCH,~~EAEL~~,EAAGI,QAAOC,eAAU,CAC7CC,QAAS,OACTC,WAAY,SACZC,IAAKJ,EAAMK,QAAQ,GACnBC,QAASN,EAAMK,QAAQ,GACvBE,aAAc,aAAaP,EAAMQ,QAAQC,SAASC,OAAO,iBACzDC,gBAAiBV,EACbD,EAAMQ,QAAQC,SAASG,KAAK,mBAC5BZ,EAAMQ,QAAQC,SAASI,WAAW,~~yBAGlCC~~,EAAqClB,EAAOC,EAAPD,~~EAAY~~,EAAGI,YAAO,CAC/De,KAAM,EACNb,QAAS,OACTc,cAAe,MACfZ,IAAKJ,EAAMK,QAAQ,GACnBY,SAAU,SACVC,SAAU,~~MAGNC~~,EAAmCvB,EAAOC,EAAPD,~~EAAY~~,KAAA,CACnDmB,KAAM,EACNb,QAAS,OACTe,SAAU,SACVD,cAAe,SACfE,SAAU,~~MAGNE~~,EAAwBxB,EAAOC,EAAPD,~~EAAY~~,KAAA,CACxCM,QAAS,OACTc,cAAe,MACfb,WAAY,SACZkB,eAAgB,~~eAEZC~~,EAAiB1B,EAAO2B,EAAP3B,~~EAAmB~~,KAAA,CACxCqB,SAAU,SACVO,aAAc,WACdC,WAAY,~~aAGRC~~,EAAuB9B,EAAO+B,EAAAA,eAAP/B,CAAuB,CAClDgC,MAAO,yBAUiC,EAAGC,OAAMC,QAAQ,KAAMC,eAAc,EAAOC,eACpF,MAAMhC,EAAQiC,KACRC,UAAEA,GAAcC,mBActB,OACEC,OAACzC,EAAuB,CAACM,WAAY6B,EAAKO,SAAA,CACxCC,EAAAA,IAACC,EAAa,CAACV,KAAMA,IAErBO,OAACtB,EAAkC,CAAAuB,SAAA,CACjCD,EAAAA,KAACjB,EAAgC,CAAAkB,SAAA,CAC/BC,MAAChB,EAAc,CAACkB,MAAOxC,EAAMQ,QAAQC,SAASgC,KAAK,eAAgBC,QAAQ,cAAaL,SACrFR,EAAKc,OAERL,EAAAA,IAACf,GAAWiB,MAAOxC,EAAMQ,QAAQC,SAASgC,KAAK,aAAcC,QAAQ,cAAaL,SAjBnE,CAACO,IACtB,GAAc,IAAVA,EAAa,MAAO,UACxB,MAEMC,EAAIC,KAAKC,MAAMD,KAAKE,IAAIJ,GAASE,KAAKE,IAFlC,OAGV,MAAO,GAAGF,KAAKG,MAAOL,EAAQE,KAAKI,IAHzB,KAGgCL,GAAM,KAAO,OAFzC,CAAC,IAAK,KAAM,KAAM,MAEoCA,MAa3DM,CAAetB,EAAKuB,WAIzBhB,EAAAA,KAAChB,EAAqB,CAAAiB,SAAA,CACnBP,GACCQ,EAAAA,IAACf,EAAU,CAACiB,MAAOxC,EAAMQ,QAAQC,SAASgC,KAAK,cAAeC,QAAQ,cAAaL,SAChFP,IAGJC,GAAeO,EAAAA,IAACZ,EAAoB,CAAA,SAIzCY,EAAAA,IAACe,EAAAA,WAAU,CAAA,aACGnB,EAAU,eACtBoB,QAtCoB,KACxBtB,EAASH,IAsCLuB,KAAK,QACLG,KAAK,UACLb,QAAQ,WAAUL,SAElBC,EAAAA,IAACkB,EAAU,CAAA"}
1	+ {"version":3,"file":"FileItem.cjs.js","sources":["../../../../../src/components/organisms/FileUpload/components/FileItem.tsx"],"sourcesContent":["import React from 'react';\n\nimport Box from '@mui/material/Box';\nimport styled from '@mui/material/styles/styled';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport IconButton from '@fd/components/atoms/IconButton';\nimport LinearProgress from '@fd/components/atoms/LinearProgress';\nimport Typography from '@fd/components/atoms/Typography';\nimport CancelIcon from '@fd/icons/Cancel';\nimport { useTranslation } from '@fd/providers/TranslationProvider';\n\nimport FileThumbnail from './FileThumbnail';\n\nconst StyledFileItemContainer = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'hasError',\n})<{ hasError?: boolean }>(({ theme, hasError }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(2),\n padding: theme.spacing(2),\n borderBottom: `1px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n backgroundColor: hasError\n ? theme.palette.semantic.fill['fill-error-weak']\n : theme.palette.semantic.background['background-raised'],\n}));\n\nconst StyledFileItemInformationContainer = styled(Box)(({ theme }) => ({\n flex: 1,\n display: 'flex',\n flexDirection: 'row',\n gap: theme.spacing(1),\n overflow: 'hidden',\n minWidth: 0,\n}));\n\nconst StyledFileItemInformationContent = styled(Box)(() => ({\n flex: 1,\n display: 'flex',\n overflow: 'hidden',\n flexDirection: 'column',\n minWidth: 0,\n}));\n\nconst StyledFileItemContent = styled(Box)(() => ({\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'flex-end',\n}));\nconst StyledFileName = styled(Typography)(() => ({\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n}));\n\nconst StyledLinearProgress = styled(LinearProgress)({\n width: '250px',\n});\n\nexport interface FileItemProps {\n file: File;\n error?: string \| null;\n isUploading?: boolean;\n onRemove: (file: File) => void;\n}\n\nconst FileItem: React.FC<FileItemProps> = ({ file, error = null, isUploading = false, onRemove }) => {\n const theme = useTheme();\n const { translate } = useTranslation();\n\n const handleRemoveClick = (): void => {\n onRemove(file);\n };\n\n const formatFileSize = (bytes: number): string => {\n if (bytes === 0) return '0 Bytes';\n const k = 1024;\n const sizes = ['B', 'KB', 'MB', 'GB'];\n const i = Math.floor(Math.log(bytes) / Math.log(k));\n return `${Math.round((bytes / Math.pow(k, i)) * 100) / 100} ${sizes[i]}`;\n };\n\n return (\n <StyledFileItemContainer hasError={!!error}>\n <FileThumbnail file={file} />\n\n <StyledFileItemInformationContainer>\n <StyledFileItemInformationContent>\n <StyledFileName color={theme.palette.semantic.text['text-strong']} variant=\"captionWeak\">\n {file.name}\n </StyledFileName>\n <Typography color={theme.palette.semantic.text['text-weak']} variant=\"captionWeak\">\n {formatFileSize(file.size)}\n </Typography>\n </StyledFileItemInformationContent>\n\n <StyledFileItemContent>\n {error && (\n <Typography color={theme.palette.semantic.text['text-error']} variant=\"captionWeak\">\n {error}\n </Typography>\n )}\n {isUploading && <StyledLinearProgress />}\n </StyledFileItemContent>\n </StyledFileItemInformationContainer>\n\n <IconButton\n aria-label={translate('Remove_file')}\n onClick={handleRemoveClick}\n size=\"small\"\n tone=\"neutral\"\n variant=\"tertiary\"\n >\n <CancelIcon />\n </IconButton>\n </StyledFileItemContainer>\n );\n};\n\nexport default FileItem;\n"],"names":["StyledFileItemContainer","styled","Box","shouldForwardProp","prop","theme","hasError","display","alignItems","gap","spacing","padding","borderBottom","palette","semantic","stroke","backgroundColor","fill","background","StyledFileItemInformationContainer","flex","flexDirection","overflow","minWidth","StyledFileItemInformationContent","StyledFileItemContent","justifyContent","StyledFileName","Typography","textOverflow","whiteSpace","StyledLinearProgress","LinearProgress","width","file","error","isUploading","onRemove","useTheme","translate","useTranslation","_jsxs","children","_jsx","FileThumbnail","color","text","variant","name","bytes","i","Math","floor","log","round","pow","formatFileSize","size","IconButton","onClick","tone","CancelIcon"],"mappings":"+dAcA,MAAMA,EAA0BC,EAAOC,EAAK,CAC1CC,kBAAoBC,GAAkB,aAATA,GADCH,CAEL,EAAGI,QAAOC,eAAU,CAC7CC,QAAS,OACTC,WAAY,SACZC,IAAKJ,EAAMK,QAAQ,GACnBC,QAASN,EAAMK,QAAQ,GACvBE,aAAc,aAAaP,EAAMQ,QAAQC,SAASC,OAAO,iBACzDC,gBAAiBV,EACbD,EAAMQ,QAAQC,SAASG,KAAK,mBAC5BZ,EAAMQ,QAAQC,SAASI,WAAW,wBAGlCC,EAAqClB,EAAOC,EAAPD,CAAY,EAAGI,YAAO,CAC/De,KAAM,EACNb,QAAS,OACTc,cAAe,MACfZ,IAAKJ,EAAMK,QAAQ,GACnBY,SAAU,SACVC,SAAU,KAGNC,EAAmCvB,EAAOC,EAAPD,CAAY,KAAA,CACnDmB,KAAM,EACNb,QAAS,OACTe,SAAU,SACVD,cAAe,SACfE,SAAU,KAGNE,EAAwBxB,EAAOC,EAAPD,CAAY,KAAA,CACxCM,QAAS,OACTc,cAAe,MACfb,WAAY,SACZkB,eAAgB,cAEZC,EAAiB1B,EAAO2B,EAAP3B,CAAmB,KAAA,CACxCqB,SAAU,SACVO,aAAc,WACdC,WAAY,YAGRC,EAAuB9B,EAAO+B,EAAAA,eAAP/B,CAAuB,CAClDgC,MAAO,yBAUiC,EAAGC,OAAMC,QAAQ,KAAMC,eAAc,EAAOC,eACpF,MAAMhC,EAAQiC,KACRC,UAAEA,GAAcC,mBActB,OACEC,OAACzC,EAAuB,CAACM,WAAY6B,EAAKO,SAAA,CACxCC,EAAAA,IAACC,EAAa,CAACV,KAAMA,IAErBO,OAACtB,EAAkC,CAAAuB,SAAA,CACjCD,EAAAA,KAACjB,EAAgC,CAAAkB,SAAA,CAC/BC,MAAChB,EAAc,CAACkB,MAAOxC,EAAMQ,QAAQC,SAASgC,KAAK,eAAgBC,QAAQ,cAAaL,SACrFR,EAAKc,OAERL,EAAAA,IAACf,GAAWiB,MAAOxC,EAAMQ,QAAQC,SAASgC,KAAK,aAAcC,QAAQ,cAAaL,SAjBnE,CAACO,IACtB,GAAc,IAAVA,EAAa,MAAO,UACxB,MAEMC,EAAIC,KAAKC,MAAMD,KAAKE,IAAIJ,GAASE,KAAKE,IAFlC,OAGV,MAAO,GAAGF,KAAKG,MAAOL,EAAQE,KAAKI,IAHzB,KAGgCL,GAAM,KAAO,OAFzC,CAAC,IAAK,KAAM,KAAM,MAEoCA,MAa3DM,CAAetB,EAAKuB,WAIzBhB,EAAAA,KAAChB,EAAqB,CAAAiB,SAAA,CACnBP,GACCQ,EAAAA,IAACf,EAAU,CAACiB,MAAOxC,EAAMQ,QAAQC,SAASgC,KAAK,cAAeC,QAAQ,cAAaL,SAChFP,IAGJC,GAAeO,EAAAA,IAACZ,EAAoB,CAAA,SAIzCY,EAAAA,IAACe,EAAAA,WAAU,CAAA,aACGnB,EAAU,eACtBoB,QAtCoB,KACxBtB,EAASH,IAsCLuB,KAAK,QACLG,KAAK,UACLb,QAAQ,WAAUL,SAElBC,EAAAA,IAACkB,EAAU,CAAA"}

package/dist/components/organisms/FileUpload/components/FileItem.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as r}from"react/jsx-runtime";import"react";import t from"@mui/material/Box";import i from"@mui/material/styles/styled";import o from"@mui/material/styles/useTheme";import{IconButton as a}from"../../../atoms/IconButton/index.js";import{LinearProgress as l}from"../../../atoms/LinearProgress/index.js";import n from"@mui/material/Typography";import s from"../../../../icons/Cancel/index.js";import{useTranslation as m}from"../../../../providers/TranslationProvider.js";import c from"./FileThumbnail.js";const p=i(t,{shouldForwardProp:e=>"hasError"!==e})((({theme:e,hasError:r})=>({display:"flex",alignItems:"center",gap:e.spacing(2),padding:e.spacing(2),borderBottom:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`,backgroundColor:r?e.palette.semantic.fill["fill-error-weak"]:e.palette.semantic.background["background-raised"]}))),d=i(t)((({theme:e})=>({flex:1,display:"flex",flexDirection:"row",gap:e.spacing(1),overflow:"hidden",minWidth:0}))),f=i(t)((()=>({flex:1,display:"flex",overflow:"hidden",flexDirection:"column",minWidth:0}))),h=i(t)((()=>({display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"flex-end"}))),x=i(n)((()=>({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}))),u=i(l)({width:"250px"}),g=({file:t,error:i=null,isUploading:l=!1,onRemove:g})=>{const w=o(),{translate:k}=m();return e(p,{hasError:!!i,children:[r(c,{file:t}),e(d,{children:[e(f,{children:[r(x,{color:w.palette.semantic.text["text-strong"],variant:"captionWeak",children:t.name}),r(n,{color:w.palette.semantic.text["text-weak"],variant:"captionWeak",children:(e=>{if(0===e)return"0 Bytes";const r=Math.floor(Math.log(e)/Math.log(1024));return`${Math.round(e/Math.pow(1024,r)*100)/100} ${["B","KB","MB","GB"][r]}`})(t.size)})]}),e(h,{children:[i&&r(n,{color:w.palette.semantic.text["text-error"],variant:"captionWeak",children:i}),l&&r(u,{})]})]}),r(a,{"aria-label":k("Remove_file"),onClick:()=>{g(t)},size:"small",tone:"neutral",variant:"tertiary",children:r(s,{})})]})};export{g as default};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import"react";import t from"@mui/material/Box";import i from"@mui/material/styles/styled";import o from"@mui/material/styles/useTheme";import{IconButton as a}from"../../../atoms/IconButton/index.js";import{LinearProgress as l}from"../../../atoms/LinearProgress/index.js";import n from"@mui/material/Typography";import s from"../../../../icons/Cancel/index.js";import{useTranslation as m}from"../../../../providers/TranslationProvider.js";import c from"./FileThumbnail.js";const p=i(t,{shouldForwardProp:e=>"hasError"!==e})(({theme:e,hasError:r})=>({display:"flex",alignItems:"center",gap:e.spacing(2),padding:e.spacing(2),borderBottom:`1px solid ${e.palette.semantic.stroke["stroke-weak"]}`,backgroundColor:r?e.palette.semantic.fill["fill-error-weak"]:e.palette.semantic.background["background-raised"]})),d=i(t)(({theme:e})=>({flex:1,display:"flex",flexDirection:"row",gap:e.spacing(1),overflow:"hidden",minWidth:0})),f=i(t)(()=>({flex:1,display:"flex",overflow:"hidden",flexDirection:"column",minWidth:0})),h=i(t)(()=>({display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"flex-end"})),x=i(n)(()=>({overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"})),u=i(l)({width:"250px"}),g=({file:t,error:i=null,isUploading:l=!1,onRemove:g})=>{const w=o(),{translate:k}=m();return e(p,{hasError:!!i,children:[r(c,{file:t}),e(d,{children:[e(f,{children:[r(x,{color:w.palette.semantic.text["text-strong"],variant:"captionWeak",children:t.name}),r(n,{color:w.palette.semantic.text["text-weak"],variant:"captionWeak",children:(e=>{if(0===e)return"0 Bytes";const r=Math.floor(Math.log(e)/Math.log(1024));return`${Math.round(e/Math.pow(1024,r)*100)/100} ${["B","KB","MB","GB"][r]}`})(t.size)})]}),e(h,{children:[i&&r(n,{color:w.palette.semantic.text["text-error"],variant:"captionWeak",children:i}),l&&r(u,{})]})]}),r(a,{"aria-label":k("Remove_file"),onClick:()=>{g(t)},size:"small",tone:"neutral",variant:"tertiary",children:r(s,{})})]})};export{g as default};
 //# sourceMappingURL=FileItem.js.map

package/dist/components/organisms/FileUpload/components/FileItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileItem.js","sources":["../../../../../src/components/organisms/FileUpload/components/FileItem.tsx"],"sourcesContent":["import React from 'react';\n\nimport Box from '@mui/material/Box';\nimport styled from '@mui/material/styles/styled';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport IconButton from '@fd/components/atoms/IconButton';\nimport LinearProgress from '@fd/components/atoms/LinearProgress';\nimport Typography from '@fd/components/atoms/Typography';\nimport CancelIcon from '@fd/icons/Cancel';\nimport { useTranslation } from '@fd/providers/TranslationProvider';\n\nimport FileThumbnail from './FileThumbnail';\n\nconst StyledFileItemContainer = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'hasError',\n})<{ hasError?: boolean }>(({ theme, hasError }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(2),\n padding: theme.spacing(2),\n borderBottom: `1px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n backgroundColor: hasError\n ? theme.palette.semantic.fill['fill-error-weak']\n : theme.palette.semantic.background['background-raised'],\n}));\n\nconst StyledFileItemInformationContainer = styled(Box)(({ theme }) => ({\n flex: 1,\n display: 'flex',\n flexDirection: 'row',\n gap: theme.spacing(1),\n overflow: 'hidden',\n minWidth: 0,\n}));\n\nconst StyledFileItemInformationContent = styled(Box)(() => ({\n flex: 1,\n display: 'flex',\n overflow: 'hidden',\n flexDirection: 'column',\n minWidth: 0,\n}));\n\nconst StyledFileItemContent = styled(Box)(() => ({\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'flex-end',\n}));\nconst StyledFileName = styled(Typography)(() => ({\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n}));\n\nconst StyledLinearProgress = styled(LinearProgress)({\n width: '250px',\n});\n\nexport interface FileItemProps {\n file: File;\n error?: string \| null;\n isUploading?: boolean;\n onRemove: (file: File) => void;\n}\n\nconst FileItem: React.FC<FileItemProps> = ({ file, error = null, isUploading = false, onRemove }) => {\n const theme = useTheme();\n const { translate } = useTranslation();\n\n const handleRemoveClick = (): void => {\n onRemove(file);\n };\n\n const formatFileSize = (bytes: number): string => {\n if (bytes === 0) return '0 Bytes';\n const k = 1024;\n const sizes = ['B', 'KB', 'MB', 'GB'];\n const i = Math.floor(Math.log(bytes) / Math.log(k));\n return `${Math.round((bytes / Math.pow(k, i)) * 100) / 100} ${sizes[i]}`;\n };\n\n return (\n <StyledFileItemContainer hasError={!!error}>\n <FileThumbnail file={file} />\n\n <StyledFileItemInformationContainer>\n <StyledFileItemInformationContent>\n <StyledFileName color={theme.palette.semantic.text['text-strong']} variant=\"captionWeak\">\n {file.name}\n </StyledFileName>\n <Typography color={theme.palette.semantic.text['text-weak']} variant=\"captionWeak\">\n {formatFileSize(file.size)}\n </Typography>\n </StyledFileItemInformationContent>\n\n <StyledFileItemContent>\n {error && (\n <Typography color={theme.palette.semantic.text['text-error']} variant=\"captionWeak\">\n {error}\n </Typography>\n )}\n {isUploading && <StyledLinearProgress />}\n </StyledFileItemContent>\n </StyledFileItemInformationContainer>\n\n <IconButton\n aria-label={translate('Remove_file')}\n onClick={handleRemoveClick}\n size=\"small\"\n tone=\"neutral\"\n variant=\"tertiary\"\n >\n <CancelIcon />\n </IconButton>\n </StyledFileItemContainer>\n );\n};\n\nexport default FileItem;\n"],"names":["StyledFileItemContainer","styled","Box","shouldForwardProp","prop","theme","hasError","display","alignItems","gap","spacing","padding","borderBottom","palette","semantic","stroke","backgroundColor","fill","background","StyledFileItemInformationContainer","flex","flexDirection","overflow","minWidth","StyledFileItemInformationContent","StyledFileItemContent","justifyContent","StyledFileName","Typography","textOverflow","whiteSpace","StyledLinearProgress","LinearProgress","width","FileItem","file","error","isUploading","onRemove","useTheme","translate","useTranslation","_jsxs","children","_jsx","FileThumbnail","color","text","variant","name","bytes","i","Math","floor","log","round","pow","formatFileSize","size","IconButton","onClick","tone","CancelIcon"],"mappings":"0gBAcA,MAAMA,EAA0BC,EAAOC,EAAK,CAC1CC,kBAAoBC,GAAkB,aAATA,GADCH,~~EAEL~~,EAAGI,QAAOC,eAAU,CAC7CC,QAAS,OACTC,WAAY,SACZC,IAAKJ,EAAMK,QAAQ,GACnBC,QAASN,EAAMK,QAAQ,GACvBE,aAAc,aAAaP,EAAMQ,QAAQC,SAASC,OAAO,iBACzDC,gBAAiBV,EACbD,EAAMQ,QAAQC,SAASG,KAAK,mBAC5BZ,EAAMQ,QAAQC,SAASI,WAAW,~~yBAGlCC~~,EAAqClB,EAAOC,EAAPD,~~EAAY~~,EAAGI,YAAO,CAC/De,KAAM,EACNb,QAAS,OACTc,cAAe,MACfZ,IAAKJ,EAAMK,QAAQ,GACnBY,SAAU,SACVC,SAAU,~~MAGNC~~,EAAmCvB,EAAOC,EAAPD,~~EAAY~~,KAAA,CACnDmB,KAAM,EACNb,QAAS,OACTe,SAAU,SACVD,cAAe,SACfE,SAAU,~~MAGNE~~,EAAwBxB,EAAOC,EAAPD,~~EAAY~~,KAAA,CACxCM,QAAS,OACTc,cAAe,MACfb,WAAY,SACZkB,eAAgB,~~eAEZC~~,EAAiB1B,EAAO2B,EAAP3B,~~EAAmB~~,KAAA,CACxCqB,SAAU,SACVO,aAAc,WACdC,WAAY,~~aAGRC~~,EAAuB9B,EAAO+B,EAAP/B,CAAuB,CAClDgC,MAAO,UAUHC,EAAoC,EAAGC,OAAMC,QAAQ,KAAMC,eAAc,EAAOC,eACpF,MAAMjC,EAAQkC,KACRC,UAAEA,GAAcC,IActB,OACEC,EAAC1C,EAAuB,CAACM,WAAY8B,EAAKO,SAAA,CACxCC,EAACC,EAAa,CAACV,KAAMA,IAErBO,EAACvB,EAAkC,CAAAwB,SAAA,CACjCD,EAAClB,EAAgC,CAAAmB,SAAA,CAC/BC,EAACjB,EAAc,CAACmB,MAAOzC,EAAMQ,QAAQC,SAASiC,KAAK,eAAgBC,QAAQ,cAAaL,SACrFR,EAAKc,OAERL,EAAChB,GAAWkB,MAAOzC,EAAMQ,QAAQC,SAASiC,KAAK,aAAcC,QAAQ,cAAaL,SAjBnE,CAACO,IACtB,GAAc,IAAVA,EAAa,MAAO,UACxB,MAEMC,EAAIC,KAAKC,MAAMD,KAAKE,IAAIJ,GAASE,KAAKE,IAFlC,OAGV,MAAO,GAAGF,KAAKG,MAAOL,EAAQE,KAAKI,IAHzB,KAGgCL,GAAM,KAAO,OAFzC,CAAC,IAAK,KAAM,KAAM,MAEoCA,MAa3DM,CAAetB,EAAKuB,WAIzBhB,EAACjB,EAAqB,CAAAkB,SAAA,CACnBP,GACCQ,EAAChB,EAAU,CAACkB,MAAOzC,EAAMQ,QAAQC,SAASiC,KAAK,cAAeC,QAAQ,cAAaL,SAChFP,IAGJC,GAAeO,EAACb,EAAoB,CAAA,SAIzCa,EAACe,EAAU,CAAA,aACGnB,EAAU,eACtBoB,QAtCoB,KACxBtB,EAASH,IAsCLuB,KAAK,QACLG,KAAK,UACLb,QAAQ,WAAUL,SAElBC,EAACkB,EAAU,CAAA"}
1	+ {"version":3,"file":"FileItem.js","sources":["../../../../../src/components/organisms/FileUpload/components/FileItem.tsx"],"sourcesContent":["import React from 'react';\n\nimport Box from '@mui/material/Box';\nimport styled from '@mui/material/styles/styled';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport IconButton from '@fd/components/atoms/IconButton';\nimport LinearProgress from '@fd/components/atoms/LinearProgress';\nimport Typography from '@fd/components/atoms/Typography';\nimport CancelIcon from '@fd/icons/Cancel';\nimport { useTranslation } from '@fd/providers/TranslationProvider';\n\nimport FileThumbnail from './FileThumbnail';\n\nconst StyledFileItemContainer = styled(Box, {\n shouldForwardProp: (prop) => prop !== 'hasError',\n})<{ hasError?: boolean }>(({ theme, hasError }) => ({\n display: 'flex',\n alignItems: 'center',\n gap: theme.spacing(2),\n padding: theme.spacing(2),\n borderBottom: `1px solid ${theme.palette.semantic.stroke['stroke-weak']}`,\n backgroundColor: hasError\n ? theme.palette.semantic.fill['fill-error-weak']\n : theme.palette.semantic.background['background-raised'],\n}));\n\nconst StyledFileItemInformationContainer = styled(Box)(({ theme }) => ({\n flex: 1,\n display: 'flex',\n flexDirection: 'row',\n gap: theme.spacing(1),\n overflow: 'hidden',\n minWidth: 0,\n}));\n\nconst StyledFileItemInformationContent = styled(Box)(() => ({\n flex: 1,\n display: 'flex',\n overflow: 'hidden',\n flexDirection: 'column',\n minWidth: 0,\n}));\n\nconst StyledFileItemContent = styled(Box)(() => ({\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'flex-end',\n}));\nconst StyledFileName = styled(Typography)(() => ({\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n}));\n\nconst StyledLinearProgress = styled(LinearProgress)({\n width: '250px',\n});\n\nexport interface FileItemProps {\n file: File;\n error?: string \| null;\n isUploading?: boolean;\n onRemove: (file: File) => void;\n}\n\nconst FileItem: React.FC<FileItemProps> = ({ file, error = null, isUploading = false, onRemove }) => {\n const theme = useTheme();\n const { translate } = useTranslation();\n\n const handleRemoveClick = (): void => {\n onRemove(file);\n };\n\n const formatFileSize = (bytes: number): string => {\n if (bytes === 0) return '0 Bytes';\n const k = 1024;\n const sizes = ['B', 'KB', 'MB', 'GB'];\n const i = Math.floor(Math.log(bytes) / Math.log(k));\n return `${Math.round((bytes / Math.pow(k, i)) * 100) / 100} ${sizes[i]}`;\n };\n\n return (\n <StyledFileItemContainer hasError={!!error}>\n <FileThumbnail file={file} />\n\n <StyledFileItemInformationContainer>\n <StyledFileItemInformationContent>\n <StyledFileName color={theme.palette.semantic.text['text-strong']} variant=\"captionWeak\">\n {file.name}\n </StyledFileName>\n <Typography color={theme.palette.semantic.text['text-weak']} variant=\"captionWeak\">\n {formatFileSize(file.size)}\n </Typography>\n </StyledFileItemInformationContent>\n\n <StyledFileItemContent>\n {error && (\n <Typography color={theme.palette.semantic.text['text-error']} variant=\"captionWeak\">\n {error}\n </Typography>\n )}\n {isUploading && <StyledLinearProgress />}\n </StyledFileItemContent>\n </StyledFileItemInformationContainer>\n\n <IconButton\n aria-label={translate('Remove_file')}\n onClick={handleRemoveClick}\n size=\"small\"\n tone=\"neutral\"\n variant=\"tertiary\"\n >\n <CancelIcon />\n </IconButton>\n </StyledFileItemContainer>\n );\n};\n\nexport default FileItem;\n"],"names":["StyledFileItemContainer","styled","Box","shouldForwardProp","prop","theme","hasError","display","alignItems","gap","spacing","padding","borderBottom","palette","semantic","stroke","backgroundColor","fill","background","StyledFileItemInformationContainer","flex","flexDirection","overflow","minWidth","StyledFileItemInformationContent","StyledFileItemContent","justifyContent","StyledFileName","Typography","textOverflow","whiteSpace","StyledLinearProgress","LinearProgress","width","FileItem","file","error","isUploading","onRemove","useTheme","translate","useTranslation","_jsxs","children","_jsx","FileThumbnail","color","text","variant","name","bytes","i","Math","floor","log","round","pow","formatFileSize","size","IconButton","onClick","tone","CancelIcon"],"mappings":"0gBAcA,MAAMA,EAA0BC,EAAOC,EAAK,CAC1CC,kBAAoBC,GAAkB,aAATA,GADCH,CAEL,EAAGI,QAAOC,eAAU,CAC7CC,QAAS,OACTC,WAAY,SACZC,IAAKJ,EAAMK,QAAQ,GACnBC,QAASN,EAAMK,QAAQ,GACvBE,aAAc,aAAaP,EAAMQ,QAAQC,SAASC,OAAO,iBACzDC,gBAAiBV,EACbD,EAAMQ,QAAQC,SAASG,KAAK,mBAC5BZ,EAAMQ,QAAQC,SAASI,WAAW,wBAGlCC,EAAqClB,EAAOC,EAAPD,CAAY,EAAGI,YAAO,CAC/De,KAAM,EACNb,QAAS,OACTc,cAAe,MACfZ,IAAKJ,EAAMK,QAAQ,GACnBY,SAAU,SACVC,SAAU,KAGNC,EAAmCvB,EAAOC,EAAPD,CAAY,KAAA,CACnDmB,KAAM,EACNb,QAAS,OACTe,SAAU,SACVD,cAAe,SACfE,SAAU,KAGNE,EAAwBxB,EAAOC,EAAPD,CAAY,KAAA,CACxCM,QAAS,OACTc,cAAe,MACfb,WAAY,SACZkB,eAAgB,cAEZC,EAAiB1B,EAAO2B,EAAP3B,CAAmB,KAAA,CACxCqB,SAAU,SACVO,aAAc,WACdC,WAAY,YAGRC,EAAuB9B,EAAO+B,EAAP/B,CAAuB,CAClDgC,MAAO,UAUHC,EAAoC,EAAGC,OAAMC,QAAQ,KAAMC,eAAc,EAAOC,eACpF,MAAMjC,EAAQkC,KACRC,UAAEA,GAAcC,IActB,OACEC,EAAC1C,EAAuB,CAACM,WAAY8B,EAAKO,SAAA,CACxCC,EAACC,EAAa,CAACV,KAAMA,IAErBO,EAACvB,EAAkC,CAAAwB,SAAA,CACjCD,EAAClB,EAAgC,CAAAmB,SAAA,CAC/BC,EAACjB,EAAc,CAACmB,MAAOzC,EAAMQ,QAAQC,SAASiC,KAAK,eAAgBC,QAAQ,cAAaL,SACrFR,EAAKc,OAERL,EAAChB,GAAWkB,MAAOzC,EAAMQ,QAAQC,SAASiC,KAAK,aAAcC,QAAQ,cAAaL,SAjBnE,CAACO,IACtB,GAAc,IAAVA,EAAa,MAAO,UACxB,MAEMC,EAAIC,KAAKC,MAAMD,KAAKE,IAAIJ,GAASE,KAAKE,IAFlC,OAGV,MAAO,GAAGF,KAAKG,MAAOL,EAAQE,KAAKI,IAHzB,KAGgCL,GAAM,KAAO,OAFzC,CAAC,IAAK,KAAM,KAAM,MAEoCA,MAa3DM,CAAetB,EAAKuB,WAIzBhB,EAACjB,EAAqB,CAAAkB,SAAA,CACnBP,GACCQ,EAAChB,EAAU,CAACkB,MAAOzC,EAAMQ,QAAQC,SAASiC,KAAK,cAAeC,QAAQ,cAAaL,SAChFP,IAGJC,GAAeO,EAACb,EAAoB,CAAA,SAIzCa,EAACe,EAAU,CAAA,aACGnB,EAAU,eACtBoB,QAtCoB,KACxBtB,EAASH,IAsCLuB,KAAK,QACLG,KAAK,UACLb,QAAQ,WAAUL,SAElBC,EAACkB,EAAU,CAAA"}

package/dist/components/organisms/FileUpload/components/FileThumbnail.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),i=require("@mui/material/Box"),r=require("@mui/material/styles/styled"),s=require("@mui/material/styles/useTheme"),l=require("../../../../icons/File/index.cjs.js");const a=r(i)((({theme:e})=>({width:"64px",height:"64px",borderRadius:e.radius["radius-4"],overflow:"hidden",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.semantic.fill["fill-weak"],flexShrink:0}))),n=r(i)((({theme:e})=>({display:"flex",flexDirection:"column",width:"48px",height:"48px",padding:"0px",justifyContent:"center",alignItems:"center",borderRadius:e.radius["radius-32"],backgroundColor:e.palette.semantic.fill["fill-weak"]}))),c=r("img")({width:"100%",height:"100%",objectFit:"cover"});module.exports=({file:i})=>{const r=s(),[o,u]=t.useState(null),[d,m]=t.useState(!1);return t.useEffect((()=>{const e=i.type.startsWith("image/");if(m(e),e){const e=URL.createObjectURL(i);return u(e),()=>{URL.revokeObjectURL(e)}}}),[i]),d&&o?e.jsx(a,{children:e.jsx(c,{alt:i.name,src:o})}):e.jsx(n,{children:e.jsx(l,{color:r.palette.semantic.icon["icon-strong"]})})};
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),i=require("@mui/material/Box"),r=require("@mui/material/styles/styled"),s=require("@mui/material/styles/useTheme"),l=require("../../../../icons/File/index.cjs.js");const a=r(i)(({theme:e})=>({width:"64px",height:"64px",borderRadius:e.radius["radius-4"],overflow:"hidden",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.semantic.fill["fill-weak"],flexShrink:0})),n=r(i)(({theme:e})=>({display:"flex",flexDirection:"column",width:"48px",height:"48px",padding:"0px",justifyContent:"center",alignItems:"center",borderRadius:e.radius["radius-32"],backgroundColor:e.palette.semantic.fill["fill-weak"]})),c=r("img")({width:"100%",height:"100%",objectFit:"cover"});module.exports=({file:i})=>{const r=s(),[o,u]=t.useState(null),[d,m]=t.useState(!1);return t.useEffect(()=>{const e=i.type.startsWith("image/");if(m(e),e){const e=URL.createObjectURL(i);return u(e),()=>{URL.revokeObjectURL(e)}}},[i]),d&&o?e.jsx(a,{children:e.jsx(c,{alt:i.name,src:o})}):e.jsx(n,{children:e.jsx(l,{color:r.palette.semantic.icon["icon-strong"]})})};
 //# sourceMappingURL=FileThumbnail.cjs.js.map

package/dist/components/organisms/FileUpload/components/FileThumbnail.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileThumbnail.cjs.js","sources":["../../../../../src/components/organisms/FileUpload/components/FileThumbnail.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport Box from '@mui/material/Box';\nimport styled from '@mui/material/styles/styled';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport FileIcon from '@fd/icons/File';\n\nconst StyledThumbnailContainer = styled(Box)(({ theme }) => ({\n width: '64px',\n height: '64px',\n borderRadius: theme.radius['radius-4'],\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: theme.palette.semantic.fill['fill-weak'],\n flexShrink: 0,\n}));\n\nconst StyledIconContainer = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n width: '48px',\n height: '48px',\n padding: '0px',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: theme.radius['radius-32'],\n backgroundColor: theme.palette.semantic.fill['fill-weak'],\n}));\n\nconst StyledImage = styled('img')({\n width: '100%',\n height: '100%',\n objectFit: 'cover',\n});\n\nexport interface FileThumbnailProps {\n file: File;\n}\n\nconst FileThumbnail: React.FC<FileThumbnailProps> = ({ file }) => {\n const theme = useTheme();\n const [imageUrl, setImageUrl] = useState<string \| null>(null);\n const [isImage, setIsImage] = useState(false);\n\n useEffect(() => {\n // Check if the file is an image\n const fileType = file.type;\n const isImageFile = fileType.startsWith('image/');\n setIsImage(isImageFile);\n\n if (isImageFile) {\n // Create object URL for image preview\n const url = URL.createObjectURL(file);\n setImageUrl(url);\n\n // Cleanup function to revoke object URL\n return (): void => {\n URL.revokeObjectURL(url);\n };\n }\n\n return undefined;\n }, [file]);\n\n return isImage && imageUrl ? (\n <StyledThumbnailContainer>\n <StyledImage alt={file.name} src={imageUrl} />\n </StyledThumbnailContainer>\n ) : (\n <StyledIconContainer>\n <FileIcon color={theme.palette.semantic.icon['icon-strong']} />\n </StyledIconContainer>\n );\n};\n\nexport default FileThumbnail;\n"],"names":["StyledThumbnailContainer","styled","Box","theme","width","height","borderRadius","radius","overflow","display","alignItems","justifyContent","backgroundColor","palette","semantic","fill","flexShrink","StyledIconContainer","flexDirection","padding","StyledImage","objectFit","file","useTheme","imageUrl","setImageUrl","useState","isImage","setIsImage","useEffect","isImageFile","type","startsWith","url","URL","createObjectURL","revokeObjectURL","_jsx","children","alt","name","src","FileIcon","color","icon"],"mappings":"uOAQA,MAAMA,EAA2BC,EAAOC,EAAPD,~~EAAY~~,EAAGE,YAAO,CACrDC,MAAO,OACPC,OAAQ,OACRC,aAAcH,EAAMI,OAAO,YAC3BC,SAAU,SACVC,QAAS,OACTC,WAAY,SACZC,eAAgB,SAChBC,gBAAiBT,EAAMU,QAAQC,SAASC,KAAK,aAC7CC,WAAY,~~MAGRC~~,EAAsBhB,EAAOC,EAAPD,~~EAAY~~,EAAGE,YAAO,CAChDM,QAAS,OACTS,cAAe,SACfd,MAAO,OACPC,OAAQ,OACRc,QAAS,MACTR,eAAgB,SAChBD,WAAY,SACZJ,aAAcH,EAAMI,OAAO,aAC3BK,gBAAiBT,EAAMU,QAAQC,SAASC,KAAK,~~iBAGzCK~~,EAAcnB,EAAO,MAAPA,CAAc,CAChCG,MAAO,OACPC,OAAQ,OACRgB,UAAW,yBAOuC,EAAGC,WACrD,MAAMnB,EAAQoB,KACPC,EAAUC,GAAeC,EAAAA,SAAwB,OACjDC,EAASC,GAAcF,EAAAA,UAAS,GAsBvC,OApBAG,EAAAA,~~WAAU~~,KAER,MACMC,EADWR,EAAKS,KACOC,WAAW,UAGxC,GAFAJ,EAAWE,GAEPA,EAAa,CAEf,MAAMG,EAAMC,IAAIC,gBAAgBb,GAIhC,OAHAG,EAAYQ,GAGL,KACLC,IAAIE,gBAAgBH,GAExB,~~IAGC~~,CAACX,IAEGK,GAAWH,EAChBa,EAAAA,IAACrC,EAAwB,CAAAsC,SACvBD,EAAAA,IAACjB,EAAW,CAACmB,IAAKjB,EAAKkB,KAAMC,IAAKjB,MAGpCa,EAAAA,IAACpB,YACCoB,EAAAA,IAACK,EAAQ,CAACC,MAAOxC,EAAMU,QAAQC,SAAS8B,KAAK"}
1	+ {"version":3,"file":"FileThumbnail.cjs.js","sources":["../../../../../src/components/organisms/FileUpload/components/FileThumbnail.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport Box from '@mui/material/Box';\nimport styled from '@mui/material/styles/styled';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport FileIcon from '@fd/icons/File';\n\nconst StyledThumbnailContainer = styled(Box)(({ theme }) => ({\n width: '64px',\n height: '64px',\n borderRadius: theme.radius['radius-4'],\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: theme.palette.semantic.fill['fill-weak'],\n flexShrink: 0,\n}));\n\nconst StyledIconContainer = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n width: '48px',\n height: '48px',\n padding: '0px',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: theme.radius['radius-32'],\n backgroundColor: theme.palette.semantic.fill['fill-weak'],\n}));\n\nconst StyledImage = styled('img')({\n width: '100%',\n height: '100%',\n objectFit: 'cover',\n});\n\nexport interface FileThumbnailProps {\n file: File;\n}\n\nconst FileThumbnail: React.FC<FileThumbnailProps> = ({ file }) => {\n const theme = useTheme();\n const [imageUrl, setImageUrl] = useState<string \| null>(null);\n const [isImage, setIsImage] = useState(false);\n\n useEffect(() => {\n // Check if the file is an image\n const fileType = file.type;\n const isImageFile = fileType.startsWith('image/');\n setIsImage(isImageFile);\n\n if (isImageFile) {\n // Create object URL for image preview\n const url = URL.createObjectURL(file);\n setImageUrl(url);\n\n // Cleanup function to revoke object URL\n return (): void => {\n URL.revokeObjectURL(url);\n };\n }\n\n return undefined;\n }, [file]);\n\n return isImage && imageUrl ? (\n <StyledThumbnailContainer>\n <StyledImage alt={file.name} src={imageUrl} />\n </StyledThumbnailContainer>\n ) : (\n <StyledIconContainer>\n <FileIcon color={theme.palette.semantic.icon['icon-strong']} />\n </StyledIconContainer>\n );\n};\n\nexport default FileThumbnail;\n"],"names":["StyledThumbnailContainer","styled","Box","theme","width","height","borderRadius","radius","overflow","display","alignItems","justifyContent","backgroundColor","palette","semantic","fill","flexShrink","StyledIconContainer","flexDirection","padding","StyledImage","objectFit","file","useTheme","imageUrl","setImageUrl","useState","isImage","setIsImage","useEffect","isImageFile","type","startsWith","url","URL","createObjectURL","revokeObjectURL","_jsx","children","alt","name","src","FileIcon","color","icon"],"mappings":"uOAQA,MAAMA,EAA2BC,EAAOC,EAAPD,CAAY,EAAGE,YAAO,CACrDC,MAAO,OACPC,OAAQ,OACRC,aAAcH,EAAMI,OAAO,YAC3BC,SAAU,SACVC,QAAS,OACTC,WAAY,SACZC,eAAgB,SAChBC,gBAAiBT,EAAMU,QAAQC,SAASC,KAAK,aAC7CC,WAAY,KAGRC,EAAsBhB,EAAOC,EAAPD,CAAY,EAAGE,YAAO,CAChDM,QAAS,OACTS,cAAe,SACfd,MAAO,OACPC,OAAQ,OACRc,QAAS,MACTR,eAAgB,SAChBD,WAAY,SACZJ,aAAcH,EAAMI,OAAO,aAC3BK,gBAAiBT,EAAMU,QAAQC,SAASC,KAAK,gBAGzCK,EAAcnB,EAAO,MAAPA,CAAc,CAChCG,MAAO,OACPC,OAAQ,OACRgB,UAAW,yBAOuC,EAAGC,WACrD,MAAMnB,EAAQoB,KACPC,EAAUC,GAAeC,EAAAA,SAAwB,OACjDC,EAASC,GAAcF,EAAAA,UAAS,GAsBvC,OApBAG,EAAAA,UAAU,KAER,MACMC,EADWR,EAAKS,KACOC,WAAW,UAGxC,GAFAJ,EAAWE,GAEPA,EAAa,CAEf,MAAMG,EAAMC,IAAIC,gBAAgBb,GAIhC,OAHAG,EAAYQ,GAGL,KACLC,IAAIE,gBAAgBH,GAExB,GAGC,CAACX,IAEGK,GAAWH,EAChBa,EAAAA,IAACrC,EAAwB,CAAAsC,SACvBD,EAAAA,IAACjB,EAAW,CAACmB,IAAKjB,EAAKkB,KAAMC,IAAKjB,MAGpCa,EAAAA,IAACpB,YACCoB,EAAAA,IAACK,EAAQ,CAACC,MAAOxC,EAAMU,QAAQC,SAAS8B,KAAK"}

package/dist/components/organisms/FileUpload/components/FileThumbnail.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{useState as t,useEffect as i}from"react";import r from"@mui/material/Box";import o from"@mui/material/styles/styled";import l from"@mui/material/styles/useTheme";import a from"../../../../icons/File/index.js";const n=o(r)((({theme:e})=>({width:"64px",height:"64px",borderRadius:e.radius["radius-4"],overflow:"hidden",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.semantic.fill["fill-weak"],flexShrink:0}))),s=o(r)((({theme:e})=>({display:"flex",flexDirection:"column",width:"48px",height:"48px",padding:"0px",justifyContent:"center",alignItems:"center",borderRadius:e.radius["radius-32"],backgroundColor:e.palette.semantic.fill["fill-weak"]}))),m=o("img")({width:"100%",height:"100%",objectFit:"cover"}),c=({file:r})=>{const o=l(),[c,d]=t(null),[f,u]=t(!1);return i((()=>{const e=r.type.startsWith("image/");if(u(e),e){const e=URL.createObjectURL(r);return d(e),()=>{URL.revokeObjectURL(e)}}}),[r]),f&&c?e(n,{children:e(m,{alt:r.name,src:c})}):e(s,{children:e(a,{color:o.palette.semantic.icon["icon-strong"]})})};export{c as default};
+import{jsx as e}from"react/jsx-runtime";import{useState as t,useEffect as i}from"react";import r from"@mui/material/Box";import o from"@mui/material/styles/styled";import l from"@mui/material/styles/useTheme";import a from"../../../../icons/File/index.js";const n=o(r)(({theme:e})=>({width:"64px",height:"64px",borderRadius:e.radius["radius-4"],overflow:"hidden",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:e.palette.semantic.fill["fill-weak"],flexShrink:0})),s=o(r)(({theme:e})=>({display:"flex",flexDirection:"column",width:"48px",height:"48px",padding:"0px",justifyContent:"center",alignItems:"center",borderRadius:e.radius["radius-32"],backgroundColor:e.palette.semantic.fill["fill-weak"]})),m=o("img")({width:"100%",height:"100%",objectFit:"cover"}),c=({file:r})=>{const o=l(),[c,d]=t(null),[f,u]=t(!1);return i(()=>{const e=r.type.startsWith("image/");if(u(e),e){const e=URL.createObjectURL(r);return d(e),()=>{URL.revokeObjectURL(e)}}},[r]),f&&c?e(n,{children:e(m,{alt:r.name,src:c})}):e(s,{children:e(a,{color:o.palette.semantic.icon["icon-strong"]})})};export{c as default};
 //# sourceMappingURL=FileThumbnail.js.map

package/dist/components/organisms/FileUpload/components/FileThumbnail.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FileThumbnail.js","sources":["../../../../../src/components/organisms/FileUpload/components/FileThumbnail.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport Box from '@mui/material/Box';\nimport styled from '@mui/material/styles/styled';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport FileIcon from '@fd/icons/File';\n\nconst StyledThumbnailContainer = styled(Box)(({ theme }) => ({\n width: '64px',\n height: '64px',\n borderRadius: theme.radius['radius-4'],\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: theme.palette.semantic.fill['fill-weak'],\n flexShrink: 0,\n}));\n\nconst StyledIconContainer = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n width: '48px',\n height: '48px',\n padding: '0px',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: theme.radius['radius-32'],\n backgroundColor: theme.palette.semantic.fill['fill-weak'],\n}));\n\nconst StyledImage = styled('img')({\n width: '100%',\n height: '100%',\n objectFit: 'cover',\n});\n\nexport interface FileThumbnailProps {\n file: File;\n}\n\nconst FileThumbnail: React.FC<FileThumbnailProps> = ({ file }) => {\n const theme = useTheme();\n const [imageUrl, setImageUrl] = useState<string \| null>(null);\n const [isImage, setIsImage] = useState(false);\n\n useEffect(() => {\n // Check if the file is an image\n const fileType = file.type;\n const isImageFile = fileType.startsWith('image/');\n setIsImage(isImageFile);\n\n if (isImageFile) {\n // Create object URL for image preview\n const url = URL.createObjectURL(file);\n setImageUrl(url);\n\n // Cleanup function to revoke object URL\n return (): void => {\n URL.revokeObjectURL(url);\n };\n }\n\n return undefined;\n }, [file]);\n\n return isImage && imageUrl ? (\n <StyledThumbnailContainer>\n <StyledImage alt={file.name} src={imageUrl} />\n </StyledThumbnailContainer>\n ) : (\n <StyledIconContainer>\n <FileIcon color={theme.palette.semantic.icon['icon-strong']} />\n </StyledIconContainer>\n );\n};\n\nexport default FileThumbnail;\n"],"names":["StyledThumbnailContainer","styled","Box","theme","width","height","borderRadius","radius","overflow","display","alignItems","justifyContent","backgroundColor","palette","semantic","fill","flexShrink","StyledIconContainer","flexDirection","padding","StyledImage","objectFit","FileThumbnail","file","useTheme","imageUrl","setImageUrl","useState","isImage","setIsImage","useEffect","isImageFile","type","startsWith","url","URL","createObjectURL","revokeObjectURL","_jsx","children","alt","name","src","FileIcon","color","icon"],"mappings":"gQAQA,MAAMA,EAA2BC,EAAOC,EAAPD,~~EAAY~~,EAAGE,YAAO,CACrDC,MAAO,OACPC,OAAQ,OACRC,aAAcH,EAAMI,OAAO,YAC3BC,SAAU,SACVC,QAAS,OACTC,WAAY,SACZC,eAAgB,SAChBC,gBAAiBT,EAAMU,QAAQC,SAASC,KAAK,aAC7CC,WAAY,~~MAGRC~~,EAAsBhB,EAAOC,EAAPD,~~EAAY~~,EAAGE,YAAO,CAChDM,QAAS,OACTS,cAAe,SACfd,MAAO,OACPC,OAAQ,OACRc,QAAS,MACTR,eAAgB,SAChBD,WAAY,SACZJ,aAAcH,EAAMI,OAAO,aAC3BK,gBAAiBT,EAAMU,QAAQC,SAASC,KAAK,~~iBAGzCK~~,EAAcnB,EAAO,MAAPA,CAAc,CAChCG,MAAO,OACPC,OAAQ,OACRgB,UAAW,UAOPC,EAA8C,EAAGC,WACrD,MAAMpB,EAAQqB,KACPC,EAAUC,GAAeC,EAAwB,OACjDC,EAASC,GAAcF,GAAS,GAsBvC,OApBAG,~~GAAU~~,KAER,MACMC,EADWR,EAAKS,KACOC,WAAW,UAGxC,GAFAJ,EAAWE,GAEPA,EAAa,CAEf,MAAMG,EAAMC,IAAIC,gBAAgBb,GAIhC,OAHAG,EAAYQ,GAGL,KACLC,IAAIE,gBAAgBH,GAExB,~~IAGC~~,CAACX,IAEGK,GAAWH,EAChBa,EAACtC,EAAwB,CAAAuC,SACvBD,EAAClB,EAAW,CAACoB,IAAKjB,EAAKkB,KAAMC,IAAKjB,MAGpCa,EAACrB,YACCqB,EAACK,EAAQ,CAACC,MAAOzC,EAAMU,QAAQC,SAAS+B,KAAK"}
1	+ {"version":3,"file":"FileThumbnail.js","sources":["../../../../../src/components/organisms/FileUpload/components/FileThumbnail.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport Box from '@mui/material/Box';\nimport styled from '@mui/material/styles/styled';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport FileIcon from '@fd/icons/File';\n\nconst StyledThumbnailContainer = styled(Box)(({ theme }) => ({\n width: '64px',\n height: '64px',\n borderRadius: theme.radius['radius-4'],\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: theme.palette.semantic.fill['fill-weak'],\n flexShrink: 0,\n}));\n\nconst StyledIconContainer = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n width: '48px',\n height: '48px',\n padding: '0px',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: theme.radius['radius-32'],\n backgroundColor: theme.palette.semantic.fill['fill-weak'],\n}));\n\nconst StyledImage = styled('img')({\n width: '100%',\n height: '100%',\n objectFit: 'cover',\n});\n\nexport interface FileThumbnailProps {\n file: File;\n}\n\nconst FileThumbnail: React.FC<FileThumbnailProps> = ({ file }) => {\n const theme = useTheme();\n const [imageUrl, setImageUrl] = useState<string \| null>(null);\n const [isImage, setIsImage] = useState(false);\n\n useEffect(() => {\n // Check if the file is an image\n const fileType = file.type;\n const isImageFile = fileType.startsWith('image/');\n setIsImage(isImageFile);\n\n if (isImageFile) {\n // Create object URL for image preview\n const url = URL.createObjectURL(file);\n setImageUrl(url);\n\n // Cleanup function to revoke object URL\n return (): void => {\n URL.revokeObjectURL(url);\n };\n }\n\n return undefined;\n }, [file]);\n\n return isImage && imageUrl ? (\n <StyledThumbnailContainer>\n <StyledImage alt={file.name} src={imageUrl} />\n </StyledThumbnailContainer>\n ) : (\n <StyledIconContainer>\n <FileIcon color={theme.palette.semantic.icon['icon-strong']} />\n </StyledIconContainer>\n );\n};\n\nexport default FileThumbnail;\n"],"names":["StyledThumbnailContainer","styled","Box","theme","width","height","borderRadius","radius","overflow","display","alignItems","justifyContent","backgroundColor","palette","semantic","fill","flexShrink","StyledIconContainer","flexDirection","padding","StyledImage","objectFit","FileThumbnail","file","useTheme","imageUrl","setImageUrl","useState","isImage","setIsImage","useEffect","isImageFile","type","startsWith","url","URL","createObjectURL","revokeObjectURL","_jsx","children","alt","name","src","FileIcon","color","icon"],"mappings":"gQAQA,MAAMA,EAA2BC,EAAOC,EAAPD,CAAY,EAAGE,YAAO,CACrDC,MAAO,OACPC,OAAQ,OACRC,aAAcH,EAAMI,OAAO,YAC3BC,SAAU,SACVC,QAAS,OACTC,WAAY,SACZC,eAAgB,SAChBC,gBAAiBT,EAAMU,QAAQC,SAASC,KAAK,aAC7CC,WAAY,KAGRC,EAAsBhB,EAAOC,EAAPD,CAAY,EAAGE,YAAO,CAChDM,QAAS,OACTS,cAAe,SACfd,MAAO,OACPC,OAAQ,OACRc,QAAS,MACTR,eAAgB,SAChBD,WAAY,SACZJ,aAAcH,EAAMI,OAAO,aAC3BK,gBAAiBT,EAAMU,QAAQC,SAASC,KAAK,gBAGzCK,EAAcnB,EAAO,MAAPA,CAAc,CAChCG,MAAO,OACPC,OAAQ,OACRgB,UAAW,UAOPC,EAA8C,EAAGC,WACrD,MAAMpB,EAAQqB,KACPC,EAAUC,GAAeC,EAAwB,OACjDC,EAASC,GAAcF,GAAS,GAsBvC,OApBAG,EAAU,KAER,MACMC,EADWR,EAAKS,KACOC,WAAW,UAGxC,GAFAJ,EAAWE,GAEPA,EAAa,CAEf,MAAMG,EAAMC,IAAIC,gBAAgBb,GAIhC,OAHAG,EAAYQ,GAGL,KACLC,IAAIE,gBAAgBH,GAExB,GAGC,CAACX,IAEGK,GAAWH,EAChBa,EAACtC,EAAwB,CAAAuC,SACvBD,EAAClB,EAAW,CAACoB,IAAKjB,EAAKkB,KAAMC,IAAKjB,MAGpCa,EAACrB,YACCqB,EAACK,EAAQ,CAACC,MAAOzC,EAAMU,QAAQC,SAAS+B,KAAK"}

package/dist/components/organisms/FileUpload/index.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime");require("react");var i=require("@mui/material/Stack/Stack"),l=require("@mui/material/styles/useTheme"),a=require("@mui/material/Typography"),t=require("./components/FileDropZone.cjs.js"),r=require("./components/FileItem.cjs.js");module.exports=s=>{const o=l(),{label:n="Upload File",files:d,allowedFileTypes:m,maxFiles:x,maxFileSize:p,onUpload:c,onRemove:u,multiple:F=!0,dragActiveText:T,dragInactiveText:g,browseButtonText:v,invalidFileTypesText:j="File type is not allowed. Allowed types: {allowedFileTypes}",invalidFileSizeText:y="File size is too large. Maximum size: {maxFileSize}",invalidFileCountText:f="Too many files selected. Maximum allowed: {maxFiles}",error:h}=s,w=e=>{u(e)};return e.jsxs(e.Fragment,{children:[e.jsx(a,{paddingBottom:o.spacing(1),variant:"b1Weak",children:n}),e.jsxs(i,{direction:"column",flex:1,gap:o.spacing(1),children:[e.jsx(t,{allowedFileTypes:m,browseButtonText:v,dragActiveText:T,dragInactiveText:g,error:h,handleUpload:e=>{c(e)},invalidFileCountText:f,invalidFileSizeText:y,invalidFileTypesText:j,maxFiles:x,maxFileSize:p,multiple:F}),d.length>0&&e.jsx(i,{direction:"column",gap:o.spacing(1.5),children:d.map((i=>e.jsx(r,{file:i.file,isUploading:i.isUploading,onRemove:w},`${i.file.name}-${i.file.size}-${i.file.lastModified}`)))})]})]})};
+"use strict";var e=require("react/jsx-runtime");require("react");var i=require("@mui/material/Stack/Stack"),l=require("@mui/material/styles/useTheme"),a=require("@mui/material/Typography"),t=require("./components/FileDropZone.cjs.js"),r=require("./components/FileItem.cjs.js");module.exports=s=>{const o=l(),{label:n="Upload File",files:d,allowedFileTypes:m,maxFiles:x,maxFileSize:p,onUpload:c,onRemove:u,multiple:F=!0,dragActiveText:T,dragInactiveText:g,browseButtonText:v,invalidFileTypesText:j="File type is not allowed. Allowed types: {allowedFileTypes}",invalidFileSizeText:y="File size is too large. Maximum size: {maxFileSize}",invalidFileCountText:f="Too many files selected. Maximum allowed: {maxFiles}",error:h}=s,w=e=>{u(e)};return e.jsxs(e.Fragment,{children:[e.jsx(a,{paddingBottom:o.spacing(1),variant:"b1Weak",children:n}),e.jsxs(i,{direction:"column",flex:1,gap:o.spacing(1),children:[e.jsx(t,{allowedFileTypes:m,browseButtonText:v,dragActiveText:T,dragInactiveText:g,error:h,handleUpload:e=>{c(e)},invalidFileCountText:f,invalidFileSizeText:y,invalidFileTypesText:j,maxFiles:x,maxFileSize:p,multiple:F}),d.length>0&&e.jsx(i,{direction:"column",gap:o.spacing(1.5),children:d.map(i=>e.jsx(r,{file:i.file,isUploading:i.isUploading,onRemove:w},`${i.file.name}-${i.file.size}-${i.file.lastModified}`))})]})]})};
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/organisms/FileUpload/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/organisms/FileUpload/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Stack from '@mui/material/Stack/Stack';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport Typography from '@fd/components/atoms/Typography';\n\nimport FileDropZone from './components/FileDropZone';\nimport FileItem from './components/FileItem';\n\nexport interface FileUploadState {\n file: File;\n isUploading?: boolean;\n}\n\nexport interface FileUploadProps {\n /*\n Label text displayed above the file upload area.\n * @default 'Upload File'\n /\n label?: string;\n\n /\n Array of file upload states (file object with optional isUploading flag).\n /\n files: FileUploadState[];\n\n /\n Array of allowed file extensions (without dots).\n * Example: ['jpg', 'png', 'pdf']\n /\n allowedFileTypes: string[];\n\n /\n Whether multiple files can be selected at once.\n * @default true\n /\n multiple?: boolean;\n\n /\n Maximum number of files that can be uploaded.\n /\n maxFiles: number;\n\n /\n Maximum file size allowed in bytes.\n * Example: 10 * 1024 * 1024 for 10MB\n /\n maxFileSize: number;\n\n /\n Callback fired when files are uploaded.\n /\n onUpload: (files: File[]) => void;\n\n /\n Callback fired when a file is removed.\n /\n onRemove: (file: File) => void;\n\n /\n Text displayed when files are being dragged over the drop zone.\n * @default 'Drop files here'\n /\n dragActiveText?: string;\n\n /\n Text displayed when no files are being dragged (idle state).\n * @default 'Drag and drop files here'\n /\n dragInactiveText?: string;\n\n /\n Text displayed on the browse/upload button.\n * @default 'Browse files'\n /\n browseButtonText?: string;\n\n /\n Text displayed when a file type is not allowed.\n * @default 'File type is not allowed. Allowed types: {allowedFileTypes}'\n /\n invalidFileTypesText?: string;\n\n /\n Text displayed when a file size is too large.\n * @default 'File size is too large. Maximum size: {maxFileSize}'\n /\n invalidFileSizeText?: string;\n\n /\n Text displayed when too many files are selected.\n * @default 'Too many files selected. Maximum allowed: {maxFiles}'\n /\n invalidFileCountText?: string;\n\n /\n Optional error message coming from external sources (e.g., API failures) to show on the drop zone.\n */\n error?: string \| null;\n}\n\nconst FileUpload: React.FC<FileUploadProps> = (props) => {\n const theme = useTheme();\n const {\n label = 'Upload File',\n files,\n allowedFileTypes,\n maxFiles,\n maxFileSize,\n onUpload,\n onRemove,\n multiple = true,\n dragActiveText,\n dragInactiveText,\n browseButtonText,\n invalidFileTypesText = 'File type is not allowed. Allowed types: {allowedFileTypes}',\n invalidFileSizeText = 'File size is too large. Maximum size: {maxFileSize}',\n invalidFileCountText = 'Too many files selected. Maximum allowed: {maxFiles}',\n error,\n } = props;\n\n const handleUpload = (newFiles: File[]): void => {\n // Notify parent - parent will manage state\n onUpload(newFiles);\n };\n\n const handleRemoveFile = (fileToRemove: File): void => {\n // Notify parent - parent will manage state\n onRemove(fileToRemove);\n };\n\n return (\n <>\n <Typography paddingBottom={theme.spacing(1)} variant=\"b1Weak\">\n {label}\n </Typography>\n <Stack direction=\"column\" flex={1} gap={theme.spacing(1)}>\n <FileDropZone\n allowedFileTypes={allowedFileTypes}\n browseButtonText={browseButtonText}\n dragActiveText={dragActiveText}\n dragInactiveText={dragInactiveText}\n error={error}\n handleUpload={handleUpload}\n invalidFileCountText={invalidFileCountText}\n invalidFileSizeText={invalidFileSizeText}\n invalidFileTypesText={invalidFileTypesText}\n maxFiles={maxFiles}\n maxFileSize={maxFileSize}\n multiple={multiple}\n />\n\n {files.length > 0 && (\n <Stack direction=\"column\" gap={theme.spacing(1.5)}>\n {files.map((fileState) => (\n <FileItem\n key={`${fileState.file.name}-${fileState.file.size}-${fileState.file.lastModified}`}\n file={fileState.file}\n isUploading={fileState.isUploading}\n onRemove={handleRemoveFile}\n />\n ))}\n </Stack>\n )}\n </Stack>\n </>\n );\n};\n\nexport default FileUpload;\n"],"names":["props","theme","useTheme","label","files","allowedFileTypes","maxFiles","maxFileSize","onUpload","onRemove","multiple","dragActiveText","dragInactiveText","browseButtonText","invalidFileTypesText","invalidFileSizeText","invalidFileCountText","error","handleRemoveFile","fileToRemove","_jsxs","_Fragment","children","_jsx","Typography","paddingBottom","spacing","variant","Stack","direction","flex","gap","FileDropZone","handleUpload","newFiles","length","map","fileState","FileItem","file","isUploading","name","size","lastModified"],"mappings":"oSAsG+CA,IAC7C,MAAMC,EAAQC,KACRC,MACJA,EAAQ,cAAaC,MACrBA,EAAKC,iBACLA,EAAgBC,SAChBA,EAAQC,YACRA,EAAWC,SACXA,EAAQC,SACRA,EAAQC,SACRA,GAAW,EAAIC,eACfA,EAAcC,iBACdA,EAAgBC,iBAChBA,EAAgBC,qBAChBA,EAAuB,8DAA6DC,oBACpFA,EAAsB,sDAAqDC,qBAC3EA,EAAuB,uDAAsDC,MAC7EA,GACEjB,EAOEkB,EAAoBC,IAExBV,EAASU,IAGX,OACEC,OAAAC,EAAAA,SAAA,CAAAC,SAAA,CACEC,EAAAA,IAACC,EAAU,CAACC,cAAexB,EAAMyB,QAAQ,GAAIC,QAAQ,kBAClDxB,IAEHiB,EAAAA,KAACQ,EAAK,CAACC,UAAU,SAASC,KAAM,EAAGC,IAAK9B,EAAMyB,QAAQ,GAAEJ,SAAA,CACtDC,EAAAA,IAACS,EAAY,CACX3B,iBAAkBA,EAClBQ,iBAAkBA,EAClBF,eAAgBA,EAChBC,iBAAkBA,EAClBK,MAAOA,EACPgB,aAtBcC,IAEpB1B,EAAS0B,IAqBHlB,qBAAsBA,EACtBD,oBAAqBA,EACrBD,qBAAsBA,EACtBR,SAAUA,EACVC,YAAaA,EACbG,SAAUA,IAGXN,EAAM+B,OAAS,GACdZ,EAAAA,IAACK,GAAMC,UAAU,SAASE,IAAK9B,EAAMyB,QAAQ,KAAIJ,SAC9ClB,EAAMgC,~~KAAKC~~,GACVd,EAAAA,IAACe,EAAQ,CAEPC,KAAMF,EAAUE,KAChBC,YAAaH,EAAUG,YACvB/B,SAAUS,GAHL,GAAGmB,EAAUE,KAAKE,QAAQJ,EAAUE,KAAKG,QAAQL,EAAUE,KAAKI"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/organisms/FileUpload/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Stack from '@mui/material/Stack/Stack';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport Typography from '@fd/components/atoms/Typography';\n\nimport FileDropZone from './components/FileDropZone';\nimport FileItem from './components/FileItem';\n\nexport interface FileUploadState {\n file: File;\n isUploading?: boolean;\n}\n\nexport interface FileUploadProps {\n /*\n Label text displayed above the file upload area.\n * @default 'Upload File'\n /\n label?: string;\n\n /\n Array of file upload states (file object with optional isUploading flag).\n /\n files: FileUploadState[];\n\n /\n Array of allowed file extensions (without dots).\n * Example: ['jpg', 'png', 'pdf']\n /\n allowedFileTypes: string[];\n\n /\n Whether multiple files can be selected at once.\n * @default true\n /\n multiple?: boolean;\n\n /\n Maximum number of files that can be uploaded.\n /\n maxFiles: number;\n\n /\n Maximum file size allowed in bytes.\n * Example: 10 * 1024 * 1024 for 10MB\n /\n maxFileSize: number;\n\n /\n Callback fired when files are uploaded.\n /\n onUpload: (files: File[]) => void;\n\n /\n Callback fired when a file is removed.\n /\n onRemove: (file: File) => void;\n\n /\n Text displayed when files are being dragged over the drop zone.\n * @default 'Drop files here'\n /\n dragActiveText?: string;\n\n /\n Text displayed when no files are being dragged (idle state).\n * @default 'Drag and drop files here'\n /\n dragInactiveText?: string;\n\n /\n Text displayed on the browse/upload button.\n * @default 'Browse files'\n /\n browseButtonText?: string;\n\n /\n Text displayed when a file type is not allowed.\n * @default 'File type is not allowed. Allowed types: {allowedFileTypes}'\n /\n invalidFileTypesText?: string;\n\n /\n Text displayed when a file size is too large.\n * @default 'File size is too large. Maximum size: {maxFileSize}'\n /\n invalidFileSizeText?: string;\n\n /\n Text displayed when too many files are selected.\n * @default 'Too many files selected. Maximum allowed: {maxFiles}'\n /\n invalidFileCountText?: string;\n\n /\n Optional error message coming from external sources (e.g., API failures) to show on the drop zone.\n */\n error?: string \| null;\n}\n\nconst FileUpload: React.FC<FileUploadProps> = (props) => {\n const theme = useTheme();\n const {\n label = 'Upload File',\n files,\n allowedFileTypes,\n maxFiles,\n maxFileSize,\n onUpload,\n onRemove,\n multiple = true,\n dragActiveText,\n dragInactiveText,\n browseButtonText,\n invalidFileTypesText = 'File type is not allowed. Allowed types: {allowedFileTypes}',\n invalidFileSizeText = 'File size is too large. Maximum size: {maxFileSize}',\n invalidFileCountText = 'Too many files selected. Maximum allowed: {maxFiles}',\n error,\n } = props;\n\n const handleUpload = (newFiles: File[]): void => {\n // Notify parent - parent will manage state\n onUpload(newFiles);\n };\n\n const handleRemoveFile = (fileToRemove: File): void => {\n // Notify parent - parent will manage state\n onRemove(fileToRemove);\n };\n\n return (\n <>\n <Typography paddingBottom={theme.spacing(1)} variant=\"b1Weak\">\n {label}\n </Typography>\n <Stack direction=\"column\" flex={1} gap={theme.spacing(1)}>\n <FileDropZone\n allowedFileTypes={allowedFileTypes}\n browseButtonText={browseButtonText}\n dragActiveText={dragActiveText}\n dragInactiveText={dragInactiveText}\n error={error}\n handleUpload={handleUpload}\n invalidFileCountText={invalidFileCountText}\n invalidFileSizeText={invalidFileSizeText}\n invalidFileTypesText={invalidFileTypesText}\n maxFiles={maxFiles}\n maxFileSize={maxFileSize}\n multiple={multiple}\n />\n\n {files.length > 0 && (\n <Stack direction=\"column\" gap={theme.spacing(1.5)}>\n {files.map((fileState) => (\n <FileItem\n key={`${fileState.file.name}-${fileState.file.size}-${fileState.file.lastModified}`}\n file={fileState.file}\n isUploading={fileState.isUploading}\n onRemove={handleRemoveFile}\n />\n ))}\n </Stack>\n )}\n </Stack>\n </>\n );\n};\n\nexport default FileUpload;\n"],"names":["props","theme","useTheme","label","files","allowedFileTypes","maxFiles","maxFileSize","onUpload","onRemove","multiple","dragActiveText","dragInactiveText","browseButtonText","invalidFileTypesText","invalidFileSizeText","invalidFileCountText","error","handleRemoveFile","fileToRemove","_jsxs","_Fragment","children","_jsx","Typography","paddingBottom","spacing","variant","Stack","direction","flex","gap","FileDropZone","handleUpload","newFiles","length","map","fileState","FileItem","file","isUploading","name","size","lastModified"],"mappings":"oSAsG+CA,IAC7C,MAAMC,EAAQC,KACRC,MACJA,EAAQ,cAAaC,MACrBA,EAAKC,iBACLA,EAAgBC,SAChBA,EAAQC,YACRA,EAAWC,SACXA,EAAQC,SACRA,EAAQC,SACRA,GAAW,EAAIC,eACfA,EAAcC,iBACdA,EAAgBC,iBAChBA,EAAgBC,qBAChBA,EAAuB,8DAA6DC,oBACpFA,EAAsB,sDAAqDC,qBAC3EA,EAAuB,uDAAsDC,MAC7EA,GACEjB,EAOEkB,EAAoBC,IAExBV,EAASU,IAGX,OACEC,OAAAC,EAAAA,SAAA,CAAAC,SAAA,CACEC,EAAAA,IAACC,EAAU,CAACC,cAAexB,EAAMyB,QAAQ,GAAIC,QAAQ,kBAClDxB,IAEHiB,EAAAA,KAACQ,EAAK,CAACC,UAAU,SAASC,KAAM,EAAGC,IAAK9B,EAAMyB,QAAQ,GAAEJ,SAAA,CACtDC,EAAAA,IAACS,EAAY,CACX3B,iBAAkBA,EAClBQ,iBAAkBA,EAClBF,eAAgBA,EAChBC,iBAAkBA,EAClBK,MAAOA,EACPgB,aAtBcC,IAEpB1B,EAAS0B,IAqBHlB,qBAAsBA,EACtBD,oBAAqBA,EACrBD,qBAAsBA,EACtBR,SAAUA,EACVC,YAAaA,EACbG,SAAUA,IAGXN,EAAM+B,OAAS,GACdZ,EAAAA,IAACK,GAAMC,UAAU,SAASE,IAAK9B,EAAMyB,QAAQ,KAAIJ,SAC9ClB,EAAMgC,IAAKC,GACVd,EAAAA,IAACe,EAAQ,CAEPC,KAAMF,EAAUE,KAChBC,YAAaH,EAAUG,YACvB/B,SAAUS,GAHL,GAAGmB,EAAUE,KAAKE,QAAQJ,EAAUE,KAAKG,QAAQL,EAAUE,KAAKI"}

package/dist/components/organisms/FileUpload/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,Fragment as i,jsx as l}from"react/jsx-runtime";import"react";import t from"@mui/material/Stack/Stack";import a from"@mui/material/styles/useTheme";import o from"@mui/material/Typography";import m from"./components/FileDropZone.js";import n from"./components/FileItem.js";const r=r=>{const s=a(),{label:d="Upload File",files:p,allowedFileTypes:c,maxFiles:x,maxFileSize:F,onUpload:T,onRemove:u,multiple:f=!0,dragActiveText:g,dragInactiveText:v,browseButtonText:y,invalidFileTypesText:h="File type is not allowed. Allowed types: {allowedFileTypes}",invalidFileSizeText:w="File size is too large. Maximum size: {maxFileSize}",invalidFileCountText:z="Too many files selected. Maximum allowed: {maxFiles}",error:S}=r,U=e=>{u(e)};return e(i,{children:[l(o,{paddingBottom:s.spacing(1),variant:"b1Weak",children:d}),e(t,{direction:"column",flex:1,gap:s.spacing(1),children:[l(m,{allowedFileTypes:c,browseButtonText:y,dragActiveText:g,dragInactiveText:v,error:S,handleUpload:e=>{T(e)},invalidFileCountText:z,invalidFileSizeText:w,invalidFileTypesText:h,maxFiles:x,maxFileSize:F,multiple:f}),p.length>0&&l(t,{direction:"column",gap:s.spacing(1.5),children:p.map((e=>l(n,{file:e.file,isUploading:e.isUploading,onRemove:U},`${e.file.name}-${e.file.size}-${e.file.lastModified}`)))})]})]})};export{r as default};
+import{jsxs as e,Fragment as i,jsx as l}from"react/jsx-runtime";import"react";import t from"@mui/material/Stack/Stack";import a from"@mui/material/styles/useTheme";import o from"@mui/material/Typography";import m from"./components/FileDropZone.js";import n from"./components/FileItem.js";const r=r=>{const s=a(),{label:d="Upload File",files:p,allowedFileTypes:c,maxFiles:x,maxFileSize:F,onUpload:T,onRemove:u,multiple:f=!0,dragActiveText:g,dragInactiveText:v,browseButtonText:y,invalidFileTypesText:h="File type is not allowed. Allowed types: {allowedFileTypes}",invalidFileSizeText:w="File size is too large. Maximum size: {maxFileSize}",invalidFileCountText:z="Too many files selected. Maximum allowed: {maxFiles}",error:S}=r,U=e=>{u(e)};return e(i,{children:[l(o,{paddingBottom:s.spacing(1),variant:"b1Weak",children:d}),e(t,{direction:"column",flex:1,gap:s.spacing(1),children:[l(m,{allowedFileTypes:c,browseButtonText:y,dragActiveText:g,dragInactiveText:v,error:S,handleUpload:e=>{T(e)},invalidFileCountText:z,invalidFileSizeText:w,invalidFileTypesText:h,maxFiles:x,maxFileSize:F,multiple:f}),p.length>0&&l(t,{direction:"column",gap:s.spacing(1.5),children:p.map(e=>l(n,{file:e.file,isUploading:e.isUploading,onRemove:U},`${e.file.name}-${e.file.size}-${e.file.lastModified}`))})]})]})};export{r as default};
 //# sourceMappingURL=index.js.map

package/dist/components/organisms/FileUpload/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../src/components/organisms/FileUpload/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Stack from '@mui/material/Stack/Stack';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport Typography from '@fd/components/atoms/Typography';\n\nimport FileDropZone from './components/FileDropZone';\nimport FileItem from './components/FileItem';\n\nexport interface FileUploadState {\n file: File;\n isUploading?: boolean;\n}\n\nexport interface FileUploadProps {\n /*\n Label text displayed above the file upload area.\n * @default 'Upload File'\n /\n label?: string;\n\n /\n Array of file upload states (file object with optional isUploading flag).\n /\n files: FileUploadState[];\n\n /\n Array of allowed file extensions (without dots).\n * Example: ['jpg', 'png', 'pdf']\n /\n allowedFileTypes: string[];\n\n /\n Whether multiple files can be selected at once.\n * @default true\n /\n multiple?: boolean;\n\n /\n Maximum number of files that can be uploaded.\n /\n maxFiles: number;\n\n /\n Maximum file size allowed in bytes.\n * Example: 10 * 1024 * 1024 for 10MB\n /\n maxFileSize: number;\n\n /\n Callback fired when files are uploaded.\n /\n onUpload: (files: File[]) => void;\n\n /\n Callback fired when a file is removed.\n /\n onRemove: (file: File) => void;\n\n /\n Text displayed when files are being dragged over the drop zone.\n * @default 'Drop files here'\n /\n dragActiveText?: string;\n\n /\n Text displayed when no files are being dragged (idle state).\n * @default 'Drag and drop files here'\n /\n dragInactiveText?: string;\n\n /\n Text displayed on the browse/upload button.\n * @default 'Browse files'\n /\n browseButtonText?: string;\n\n /\n Text displayed when a file type is not allowed.\n * @default 'File type is not allowed. Allowed types: {allowedFileTypes}'\n /\n invalidFileTypesText?: string;\n\n /\n Text displayed when a file size is too large.\n * @default 'File size is too large. Maximum size: {maxFileSize}'\n /\n invalidFileSizeText?: string;\n\n /\n Text displayed when too many files are selected.\n * @default 'Too many files selected. Maximum allowed: {maxFiles}'\n /\n invalidFileCountText?: string;\n\n /\n Optional error message coming from external sources (e.g., API failures) to show on the drop zone.\n */\n error?: string \| null;\n}\n\nconst FileUpload: React.FC<FileUploadProps> = (props) => {\n const theme = useTheme();\n const {\n label = 'Upload File',\n files,\n allowedFileTypes,\n maxFiles,\n maxFileSize,\n onUpload,\n onRemove,\n multiple = true,\n dragActiveText,\n dragInactiveText,\n browseButtonText,\n invalidFileTypesText = 'File type is not allowed. Allowed types: {allowedFileTypes}',\n invalidFileSizeText = 'File size is too large. Maximum size: {maxFileSize}',\n invalidFileCountText = 'Too many files selected. Maximum allowed: {maxFiles}',\n error,\n } = props;\n\n const handleUpload = (newFiles: File[]): void => {\n // Notify parent - parent will manage state\n onUpload(newFiles);\n };\n\n const handleRemoveFile = (fileToRemove: File): void => {\n // Notify parent - parent will manage state\n onRemove(fileToRemove);\n };\n\n return (\n <>\n <Typography paddingBottom={theme.spacing(1)} variant=\"b1Weak\">\n {label}\n </Typography>\n <Stack direction=\"column\" flex={1} gap={theme.spacing(1)}>\n <FileDropZone\n allowedFileTypes={allowedFileTypes}\n browseButtonText={browseButtonText}\n dragActiveText={dragActiveText}\n dragInactiveText={dragInactiveText}\n error={error}\n handleUpload={handleUpload}\n invalidFileCountText={invalidFileCountText}\n invalidFileSizeText={invalidFileSizeText}\n invalidFileTypesText={invalidFileTypesText}\n maxFiles={maxFiles}\n maxFileSize={maxFileSize}\n multiple={multiple}\n />\n\n {files.length > 0 && (\n <Stack direction=\"column\" gap={theme.spacing(1.5)}>\n {files.map((fileState) => (\n <FileItem\n key={`${fileState.file.name}-${fileState.file.size}-${fileState.file.lastModified}`}\n file={fileState.file}\n isUploading={fileState.isUploading}\n onRemove={handleRemoveFile}\n />\n ))}\n </Stack>\n )}\n </Stack>\n </>\n );\n};\n\nexport default FileUpload;\n"],"names":["FileUpload","props","theme","useTheme","label","files","allowedFileTypes","maxFiles","maxFileSize","onUpload","onRemove","multiple","dragActiveText","dragInactiveText","browseButtonText","invalidFileTypesText","invalidFileSizeText","invalidFileCountText","error","handleRemoveFile","fileToRemove","_jsxs","_Fragment","children","_jsx","Typography","paddingBottom","spacing","variant","Stack","direction","flex","gap","FileDropZone","handleUpload","newFiles","length","map","fileState","FileItem","file","isUploading","name","size","lastModified"],"mappings":"gSAsGA,MAAMA,EAAyCC,IAC7C,MAAMC,EAAQC,KACRC,MACJA,EAAQ,cAAaC,MACrBA,EAAKC,iBACLA,EAAgBC,SAChBA,EAAQC,YACRA,EAAWC,SACXA,EAAQC,SACRA,EAAQC,SACRA,GAAW,EAAIC,eACfA,EAAcC,iBACdA,EAAgBC,iBAChBA,EAAgBC,qBAChBA,EAAuB,8DAA6DC,oBACpFA,EAAsB,sDAAqDC,qBAC3EA,EAAuB,uDAAsDC,MAC7EA,GACEjB,EAOEkB,EAAoBC,IAExBV,EAASU,IAGX,OACEC,EAAAC,EAAA,CAAAC,SAAA,CACEC,EAACC,EAAU,CAACC,cAAexB,EAAMyB,QAAQ,GAAIC,QAAQ,kBAClDxB,IAEHiB,EAACQ,EAAK,CAACC,UAAU,SAASC,KAAM,EAAGC,IAAK9B,EAAMyB,QAAQ,GAAEJ,SAAA,CACtDC,EAACS,EAAY,CACX3B,iBAAkBA,EAClBQ,iBAAkBA,EAClBF,eAAgBA,EAChBC,iBAAkBA,EAClBK,MAAOA,EACPgB,aAtBcC,IAEpB1B,EAAS0B,IAqBHlB,qBAAsBA,EACtBD,oBAAqBA,EACrBD,qBAAsBA,EACtBR,SAAUA,EACVC,YAAaA,EACbG,SAAUA,IAGXN,EAAM+B,OAAS,GACdZ,EAACK,GAAMC,UAAU,SAASE,IAAK9B,EAAMyB,QAAQ,KAAIJ,SAC9ClB,EAAMgC,~~KAAKC~~,GACVd,EAACe,EAAQ,CAEPC,KAAMF,EAAUE,KAChBC,YAAaH,EAAUG,YACvB/B,SAAUS,GAHL,GAAGmB,EAAUE,KAAKE,QAAQJ,EAAUE,KAAKG,QAAQL,EAAUE,KAAKI"}
1	+ {"version":3,"file":"index.js","sources":["../../../../src/components/organisms/FileUpload/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Stack from '@mui/material/Stack/Stack';\nimport useTheme from '@mui/material/styles/useTheme';\n\nimport Typography from '@fd/components/atoms/Typography';\n\nimport FileDropZone from './components/FileDropZone';\nimport FileItem from './components/FileItem';\n\nexport interface FileUploadState {\n file: File;\n isUploading?: boolean;\n}\n\nexport interface FileUploadProps {\n /*\n Label text displayed above the file upload area.\n * @default 'Upload File'\n /\n label?: string;\n\n /\n Array of file upload states (file object with optional isUploading flag).\n /\n files: FileUploadState[];\n\n /\n Array of allowed file extensions (without dots).\n * Example: ['jpg', 'png', 'pdf']\n /\n allowedFileTypes: string[];\n\n /\n Whether multiple files can be selected at once.\n * @default true\n /\n multiple?: boolean;\n\n /\n Maximum number of files that can be uploaded.\n /\n maxFiles: number;\n\n /\n Maximum file size allowed in bytes.\n * Example: 10 * 1024 * 1024 for 10MB\n /\n maxFileSize: number;\n\n /\n Callback fired when files are uploaded.\n /\n onUpload: (files: File[]) => void;\n\n /\n Callback fired when a file is removed.\n /\n onRemove: (file: File) => void;\n\n /\n Text displayed when files are being dragged over the drop zone.\n * @default 'Drop files here'\n /\n dragActiveText?: string;\n\n /\n Text displayed when no files are being dragged (idle state).\n * @default 'Drag and drop files here'\n /\n dragInactiveText?: string;\n\n /\n Text displayed on the browse/upload button.\n * @default 'Browse files'\n /\n browseButtonText?: string;\n\n /\n Text displayed when a file type is not allowed.\n * @default 'File type is not allowed. Allowed types: {allowedFileTypes}'\n /\n invalidFileTypesText?: string;\n\n /\n Text displayed when a file size is too large.\n * @default 'File size is too large. Maximum size: {maxFileSize}'\n /\n invalidFileSizeText?: string;\n\n /\n Text displayed when too many files are selected.\n * @default 'Too many files selected. Maximum allowed: {maxFiles}'\n /\n invalidFileCountText?: string;\n\n /\n Optional error message coming from external sources (e.g., API failures) to show on the drop zone.\n */\n error?: string \| null;\n}\n\nconst FileUpload: React.FC<FileUploadProps> = (props) => {\n const theme = useTheme();\n const {\n label = 'Upload File',\n files,\n allowedFileTypes,\n maxFiles,\n maxFileSize,\n onUpload,\n onRemove,\n multiple = true,\n dragActiveText,\n dragInactiveText,\n browseButtonText,\n invalidFileTypesText = 'File type is not allowed. Allowed types: {allowedFileTypes}',\n invalidFileSizeText = 'File size is too large. Maximum size: {maxFileSize}',\n invalidFileCountText = 'Too many files selected. Maximum allowed: {maxFiles}',\n error,\n } = props;\n\n const handleUpload = (newFiles: File[]): void => {\n // Notify parent - parent will manage state\n onUpload(newFiles);\n };\n\n const handleRemoveFile = (fileToRemove: File): void => {\n // Notify parent - parent will manage state\n onRemove(fileToRemove);\n };\n\n return (\n <>\n <Typography paddingBottom={theme.spacing(1)} variant=\"b1Weak\">\n {label}\n </Typography>\n <Stack direction=\"column\" flex={1} gap={theme.spacing(1)}>\n <FileDropZone\n allowedFileTypes={allowedFileTypes}\n browseButtonText={browseButtonText}\n dragActiveText={dragActiveText}\n dragInactiveText={dragInactiveText}\n error={error}\n handleUpload={handleUpload}\n invalidFileCountText={invalidFileCountText}\n invalidFileSizeText={invalidFileSizeText}\n invalidFileTypesText={invalidFileTypesText}\n maxFiles={maxFiles}\n maxFileSize={maxFileSize}\n multiple={multiple}\n />\n\n {files.length > 0 && (\n <Stack direction=\"column\" gap={theme.spacing(1.5)}>\n {files.map((fileState) => (\n <FileItem\n key={`${fileState.file.name}-${fileState.file.size}-${fileState.file.lastModified}`}\n file={fileState.file}\n isUploading={fileState.isUploading}\n onRemove={handleRemoveFile}\n />\n ))}\n </Stack>\n )}\n </Stack>\n </>\n );\n};\n\nexport default FileUpload;\n"],"names":["FileUpload","props","theme","useTheme","label","files","allowedFileTypes","maxFiles","maxFileSize","onUpload","onRemove","multiple","dragActiveText","dragInactiveText","browseButtonText","invalidFileTypesText","invalidFileSizeText","invalidFileCountText","error","handleRemoveFile","fileToRemove","_jsxs","_Fragment","children","_jsx","Typography","paddingBottom","spacing","variant","Stack","direction","flex","gap","FileDropZone","handleUpload","newFiles","length","map","fileState","FileItem","file","isUploading","name","size","lastModified"],"mappings":"gSAsGA,MAAMA,EAAyCC,IAC7C,MAAMC,EAAQC,KACRC,MACJA,EAAQ,cAAaC,MACrBA,EAAKC,iBACLA,EAAgBC,SAChBA,EAAQC,YACRA,EAAWC,SACXA,EAAQC,SACRA,EAAQC,SACRA,GAAW,EAAIC,eACfA,EAAcC,iBACdA,EAAgBC,iBAChBA,EAAgBC,qBAChBA,EAAuB,8DAA6DC,oBACpFA,EAAsB,sDAAqDC,qBAC3EA,EAAuB,uDAAsDC,MAC7EA,GACEjB,EAOEkB,EAAoBC,IAExBV,EAASU,IAGX,OACEC,EAAAC,EAAA,CAAAC,SAAA,CACEC,EAACC,EAAU,CAACC,cAAexB,EAAMyB,QAAQ,GAAIC,QAAQ,kBAClDxB,IAEHiB,EAACQ,EAAK,CAACC,UAAU,SAASC,KAAM,EAAGC,IAAK9B,EAAMyB,QAAQ,GAAEJ,SAAA,CACtDC,EAACS,EAAY,CACX3B,iBAAkBA,EAClBQ,iBAAkBA,EAClBF,eAAgBA,EAChBC,iBAAkBA,EAClBK,MAAOA,EACPgB,aAtBcC,IAEpB1B,EAAS0B,IAqBHlB,qBAAsBA,EACtBD,oBAAqBA,EACrBD,qBAAsBA,EACtBR,SAAUA,EACVC,YAAaA,EACbG,SAAUA,IAGXN,EAAM+B,OAAS,GACdZ,EAACK,GAAMC,UAAU,SAASE,IAAK9B,EAAMyB,QAAQ,KAAIJ,SAC9ClB,EAAMgC,IAAKC,GACVd,EAACe,EAAQ,CAEPC,KAAMF,EAAUE,KAChBC,YAAaH,EAAUG,YACvB/B,SAAUS,GAHL,GAAGmB,EAAUE,KAAKE,QAAQJ,EAAUE,KAAKG,QAAQL,EAAUE,KAAKI"}

package/dist/components/organisms/Heading/index.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("react");var t=require("@mui/material/Toolbar"),i=require("@mui/material/styles"),a=require("@mui/material/Box"),n=require("../../atoms/BreadCrumbs/index.cjs.js"),l=require("../../atoms/Button/index.cjs.js"),r=require("@mui/material/Typography"),s=require("../../molecules/ButtonGroup/index.cjs.js"),o=require("../../molecules/Combobox/index.cjs.js");const d=i.styled(t)((({theme:e})=>({flexDirection:"column",alignItems:"stretch",[e.breakpoints.up("tablet")]:{flexDirection:"row",alignItems:"flex-start",justifyContent:"space-between",paddingTop:e.spacing(2),paddingBottom:e.spacing(2)},[e.breakpoints.down("tablet")]:{paddingTop:e.spacing(2),paddingBottom:e.spacing(2)}}))),p=i.styled(a)((({theme:e})=>({display:"flex",flexDirection:"column",alignItems:"flex-start",flex:"1 1 auto",gap:e.spacing(.5),minWidth:0,maxWidth:"100%",[e.breakpoints.up("tablet")]:{marginRight:e.spacing(2)}}))),c=i.styled(a)((({theme:e})=>({display:"flex",justifyContent:"flex-end",alignItems:"center",gap:e.spacing(1),flexShrink:0,alignSelf:"flex-start",paddingTop:e.spacing(.5),[e.breakpoints.down("tablet")]:{justifyContent:"flex-end",marginTop:e.spacing(1),paddingTop:0,alignSelf:"stretch",width:"100%"}}))),u=i.styled(a)((({theme:e})=>({display:"flex",flexDirection:"column",alignItems:"flex-start",gap:e.spacing(2),width:"100%",maxWidth:"100%",[e.breakpoints.up("tablet")]:{flexDirection:"row",alignItems:"center",paddingTop:e.spacing(2),flexWrap:"wrap"},[e.breakpoints.down("tablet")]:{flexDirection:"column",alignItems:"flex-start",paddingTop:e.spacing(2),paddingBottom:e.spacing(2),width:"100%"}}))),g=({title:t,buttons:i,description:a,breadcrumbItems:g,selectBoxes:m})=>e.jsxs(d,{children:[e.jsxs(p,{children:[g&&e.jsx(n,{items:g}),t&&e.jsx(r,{variant:"h1Strong",children:t}),a&&e.jsx(r,{color:"semantic.text.text-weak",variant:"captionWeak",children:a}),m?.length?e.jsx(u,{children:m.map((t=>e.jsx(o.Combobox,{fdKey:t.fdKey,label:t.label,onChange:t.onChange,options:t.options,placeholder:t.placeholder,value:t.value??null},t.fdKey)))}):null]}),i?.length?e.jsx(c,{children:e.jsx(s,{align:"right",fdKey:"heading-button-group",layout:"horizontal",size:"medium",children:i.map((t=>{const i=t.variant;return e.jsx(l.Button,{disabled:t.disabled??!1,fdKey:t.fdKey,onClick:t.onClick,variant:i,children:t.label},t.fdKey)}))})}):null]});exports.Heading=g,exports.default=g;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("react");var t=require("@mui/material/Toolbar"),i=require("@mui/material/styles"),a=require("@mui/material/Box"),n=require("../../atoms/BreadCrumbs/index.cjs.js"),l=require("../../atoms/Button/index.cjs.js"),r=require("@mui/material/Typography"),s=require("../../molecules/ButtonGroup/index.cjs.js"),o=require("../../molecules/Combobox/index.cjs.js");const d=i.styled(t)(({theme:e})=>({flexDirection:"column",alignItems:"stretch",[e.breakpoints.up("tablet")]:{flexDirection:"row",alignItems:"flex-start",justifyContent:"space-between",paddingTop:e.spacing(2),paddingBottom:e.spacing(2)},[e.breakpoints.down("tablet")]:{paddingTop:e.spacing(2),paddingBottom:e.spacing(2)}})),p=i.styled(a)(({theme:e})=>({display:"flex",flexDirection:"column",alignItems:"flex-start",flex:"1 1 auto",gap:e.spacing(.5),minWidth:0,maxWidth:"100%",[e.breakpoints.up("tablet")]:{marginRight:e.spacing(2)}})),c=i.styled(a)(({theme:e})=>({display:"flex",justifyContent:"flex-end",alignItems:"center",gap:e.spacing(1),flexShrink:0,alignSelf:"flex-start",paddingTop:e.spacing(.5),[e.breakpoints.down("tablet")]:{justifyContent:"flex-end",marginTop:e.spacing(1),paddingTop:0,alignSelf:"stretch",width:"100%"}})),u=i.styled(a)(({theme:e})=>({display:"flex",flexDirection:"column",alignItems:"flex-start",gap:e.spacing(2),width:"100%",maxWidth:"100%",[e.breakpoints.up("tablet")]:{flexDirection:"row",alignItems:"center",paddingTop:e.spacing(2),flexWrap:"wrap"},[e.breakpoints.down("tablet")]:{flexDirection:"column",alignItems:"flex-start",paddingTop:e.spacing(2),paddingBottom:e.spacing(2),width:"100%"}})),g=({title:t,buttons:i,description:a,breadcrumbItems:g,selectBoxes:m})=>e.jsxs(d,{children:[e.jsxs(p,{children:[g&&e.jsx(n,{items:g}),t&&e.jsx(r,{variant:"h1Strong",children:t}),a&&e.jsx(r,{color:"semantic.text.text-weak",variant:"captionWeak",children:a}),m?.length?e.jsx(u,{children:m.map(t=>e.jsx(o.Combobox,{fdKey:t.fdKey,label:t.label,onChange:t.onChange,options:t.options,placeholder:t.placeholder,value:t.value??null},t.fdKey))}):null]}),i?.length?e.jsx(c,{children:e.jsx(s,{align:"right",fdKey:"heading-button-group",layout:"horizontal",size:"medium",children:i.map(t=>{const i=t.variant;return e.jsx(l.Button,{disabled:t.disabled??!1,fdKey:t.fdKey,onClick:t.onClick,variant:i,children:t.label},t.fdKey)})})}):null]});exports.Heading=g,exports.default=g;
 //# sourceMappingURL=index.cjs.js.map

package/dist/components/organisms/Heading/index.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/organisms/Heading/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Toolbar from '@mui/material/Toolbar';\n\nimport styled from '@fd/utilities/styledUtilities';\n\nimport Box from '../../atoms/Box';\nimport BreadCrumbs, { type BreadcrumbItem } from '../../atoms/BreadCrumbs';\nimport Button from '../../atoms/Button';\nimport { type ButtonType } from '../../atoms/Button/getButtonStyles';\nimport Typography from '../../atoms/Typography';\nimport ButtonGroup from '../../molecules/ButtonGroup';\nimport { Combobox, type ComboboxOption, type ComboboxProps } from '../../molecules/Combobox';\n\nexport interface ButtonConfig {\n variant: ButtonType;\n onClick: () => void;\n label: string;\n fdKey: string;\n disabled?: boolean;\n}\n\nexport interface SelectConfig {\n options: ComboboxOption[];\n label: string;\n placeholder?: string;\n fdKey: string;\n onChange?: ComboboxProps['onChange'];\n value?: ComboboxProps['value'];\n}\n\nexport interface HeadingProps {\n title?: string;\n buttons?: ButtonConfig[];\n description?: string;\n breadcrumbItems?: BreadcrumbItem[];\n selectBoxes?: SelectConfig[];\n}\n\nconst StyledToolbar = styled(Toolbar)(({ theme }) => ({\n flexDirection: 'column',\n alignItems: 'stretch',\n [theme.breakpoints.up('tablet')]: {\n flexDirection: 'row',\n alignItems: 'flex-start',\n justifyContent: 'space-between',\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n },\n [theme.breakpoints.down('tablet')]: {\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n },\n}));\n\nconst StyledLeftSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n flex: '1 1 auto',\n gap: theme.spacing(0.5),\n minWidth: 0,\n maxWidth: '100%',\n [theme.breakpoints.up('tablet')]: {\n marginRight: theme.spacing(2),\n },\n}));\n\nconst StyledRightSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n justifyContent: 'flex-end',\n alignItems: 'center',\n gap: theme.spacing(1),\n flexShrink: 0,\n alignSelf: 'flex-start',\n paddingTop: theme.spacing(0.5),\n [theme.breakpoints.down('tablet')]: {\n justifyContent: 'flex-end',\n marginTop: theme.spacing(1),\n paddingTop: 0,\n alignSelf: 'stretch',\n width: '100%',\n },\n}));\n\nconst StyledSelectedSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n gap: theme.spacing(2),\n width: '100%',\n maxWidth: '100%',\n [theme.breakpoints.up('tablet')]: {\n flexDirection: 'row',\n alignItems: 'center',\n paddingTop: theme.spacing(2),\n flexWrap: 'wrap',\n },\n [theme.breakpoints.down('tablet')]: {\n flexDirection: 'column',\n alignItems: 'flex-start',\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n width: '100%',\n },\n}));\n\nexport const Heading: React.FC<HeadingProps> = ({\n title,\n buttons,\n description,\n breadcrumbItems,\n selectBoxes,\n}: HeadingProps) => {\n const renderSelectedSection = (): React.ReactNode => {\n if (!selectBoxes?.length) {\n return null;\n }\n\n return (\n <StyledSelectedSection>\n {selectBoxes.map((selectConfig) => (\n <Combobox\n key={selectConfig.fdKey}\n fdKey={selectConfig.fdKey}\n label={selectConfig.label}\n onChange={selectConfig.onChange}\n options={selectConfig.options}\n placeholder={selectConfig.placeholder}\n value={selectConfig.value ?? null}\n />\n ))}\n </StyledSelectedSection>\n );\n };\n\n const renderLeftSection = (): React.ReactNode => (\n <StyledLeftSection>\n {breadcrumbItems && <BreadCrumbs items={breadcrumbItems} />}\n {title && <Typography variant=\"h1Strong\">{title}</Typography>}\n {description && (\n <Typography color=\"semantic.text.text-weak\" variant=\"captionWeak\">\n {description}\n </Typography>\n )}\n {renderSelectedSection()}\n </StyledLeftSection>\n );\n\n const renderRightSection = (): React.ReactNode => {\n if (!buttons?.length) {\n return null;\n }\n\n return (\n <StyledRightSection>\n <ButtonGroup align=\"right\" fdKey=\"heading-button-group\" layout=\"horizontal\" size=\"medium\">\n {buttons.map((buttonConfig: ButtonConfig) => {\n const variant: ButtonType = buttonConfig.variant;\n return (\n <Button\n key={buttonConfig.fdKey}\n disabled={buttonConfig.disabled ?? false}\n fdKey={buttonConfig.fdKey}\n onClick={buttonConfig.onClick}\n variant={variant}\n >\n {buttonConfig.label}\n </Button>\n );\n })}\n </ButtonGroup>\n </StyledRightSection>\n );\n };\n\n return (\n <StyledToolbar>\n {renderLeftSection()}\n {renderRightSection()}\n </StyledToolbar>\n );\n};\n\nexport default Heading;\n"],"names":["StyledToolbar","styled","Toolbar","theme","flexDirection","alignItems","breakpoints","up","justifyContent","paddingTop","spacing","paddingBottom","down","StyledLeftSection","Box","display","flex","gap","minWidth","maxWidth","marginRight","StyledRightSection","flexShrink","alignSelf","marginTop","width","StyledSelectedSection","flexWrap","Heading","title","buttons","description","breadcrumbItems","selectBoxes","_jsxs","children","_jsx","BreadCrumbs","items","Typography","variant","color","length","map","selectConfig","Combobox","fdKey","label","onChange","options","placeholder","value","ButtonGroup","align","layout","size","buttonConfig","Button","disabled","onClick"],"mappings":"8cAuCA,MAAMA,EAAgBC,EAAAA,OAAOC,EAAPD,~~EAAgB~~,EAAGE,YAAO,CAC9CC,cAAe,SACfC,WAAY,UACZ,CAACF,EAAMG,YAAYC,GAAG,WAAY,CAChCH,cAAe,MACfC,WAAY,aACZG,eAAgB,gBAChBC,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,IAE/B,CAACP,EAAMG,YAAYM,KAAK,WAAY,CAClCH,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,~~QAI3BG~~,EAAoBZ,EAAAA,OAAOa,EAAPb,~~EAAY~~,EAAGE,YAAO,CAC9CY,QAAS,OACTX,cAAe,SACfC,WAAY,aACZW,KAAM,WACNC,IAAKd,EAAMO,QAAQ,IACnBQ,SAAU,EACVC,SAAU,OACV,CAAChB,EAAMG,YAAYC,GAAG,WAAY,CAChCa,YAAajB,EAAMO,QAAQ,~~QAIzBW~~,EAAqBpB,EAAAA,OAAOa,EAAPb,~~EAAY~~,EAAGE,YAAO,CAC/CY,QAAS,OACTP,eAAgB,WAChBH,WAAY,SACZY,IAAKd,EAAMO,QAAQ,GACnBY,WAAY,EACZC,UAAW,aACXd,WAAYN,EAAMO,QAAQ,IAC1B,CAACP,EAAMG,YAAYM,KAAK,WAAY,CAClCJ,eAAgB,WAChBgB,UAAWrB,EAAMO,QAAQ,GACzBD,WAAY,EACZc,UAAW,UACXE,MAAO,~~YAILC~~,EAAwBzB,EAAAA,OAAOa,EAAPb,~~EAAY~~,EAAGE,YAAO,CAClDY,QAAS,OACTX,cAAe,SACfC,WAAY,aACZY,IAAKd,EAAMO,QAAQ,GACnBe,MAAO,OACPN,SAAU,OACV,CAAChB,EAAMG,YAAYC,GAAG,WAAY,CAChCH,cAAe,MACfC,WAAY,SACZI,WAAYN,EAAMO,QAAQ,GAC1BiB,SAAU,QAEZ,CAACxB,EAAMG,YAAYM,KAAK,WAAY,CAClCR,cAAe,SACfC,WAAY,aACZI,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,GAC7Be,MAAO,~~YAIEG~~,EAAkC,EAC7CC,QACAC,UACAC,cACAC,kBACAC,iBAiEEC,EAAAA,KAAClC,EAAa,CAAAmC,SAAA,CAxCdD,OAACrB,EAAiB,CAAAsB,SAAA,CACfH,GAAmBI,EAAAA,IAACC,EAAW,CAACC,MAAON,IACvCH,GAASO,EAAAA,IAACG,EAAU,CAACC,QAAQ,WAAUL,SAAEN,IACzCE,GACCK,EAAAA,IAACG,EAAU,CAACE,MAAM,0BAA0BD,QAAQ,cAAaL,SAC9DJ,IA3BFE,GAAaS,OAKhBN,EAAAA,IAACV,EAAqB,CAAAS,SACnBF,EAAYU,~~KAAKC~~,GAChBR,EAAAA,IAACS,EAAAA,SAAQ,CAEPC,MAAOF,EAAaE,MACpBC,MAAOH,EAAaG,MACpBC,SAAUJ,EAAaI,SACvBC,QAASL,EAAaK,QACtBC,YAAaN,EAAaM,YAC1BC,MAAOP,EAAaO,OAAS,MANxBP,EAAaE,~~WAPjB~~,QAkCJhB,GAASY,OAKZN,EAAAA,IAACf,EAAkB,CAAAc,SACjBC,EAAAA,IAACgB,EAAW,CAACC,MAAM,QAAQP,MAAM,uBAAuBQ,OAAO,aAAaC,KAAK,SAAQpB,SACtFL,EAAQa,~~KAAKa~~,IACZ,MAAMhB,EAAsBgB,EAAahB,QACzC,OACEJ,EAAAA,IAACqB,SAAM,CAELC,SAAUF,EAAaE,WAAY,EACnCZ,MAAOU,EAAaV,MACpBa,QAASH,EAAaG,QACtBnB,QAASA,EAAOL,SAEfqB,EAAaT,OANTS,EAAaV,~~cAVrB~~"}
1	+ {"version":3,"file":"index.cjs.js","sources":["../../../../src/components/organisms/Heading/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Toolbar from '@mui/material/Toolbar';\n\nimport styled from '@fd/utilities/styledUtilities';\n\nimport Box from '../../atoms/Box';\nimport BreadCrumbs, { type BreadcrumbItem } from '../../atoms/BreadCrumbs';\nimport Button from '../../atoms/Button';\nimport { type ButtonType } from '../../atoms/Button/getButtonStyles';\nimport Typography from '../../atoms/Typography';\nimport ButtonGroup from '../../molecules/ButtonGroup';\nimport { Combobox, type ComboboxOption, type ComboboxProps } from '../../molecules/Combobox';\n\nexport interface ButtonConfig {\n variant: ButtonType;\n onClick: () => void;\n label: string;\n fdKey: string;\n disabled?: boolean;\n}\n\nexport interface SelectConfig {\n options: ComboboxOption[];\n label: string;\n placeholder?: string;\n fdKey: string;\n onChange?: ComboboxProps['onChange'];\n value?: ComboboxProps['value'];\n}\n\nexport interface HeadingProps {\n title?: string;\n buttons?: ButtonConfig[];\n description?: string;\n breadcrumbItems?: BreadcrumbItem[];\n selectBoxes?: SelectConfig[];\n}\n\nconst StyledToolbar = styled(Toolbar)(({ theme }) => ({\n flexDirection: 'column',\n alignItems: 'stretch',\n [theme.breakpoints.up('tablet')]: {\n flexDirection: 'row',\n alignItems: 'flex-start',\n justifyContent: 'space-between',\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n },\n [theme.breakpoints.down('tablet')]: {\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n },\n}));\n\nconst StyledLeftSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n flex: '1 1 auto',\n gap: theme.spacing(0.5),\n minWidth: 0,\n maxWidth: '100%',\n [theme.breakpoints.up('tablet')]: {\n marginRight: theme.spacing(2),\n },\n}));\n\nconst StyledRightSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n justifyContent: 'flex-end',\n alignItems: 'center',\n gap: theme.spacing(1),\n flexShrink: 0,\n alignSelf: 'flex-start',\n paddingTop: theme.spacing(0.5),\n [theme.breakpoints.down('tablet')]: {\n justifyContent: 'flex-end',\n marginTop: theme.spacing(1),\n paddingTop: 0,\n alignSelf: 'stretch',\n width: '100%',\n },\n}));\n\nconst StyledSelectedSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n gap: theme.spacing(2),\n width: '100%',\n maxWidth: '100%',\n [theme.breakpoints.up('tablet')]: {\n flexDirection: 'row',\n alignItems: 'center',\n paddingTop: theme.spacing(2),\n flexWrap: 'wrap',\n },\n [theme.breakpoints.down('tablet')]: {\n flexDirection: 'column',\n alignItems: 'flex-start',\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n width: '100%',\n },\n}));\n\nexport const Heading: React.FC<HeadingProps> = ({\n title,\n buttons,\n description,\n breadcrumbItems,\n selectBoxes,\n}: HeadingProps) => {\n const renderSelectedSection = (): React.ReactNode => {\n if (!selectBoxes?.length) {\n return null;\n }\n\n return (\n <StyledSelectedSection>\n {selectBoxes.map((selectConfig) => (\n <Combobox\n key={selectConfig.fdKey}\n fdKey={selectConfig.fdKey}\n label={selectConfig.label}\n onChange={selectConfig.onChange}\n options={selectConfig.options}\n placeholder={selectConfig.placeholder}\n value={selectConfig.value ?? null}\n />\n ))}\n </StyledSelectedSection>\n );\n };\n\n const renderLeftSection = (): React.ReactNode => (\n <StyledLeftSection>\n {breadcrumbItems && <BreadCrumbs items={breadcrumbItems} />}\n {title && <Typography variant=\"h1Strong\">{title}</Typography>}\n {description && (\n <Typography color=\"semantic.text.text-weak\" variant=\"captionWeak\">\n {description}\n </Typography>\n )}\n {renderSelectedSection()}\n </StyledLeftSection>\n );\n\n const renderRightSection = (): React.ReactNode => {\n if (!buttons?.length) {\n return null;\n }\n\n return (\n <StyledRightSection>\n <ButtonGroup align=\"right\" fdKey=\"heading-button-group\" layout=\"horizontal\" size=\"medium\">\n {buttons.map((buttonConfig: ButtonConfig) => {\n const variant: ButtonType = buttonConfig.variant;\n return (\n <Button\n key={buttonConfig.fdKey}\n disabled={buttonConfig.disabled ?? false}\n fdKey={buttonConfig.fdKey}\n onClick={buttonConfig.onClick}\n variant={variant}\n >\n {buttonConfig.label}\n </Button>\n );\n })}\n </ButtonGroup>\n </StyledRightSection>\n );\n };\n\n return (\n <StyledToolbar>\n {renderLeftSection()}\n {renderRightSection()}\n </StyledToolbar>\n );\n};\n\nexport default Heading;\n"],"names":["StyledToolbar","styled","Toolbar","theme","flexDirection","alignItems","breakpoints","up","justifyContent","paddingTop","spacing","paddingBottom","down","StyledLeftSection","Box","display","flex","gap","minWidth","maxWidth","marginRight","StyledRightSection","flexShrink","alignSelf","marginTop","width","StyledSelectedSection","flexWrap","Heading","title","buttons","description","breadcrumbItems","selectBoxes","_jsxs","children","_jsx","BreadCrumbs","items","Typography","variant","color","length","map","selectConfig","Combobox","fdKey","label","onChange","options","placeholder","value","ButtonGroup","align","layout","size","buttonConfig","Button","disabled","onClick"],"mappings":"8cAuCA,MAAMA,EAAgBC,EAAAA,OAAOC,EAAPD,CAAgB,EAAGE,YAAO,CAC9CC,cAAe,SACfC,WAAY,UACZ,CAACF,EAAMG,YAAYC,GAAG,WAAY,CAChCH,cAAe,MACfC,WAAY,aACZG,eAAgB,gBAChBC,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,IAE/B,CAACP,EAAMG,YAAYM,KAAK,WAAY,CAClCH,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,OAI3BG,EAAoBZ,EAAAA,OAAOa,EAAPb,CAAY,EAAGE,YAAO,CAC9CY,QAAS,OACTX,cAAe,SACfC,WAAY,aACZW,KAAM,WACNC,IAAKd,EAAMO,QAAQ,IACnBQ,SAAU,EACVC,SAAU,OACV,CAAChB,EAAMG,YAAYC,GAAG,WAAY,CAChCa,YAAajB,EAAMO,QAAQ,OAIzBW,EAAqBpB,EAAAA,OAAOa,EAAPb,CAAY,EAAGE,YAAO,CAC/CY,QAAS,OACTP,eAAgB,WAChBH,WAAY,SACZY,IAAKd,EAAMO,QAAQ,GACnBY,WAAY,EACZC,UAAW,aACXd,WAAYN,EAAMO,QAAQ,IAC1B,CAACP,EAAMG,YAAYM,KAAK,WAAY,CAClCJ,eAAgB,WAChBgB,UAAWrB,EAAMO,QAAQ,GACzBD,WAAY,EACZc,UAAW,UACXE,MAAO,WAILC,EAAwBzB,EAAAA,OAAOa,EAAPb,CAAY,EAAGE,YAAO,CAClDY,QAAS,OACTX,cAAe,SACfC,WAAY,aACZY,IAAKd,EAAMO,QAAQ,GACnBe,MAAO,OACPN,SAAU,OACV,CAAChB,EAAMG,YAAYC,GAAG,WAAY,CAChCH,cAAe,MACfC,WAAY,SACZI,WAAYN,EAAMO,QAAQ,GAC1BiB,SAAU,QAEZ,CAACxB,EAAMG,YAAYM,KAAK,WAAY,CAClCR,cAAe,SACfC,WAAY,aACZI,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,GAC7Be,MAAO,WAIEG,EAAkC,EAC7CC,QACAC,UACAC,cACAC,kBACAC,iBAiEEC,EAAAA,KAAClC,EAAa,CAAAmC,SAAA,CAxCdD,OAACrB,EAAiB,CAAAsB,SAAA,CACfH,GAAmBI,EAAAA,IAACC,EAAW,CAACC,MAAON,IACvCH,GAASO,EAAAA,IAACG,EAAU,CAACC,QAAQ,WAAUL,SAAEN,IACzCE,GACCK,EAAAA,IAACG,EAAU,CAACE,MAAM,0BAA0BD,QAAQ,cAAaL,SAC9DJ,IA3BFE,GAAaS,OAKhBN,EAAAA,IAACV,EAAqB,CAAAS,SACnBF,EAAYU,IAAKC,GAChBR,EAAAA,IAACS,EAAAA,SAAQ,CAEPC,MAAOF,EAAaE,MACpBC,MAAOH,EAAaG,MACpBC,SAAUJ,EAAaI,SACvBC,QAASL,EAAaK,QACtBC,YAAaN,EAAaM,YAC1BC,MAAOP,EAAaO,OAAS,MANxBP,EAAaE,UAPjB,QAkCJhB,GAASY,OAKZN,EAAAA,IAACf,EAAkB,CAAAc,SACjBC,EAAAA,IAACgB,EAAW,CAACC,MAAM,QAAQP,MAAM,uBAAuBQ,OAAO,aAAaC,KAAK,SAAQpB,SACtFL,EAAQa,IAAKa,IACZ,MAAMhB,EAAsBgB,EAAahB,QACzC,OACEJ,EAAAA,IAACqB,SAAM,CAELC,SAAUF,EAAaE,WAAY,EACnCZ,MAAOU,EAAaV,MACpBa,QAASH,EAAaG,QACtBnB,QAASA,EAAOL,SAEfqB,EAAaT,OANTS,EAAaV,aAVrB"}

package/dist/components/organisms/Heading/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import"react";import i from"@mui/material/Toolbar";import{styled as a}from"@mui/material/styles";import n from"@mui/material/Box";import o from"../../atoms/BreadCrumbs/index.js";import{Button as l}from"../../atoms/Button/index.js";import r from"@mui/material/Typography";import p from"../../molecules/ButtonGroup/index.js";import{Combobox as s}from"../../molecules/Combobox/index.js";const m=a(i)((({theme:e})=>({flexDirection:"column",alignItems:"stretch",[e.breakpoints.up("tablet")]:{flexDirection:"row",alignItems:"flex-start",justifyContent:"space-between",paddingTop:e.spacing(2),paddingBottom:e.spacing(2)},[e.breakpoints.down("tablet")]:{paddingTop:e.spacing(2),paddingBottom:e.spacing(2)}}))),d=a(n)((({theme:e})=>({display:"flex",flexDirection:"column",alignItems:"flex-start",flex:"1 1 auto",gap:e.spacing(.5),minWidth:0,maxWidth:"100%",[e.breakpoints.up("tablet")]:{marginRight:e.spacing(2)}}))),c=a(n)((({theme:e})=>({display:"flex",justifyContent:"flex-end",alignItems:"center",gap:e.spacing(1),flexShrink:0,alignSelf:"flex-start",paddingTop:e.spacing(.5),[e.breakpoints.down("tablet")]:{justifyContent:"flex-end",marginTop:e.spacing(1),paddingTop:0,alignSelf:"stretch",width:"100%"}}))),g=a(n)((({theme:e})=>({display:"flex",flexDirection:"column",alignItems:"flex-start",gap:e.spacing(2),width:"100%",maxWidth:"100%",[e.breakpoints.up("tablet")]:{flexDirection:"row",alignItems:"center",paddingTop:e.spacing(2),flexWrap:"wrap"},[e.breakpoints.down("tablet")]:{flexDirection:"column",alignItems:"flex-start",paddingTop:e.spacing(2),paddingBottom:e.spacing(2),width:"100%"}}))),f=({title:i,buttons:a,description:n,breadcrumbItems:f,selectBoxes:u})=>e(m,{children:[e(d,{children:[f&&t(o,{items:f}),i&&t(r,{variant:"h1Strong",children:i}),n&&t(r,{color:"semantic.text.text-weak",variant:"captionWeak",children:n}),u?.length?t(g,{children:u.map((e=>t(s,{fdKey:e.fdKey,label:e.label,onChange:e.onChange,options:e.options,placeholder:e.placeholder,value:e.value??null},e.fdKey)))}):null]}),a?.length?t(c,{children:t(p,{align:"right",fdKey:"heading-button-group",layout:"horizontal",size:"medium",children:a.map((e=>{const i=e.variant;return t(l,{disabled:e.disabled??!1,fdKey:e.fdKey,onClick:e.onClick,variant:i,children:e.label},e.fdKey)}))})}):null]});export{f as Heading,f as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import"react";import i from"@mui/material/Toolbar";import{styled as a}from"@mui/material/styles";import n from"@mui/material/Box";import o from"../../atoms/BreadCrumbs/index.js";import{Button as l}from"../../atoms/Button/index.js";import r from"@mui/material/Typography";import p from"../../molecules/ButtonGroup/index.js";import{Combobox as s}from"../../molecules/Combobox/index.js";const m=a(i)(({theme:e})=>({flexDirection:"column",alignItems:"stretch",[e.breakpoints.up("tablet")]:{flexDirection:"row",alignItems:"flex-start",justifyContent:"space-between",paddingTop:e.spacing(2),paddingBottom:e.spacing(2)},[e.breakpoints.down("tablet")]:{paddingTop:e.spacing(2),paddingBottom:e.spacing(2)}})),d=a(n)(({theme:e})=>({display:"flex",flexDirection:"column",alignItems:"flex-start",flex:"1 1 auto",gap:e.spacing(.5),minWidth:0,maxWidth:"100%",[e.breakpoints.up("tablet")]:{marginRight:e.spacing(2)}})),c=a(n)(({theme:e})=>({display:"flex",justifyContent:"flex-end",alignItems:"center",gap:e.spacing(1),flexShrink:0,alignSelf:"flex-start",paddingTop:e.spacing(.5),[e.breakpoints.down("tablet")]:{justifyContent:"flex-end",marginTop:e.spacing(1),paddingTop:0,alignSelf:"stretch",width:"100%"}})),g=a(n)(({theme:e})=>({display:"flex",flexDirection:"column",alignItems:"flex-start",gap:e.spacing(2),width:"100%",maxWidth:"100%",[e.breakpoints.up("tablet")]:{flexDirection:"row",alignItems:"center",paddingTop:e.spacing(2),flexWrap:"wrap"},[e.breakpoints.down("tablet")]:{flexDirection:"column",alignItems:"flex-start",paddingTop:e.spacing(2),paddingBottom:e.spacing(2),width:"100%"}})),f=({title:i,buttons:a,description:n,breadcrumbItems:f,selectBoxes:u})=>e(m,{children:[e(d,{children:[f&&t(o,{items:f}),i&&t(r,{variant:"h1Strong",children:i}),n&&t(r,{color:"semantic.text.text-weak",variant:"captionWeak",children:n}),u?.length?t(g,{children:u.map(e=>t(s,{fdKey:e.fdKey,label:e.label,onChange:e.onChange,options:e.options,placeholder:e.placeholder,value:e.value??null},e.fdKey))}):null]}),a?.length?t(c,{children:t(p,{align:"right",fdKey:"heading-button-group",layout:"horizontal",size:"medium",children:a.map(e=>{const i=e.variant;return t(l,{disabled:e.disabled??!1,fdKey:e.fdKey,onClick:e.onClick,variant:i,children:e.label},e.fdKey)})})}):null]});export{f as Heading,f as default};
 //# sourceMappingURL=index.js.map

package/dist/components/organisms/Heading/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../../src/components/organisms/Heading/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Toolbar from '@mui/material/Toolbar';\n\nimport styled from '@fd/utilities/styledUtilities';\n\nimport Box from '../../atoms/Box';\nimport BreadCrumbs, { type BreadcrumbItem } from '../../atoms/BreadCrumbs';\nimport Button from '../../atoms/Button';\nimport { type ButtonType } from '../../atoms/Button/getButtonStyles';\nimport Typography from '../../atoms/Typography';\nimport ButtonGroup from '../../molecules/ButtonGroup';\nimport { Combobox, type ComboboxOption, type ComboboxProps } from '../../molecules/Combobox';\n\nexport interface ButtonConfig {\n variant: ButtonType;\n onClick: () => void;\n label: string;\n fdKey: string;\n disabled?: boolean;\n}\n\nexport interface SelectConfig {\n options: ComboboxOption[];\n label: string;\n placeholder?: string;\n fdKey: string;\n onChange?: ComboboxProps['onChange'];\n value?: ComboboxProps['value'];\n}\n\nexport interface HeadingProps {\n title?: string;\n buttons?: ButtonConfig[];\n description?: string;\n breadcrumbItems?: BreadcrumbItem[];\n selectBoxes?: SelectConfig[];\n}\n\nconst StyledToolbar = styled(Toolbar)(({ theme }) => ({\n flexDirection: 'column',\n alignItems: 'stretch',\n [theme.breakpoints.up('tablet')]: {\n flexDirection: 'row',\n alignItems: 'flex-start',\n justifyContent: 'space-between',\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n },\n [theme.breakpoints.down('tablet')]: {\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n },\n}));\n\nconst StyledLeftSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n flex: '1 1 auto',\n gap: theme.spacing(0.5),\n minWidth: 0,\n maxWidth: '100%',\n [theme.breakpoints.up('tablet')]: {\n marginRight: theme.spacing(2),\n },\n}));\n\nconst StyledRightSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n justifyContent: 'flex-end',\n alignItems: 'center',\n gap: theme.spacing(1),\n flexShrink: 0,\n alignSelf: 'flex-start',\n paddingTop: theme.spacing(0.5),\n [theme.breakpoints.down('tablet')]: {\n justifyContent: 'flex-end',\n marginTop: theme.spacing(1),\n paddingTop: 0,\n alignSelf: 'stretch',\n width: '100%',\n },\n}));\n\nconst StyledSelectedSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n gap: theme.spacing(2),\n width: '100%',\n maxWidth: '100%',\n [theme.breakpoints.up('tablet')]: {\n flexDirection: 'row',\n alignItems: 'center',\n paddingTop: theme.spacing(2),\n flexWrap: 'wrap',\n },\n [theme.breakpoints.down('tablet')]: {\n flexDirection: 'column',\n alignItems: 'flex-start',\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n width: '100%',\n },\n}));\n\nexport const Heading: React.FC<HeadingProps> = ({\n title,\n buttons,\n description,\n breadcrumbItems,\n selectBoxes,\n}: HeadingProps) => {\n const renderSelectedSection = (): React.ReactNode => {\n if (!selectBoxes?.length) {\n return null;\n }\n\n return (\n <StyledSelectedSection>\n {selectBoxes.map((selectConfig) => (\n <Combobox\n key={selectConfig.fdKey}\n fdKey={selectConfig.fdKey}\n label={selectConfig.label}\n onChange={selectConfig.onChange}\n options={selectConfig.options}\n placeholder={selectConfig.placeholder}\n value={selectConfig.value ?? null}\n />\n ))}\n </StyledSelectedSection>\n );\n };\n\n const renderLeftSection = (): React.ReactNode => (\n <StyledLeftSection>\n {breadcrumbItems && <BreadCrumbs items={breadcrumbItems} />}\n {title && <Typography variant=\"h1Strong\">{title}</Typography>}\n {description && (\n <Typography color=\"semantic.text.text-weak\" variant=\"captionWeak\">\n {description}\n </Typography>\n )}\n {renderSelectedSection()}\n </StyledLeftSection>\n );\n\n const renderRightSection = (): React.ReactNode => {\n if (!buttons?.length) {\n return null;\n }\n\n return (\n <StyledRightSection>\n <ButtonGroup align=\"right\" fdKey=\"heading-button-group\" layout=\"horizontal\" size=\"medium\">\n {buttons.map((buttonConfig: ButtonConfig) => {\n const variant: ButtonType = buttonConfig.variant;\n return (\n <Button\n key={buttonConfig.fdKey}\n disabled={buttonConfig.disabled ?? false}\n fdKey={buttonConfig.fdKey}\n onClick={buttonConfig.onClick}\n variant={variant}\n >\n {buttonConfig.label}\n </Button>\n );\n })}\n </ButtonGroup>\n </StyledRightSection>\n );\n };\n\n return (\n <StyledToolbar>\n {renderLeftSection()}\n {renderRightSection()}\n </StyledToolbar>\n );\n};\n\nexport default Heading;\n"],"names":["StyledToolbar","styled","Toolbar","theme","flexDirection","alignItems","breakpoints","up","justifyContent","paddingTop","spacing","paddingBottom","down","StyledLeftSection","Box","display","flex","gap","minWidth","maxWidth","marginRight","StyledRightSection","flexShrink","alignSelf","marginTop","width","StyledSelectedSection","flexWrap","Heading","title","buttons","description","breadcrumbItems","selectBoxes","_jsxs","children","_jsx","BreadCrumbs","items","Typography","variant","color","length","map","selectConfig","Combobox","fdKey","label","onChange","options","placeholder","value","ButtonGroup","align","layout","size","buttonConfig","Button","disabled","onClick"],"mappings":"kbAuCA,MAAMA,EAAgBC,EAAOC,EAAPD,~~EAAgB~~,EAAGE,YAAO,CAC9CC,cAAe,SACfC,WAAY,UACZ,CAACF,EAAMG,YAAYC,GAAG,WAAY,CAChCH,cAAe,MACfC,WAAY,aACZG,eAAgB,gBAChBC,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,IAE/B,CAACP,EAAMG,YAAYM,KAAK,WAAY,CAClCH,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,~~QAI3BG~~,EAAoBZ,EAAOa,EAAPb,~~EAAY~~,EAAGE,YAAO,CAC9CY,QAAS,OACTX,cAAe,SACfC,WAAY,aACZW,KAAM,WACNC,IAAKd,EAAMO,QAAQ,IACnBQ,SAAU,EACVC,SAAU,OACV,CAAChB,EAAMG,YAAYC,GAAG,WAAY,CAChCa,YAAajB,EAAMO,QAAQ,~~QAIzBW~~,EAAqBpB,EAAOa,EAAPb,~~EAAY~~,EAAGE,YAAO,CAC/CY,QAAS,OACTP,eAAgB,WAChBH,WAAY,SACZY,IAAKd,EAAMO,QAAQ,GACnBY,WAAY,EACZC,UAAW,aACXd,WAAYN,EAAMO,QAAQ,IAC1B,CAACP,EAAMG,YAAYM,KAAK,WAAY,CAClCJ,eAAgB,WAChBgB,UAAWrB,EAAMO,QAAQ,GACzBD,WAAY,EACZc,UAAW,UACXE,MAAO,~~YAILC~~,EAAwBzB,EAAOa,EAAPb,~~EAAY~~,EAAGE,YAAO,CAClDY,QAAS,OACTX,cAAe,SACfC,WAAY,aACZY,IAAKd,EAAMO,QAAQ,GACnBe,MAAO,OACPN,SAAU,OACV,CAAChB,EAAMG,YAAYC,GAAG,WAAY,CAChCH,cAAe,MACfC,WAAY,SACZI,WAAYN,EAAMO,QAAQ,GAC1BiB,SAAU,QAEZ,CAACxB,EAAMG,YAAYM,KAAK,WAAY,CAClCR,cAAe,SACfC,WAAY,aACZI,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,GAC7Be,MAAO,~~YAIEG~~,EAAkC,EAC7CC,QACAC,UACAC,cACAC,kBACAC,iBAiEEC,EAAClC,EAAa,CAAAmC,SAAA,CAxCdD,EAACrB,EAAiB,CAAAsB,SAAA,CACfH,GAAmBI,EAACC,EAAW,CAACC,MAAON,IACvCH,GAASO,EAACG,EAAU,CAACC,QAAQ,WAAUL,SAAEN,IACzCE,GACCK,EAACG,EAAU,CAACE,MAAM,0BAA0BD,QAAQ,cAAaL,SAC9DJ,IA3BFE,GAAaS,OAKhBN,EAACV,EAAqB,CAAAS,SACnBF,EAAYU,~~KAAKC~~,GAChBR,EAACS,EAAQ,CAEPC,MAAOF,EAAaE,MACpBC,MAAOH,EAAaG,MACpBC,SAAUJ,EAAaI,SACvBC,QAASL,EAAaK,QACtBC,YAAaN,EAAaM,YAC1BC,MAAOP,EAAaO,OAAS,MANxBP,EAAaE,~~WAPjB~~,QAkCJhB,GAASY,OAKZN,EAACf,EAAkB,CAAAc,SACjBC,EAACgB,EAAW,CAACC,MAAM,QAAQP,MAAM,uBAAuBQ,OAAO,aAAaC,KAAK,SAAQpB,SACtFL,EAAQa,~~KAAKa~~,IACZ,MAAMhB,EAAsBgB,EAAahB,QACzC,OACEJ,EAACqB,EAAM,CAELC,SAAUF,EAAaE,WAAY,EACnCZ,MAAOU,EAAaV,MACpBa,QAASH,EAAaG,QACtBnB,QAASA,EAAOL,SAEfqB,EAAaT,OANTS,EAAaV,~~cAVrB~~"}
1	+ {"version":3,"file":"index.js","sources":["../../../../src/components/organisms/Heading/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport Toolbar from '@mui/material/Toolbar';\n\nimport styled from '@fd/utilities/styledUtilities';\n\nimport Box from '../../atoms/Box';\nimport BreadCrumbs, { type BreadcrumbItem } from '../../atoms/BreadCrumbs';\nimport Button from '../../atoms/Button';\nimport { type ButtonType } from '../../atoms/Button/getButtonStyles';\nimport Typography from '../../atoms/Typography';\nimport ButtonGroup from '../../molecules/ButtonGroup';\nimport { Combobox, type ComboboxOption, type ComboboxProps } from '../../molecules/Combobox';\n\nexport interface ButtonConfig {\n variant: ButtonType;\n onClick: () => void;\n label: string;\n fdKey: string;\n disabled?: boolean;\n}\n\nexport interface SelectConfig {\n options: ComboboxOption[];\n label: string;\n placeholder?: string;\n fdKey: string;\n onChange?: ComboboxProps['onChange'];\n value?: ComboboxProps['value'];\n}\n\nexport interface HeadingProps {\n title?: string;\n buttons?: ButtonConfig[];\n description?: string;\n breadcrumbItems?: BreadcrumbItem[];\n selectBoxes?: SelectConfig[];\n}\n\nconst StyledToolbar = styled(Toolbar)(({ theme }) => ({\n flexDirection: 'column',\n alignItems: 'stretch',\n [theme.breakpoints.up('tablet')]: {\n flexDirection: 'row',\n alignItems: 'flex-start',\n justifyContent: 'space-between',\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n },\n [theme.breakpoints.down('tablet')]: {\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n },\n}));\n\nconst StyledLeftSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n flex: '1 1 auto',\n gap: theme.spacing(0.5),\n minWidth: 0,\n maxWidth: '100%',\n [theme.breakpoints.up('tablet')]: {\n marginRight: theme.spacing(2),\n },\n}));\n\nconst StyledRightSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n justifyContent: 'flex-end',\n alignItems: 'center',\n gap: theme.spacing(1),\n flexShrink: 0,\n alignSelf: 'flex-start',\n paddingTop: theme.spacing(0.5),\n [theme.breakpoints.down('tablet')]: {\n justifyContent: 'flex-end',\n marginTop: theme.spacing(1),\n paddingTop: 0,\n alignSelf: 'stretch',\n width: '100%',\n },\n}));\n\nconst StyledSelectedSection = styled(Box)(({ theme }) => ({\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n gap: theme.spacing(2),\n width: '100%',\n maxWidth: '100%',\n [theme.breakpoints.up('tablet')]: {\n flexDirection: 'row',\n alignItems: 'center',\n paddingTop: theme.spacing(2),\n flexWrap: 'wrap',\n },\n [theme.breakpoints.down('tablet')]: {\n flexDirection: 'column',\n alignItems: 'flex-start',\n paddingTop: theme.spacing(2),\n paddingBottom: theme.spacing(2),\n width: '100%',\n },\n}));\n\nexport const Heading: React.FC<HeadingProps> = ({\n title,\n buttons,\n description,\n breadcrumbItems,\n selectBoxes,\n}: HeadingProps) => {\n const renderSelectedSection = (): React.ReactNode => {\n if (!selectBoxes?.length) {\n return null;\n }\n\n return (\n <StyledSelectedSection>\n {selectBoxes.map((selectConfig) => (\n <Combobox\n key={selectConfig.fdKey}\n fdKey={selectConfig.fdKey}\n label={selectConfig.label}\n onChange={selectConfig.onChange}\n options={selectConfig.options}\n placeholder={selectConfig.placeholder}\n value={selectConfig.value ?? null}\n />\n ))}\n </StyledSelectedSection>\n );\n };\n\n const renderLeftSection = (): React.ReactNode => (\n <StyledLeftSection>\n {breadcrumbItems && <BreadCrumbs items={breadcrumbItems} />}\n {title && <Typography variant=\"h1Strong\">{title}</Typography>}\n {description && (\n <Typography color=\"semantic.text.text-weak\" variant=\"captionWeak\">\n {description}\n </Typography>\n )}\n {renderSelectedSection()}\n </StyledLeftSection>\n );\n\n const renderRightSection = (): React.ReactNode => {\n if (!buttons?.length) {\n return null;\n }\n\n return (\n <StyledRightSection>\n <ButtonGroup align=\"right\" fdKey=\"heading-button-group\" layout=\"horizontal\" size=\"medium\">\n {buttons.map((buttonConfig: ButtonConfig) => {\n const variant: ButtonType = buttonConfig.variant;\n return (\n <Button\n key={buttonConfig.fdKey}\n disabled={buttonConfig.disabled ?? false}\n fdKey={buttonConfig.fdKey}\n onClick={buttonConfig.onClick}\n variant={variant}\n >\n {buttonConfig.label}\n </Button>\n );\n })}\n </ButtonGroup>\n </StyledRightSection>\n );\n };\n\n return (\n <StyledToolbar>\n {renderLeftSection()}\n {renderRightSection()}\n </StyledToolbar>\n );\n};\n\nexport default Heading;\n"],"names":["StyledToolbar","styled","Toolbar","theme","flexDirection","alignItems","breakpoints","up","justifyContent","paddingTop","spacing","paddingBottom","down","StyledLeftSection","Box","display","flex","gap","minWidth","maxWidth","marginRight","StyledRightSection","flexShrink","alignSelf","marginTop","width","StyledSelectedSection","flexWrap","Heading","title","buttons","description","breadcrumbItems","selectBoxes","_jsxs","children","_jsx","BreadCrumbs","items","Typography","variant","color","length","map","selectConfig","Combobox","fdKey","label","onChange","options","placeholder","value","ButtonGroup","align","layout","size","buttonConfig","Button","disabled","onClick"],"mappings":"kbAuCA,MAAMA,EAAgBC,EAAOC,EAAPD,CAAgB,EAAGE,YAAO,CAC9CC,cAAe,SACfC,WAAY,UACZ,CAACF,EAAMG,YAAYC,GAAG,WAAY,CAChCH,cAAe,MACfC,WAAY,aACZG,eAAgB,gBAChBC,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,IAE/B,CAACP,EAAMG,YAAYM,KAAK,WAAY,CAClCH,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,OAI3BG,EAAoBZ,EAAOa,EAAPb,CAAY,EAAGE,YAAO,CAC9CY,QAAS,OACTX,cAAe,SACfC,WAAY,aACZW,KAAM,WACNC,IAAKd,EAAMO,QAAQ,IACnBQ,SAAU,EACVC,SAAU,OACV,CAAChB,EAAMG,YAAYC,GAAG,WAAY,CAChCa,YAAajB,EAAMO,QAAQ,OAIzBW,EAAqBpB,EAAOa,EAAPb,CAAY,EAAGE,YAAO,CAC/CY,QAAS,OACTP,eAAgB,WAChBH,WAAY,SACZY,IAAKd,EAAMO,QAAQ,GACnBY,WAAY,EACZC,UAAW,aACXd,WAAYN,EAAMO,QAAQ,IAC1B,CAACP,EAAMG,YAAYM,KAAK,WAAY,CAClCJ,eAAgB,WAChBgB,UAAWrB,EAAMO,QAAQ,GACzBD,WAAY,EACZc,UAAW,UACXE,MAAO,WAILC,EAAwBzB,EAAOa,EAAPb,CAAY,EAAGE,YAAO,CAClDY,QAAS,OACTX,cAAe,SACfC,WAAY,aACZY,IAAKd,EAAMO,QAAQ,GACnBe,MAAO,OACPN,SAAU,OACV,CAAChB,EAAMG,YAAYC,GAAG,WAAY,CAChCH,cAAe,MACfC,WAAY,SACZI,WAAYN,EAAMO,QAAQ,GAC1BiB,SAAU,QAEZ,CAACxB,EAAMG,YAAYM,KAAK,WAAY,CAClCR,cAAe,SACfC,WAAY,aACZI,WAAYN,EAAMO,QAAQ,GAC1BC,cAAeR,EAAMO,QAAQ,GAC7Be,MAAO,WAIEG,EAAkC,EAC7CC,QACAC,UACAC,cACAC,kBACAC,iBAiEEC,EAAClC,EAAa,CAAAmC,SAAA,CAxCdD,EAACrB,EAAiB,CAAAsB,SAAA,CACfH,GAAmBI,EAACC,EAAW,CAACC,MAAON,IACvCH,GAASO,EAACG,EAAU,CAACC,QAAQ,WAAUL,SAAEN,IACzCE,GACCK,EAACG,EAAU,CAACE,MAAM,0BAA0BD,QAAQ,cAAaL,SAC9DJ,IA3BFE,GAAaS,OAKhBN,EAACV,EAAqB,CAAAS,SACnBF,EAAYU,IAAKC,GAChBR,EAACS,EAAQ,CAEPC,MAAOF,EAAaE,MACpBC,MAAOH,EAAaG,MACpBC,SAAUJ,EAAaI,SACvBC,QAASL,EAAaK,QACtBC,YAAaN,EAAaM,YAC1BC,MAAOP,EAAaO,OAAS,MANxBP,EAAaE,UAPjB,QAkCJhB,GAASY,OAKZN,EAACf,EAAkB,CAAAc,SACjBC,EAACgB,EAAW,CAACC,MAAM,QAAQP,MAAM,uBAAuBQ,OAAO,aAAaC,KAAK,SAAQpB,SACtFL,EAAQa,IAAKa,IACZ,MAAMhB,EAAsBgB,EAAahB,QACzC,OACEJ,EAACqB,EAAM,CAELC,SAAUF,EAAaE,WAAY,EACnCZ,MAAOU,EAAaV,MACpBa,QAASH,EAAaG,QACtBnB,QAASA,EAAOL,SAEfqB,EAAaT,OANTS,EAAaV,aAVrB"}

package/dist/components/organisms/ImageUploadWidget/components/ImageDisplay.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material/Skeleton/Skeleton"),i=require("@mui/material/styles/styled"),a=require("@cloudinary/react"),n=require("@cloudinary/url-gen"),o=require("react-imgix");const u=i(t)({width:"100%",height:"100%"});module.exports=({src:t,isCloudinaryAsset:i,cdnCloudName:s})=>{const[d,l]=r.useState(!0),c=e=>{l(e)},m=r.useMemo((()=>{if(i){return new n.Cloudinary({cloud:{cloudName:s}}).image(t)}return null}),[t,i,s]);return i&&m?e.jsxs(e.Fragment,{children:[e.jsx(a.AdvancedImage,{cldImg:m,onError:()=>c(!1),onLoad:()=>c(!1),style:{maxWidth:d?"0%":"100%",maxHeight:"100%",objectFit:"cover"}}),d&&e.jsx(u,{animation:"wave",variant:"rounded"})]}):e.jsxs(e.Fragment,{children:[e.jsx(o,{htmlAttributes:{onLoad:()=>c(!1),onError:()=>c(!1),style:{maxWidth:d?"0%":"100%",maxHeight:"100%",objectFit:"cover"}},src:t}),d&&e.jsx(u,{animation:"wave",variant:"rounded"})]})};
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material/Skeleton/Skeleton"),i=require("@mui/material/styles/styled"),a=require("@cloudinary/react"),n=require("@cloudinary/url-gen"),o=require("react-imgix");const u=i(t)({width:"100%",height:"100%"});module.exports=({src:t,isCloudinaryAsset:i,cdnCloudName:s})=>{const[d,l]=r.useState(!0),c=e=>{l(e)},m=r.useMemo(()=>{if(i){return new n.Cloudinary({cloud:{cloudName:s}}).image(t)}return null},[t,i,s]);return i&&m?e.jsxs(e.Fragment,{children:[e.jsx(a.AdvancedImage,{cldImg:m,onError:()=>c(!1),onLoad:()=>c(!1),style:{maxWidth:d?"0%":"100%",maxHeight:"100%",objectFit:"cover"}}),d&&e.jsx(u,{animation:"wave",variant:"rounded"})]}):e.jsxs(e.Fragment,{children:[e.jsx(o,{htmlAttributes:{onLoad:()=>c(!1),onError:()=>c(!1),style:{maxWidth:d?"0%":"100%",maxHeight:"100%",objectFit:"cover"}},src:t}),d&&e.jsx(u,{animation:"wave",variant:"rounded"})]})};
 //# sourceMappingURL=ImageDisplay.cjs.js.map

package/dist/components/organisms/ImageUploadWidget/components/ImageDisplay.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ImageDisplay.cjs.js","sources":["../../../../../src/components/organisms/ImageUploadWidget/components/ImageDisplay.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\n\nimport Skeleton from '@mui/material/Skeleton/Skeleton';\nimport styled from '@mui/material/styles/styled';\n\nimport { AdvancedImage } from '@cloudinary/react';\nimport { Cloudinary, type CloudinaryImage } from '@cloudinary/url-gen';\nimport Imgix from 'react-imgix';\n\ninterface ImageDisplayProps {\n src: string;\n isCloudinaryAsset?: boolean;\n cdnCloudName?: string;\n}\n\nconst StyledSkeleton = styled(Skeleton)({\n width: '100%',\n height: '100%',\n});\n\nconst ImageDisplay: React.FC<ImageDisplayProps> = ({ src, isCloudinaryAsset, cdnCloudName }) => {\n const [loading, setLoading] = useState(true);\n\n const handleLoadingChange = (loadingState: boolean): void => {\n setLoading(loadingState);\n };\n\n const cloudinaryImage = useMemo<CloudinaryImage \| null>(() => {\n if (isCloudinaryAsset) {\n const cloudinaryInstance = new Cloudinary({\n cloud: {\n cloudName: cdnCloudName,\n },\n });\n return cloudinaryInstance.image(src);\n }\n return null;\n }, [src, isCloudinaryAsset, cdnCloudName]);\n\n if (isCloudinaryAsset && cloudinaryImage) {\n return (\n <>\n <AdvancedImage\n cldImg={cloudinaryImage}\n onError={() => handleLoadingChange(false)}\n onLoad={() => handleLoadingChange(false)}\n style={{ maxWidth: loading ? '0%' : '100%', maxHeight: '100%', objectFit: 'cover' }}\n />\n {loading && <StyledSkeleton animation=\"wave\" variant=\"rounded\" />}\n </>\n );\n }\n\n return (\n <>\n <Imgix\n htmlAttributes={{\n onLoad: () => handleLoadingChange(false),\n onError: () => handleLoadingChange(false),\n style: {\n maxWidth: loading ? '0%' : '100%',\n maxHeight: '100%',\n objectFit: 'cover',\n },\n }}\n src={src}\n />\n {loading && <StyledSkeleton animation=\"wave\" variant=\"rounded\" />}\n </>\n );\n};\n\nexport default ImageDisplay;\n"],"names":["StyledSkeleton","styled","Skeleton","width","height","src","isCloudinaryAsset","cdnCloudName","loading","setLoading","useState","handleLoadingChange","loadingState","cloudinaryImage","useMemo","Cloudinary","cloud","cloudName","image","_jsxs","_Fragment","children","_jsx","AdvancedImage","cldImg","onError","onLoad","style","maxWidth","maxHeight","objectFit","animation","variant","Imgix","htmlAttributes"],"mappings":"kPAeA,MAAMA,EAAiBC,EAAOC,EAAPD,CAAiB,CACtCE,MAAO,OACPC,OAAQ,wBAGwC,EAAGC,MAAKC,oBAAmBC,mBAC3E,MAAOC,EAASC,GAAcC,EAAAA,UAAS,GAEjCC,EAAuBC,IAC3BH,EAAWG,IAGPC,EAAkBC,EAAAA,~~SAAgC~~,KACtD,GAAIR,EAAmB,CAMrB,OAL2B,IAAIS,aAAW,CACxCC,MAAO,CACLC,UAAWV,KAGWW,MAAMb,EAClC,CACA,OAAO,~~OACN~~,CAACA,EAAKC,EAAmBC,IAE5B,OAAID,GAAqBO,EAErBM,EAAAA,KAAAC,EAAAA,SAAA,CAAAC,SAAA,CACEC,MAACC,EAAAA,eACCC,OAAQX,EACRY,QAAS,IAAMd,GAAoB,GACnCe,OAAQ,IAAMf,GAAoB,GAClCgB,MAAO,CAAEC,SAAUpB,EAAU,KAAO,OAAQqB,UAAW,OAAQC,UAAW,WAE3EtB,GAAWc,MAACtB,GAAe+B,UAAU,OAAOC,QAAQ,eAMzDb,EAAAA,KAAAC,EAAAA,SAAA,CAAAC,SAAA,CACEC,MAACW,EAAK,CACJC,eAAgB,CACdR,OAAQ,IAAMf,GAAoB,GAClCc,QAAS,IAAMd,GAAoB,GACnCgB,MAAO,CACLC,SAAUpB,EAAU,KAAO,OAC3BqB,UAAW,OACXC,UAAW,UAGfzB,IAAKA,IAENG,GAAWc,EAAAA,IAACtB,EAAc,CAAC+B,UAAU,OAAOC,QAAQ"}
1	+ {"version":3,"file":"ImageDisplay.cjs.js","sources":["../../../../../src/components/organisms/ImageUploadWidget/components/ImageDisplay.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\n\nimport Skeleton from '@mui/material/Skeleton/Skeleton';\nimport styled from '@mui/material/styles/styled';\n\nimport { AdvancedImage } from '@cloudinary/react';\nimport { Cloudinary, type CloudinaryImage } from '@cloudinary/url-gen';\nimport Imgix from 'react-imgix';\n\ninterface ImageDisplayProps {\n src: string;\n isCloudinaryAsset?: boolean;\n cdnCloudName?: string;\n}\n\nconst StyledSkeleton = styled(Skeleton)({\n width: '100%',\n height: '100%',\n});\n\nconst ImageDisplay: React.FC<ImageDisplayProps> = ({ src, isCloudinaryAsset, cdnCloudName }) => {\n const [loading, setLoading] = useState(true);\n\n const handleLoadingChange = (loadingState: boolean): void => {\n setLoading(loadingState);\n };\n\n const cloudinaryImage = useMemo<CloudinaryImage \| null>(() => {\n if (isCloudinaryAsset) {\n const cloudinaryInstance = new Cloudinary({\n cloud: {\n cloudName: cdnCloudName,\n },\n });\n return cloudinaryInstance.image(src);\n }\n return null;\n }, [src, isCloudinaryAsset, cdnCloudName]);\n\n if (isCloudinaryAsset && cloudinaryImage) {\n return (\n <>\n <AdvancedImage\n cldImg={cloudinaryImage}\n onError={() => handleLoadingChange(false)}\n onLoad={() => handleLoadingChange(false)}\n style={{ maxWidth: loading ? '0%' : '100%', maxHeight: '100%', objectFit: 'cover' }}\n />\n {loading && <StyledSkeleton animation=\"wave\" variant=\"rounded\" />}\n </>\n );\n }\n\n return (\n <>\n <Imgix\n htmlAttributes={{\n onLoad: () => handleLoadingChange(false),\n onError: () => handleLoadingChange(false),\n style: {\n maxWidth: loading ? '0%' : '100%',\n maxHeight: '100%',\n objectFit: 'cover',\n },\n }}\n src={src}\n />\n {loading && <StyledSkeleton animation=\"wave\" variant=\"rounded\" />}\n </>\n );\n};\n\nexport default ImageDisplay;\n"],"names":["StyledSkeleton","styled","Skeleton","width","height","src","isCloudinaryAsset","cdnCloudName","loading","setLoading","useState","handleLoadingChange","loadingState","cloudinaryImage","useMemo","Cloudinary","cloud","cloudName","image","_jsxs","_Fragment","children","_jsx","AdvancedImage","cldImg","onError","onLoad","style","maxWidth","maxHeight","objectFit","animation","variant","Imgix","htmlAttributes"],"mappings":"kPAeA,MAAMA,EAAiBC,EAAOC,EAAPD,CAAiB,CACtCE,MAAO,OACPC,OAAQ,wBAGwC,EAAGC,MAAKC,oBAAmBC,mBAC3E,MAAOC,EAASC,GAAcC,EAAAA,UAAS,GAEjCC,EAAuBC,IAC3BH,EAAWG,IAGPC,EAAkBC,EAAAA,QAAgC,KACtD,GAAIR,EAAmB,CAMrB,OAL2B,IAAIS,aAAW,CACxCC,MAAO,CACLC,UAAWV,KAGWW,MAAMb,EAClC,CACA,OAAO,MACN,CAACA,EAAKC,EAAmBC,IAE5B,OAAID,GAAqBO,EAErBM,EAAAA,KAAAC,EAAAA,SAAA,CAAAC,SAAA,CACEC,MAACC,EAAAA,eACCC,OAAQX,EACRY,QAAS,IAAMd,GAAoB,GACnCe,OAAQ,IAAMf,GAAoB,GAClCgB,MAAO,CAAEC,SAAUpB,EAAU,KAAO,OAAQqB,UAAW,OAAQC,UAAW,WAE3EtB,GAAWc,MAACtB,GAAe+B,UAAU,OAAOC,QAAQ,eAMzDb,EAAAA,KAAAC,EAAAA,SAAA,CAAAC,SAAA,CACEC,MAACW,EAAK,CACJC,eAAgB,CACdR,OAAQ,IAAMf,GAAoB,GAClCc,QAAS,IAAMd,GAAoB,GACnCgB,MAAO,CACLC,SAAUpB,EAAU,KAAO,OAC3BqB,UAAW,OACXC,UAAW,UAGfzB,IAAKA,IAENG,GAAWc,EAAAA,IAACtB,EAAc,CAAC+B,UAAU,OAAOC,QAAQ"}

package/dist/components/organisms/ImageUploadWidget/components/ImageDisplay.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as r,Fragment as t,jsx as o}from"react/jsx-runtime";import{useState as e,useMemo as i}from"react";import a from"@mui/material/Skeleton/Skeleton";import m from"@mui/material/styles/styled";import{AdvancedImage as n}from"@cloudinary/react";import{Cloudinary as l}from"@cloudinary/url-gen";import d from"react-imgix";const c=m(a)({width:"100%",height:"100%"}),u=({src:a,isCloudinaryAsset:m,cdnCloudName:u})=>{const[s,h]=e(!0),f=r=>{h(r)},p=i((()=>{if(m){return new l({cloud:{cloudName:u}}).image(a)}return null}),[a,m,u]);return r(t,m&&p?{children:[o(n,{cldImg:p,onError:()=>f(!1),onLoad:()=>f(!1),style:{maxWidth:s?"0%":"100%",maxHeight:"100%",objectFit:"cover"}}),s&&o(c,{animation:"wave",variant:"rounded"})]}:{children:[o(d,{htmlAttributes:{onLoad:()=>f(!1),onError:()=>f(!1),style:{maxWidth:s?"0%":"100%",maxHeight:"100%",objectFit:"cover"}},src:a}),s&&o(c,{animation:"wave",variant:"rounded"})]})};export{u as default};
+import{jsxs as r,Fragment as t,jsx as o}from"react/jsx-runtime";import{useState as e,useMemo as i}from"react";import a from"@mui/material/Skeleton/Skeleton";import m from"@mui/material/styles/styled";import{AdvancedImage as n}from"@cloudinary/react";import{Cloudinary as l}from"@cloudinary/url-gen";import d from"react-imgix";const c=m(a)({width:"100%",height:"100%"}),u=({src:a,isCloudinaryAsset:m,cdnCloudName:u})=>{const[s,h]=e(!0),f=r=>{h(r)},p=i(()=>{if(m){return new l({cloud:{cloudName:u}}).image(a)}return null},[a,m,u]);return r(t,m&&p?{children:[o(n,{cldImg:p,onError:()=>f(!1),onLoad:()=>f(!1),style:{maxWidth:s?"0%":"100%",maxHeight:"100%",objectFit:"cover"}}),s&&o(c,{animation:"wave",variant:"rounded"})]}:{children:[o(d,{htmlAttributes:{onLoad:()=>f(!1),onError:()=>f(!1),style:{maxWidth:s?"0%":"100%",maxHeight:"100%",objectFit:"cover"}},src:a}),s&&o(c,{animation:"wave",variant:"rounded"})]})};export{u as default};
 //# sourceMappingURL=ImageDisplay.js.map

package/dist/components/organisms/ImageUploadWidget/components/ImageDisplay.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ImageDisplay.js","sources":["../../../../../src/components/organisms/ImageUploadWidget/components/ImageDisplay.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\n\nimport Skeleton from '@mui/material/Skeleton/Skeleton';\nimport styled from '@mui/material/styles/styled';\n\nimport { AdvancedImage } from '@cloudinary/react';\nimport { Cloudinary, type CloudinaryImage } from '@cloudinary/url-gen';\nimport Imgix from 'react-imgix';\n\ninterface ImageDisplayProps {\n src: string;\n isCloudinaryAsset?: boolean;\n cdnCloudName?: string;\n}\n\nconst StyledSkeleton = styled(Skeleton)({\n width: '100%',\n height: '100%',\n});\n\nconst ImageDisplay: React.FC<ImageDisplayProps> = ({ src, isCloudinaryAsset, cdnCloudName }) => {\n const [loading, setLoading] = useState(true);\n\n const handleLoadingChange = (loadingState: boolean): void => {\n setLoading(loadingState);\n };\n\n const cloudinaryImage = useMemo<CloudinaryImage \| null>(() => {\n if (isCloudinaryAsset) {\n const cloudinaryInstance = new Cloudinary({\n cloud: {\n cloudName: cdnCloudName,\n },\n });\n return cloudinaryInstance.image(src);\n }\n return null;\n }, [src, isCloudinaryAsset, cdnCloudName]);\n\n if (isCloudinaryAsset && cloudinaryImage) {\n return (\n <>\n <AdvancedImage\n cldImg={cloudinaryImage}\n onError={() => handleLoadingChange(false)}\n onLoad={() => handleLoadingChange(false)}\n style={{ maxWidth: loading ? '0%' : '100%', maxHeight: '100%', objectFit: 'cover' }}\n />\n {loading && <StyledSkeleton animation=\"wave\" variant=\"rounded\" />}\n </>\n );\n }\n\n return (\n <>\n <Imgix\n htmlAttributes={{\n onLoad: () => handleLoadingChange(false),\n onError: () => handleLoadingChange(false),\n style: {\n maxWidth: loading ? '0%' : '100%',\n maxHeight: '100%',\n objectFit: 'cover',\n },\n }}\n src={src}\n />\n {loading && <StyledSkeleton animation=\"wave\" variant=\"rounded\" />}\n </>\n );\n};\n\nexport default ImageDisplay;\n"],"names":["StyledSkeleton","styled","Skeleton","width","height","ImageDisplay","src","isCloudinaryAsset","cdnCloudName","loading","setLoading","useState","handleLoadingChange","loadingState","cloudinaryImage","useMemo","Cloudinary","cloud","cloudName","image","_jsxs","_Fragment","children","_jsx","AdvancedImage","cldImg","onError","onLoad","style","maxWidth","maxHeight","objectFit","animation","variant","Imgix","htmlAttributes"],"mappings":"sUAeA,MAAMA,EAAiBC,EAAOC,EAAPD,CAAiB,CACtCE,MAAO,OACPC,OAAQ,SAGJC,EAA4C,EAAGC,MAAKC,oBAAmBC,mBAC3E,MAAOC,EAASC,GAAcC,GAAS,GAEjCC,EAAuBC,IAC3BH,EAAWG,IAGPC,EAAkBC,~~GAAgC~~,KACtD,GAAIR,EAAmB,CAMrB,OAL2B,IAAIS,EAAW,CACxCC,MAAO,CACLC,UAAWV,KAGWW,MAAMb,EAClC,CACA,OAAO,~~OACN~~,CAACA,EAAKC,EAAmBC,IAE5B,OAEIY,EAAAC,EAFAd,GAAqBO,EAErB,CAAAQ,SAAA,CACEC,EAACC,GACCC,OAAQX,EACRY,QAAS,IAAMd,GAAoB,GACnCe,OAAQ,IAAMf,GAAoB,GAClCgB,MAAO,CAAEC,SAAUpB,EAAU,KAAO,OAAQqB,UAAW,OAAQC,UAAW,WAE3EtB,GAAWc,EAACvB,GAAegC,UAAU,OAAOC,QAAQ,cAMzD,CAAAX,SAAA,CACEC,EAACW,EAAK,CACJC,eAAgB,CACdR,OAAQ,IAAMf,GAAoB,GAClCc,QAAS,IAAMd,GAAoB,GACnCgB,MAAO,CACLC,SAAUpB,EAAU,KAAO,OAC3BqB,UAAW,OACXC,UAAW,UAGfzB,IAAKA,IAENG,GAAWc,EAACvB,EAAc,CAACgC,UAAU,OAAOC,QAAQ"}
1	+ {"version":3,"file":"ImageDisplay.js","sources":["../../../../../src/components/organisms/ImageUploadWidget/components/ImageDisplay.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\n\nimport Skeleton from '@mui/material/Skeleton/Skeleton';\nimport styled from '@mui/material/styles/styled';\n\nimport { AdvancedImage } from '@cloudinary/react';\nimport { Cloudinary, type CloudinaryImage } from '@cloudinary/url-gen';\nimport Imgix from 'react-imgix';\n\ninterface ImageDisplayProps {\n src: string;\n isCloudinaryAsset?: boolean;\n cdnCloudName?: string;\n}\n\nconst StyledSkeleton = styled(Skeleton)({\n width: '100%',\n height: '100%',\n});\n\nconst ImageDisplay: React.FC<ImageDisplayProps> = ({ src, isCloudinaryAsset, cdnCloudName }) => {\n const [loading, setLoading] = useState(true);\n\n const handleLoadingChange = (loadingState: boolean): void => {\n setLoading(loadingState);\n };\n\n const cloudinaryImage = useMemo<CloudinaryImage \| null>(() => {\n if (isCloudinaryAsset) {\n const cloudinaryInstance = new Cloudinary({\n cloud: {\n cloudName: cdnCloudName,\n },\n });\n return cloudinaryInstance.image(src);\n }\n return null;\n }, [src, isCloudinaryAsset, cdnCloudName]);\n\n if (isCloudinaryAsset && cloudinaryImage) {\n return (\n <>\n <AdvancedImage\n cldImg={cloudinaryImage}\n onError={() => handleLoadingChange(false)}\n onLoad={() => handleLoadingChange(false)}\n style={{ maxWidth: loading ? '0%' : '100%', maxHeight: '100%', objectFit: 'cover' }}\n />\n {loading && <StyledSkeleton animation=\"wave\" variant=\"rounded\" />}\n </>\n );\n }\n\n return (\n <>\n <Imgix\n htmlAttributes={{\n onLoad: () => handleLoadingChange(false),\n onError: () => handleLoadingChange(false),\n style: {\n maxWidth: loading ? '0%' : '100%',\n maxHeight: '100%',\n objectFit: 'cover',\n },\n }}\n src={src}\n />\n {loading && <StyledSkeleton animation=\"wave\" variant=\"rounded\" />}\n </>\n );\n};\n\nexport default ImageDisplay;\n"],"names":["StyledSkeleton","styled","Skeleton","width","height","ImageDisplay","src","isCloudinaryAsset","cdnCloudName","loading","setLoading","useState","handleLoadingChange","loadingState","cloudinaryImage","useMemo","Cloudinary","cloud","cloudName","image","_jsxs","_Fragment","children","_jsx","AdvancedImage","cldImg","onError","onLoad","style","maxWidth","maxHeight","objectFit","animation","variant","Imgix","htmlAttributes"],"mappings":"sUAeA,MAAMA,EAAiBC,EAAOC,EAAPD,CAAiB,CACtCE,MAAO,OACPC,OAAQ,SAGJC,EAA4C,EAAGC,MAAKC,oBAAmBC,mBAC3E,MAAOC,EAASC,GAAcC,GAAS,GAEjCC,EAAuBC,IAC3BH,EAAWG,IAGPC,EAAkBC,EAAgC,KACtD,GAAIR,EAAmB,CAMrB,OAL2B,IAAIS,EAAW,CACxCC,MAAO,CACLC,UAAWV,KAGWW,MAAMb,EAClC,CACA,OAAO,MACN,CAACA,EAAKC,EAAmBC,IAE5B,OAEIY,EAAAC,EAFAd,GAAqBO,EAErB,CAAAQ,SAAA,CACEC,EAACC,GACCC,OAAQX,EACRY,QAAS,IAAMd,GAAoB,GACnCe,OAAQ,IAAMf,GAAoB,GAClCgB,MAAO,CAAEC,SAAUpB,EAAU,KAAO,OAAQqB,UAAW,OAAQC,UAAW,WAE3EtB,GAAWc,EAACvB,GAAegC,UAAU,OAAOC,QAAQ,cAMzD,CAAAX,SAAA,CACEC,EAACW,EAAK,CACJC,eAAgB,CACdR,OAAQ,IAAMf,GAAoB,GAClCc,QAAS,IAAMd,GAAoB,GACnCgB,MAAO,CACLC,SAAUpB,EAAU,KAAO,OAC3BqB,UAAW,OACXC,UAAW,UAGfzB,IAAKA,IAENG,GAAWc,EAACvB,EAAc,CAACgC,UAAU,OAAOC,QAAQ"}

package/dist/components/organisms/ImageUploadWidget/components/ImageDropZone.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),i=require("@mui/material/Box/Box"),t=require("@mui/material/Stack/Stack"),o=require("@mui/material/styles/styled"),n=require("@mui/material/Typography/Typography"),r=require("../../../atoms/TextField/index.cjs.js"),l=require("react-images-uploading");const a=o(i)((({theme:e})=>({flex:"1",display:"flex",flexDirection:"column",height:"100%",boxSizing:"border-box",alignItems:"center",justifyContent:"space-between",padding:"12px",borderRadius:"4px",border:"1px solid rgba(0, 0, 0, 0.10)",background:"#FAFAFA",[e.breakpoints.only("mobile")]:{justifyContent:"center",gap:"32px"}}))),d=o(i)({display:"flex",flexDirection:"column",width:"48px",height:"48px",padding:"0px",justifyContent:"center",alignItems:"center",borderRadius:"32px",backgroundColor:"rgba(0, 0, 0, 0.04)"}),s=o(n)({color:"rgba(0, 0, 0, 0.90)",fontFamily:"Roboto",fontSize:"16px",fontStyle:"normal",fontWeight:"600",lineHeight:"24px",letterSpacing:"0px",textDecoration:"underline",textDecorationStyle:"solid",textDecorationSkipInk:"auto",textDecorationThickness:"auto",textUnderlineOffset:"25%",textUnderlinePosition:"from-font",cursor:"pointer"}),c=o(n)({fontFamily:"Roboto",fontSize:"14px",fontStyle:"normal",fontWeight:400,lineHeight:"20px",letterSpacing:"0px",textAlign:"center"}),g=o("img")({maxWidth:"100%",maxHeight:"100%",borderRadius:"4px",objectFit:"cover"}),p=o("form")({width:"100%",maxWidth:"400px"}),x=["jpg","jpeg","png","gif","bmp"];module.exports=({selectedImage:i,onImageSelect:o,uploadingError:n,allowImageLinkUpload:C,imageLink:m,onImageLinkChange:h=()=>{},onUploadImageLink:u=()=>{}})=>{const f=e=>{e.preventDefault(),u(m)};return e.jsx(l,{acceptType:x,onChange:e=>{const i=e[0];i&&o(i)},value:i?[i]:[],children:({onImageUpload:o,dragProps:l})=>{const x=`Error occurred while uploading image: ${n?.message?n.message:""}`;return i?.dataURL?e.jsx(g,{src:i.dataURL}):e.jsxs(a,{...l,children:[e.jsx(d,{children:e.jsxs("svg",{fill:"none",height:"24",viewBox:"0 0 24 24",width:"24",xmlns:"http://www.w3.org/2000/svg",children:[e.jsx("title",{children:"Upload icon"}),e.jsx("path",{clipRule:"evenodd",d:"M17.8453 2.18282C16.4851 1.99996 14.7504 1.99998 12.5745 2H12.4255C10.2496 1.99998 8.51485 1.99996 7.15471 2.18282C5.75034 2.37164 4.59652 2.77175 3.68413 3.68414C2.77174 4.59653 2.37164 5.75034 2.18282 7.15471C1.99996 8.51485 1.99998 10.2496 2 12.4255V12.5745C1.99998 14.7504 1.99996 16.4851 2.18282 17.8453C2.37164 19.2497 2.77177 20.4035 3.68415 21.3159C4.59654 22.2283 5.75034 22.6284 7.15472 22.8172C8.51486 23 10.2496 23 12.4256 23H12.5744C14.7504 23 16.4851 23 17.8453 22.8172C19.2496 22.6284 20.4035 22.2282 21.3159 21.3159C22.2283 20.4035 22.6284 19.2496 22.8172 17.8453C23 16.4851 23 14.7504 23 12.5744V12.4256C23 10.2496 23 8.51486 22.8172 7.15472C22.6284 5.75034 22.2283 4.59651 21.3159 3.68412C20.4035 2.77174 19.2497 2.37164 17.8453 2.18282ZM5.09835 5.09835C5.57721 4.61949 6.23861 4.32398 7.42121 4.16499C8.63258 4.00212 10.2326 4 12.5 4C14.7674 4 16.3674 4.00212 17.5788 4.16499C18.7614 4.32399 19.4228 4.6195 19.9017 5.09836C20.3805 5.57722 20.676 6.23862 20.835 7.42121C20.9943 8.60603 20.9998 10.1626 21 12.3519C19.6026 11.7105 18.2505 11.4471 16.9403 11.5088C15.1642 11.5923 13.5635 12.2683 12.1227 13.2344C9.67205 14.8776 7.51569 17.4909 5.59833 19.8145L5.34633 20.1197C5.25795 20.0517 5.17577 19.9791 5.09836 19.9017C4.6195 19.4228 4.32399 18.7614 4.16499 17.5788C4.00212 16.3674 4 14.7674 4 12.5C4 10.2326 4.00212 8.63258 4.16499 7.42121C4.32398 6.23861 4.6195 5.5772 5.09835 5.09835ZM20.993 14.5995C19.5215 13.7462 18.2137 13.4511 17.0342 13.5065C15.7231 13.5682 14.4707 14.068 13.2366 14.8955C11.1229 16.3128 9.2346 18.5584 7.3582 20.8263L7.42121 20.835C8.63258 20.9979 10.2326 21 12.5 21C14.7674 21 16.3674 20.9979 17.5788 20.835C18.7614 20.676 19.4228 20.3805 19.9017 19.9017C20.3805 19.4228 20.676 18.7614 20.835 17.5788C20.9423 16.7808 20.9798 15.8143 20.993 14.5995Z",fill:"black",fillOpacity:"0.45",fillRule:"evenodd"}),e.jsx("path",{clipRule:"evenodd",d:"M10.5 8C10.5 6.61929 9.38071 5.5 8 5.5C7.72212 5.5 7.45482 5.54534 7.20511 5.62902C6.21409 5.96113 5.5 6.89717 5.5 8C5.5 8.84194 5.91619 9.58667 6.55407 10.0397C6.96226 10.3296 7.46123 10.5 8 10.5C9.38071 10.5 10.5 9.38071 10.5 8ZM8 7.5C7.72386 7.5 7.5 7.72386 7.5 8C7.5 8.27614 7.72386 8.5 8 8.5C8.27614 8.5 8.5 8.27614 8.5 8C8.5 7.72386 8.27614 7.5 8 7.5Z",fill:"black",fillOpacity:"0.45",fillRule:"evenodd"})]})}),e.jsxs(t,{alignItems:"center",direction:"column",gap:"8px",width:"100%",children:[e.jsx(s,{onClick:o,children:"Select an image"}),e.jsxs(c,{color:"rgba(0, 0, 0, 0.90)",children:["OR drop it here",C&&" OR paste the image URL below"]}),C&&e.jsx(p,{"data-fd":"image-link-form",onSubmit:f,children:e.jsx(r.TextField,{fullWidth:!0,fdKey:"img-link",onChange:e=>h(e.target.value),placeholder:"Enter image URL",value:m})})]}),e.jsx(c,{color:"rgba(0, 0, 0, 0.60)",children:"Minimum dimensions: 1280 × 720 - up to 10 MB"}),e.jsx(c,{color:"rgba(184, 0, 34, 0.80)",sx:e=>({overflowY:"scroll",height:"30px",[e.breakpoints.only("mobile")]:{height:"120px"}}),children:n?x:""})]})}})};
+"use strict";var e=require("react/jsx-runtime"),i=require("@mui/material/Box/Box"),t=require("@mui/material/Stack/Stack"),o=require("@mui/material/styles/styled"),n=require("@mui/material/Typography/Typography"),r=require("../../../atoms/TextField/index.cjs.js"),l=require("react-images-uploading");const a=o(i)(({theme:e})=>({flex:"1",display:"flex",flexDirection:"column",height:"100%",boxSizing:"border-box",alignItems:"center",justifyContent:"space-between",padding:"12px",borderRadius:"4px",border:"1px solid rgba(0, 0, 0, 0.10)",background:"#FAFAFA",[e.breakpoints.only("mobile")]:{justifyContent:"center",gap:"32px"}})),d=o(i)({display:"flex",flexDirection:"column",width:"48px",height:"48px",padding:"0px",justifyContent:"center",alignItems:"center",borderRadius:"32px",backgroundColor:"rgba(0, 0, 0, 0.04)"}),s=o(n)({color:"rgba(0, 0, 0, 0.90)",fontFamily:"Roboto",fontSize:"16px",fontStyle:"normal",fontWeight:"600",lineHeight:"24px",letterSpacing:"0px",textDecoration:"underline",textDecorationStyle:"solid",textDecorationSkipInk:"auto",textDecorationThickness:"auto",textUnderlineOffset:"25%",textUnderlinePosition:"from-font",cursor:"pointer"}),c=o(n)({fontFamily:"Roboto",fontSize:"14px",fontStyle:"normal",fontWeight:400,lineHeight:"20px",letterSpacing:"0px",textAlign:"center"}),g=o("img")({maxWidth:"100%",maxHeight:"100%",borderRadius:"4px",objectFit:"cover"}),p=o("form")({width:"100%",maxWidth:"400px"}),x=["jpg","jpeg","png","gif","bmp"];module.exports=({selectedImage:i,onImageSelect:o,uploadingError:n,allowImageLinkUpload:C,imageLink:m,onImageLinkChange:h=()=>{},onUploadImageLink:u=()=>{}})=>{const f=e=>{e.preventDefault(),u(m)};return e.jsx(l,{acceptType:x,onChange:e=>{const i=e[0];i&&o(i)},value:i?[i]:[],children:({onImageUpload:o,dragProps:l})=>{const x=`Error occurred while uploading image: ${n?.message?n.message:""}`;return i?.dataURL?e.jsx(g,{src:i.dataURL}):e.jsxs(a,{...l,children:[e.jsx(d,{children:e.jsxs("svg",{fill:"none",height:"24",viewBox:"0 0 24 24",width:"24",xmlns:"http://www.w3.org/2000/svg",children:[e.jsx("title",{children:"Upload icon"}),e.jsx("path",{clipRule:"evenodd",d:"M17.8453 2.18282C16.4851 1.99996 14.7504 1.99998 12.5745 2H12.4255C10.2496 1.99998 8.51485 1.99996 7.15471 2.18282C5.75034 2.37164 4.59652 2.77175 3.68413 3.68414C2.77174 4.59653 2.37164 5.75034 2.18282 7.15471C1.99996 8.51485 1.99998 10.2496 2 12.4255V12.5745C1.99998 14.7504 1.99996 16.4851 2.18282 17.8453C2.37164 19.2497 2.77177 20.4035 3.68415 21.3159C4.59654 22.2283 5.75034 22.6284 7.15472 22.8172C8.51486 23 10.2496 23 12.4256 23H12.5744C14.7504 23 16.4851 23 17.8453 22.8172C19.2496 22.6284 20.4035 22.2282 21.3159 21.3159C22.2283 20.4035 22.6284 19.2496 22.8172 17.8453C23 16.4851 23 14.7504 23 12.5744V12.4256C23 10.2496 23 8.51486 22.8172 7.15472C22.6284 5.75034 22.2283 4.59651 21.3159 3.68412C20.4035 2.77174 19.2497 2.37164 17.8453 2.18282ZM5.09835 5.09835C5.57721 4.61949 6.23861 4.32398 7.42121 4.16499C8.63258 4.00212 10.2326 4 12.5 4C14.7674 4 16.3674 4.00212 17.5788 4.16499C18.7614 4.32399 19.4228 4.6195 19.9017 5.09836C20.3805 5.57722 20.676 6.23862 20.835 7.42121C20.9943 8.60603 20.9998 10.1626 21 12.3519C19.6026 11.7105 18.2505 11.4471 16.9403 11.5088C15.1642 11.5923 13.5635 12.2683 12.1227 13.2344C9.67205 14.8776 7.51569 17.4909 5.59833 19.8145L5.34633 20.1197C5.25795 20.0517 5.17577 19.9791 5.09836 19.9017C4.6195 19.4228 4.32399 18.7614 4.16499 17.5788C4.00212 16.3674 4 14.7674 4 12.5C4 10.2326 4.00212 8.63258 4.16499 7.42121C4.32398 6.23861 4.6195 5.5772 5.09835 5.09835ZM20.993 14.5995C19.5215 13.7462 18.2137 13.4511 17.0342 13.5065C15.7231 13.5682 14.4707 14.068 13.2366 14.8955C11.1229 16.3128 9.2346 18.5584 7.3582 20.8263L7.42121 20.835C8.63258 20.9979 10.2326 21 12.5 21C14.7674 21 16.3674 20.9979 17.5788 20.835C18.7614 20.676 19.4228 20.3805 19.9017 19.9017C20.3805 19.4228 20.676 18.7614 20.835 17.5788C20.9423 16.7808 20.9798 15.8143 20.993 14.5995Z",fill:"black",fillOpacity:"0.45",fillRule:"evenodd"}),e.jsx("path",{clipRule:"evenodd",d:"M10.5 8C10.5 6.61929 9.38071 5.5 8 5.5C7.72212 5.5 7.45482 5.54534 7.20511 5.62902C6.21409 5.96113 5.5 6.89717 5.5 8C5.5 8.84194 5.91619 9.58667 6.55407 10.0397C6.96226 10.3296 7.46123 10.5 8 10.5C9.38071 10.5 10.5 9.38071 10.5 8ZM8 7.5C7.72386 7.5 7.5 7.72386 7.5 8C7.5 8.27614 7.72386 8.5 8 8.5C8.27614 8.5 8.5 8.27614 8.5 8C8.5 7.72386 8.27614 7.5 8 7.5Z",fill:"black",fillOpacity:"0.45",fillRule:"evenodd"})]})}),e.jsxs(t,{alignItems:"center",direction:"column",gap:"8px",width:"100%",children:[e.jsx(s,{onClick:o,children:"Select an image"}),e.jsxs(c,{color:"rgba(0, 0, 0, 0.90)",children:["OR drop it here",C&&" OR paste the image URL below"]}),C&&e.jsx(p,{"data-fd":"image-link-form",onSubmit:f,children:e.jsx(r.TextField,{fullWidth:!0,fdKey:"img-link",onChange:e=>h(e.target.value),placeholder:"Enter image URL",value:m})})]}),e.jsx(c,{color:"rgba(0, 0, 0, 0.60)",children:"Minimum dimensions: 1280 × 720 - up to 10 MB"}),e.jsx(c,{color:"rgba(184, 0, 34, 0.80)",sx:e=>({overflowY:"scroll",height:"30px",[e.breakpoints.only("mobile")]:{height:"120px"}}),children:n?x:""})]})}})};
 //# sourceMappingURL=ImageDropZone.cjs.js.map

package/dist/components/organisms/ImageUploadWidget/components/ImageDropZone.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ImageDropZone.cjs.js","sources":["../../../../../src/components/organisms/ImageUploadWidget/components/ImageDropZone.tsx"],"sourcesContent":["import Box from '@mui/material/Box/Box';\nimport Stack from '@mui/material/Stack/Stack';\nimport styled from '@mui/material/styles/styled';\nimport Typography from '@mui/material/Typography/Typography';\n\nimport TextField from '@fd/components/atoms/TextField';\nimport ReactImageUploading, { type ImageListType, type ImageType } from 'react-images-uploading';\n\nconst StyledUploadAreaContainer = styled(Box)(({ theme }) => ({\n flex: '1',\n display: 'flex',\n flexDirection: 'column',\n height: '100%',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'space-between',\n padding: '12px',\n borderRadius: '4px',\n border: '1px solid rgba(0, 0, 0, 0.10)',\n background: '#FAFAFA',\n [theme.breakpoints.only('mobile')]: {\n justifyContent: 'center',\n gap: '32px',\n },\n}));\n\nconst StyledIconContainer = styled(Box)({\n display: 'flex',\n flexDirection: 'column',\n width: '48px',\n height: '48px',\n padding: '0px',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: '32px',\n backgroundColor: 'rgba(0, 0, 0, 0.04)',\n});\n\nconst StyledPrimaryText = styled(Typography)({\n color: 'rgba(0, 0, 0, 0.90)',\n fontFamily: 'Roboto',\n fontSize: '16px',\n fontStyle: 'normal',\n fontWeight: '600',\n lineHeight: '24px',\n letterSpacing: '0px',\n textDecoration: 'underline',\n textDecorationStyle: 'solid',\n textDecorationSkipInk: 'auto',\n textDecorationThickness: 'auto',\n textUnderlineOffset: '25%',\n textUnderlinePosition: 'from-font',\n cursor: 'pointer',\n});\n\nconst StyledSecondaryText = styled(Typography)({\n fontFamily: 'Roboto',\n fontSize: '14px',\n fontStyle: 'normal',\n fontWeight: 400,\n lineHeight: '20px',\n letterSpacing: '0px',\n textAlign: 'center',\n});\n\nconst StyledImageComponent = styled('img')({\n maxWidth: '100%',\n maxHeight: '100%',\n borderRadius: '4px',\n objectFit: 'cover',\n});\n\nconst StyledForm = styled('form')({\n width: '100%',\n maxWidth: '400px',\n});\n\ninterface ImageDropZoneProps {\n selectedImage: ImageType \| null;\n onImageSelect: (selectedImage: ImageType) => void;\n allowImageLinkUpload: boolean;\n imageLink: string;\n onUploadImageLink?: (link: string) => void;\n onImageLinkChange?: (link: string) => void;\n uploadingError: Error \| null;\n}\n\nconst allowedFileTypes = ['jpg', 'jpeg', 'png', 'gif', 'bmp'];\n\nconst ImageDropZone: React.FC<ImageDropZoneProps> = ({\n selectedImage,\n onImageSelect,\n uploadingError,\n allowImageLinkUpload,\n imageLink,\n onImageLinkChange = (): void => {},\n onUploadImageLink = (): void => {},\n}) => {\n const handleImageSelect = (value: ImageListType): void => {\n const firstImage = value[0] as ImageType \| undefined;\n if (firstImage) {\n onImageSelect(firstImage);\n }\n };\n\n const handleImageLinkUpload = (e: React.FormEvent): void => {\n e.preventDefault();\n onUploadImageLink(imageLink);\n };\n\n return (\n <ReactImageUploading\n acceptType={allowedFileTypes}\n onChange={handleImageSelect}\n value={selectedImage ? [selectedImage] : []}\n >\n {({ onImageUpload, dragProps }) => {\n const uploadErrorMessage = `Error occurred while uploading image: ${uploadingError?.message ? uploadingError.message : ''}`;\n\n if (selectedImage?.dataURL) {\n return <StyledImageComponent src={selectedImage.dataURL} />;\n }\n\n return (\n <StyledUploadAreaContainer {...dragProps}>\n <StyledIconContainer>\n <svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n <title>Upload icon</title>\n <path\n clipRule=\"evenodd\"\n d=\"M17.8453 2.18282C16.4851 1.99996 14.7504 1.99998 12.5745 2H12.4255C10.2496 1.99998 8.51485 1.99996 7.15471 2.18282C5.75034 2.37164 4.59652 2.77175 3.68413 3.68414C2.77174 4.59653 2.37164 5.75034 2.18282 7.15471C1.99996 8.51485 1.99998 10.2496 2 12.4255V12.5745C1.99998 14.7504 1.99996 16.4851 2.18282 17.8453C2.37164 19.2497 2.77177 20.4035 3.68415 21.3159C4.59654 22.2283 5.75034 22.6284 7.15472 22.8172C8.51486 23 10.2496 23 12.4256 23H12.5744C14.7504 23 16.4851 23 17.8453 22.8172C19.2496 22.6284 20.4035 22.2282 21.3159 21.3159C22.2283 20.4035 22.6284 19.2496 22.8172 17.8453C23 16.4851 23 14.7504 23 12.5744V12.4256C23 10.2496 23 8.51486 22.8172 7.15472C22.6284 5.75034 22.2283 4.59651 21.3159 3.68412C20.4035 2.77174 19.2497 2.37164 17.8453 2.18282ZM5.09835 5.09835C5.57721 4.61949 6.23861 4.32398 7.42121 4.16499C8.63258 4.00212 10.2326 4 12.5 4C14.7674 4 16.3674 4.00212 17.5788 4.16499C18.7614 4.32399 19.4228 4.6195 19.9017 5.09836C20.3805 5.57722 20.676 6.23862 20.835 7.42121C20.9943 8.60603 20.9998 10.1626 21 12.3519C19.6026 11.7105 18.2505 11.4471 16.9403 11.5088C15.1642 11.5923 13.5635 12.2683 12.1227 13.2344C9.67205 14.8776 7.51569 17.4909 5.59833 19.8145L5.34633 20.1197C5.25795 20.0517 5.17577 19.9791 5.09836 19.9017C4.6195 19.4228 4.32399 18.7614 4.16499 17.5788C4.00212 16.3674 4 14.7674 4 12.5C4 10.2326 4.00212 8.63258 4.16499 7.42121C4.32398 6.23861 4.6195 5.5772 5.09835 5.09835ZM20.993 14.5995C19.5215 13.7462 18.2137 13.4511 17.0342 13.5065C15.7231 13.5682 14.4707 14.068 13.2366 14.8955C11.1229 16.3128 9.2346 18.5584 7.3582 20.8263L7.42121 20.835C8.63258 20.9979 10.2326 21 12.5 21C14.7674 21 16.3674 20.9979 17.5788 20.835C18.7614 20.676 19.4228 20.3805 19.9017 19.9017C20.3805 19.4228 20.676 18.7614 20.835 17.5788C20.9423 16.7808 20.9798 15.8143 20.993 14.5995Z\"\n fill=\"black\"\n fillOpacity=\"0.45\"\n fillRule=\"evenodd\"\n />\n <path\n clipRule=\"evenodd\"\n d=\"M10.5 8C10.5 6.61929 9.38071 5.5 8 5.5C7.72212 5.5 7.45482 5.54534 7.20511 5.62902C6.21409 5.96113 5.5 6.89717 5.5 8C5.5 8.84194 5.91619 9.58667 6.55407 10.0397C6.96226 10.3296 7.46123 10.5 8 10.5C9.38071 10.5 10.5 9.38071 10.5 8ZM8 7.5C7.72386 7.5 7.5 7.72386 7.5 8C7.5 8.27614 7.72386 8.5 8 8.5C8.27614 8.5 8.5 8.27614 8.5 8C8.5 7.72386 8.27614 7.5 8 7.5Z\"\n fill=\"black\"\n fillOpacity=\"0.45\"\n fillRule=\"evenodd\"\n />\n </svg>\n </StyledIconContainer>\n <Stack alignItems=\"center\" direction=\"column\" gap=\"8px\" width=\"100%\">\n <StyledPrimaryText onClick={onImageUpload}>Select an image</StyledPrimaryText>\n <StyledSecondaryText color=\"rgba(0, 0, 0, 0.90)\">\n OR drop it here{allowImageLinkUpload && ' OR paste the image URL below'}\n </StyledSecondaryText>\n {allowImageLinkUpload && (\n <StyledForm data-fd=\"image-link-form\" onSubmit={handleImageLinkUpload}>\n <TextField\n fullWidth\n fdKey=\"img-link\"\n onChange={(e) => onImageLinkChange(e.target.value)}\n placeholder=\"Enter image URL\"\n value={imageLink}\n />\n </StyledForm>\n )}\n </Stack>\n <StyledSecondaryText color=\"rgba(0, 0, 0, 0.60)\">\n Minimum dimensions: 1280 × 720 - up to 10 MB\n </StyledSecondaryText>\n <StyledSecondaryText\n color=\"rgba(184, 0, 34, 0.80)\"\n sx={(theme) => ({\n overflowY: 'scroll',\n height: '30px',\n [theme.breakpoints.only('mobile')]: {\n height: '120px',\n },\n })}\n >\n {uploadingError ? uploadErrorMessage : ''}\n </StyledSecondaryText>\n </StyledUploadAreaContainer>\n );\n }}\n </ReactImageUploading>\n );\n};\n\nexport default ImageDropZone;\n"],"names":["StyledUploadAreaContainer","styled","Box","theme","flex","display","flexDirection","height","boxSizing","alignItems","justifyContent","padding","borderRadius","border","background","breakpoints","only","gap","StyledIconContainer","width","backgroundColor","StyledPrimaryText","Typography","color","fontFamily","fontSize","fontStyle","fontWeight","lineHeight","letterSpacing","textDecoration","textDecorationStyle","textDecorationSkipInk","textDecorationThickness","textUnderlineOffset","textUnderlinePosition","cursor","StyledSecondaryText","textAlign","StyledImageComponent","maxWidth","maxHeight","objectFit","StyledForm","allowedFileTypes","selectedImage","onImageSelect","uploadingError","allowImageLinkUpload","imageLink","onImageLinkChange","onUploadImageLink","handleImageLinkUpload","e","preventDefault","_jsx","ReactImageUploading","acceptType","onChange","value","firstImage","children","onImageUpload","dragProps","uploadErrorMessage","message","dataURL","src","_jsxs","fill","viewBox","xmlns","clipRule","d","fillOpacity","fillRule","Stack","direction","onClick","onSubmit","TextField","fullWidth","fdKey","target","placeholder","sx","overflowY"],"mappings":"2SAQA,MAAMA,EAA4BC,EAAOC,EAAPD,EAAY,EAAGE,YAAO,CACtDC,KAAM,IACNC,QAAS,OACTC,cAAe,SACfC,OAAQ,OACRC,UAAW,aACXC,WAAY,SACZC,eAAgB,gBAChBC,QAAS,OACTC,aAAc,MACdC,OAAQ,gCACRC,WAAY,UACZ,CAACX,EAAMY,YAAYC,KAAK,WAAY,CAClCN,eAAgB,SAChBO,IAAK,YAIHC,EAAsBjB,EAAOC,EAAPD,CAAY,CACtCI,QAAS,OACTC,cAAe,SACfa,MAAO,OACPZ,OAAQ,OACRI,QAAS,MACTD,eAAgB,SAChBD,WAAY,SACZG,aAAc,OACdQ,gBAAiB,wBAGbC,EAAoBpB,EAAOqB,EAAPrB,CAAmB,CAC3CsB,MAAO,sBACPC,WAAY,SACZC,SAAU,OACVC,UAAW,SACXC,WAAY,MACZC,WAAY,OACZC,cAAe,MACfC,eAAgB,YAChBC,oBAAqB,QACrBC,sBAAuB,OACvBC,wBAAyB,OACzBC,oBAAqB,MACrBC,sBAAuB,YACvBC,OAAQ,YAGJC,EAAsBpC,EAAOqB,EAAPrB,CAAmB,CAC7CuB,WAAY,SACZC,SAAU,OACVC,UAAW,SACXC,WAAY,IACZC,WAAY,OACZC,cAAe,MACfS,UAAW,WAGPC,EAAuBtC,EAAO,MAAPA,CAAc,CACzCuC,SAAU,OACVC,UAAW,OACX7B,aAAc,MACd8B,UAAW,UAGPC,EAAa1C,EAAO,OAAPA,CAAe,CAChCkB,MAAO,OACPqB,SAAU,UAaNI,EAAmB,CAAC,MAAO,OAAQ,MAAO,MAAO,sBAEH,EAClDC,gBACAC,gBACAC,iBACAC,uBACAC,YACAC,oBAAoB,OACpBC,oBAAoB,WAEpB,MAOMC,EAAyBC,IAC7BA,EAAEC,iBACFH,EAAkBF,IAGpB,OACEM,EAAAA,IAACC,EAAmB,CAClBC,WAAYb,EACZc,SAfuBC,IACzB,MAAMC,EAAaD,EAAM,GACrBC,GACFd,EAAcc,IAadD,MAAOd,EAAgB,CAACA,GAAiB,GAAEgB,SAE1C,EAAGC,gBAAeC,gBACjB,MAAMC,EAAqB,yCAAyCjB,GAAgBkB,QAAUlB,EAAekB,QAAU,KAEvH,OAAIpB,GAAeqB,QACVX,EAAAA,IAAChB,EAAoB,CAAC4B,IAAKtB,EAAcqB,UAIhDE,EAAAA,KAACpE,EAAyB,IAAK+D,EAASF,SAAA,CACtCN,EAAAA,IAACrC,EAAmB,CAAA2C,SAClBO,EAAAA,KAAA,MAAA,CAAKC,KAAK,OAAO9D,OAAO,KAAK+D,QAAQ,YAAYnD,MAAM,KAAKoD,MAAM,6BAA4BV,SAAA,CAC5FN,EAAAA,IAAA,QAAA,CAAAM,SAAA,gBACAN,EAAAA,IAAA,OAAA,CACEiB,SAAS,UACTC,EAAE,uwDACFJ,KAAK,QACLK,YAAY,OACZC,SAAS,YAEXpB,EAAAA,IAAA,OAAA,CACEiB,SAAS,UACTC,EAAE,wWACFJ,KAAK,QACLK,YAAY,OACZC,SAAS,iBAIfP,EAAAA,KAACQ,EAAK,CAACnE,WAAW,SAASoE,UAAU,SAAS5D,IAAI,MAAME,MAAM,OAAM0C,SAAA,CAClEN,EAAAA,IAAClC,EAAiB,CAACyD,QAAShB,+BAC5BM,EAAAA,KAAC/B,EAAmB,CAACd,MAAM,sBAAqBsC,SAAA,CAAA,kBAC9Bb,GAAwB,mCAEzCA,GACCO,MAACZ,EAAU,CAAA,UAAS,kBAAkBoC,SAAU3B,EAAqBS,SACnEN,EAAAA,IAACyB,YAAS,CACRC,aACAC,MAAM,WACNxB,SAAWL,GAAMH,EAAkBG,EAAE8B,OAAOxB,OAC5CyB,YAAY,kBACZzB,MAAOV,SAKfM,EAAAA,IAAClB,EAAmB,CAACd,MAAM,gFAG3BgC,EAAAA,IAAClB,EAAmB,CAClBd,MAAM,yBACN8D,GAAKlF,IAAK,CACRmF,UAAW,SACX/E,OAAQ,OACR,CAACJ,EAAMY,YAAYC,KAAK,WAAY,CAClCT,OAAQ,WAEVsD,SAEDd,EAAiBiB,EAAqB"}
1	+ {"version":3,"file":"ImageDropZone.cjs.js","sources":["../../../../../src/components/organisms/ImageUploadWidget/components/ImageDropZone.tsx"],"sourcesContent":["import Box from '@mui/material/Box/Box';\nimport Stack from '@mui/material/Stack/Stack';\nimport styled from '@mui/material/styles/styled';\nimport Typography from '@mui/material/Typography/Typography';\n\nimport TextField from '@fd/components/atoms/TextField';\nimport ReactImageUploading, { type ImageListType, type ImageType } from 'react-images-uploading';\n\nconst StyledUploadAreaContainer = styled(Box)(({ theme }) => ({\n flex: '1',\n display: 'flex',\n flexDirection: 'column',\n height: '100%',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'space-between',\n padding: '12px',\n borderRadius: '4px',\n border: '1px solid rgba(0, 0, 0, 0.10)',\n background: '#FAFAFA',\n [theme.breakpoints.only('mobile')]: {\n justifyContent: 'center',\n gap: '32px',\n },\n}));\n\nconst StyledIconContainer = styled(Box)({\n display: 'flex',\n flexDirection: 'column',\n width: '48px',\n height: '48px',\n padding: '0px',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: '32px',\n backgroundColor: 'rgba(0, 0, 0, 0.04)',\n});\n\nconst StyledPrimaryText = styled(Typography)({\n color: 'rgba(0, 0, 0, 0.90)',\n fontFamily: 'Roboto',\n fontSize: '16px',\n fontStyle: 'normal',\n fontWeight: '600',\n lineHeight: '24px',\n letterSpacing: '0px',\n textDecoration: 'underline',\n textDecorationStyle: 'solid',\n textDecorationSkipInk: 'auto',\n textDecorationThickness: 'auto',\n textUnderlineOffset: '25%',\n textUnderlinePosition: 'from-font',\n cursor: 'pointer',\n});\n\nconst StyledSecondaryText = styled(Typography)({\n fontFamily: 'Roboto',\n fontSize: '14px',\n fontStyle: 'normal',\n fontWeight: 400,\n lineHeight: '20px',\n letterSpacing: '0px',\n textAlign: 'center',\n});\n\nconst StyledImageComponent = styled('img')({\n maxWidth: '100%',\n maxHeight: '100%',\n borderRadius: '4px',\n objectFit: 'cover',\n});\n\nconst StyledForm = styled('form')({\n width: '100%',\n maxWidth: '400px',\n});\n\ninterface ImageDropZoneProps {\n selectedImage: ImageType \| null;\n onImageSelect: (selectedImage: ImageType) => void;\n allowImageLinkUpload: boolean;\n imageLink: string;\n onUploadImageLink?: (link: string) => void;\n onImageLinkChange?: (link: string) => void;\n uploadingError: Error \| null;\n}\n\nconst allowedFileTypes = ['jpg', 'jpeg', 'png', 'gif', 'bmp'];\n\nconst ImageDropZone: React.FC<ImageDropZoneProps> = ({\n selectedImage,\n onImageSelect,\n uploadingError,\n allowImageLinkUpload,\n imageLink,\n onImageLinkChange = (): void => {},\n onUploadImageLink = (): void => {},\n}) => {\n const handleImageSelect = (value: ImageListType): void => {\n const firstImage = value[0] as ImageType \| undefined;\n if (firstImage) {\n onImageSelect(firstImage);\n }\n };\n\n const handleImageLinkUpload = (e: React.FormEvent): void => {\n e.preventDefault();\n onUploadImageLink(imageLink);\n };\n\n return (\n <ReactImageUploading\n acceptType={allowedFileTypes}\n onChange={handleImageSelect}\n value={selectedImage ? [selectedImage] : []}\n >\n {({ onImageUpload, dragProps }) => {\n const uploadErrorMessage = `Error occurred while uploading image: ${uploadingError?.message ? uploadingError.message : ''}`;\n\n if (selectedImage?.dataURL) {\n return <StyledImageComponent src={selectedImage.dataURL} />;\n }\n\n return (\n <StyledUploadAreaContainer {...dragProps}>\n <StyledIconContainer>\n <svg fill=\"none\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n <title>Upload icon</title>\n <path\n clipRule=\"evenodd\"\n d=\"M17.8453 2.18282C16.4851 1.99996 14.7504 1.99998 12.5745 2H12.4255C10.2496 1.99998 8.51485 1.99996 7.15471 2.18282C5.75034 2.37164 4.59652 2.77175 3.68413 3.68414C2.77174 4.59653 2.37164 5.75034 2.18282 7.15471C1.99996 8.51485 1.99998 10.2496 2 12.4255V12.5745C1.99998 14.7504 1.99996 16.4851 2.18282 17.8453C2.37164 19.2497 2.77177 20.4035 3.68415 21.3159C4.59654 22.2283 5.75034 22.6284 7.15472 22.8172C8.51486 23 10.2496 23 12.4256 23H12.5744C14.7504 23 16.4851 23 17.8453 22.8172C19.2496 22.6284 20.4035 22.2282 21.3159 21.3159C22.2283 20.4035 22.6284 19.2496 22.8172 17.8453C23 16.4851 23 14.7504 23 12.5744V12.4256C23 10.2496 23 8.51486 22.8172 7.15472C22.6284 5.75034 22.2283 4.59651 21.3159 3.68412C20.4035 2.77174 19.2497 2.37164 17.8453 2.18282ZM5.09835 5.09835C5.57721 4.61949 6.23861 4.32398 7.42121 4.16499C8.63258 4.00212 10.2326 4 12.5 4C14.7674 4 16.3674 4.00212 17.5788 4.16499C18.7614 4.32399 19.4228 4.6195 19.9017 5.09836C20.3805 5.57722 20.676 6.23862 20.835 7.42121C20.9943 8.60603 20.9998 10.1626 21 12.3519C19.6026 11.7105 18.2505 11.4471 16.9403 11.5088C15.1642 11.5923 13.5635 12.2683 12.1227 13.2344C9.67205 14.8776 7.51569 17.4909 5.59833 19.8145L5.34633 20.1197C5.25795 20.0517 5.17577 19.9791 5.09836 19.9017C4.6195 19.4228 4.32399 18.7614 4.16499 17.5788C4.00212 16.3674 4 14.7674 4 12.5C4 10.2326 4.00212 8.63258 4.16499 7.42121C4.32398 6.23861 4.6195 5.5772 5.09835 5.09835ZM20.993 14.5995C19.5215 13.7462 18.2137 13.4511 17.0342 13.5065C15.7231 13.5682 14.4707 14.068 13.2366 14.8955C11.1229 16.3128 9.2346 18.5584 7.3582 20.8263L7.42121 20.835C8.63258 20.9979 10.2326 21 12.5 21C14.7674 21 16.3674 20.9979 17.5788 20.835C18.7614 20.676 19.4228 20.3805 19.9017 19.9017C20.3805 19.4228 20.676 18.7614 20.835 17.5788C20.9423 16.7808 20.9798 15.8143 20.993 14.5995Z\"\n fill=\"black\"\n fillOpacity=\"0.45\"\n fillRule=\"evenodd\"\n />\n <path\n clipRule=\"evenodd\"\n d=\"M10.5 8C10.5 6.61929 9.38071 5.5 8 5.5C7.72212 5.5 7.45482 5.54534 7.20511 5.62902C6.21409 5.96113 5.5 6.89717 5.5 8C5.5 8.84194 5.91619 9.58667 6.55407 10.0397C6.96226 10.3296 7.46123 10.5 8 10.5C9.38071 10.5 10.5 9.38071 10.5 8ZM8 7.5C7.72386 7.5 7.5 7.72386 7.5 8C7.5 8.27614 7.72386 8.5 8 8.5C8.27614 8.5 8.5 8.27614 8.5 8C8.5 7.72386 8.27614 7.5 8 7.5Z\"\n fill=\"black\"\n fillOpacity=\"0.45\"\n fillRule=\"evenodd\"\n />\n </svg>\n </StyledIconContainer>\n <Stack alignItems=\"center\" direction=\"column\" gap=\"8px\" width=\"100%\">\n <StyledPrimaryText onClick={onImageUpload}>Select an image</StyledPrimaryText>\n <StyledSecondaryText color=\"rgba(0, 0, 0, 0.90)\">\n OR drop it here{allowImageLinkUpload && ' OR paste the image URL below'}\n </StyledSecondaryText>\n {allowImageLinkUpload && (\n <StyledForm data-fd=\"image-link-form\" onSubmit={handleImageLinkUpload}>\n <TextField\n fullWidth\n fdKey=\"img-link\"\n onChange={(e) => onImageLinkChange(e.target.value)}\n placeholder=\"Enter image URL\"\n value={imageLink}\n />\n </StyledForm>\n )}\n </Stack>\n <StyledSecondaryText color=\"rgba(0, 0, 0, 0.60)\">\n Minimum dimensions: 1280 × 720 - up to 10 MB\n </StyledSecondaryText>\n <StyledSecondaryText\n color=\"rgba(184, 0, 34, 0.80)\"\n sx={(theme) => ({\n overflowY: 'scroll',\n height: '30px',\n [theme.breakpoints.only('mobile')]: {\n height: '120px',\n },\n })}\n >\n {uploadingError ? uploadErrorMessage : ''}\n </StyledSecondaryText>\n </StyledUploadAreaContainer>\n );\n }}\n </ReactImageUploading>\n );\n};\n\nexport default ImageDropZone;\n"],"names":["StyledUploadAreaContainer","styled","Box","theme","flex","display","flexDirection","height","boxSizing","alignItems","justifyContent","padding","borderRadius","border","background","breakpoints","only","gap","StyledIconContainer","width","backgroundColor","StyledPrimaryText","Typography","color","fontFamily","fontSize","fontStyle","fontWeight","lineHeight","letterSpacing","textDecoration","textDecorationStyle","textDecorationSkipInk","textDecorationThickness","textUnderlineOffset","textUnderlinePosition","cursor","StyledSecondaryText","textAlign","StyledImageComponent","maxWidth","maxHeight","objectFit","StyledForm","allowedFileTypes","selectedImage","onImageSelect","uploadingError","allowImageLinkUpload","imageLink","onImageLinkChange","onUploadImageLink","handleImageLinkUpload","e","preventDefault","_jsx","ReactImageUploading","acceptType","onChange","value","firstImage","children","onImageUpload","dragProps","uploadErrorMessage","message","dataURL","src","_jsxs","fill","viewBox","xmlns","clipRule","d","fillOpacity","fillRule","Stack","direction","onClick","onSubmit","TextField","fullWidth","fdKey","target","placeholder","sx","overflowY"],"mappings":"2SAQA,MAAMA,EAA4BC,EAAOC,EAAPD,CAAY,EAAGE,YAAO,CACtDC,KAAM,IACNC,QAAS,OACTC,cAAe,SACfC,OAAQ,OACRC,UAAW,aACXC,WAAY,SACZC,eAAgB,gBAChBC,QAAS,OACTC,aAAc,MACdC,OAAQ,gCACRC,WAAY,UACZ,CAACX,EAAMY,YAAYC,KAAK,WAAY,CAClCN,eAAgB,SAChBO,IAAK,WAIHC,EAAsBjB,EAAOC,EAAPD,CAAY,CACtCI,QAAS,OACTC,cAAe,SACfa,MAAO,OACPZ,OAAQ,OACRI,QAAS,MACTD,eAAgB,SAChBD,WAAY,SACZG,aAAc,OACdQ,gBAAiB,wBAGbC,EAAoBpB,EAAOqB,EAAPrB,CAAmB,CAC3CsB,MAAO,sBACPC,WAAY,SACZC,SAAU,OACVC,UAAW,SACXC,WAAY,MACZC,WAAY,OACZC,cAAe,MACfC,eAAgB,YAChBC,oBAAqB,QACrBC,sBAAuB,OACvBC,wBAAyB,OACzBC,oBAAqB,MACrBC,sBAAuB,YACvBC,OAAQ,YAGJC,EAAsBpC,EAAOqB,EAAPrB,CAAmB,CAC7CuB,WAAY,SACZC,SAAU,OACVC,UAAW,SACXC,WAAY,IACZC,WAAY,OACZC,cAAe,MACfS,UAAW,WAGPC,EAAuBtC,EAAO,MAAPA,CAAc,CACzCuC,SAAU,OACVC,UAAW,OACX7B,aAAc,MACd8B,UAAW,UAGPC,EAAa1C,EAAO,OAAPA,CAAe,CAChCkB,MAAO,OACPqB,SAAU,UAaNI,EAAmB,CAAC,MAAO,OAAQ,MAAO,MAAO,sBAEH,EAClDC,gBACAC,gBACAC,iBACAC,uBACAC,YACAC,oBAAoB,OACpBC,oBAAoB,WAEpB,MAOMC,EAAyBC,IAC7BA,EAAEC,iBACFH,EAAkBF,IAGpB,OACEM,EAAAA,IAACC,EAAmB,CAClBC,WAAYb,EACZc,SAfuBC,IACzB,MAAMC,EAAaD,EAAM,GACrBC,GACFd,EAAcc,IAadD,MAAOd,EAAgB,CAACA,GAAiB,GAAEgB,SAE1C,EAAGC,gBAAeC,gBACjB,MAAMC,EAAqB,yCAAyCjB,GAAgBkB,QAAUlB,EAAekB,QAAU,KAEvH,OAAIpB,GAAeqB,QACVX,EAAAA,IAAChB,EAAoB,CAAC4B,IAAKtB,EAAcqB,UAIhDE,EAAAA,KAACpE,EAAyB,IAAK+D,EAASF,SAAA,CACtCN,EAAAA,IAACrC,EAAmB,CAAA2C,SAClBO,EAAAA,KAAA,MAAA,CAAKC,KAAK,OAAO9D,OAAO,KAAK+D,QAAQ,YAAYnD,MAAM,KAAKoD,MAAM,6BAA4BV,SAAA,CAC5FN,EAAAA,IAAA,QAAA,CAAAM,SAAA,gBACAN,EAAAA,IAAA,OAAA,CACEiB,SAAS,UACTC,EAAE,uwDACFJ,KAAK,QACLK,YAAY,OACZC,SAAS,YAEXpB,EAAAA,IAAA,OAAA,CACEiB,SAAS,UACTC,EAAE,wWACFJ,KAAK,QACLK,YAAY,OACZC,SAAS,iBAIfP,EAAAA,KAACQ,EAAK,CAACnE,WAAW,SAASoE,UAAU,SAAS5D,IAAI,MAAME,MAAM,OAAM0C,SAAA,CAClEN,EAAAA,IAAClC,EAAiB,CAACyD,QAAShB,+BAC5BM,EAAAA,KAAC/B,EAAmB,CAACd,MAAM,sBAAqBsC,SAAA,CAAA,kBAC9Bb,GAAwB,mCAEzCA,GACCO,MAACZ,EAAU,CAAA,UAAS,kBAAkBoC,SAAU3B,EAAqBS,SACnEN,EAAAA,IAACyB,YAAS,CACRC,aACAC,MAAM,WACNxB,SAAWL,GAAMH,EAAkBG,EAAE8B,OAAOxB,OAC5CyB,YAAY,kBACZzB,MAAOV,SAKfM,EAAAA,IAAClB,EAAmB,CAACd,MAAM,gFAG3BgC,EAAAA,IAAClB,EAAmB,CAClBd,MAAM,yBACN8D,GAAKlF,IAAK,CACRmF,UAAW,SACX/E,OAAQ,OACR,CAACJ,EAAMY,YAAYC,KAAK,WAAY,CAClCT,OAAQ,WAEVsD,SAEDd,EAAiBiB,EAAqB"}