@lifesg/react-design-system 3.5.0-canary.7 → 4.0.0-alpha.10

package/file-upload/file-upload.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as r,useState as i}from"react";import{FileUploadContext as l}from"./context.js";import{FileUploadDropzone as o}from"./dropzone.js";import{FileList as n}from"./file-list.js";import{TextContainer as d,WarningAlert as a,ErrorAlert as s,UploadButtonContainer as c,UploadButton as p,UploadButtonText as u,Title as m,TitleContainer as f,Description as h,DescriptionContainer as b}from"./file-upload.styles.js";const y=({styleType:y="bordered",fileItems:g,title:v,description:I,maxFiles:x,warning:D,className:L,name:j,id:F,"data-testid":w,accept:z,capture:B,multiple:C,disabled:M,sortable:q=!1,fileDescriptionMaxLength:N,editableFileItems:O=!1,descriptionRequired:R=!0,descriptionLabel:S,errorMessage:T,readOnly:U,customLabels:k,onChange:A,onDelete:E,onEdit:P,onSort:$})=>{const G={uploadButton:(null==k?void 0:k.uploadButtonLabel)||"Upload files"},H=r(null),J=r(null),[K,Q]=i(),V=()=>!(!x||!g)&&g.length>=x;return e(l.Provider,{value:{activeId:K,setActiveId:Q},children:t(o,{ref:H,onChange:e=>{var t;!M&&A&&(A(e),null===(t=J.current)||void 0===t||t.focus())},id:F?`${F}-dropzone`:"dropzone",accept:z,capture:B,border:"bordered"===y,className:L,"data-testid":w,name:j,multiple:C,disabled:M||V()||U,children:[!(!v&&!I)&&t(d,{children:[v?e("string"==typeof v?m:f,{children:v}):null,I?e("string"==typeof I?h:b,{children:I}):null]}),!!D&&e(a,{type:"warning",children:D}),e(n,{ref:J,fileItems:g,editableFileItems:O,descriptionRequired:R,descriptionLabel:S,fileDescriptionMaxLength:N,sortable:q,disabled:M,readOnly:U,onItemDelete:e=>{var t;E&&(E(e),null===(t=J.current)||void 0===t||t.focus())},onItemUpdate:e=>{P&&P(e)},onSort:e=>{$&&$(e)}}),T&&e(s,{type:"error",children:T}),!U&&t(c,{children:[e(p,{type:"button",styleType:"secondary",disabled:!!K||M||V(),onClick:e=>{M||(e.preventDefault(),H.current&&H.current.openFileDialog())},children:G.uploadButton}),e(u,{weight:"semibold",children:"or drop them here"})]})]})})};export{y as FileUpload};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as r,useState as l}from"react";import{Alert as i}from"../alert/alert.js";import{Button as o}from"../button/button.js";import{Markup as a}from"../markup/markup.js";import{Typography as n}from"../typography/index.js";import{FileUploadContext as s}from"./context.js";import{FileUploadDropzone as d}from"./dropzone.js";import{FileList as c}from"./file-list/file-list.js";import{textContainer as m,warningAlert as p,errorAlert as u,uploadButtonContainer as f,uploadButton as b,uploadButtonText as h,markupContainer as y,description as v}from"./file-upload.styles.js";const g=({styleType:g="bordered",fileItems:N,title:x,description:j,maxFiles:D,warning:I,className:B,name:L,id:z,"data-testid":M,accept:T,capture:F,multiple:S,disabled:k,sortable:w=!1,fileDescriptionMaxLength:C,editableFileItems:q=!1,descriptionRequired:O=!0,descriptionLabel:R,errorMessage:U,readOnly:A,customLabels:E,onChange:P,onDelete:$,onEdit:G,onSort:H})=>{const J={uploadButton:(null==E?void 0:E.uploadButtonLabel)||"Upload files"},K=r(null),Q=r(null),[V,W]=l(),X=e=>{var t;if(void 0===D)return e;const r=null!==(t=null==N?void 0:N.length)&&void 0!==t?t:0,l=Math.max(D-r,0);return e.slice(0,l)},Y=()=>!(!D||!N)&&N.length>=D;return e(s.Provider,{value:{activeId:V,setActiveId:W},children:t(d,{ref:K,onChange:e=>{var t;const r=X(e);!k&&P&&r.length>0&&(P(r),null===(t=Q.current)||void 0===t||t.focus())},id:z?`${z}-dropzone`:"dropzone",accept:T,capture:F,border:"bordered"===g,className:B,"data-testid":M,name:L,multiple:S,disabled:k||Y()||A,children:[!(!x&&!j)&&t("div",{className:m,children:[x?"string"==typeof x?e(n.BodyBL,{children:x}):e(a,{className:y,baseTextSize:"body-baseline",children:x}):null,j?"string"==typeof j?e(n.BodyMD,{className:v,children:j}):e(a,{className:y,baseTextSize:"body-md",children:j}):null]}),!!I&&e(i,{className:p,type:"warning",children:I}),e(c,{ref:Q,fileItems:N,editableFileItems:q,descriptionRequired:O,descriptionLabel:R,fileDescriptionMaxLength:C,sortable:w,disabled:k,readOnly:A,onItemDelete:e=>{var t;$&&($(e),null===(t=Q.current)||void 0===t||t.focus())},onItemUpdate:e=>{G&&G(e)},onSort:e=>{H&&H(e)}}),U&&e(i,{className:u,type:"error",children:U}),!A&&t("div",{className:f,children:[e(o,{type:"button",sizeType:"small",styleType:"secondary",disabled:!!V||k||Y(),onClick:e=>{k||(e.preventDefault(),K.current&&K.current.openFileDialog())},className:b,children:J.uploadButton}),e(n.BodyMD,{className:h,weight:"semibold",children:"or drop them here"})]})]})})};export{g as FileUpload};
 //# sourceMappingURL=file-upload.js.map

package/file-upload/file-upload.js.map

@@ -1 +1 @@
-{"version":3,"file":"file-upload.js","sources":["../../src/file-upload/file-upload.tsx"],"sourcesContent":["import { useRef, useState } from \"react\";\nimport { FileUploadContext } from \"./context\";\nimport { DropzoneElement, FileUploadDropzone } from \"./dropzone\";\nimport { FileList, FileListRef } from \"./file-list\";\nimport {\n    Description,\n    DescriptionContainer,\n    ErrorAlert,\n    TextContainer,\n    Title,\n    TitleContainer,\n    UploadButton,\n    UploadButtonContainer,\n    UploadButtonText,\n    WarningAlert,\n} from \"./file-upload.styles\";\nimport { FileItemProps, FileUploadProps } from \"./types\";\n\nexport const FileUpload = ({\n    styleType = \"bordered\",\n    fileItems,\n    title,\n    description,\n    maxFiles,\n    warning,\n    className,\n    name,\n    id,\n    \"data-testid\": testId,\n    accept,\n    capture,\n    multiple,\n    disabled,\n    sortable = false,\n    fileDescriptionMaxLength,\n    editableFileItems = false,\n    descriptionRequired = true,\n    descriptionLabel,\n    errorMessage,\n    readOnly,\n    customLabels,\n    onChange,\n    onDelete,\n    onEdit,\n    onSort,\n}: FileUploadProps) => {\n    const labels = {\n        uploadButton: customLabels?.uploadButtonLabel || \"Upload files\",\n    };\n    // =========================================================================\n    // CONST, STATE, REFS\n    // =========================================================================\n    const dropzoneRef = useRef<DropzoneElement>(null);\n    const fileListRef = useRef<FileListRef>(null);\n    const [activeId, setActiveId] = useState<string>();\n\n    // =========================================================================\n    // EVENT HANDLERS\n    // =========================================================================\n    const handleChange = (files: File[]) => {\n        if (!disabled && onChange) {\n            onChange(files);\n            fileListRef.current?.focus();\n        }\n    };\n\n    const handleItemDelete = (item: FileItemProps) => {\n        if (onDelete) {\n            onDelete(item);\n            fileListRef.current?.focus();\n        }\n    };\n\n    const handleUploadButtonClick = (\n        event: React.MouseEvent<HTMLButtonElement>\n    ) => {\n        if (!disabled) {\n            event.preventDefault();\n            if (dropzoneRef.current) {\n                dropzoneRef.current.openFileDialog();\n            }\n        }\n    };\n\n    const handleItemUpdate = (updatedItem: FileItemProps) => {\n        if (onEdit) {\n            onEdit(updatedItem);\n        }\n    };\n\n    const handleSort = (updatedItems: FileItemProps[]) => {\n        if (onSort) {\n            onSort(updatedItems);\n        }\n    };\n\n    // =========================================================================\n    // HELPER FUNCTIONS\n    // =========================================================================\n    const reachedMaxFiles = () => {\n        return maxFiles && fileItems ? fileItems.length >= maxFiles : false;\n    };\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    const renderTitle = () => {\n        if (!title) {\n            return null;\n        }\n\n        if (typeof title === \"string\") {\n            return <Title>{title}</Title>;\n        }\n\n        return <TitleContainer>{title}</TitleContainer>;\n    };\n\n    const renderDescription = () => {\n        if (!description) {\n            return null;\n        }\n\n        if (typeof description === \"string\") {\n            return <Description>{description}</Description>;\n        }\n\n        return <DescriptionContainer>{description}</DescriptionContainer>;\n    };\n\n    return (\n        <FileUploadContext.Provider value={{ activeId, setActiveId }}>\n            <FileUploadDropzone\n                ref={dropzoneRef}\n                onChange={handleChange}\n                id={id ? `${id}-dropzone` : \"dropzone\"}\n                accept={accept}\n                capture={capture}\n                border={styleType === \"bordered\"}\n                className={className}\n                data-testid={testId}\n                name={name}\n                multiple={multiple}\n                disabled={disabled || reachedMaxFiles() || readOnly}\n            >\n                {!!(title || description) && (\n                    <TextContainer>\n                        {renderTitle()}\n                        {renderDescription()}\n                    </TextContainer>\n                )}\n                {!!warning && (\n                    <WarningAlert type=\"warning\">{warning}</WarningAlert>\n                )}\n                <FileList\n                    ref={fileListRef}\n                    fileItems={fileItems}\n                    editableFileItems={editableFileItems}\n                    descriptionRequired={descriptionRequired}\n                    descriptionLabel={descriptionLabel}\n                    fileDescriptionMaxLength={fileDescriptionMaxLength}\n                    sortable={sortable}\n                    disabled={disabled}\n                    readOnly={readOnly}\n                    onItemDelete={handleItemDelete}\n                    onItemUpdate={handleItemUpdate}\n                    onSort={handleSort}\n                />\n                {errorMessage && (\n                    <ErrorAlert type=\"error\">{errorMessage}</ErrorAlert>\n                )}\n                {!readOnly && (\n                    <UploadButtonContainer>\n                        <UploadButton\n                            type=\"button\"\n                            styleType=\"secondary\"\n                            disabled={\n                                !!activeId || disabled || reachedMaxFiles()\n                            }\n                            onClick={handleUploadButtonClick}\n                        >\n                            {labels.uploadButton}\n                        </UploadButton>\n                        <UploadButtonText weight=\"semibold\">\n                            or drop them here\n                        </UploadButtonText>\n                    </UploadButtonContainer>\n                )}\n            </FileUploadDropzone>\n        </FileUploadContext.Provider>\n    );\n};\n"],"names":["FileUpload","styleType","fileItems","title","description","maxFiles","warning","className","name","id","testId","accept","capture","multiple","disabled","sortable","fileDescriptionMaxLength","editableFileItems","descriptionRequired","descriptionLabel","errorMessage","readOnly","customLabels","onChange","onDelete","onEdit","onSort","labels","uploadButton","uploadButtonLabel","dropzoneRef","useRef","fileListRef","activeId","setActiveId","useState","reachedMaxFiles","length","_jsx","FileUploadContext","Provider","value","children","_jsxs","FileUploadDropzone","ref","files","_a","current","focus","border","TextContainer","Title","TitleContainer","Description","DescriptionContainer","WarningAlert","type","FileList","onItemDelete","item","onItemUpdate","updatedItem","updatedItems","ErrorAlert","UploadButtonContainer","UploadButton","onClick","event","preventDefault","openFileDialog","UploadButtonText","weight"],"mappings":"odAkBO,MAAMA,EAAa,EACtBC,YAAY,WACZC,YACAC,QACAC,cACAC,WACAC,UACAC,YACAC,OACAC,KACA,cAAeC,EACfC,SACAC,UACAC,WACAC,WACAC,YAAW,EACXC,2BACAC,qBAAoB,EACpBC,uBAAsB,EACtBC,mBACAC,eACAC,WACAC,eACAC,WACAC,WACAC,SACAC,aAEA,MAAMC,EAAS,CACXC,cAAcN,eAAAA,EAAcO,oBAAqB,gBAK/CC,EAAcC,EAAwB,MACtCC,EAAcD,EAAoB,OACjCE,EAAUC,GAAeC,IA6C1BC,EAAkB,OACb/B,IAAYH,IAAYA,EAAUmC,QAAUhC,EA8BvD,OACIiC,EAACC,EAAkBC,UAASC,MAAO,CAAER,WAAUC,eAAaQ,SACxDC,EAACC,EAAkB,CACfC,IAAKf,EACLP,SA3EUuB,WACbhC,GAAYS,IACbA,EAASuB,GACU,QAAnBC,EAAAf,EAAYgB,eAAO,IAAAD,GAAAA,EAAEE,QACzB,EAwEQxC,GAAIA,EAAK,GAAGA,aAAgB,WAC5BE,OAAQA,EACRC,QAASA,EACTsC,OAAsB,aAAdjD,EACRM,UAAWA,gBACEG,EACbF,KAAMA,EACNK,SAAUA,EACVC,SAAUA,GAAYsB,KAAqBf,EAAQqB,SAAA,IAE/CvC,IAASC,IACTuC,EAACQ,EAAa,CAAAT,SAAA,CAvCrBvC,EAKMmC,EADU,iBAAVnC,EACCiD,EAGJC,EAHS,CAAAX,SAAEvC,IAJR,KAWNC,EAKMkC,EADgB,iBAAhBlC,EACCkD,EAGJC,EAHe,CAAAb,SAAEtC,IAJd,UA+BAE,GACCgC,EAACkB,EAAY,CAACC,KAAK,UAASf,SAAEpC,IAElCgC,EAACoB,GACGb,IAAKb,EACL9B,UAAWA,EACXe,kBAAmBA,EACnBC,oBAAqBA,EACrBC,iBAAkBA,EAClBH,yBAA0BA,EAC1BD,SAAUA,EACVD,SAAUA,EACVO,SAAUA,EACVsC,aAlGUC,UAClBpC,IACAA,EAASoC,GACU,QAAnBb,EAAAf,EAAYgB,eAAO,IAAAD,GAAAA,EAAEE,QACzB,EA+FYY,aAjFUC,IAClBrC,GACAA,EAAOqC,EACX,EA+EYpC,OA5EIqC,IACZrC,GACAA,EAAOqC,EACX,IA2ES3C,GACGkB,EAAC0B,EAAU,CAACP,KAAK,QAAOf,SAAEtB,KAE5BC,GACEsB,EAACsB,EAAqB,CAAAvB,SAAA,CAClBJ,EAAC4B,EAAY,CACTT,KAAK,SACLxD,UAAU,YACVa,WACMmB,GAAYnB,GAAYsB,IAE9B+B,QAzGpBC,IAEKtD,IACDsD,EAAMC,iBACFvC,EAAYkB,SACZlB,EAAYkB,QAAQsB,iBAE5B,EAkGoD5B,SAE/Bf,EAAOC,eAEZU,EAACiC,EAAgB,CAACC,OAAO,WAAU9B,SAAA,6BAMtB"}
+{"version":3,"file":"file-upload.js","sources":["../../src/file-upload/file-upload.tsx"],"sourcesContent":["import { useRef, useState } from \"react\";\n\nimport { Alert } from \"../alert\";\nimport { Button } from \"../button\";\nimport { Markup } from \"../markup\";\nimport { Typography } from \"../typography\";\nimport { FileUploadContext } from \"./context\";\nimport type { DropzoneElement } from \"./dropzone\";\nimport { FileUploadDropzone } from \"./dropzone\";\nimport type { FileListRef } from \"./file-list\";\nimport { FileList } from \"./file-list\";\nimport * as styles from \"./file-upload.styles\";\nimport type { FileItemProps, FileUploadProps } from \"./types\";\n\n// @catalog\n/**\n * Allows user to upload images via drag-and-drop or a native file dialog.\n * @keywords attachment, file, upload\n */\nexport const FileUpload = ({\n    styleType = \"bordered\",\n    fileItems,\n    title,\n    description,\n    maxFiles,\n    warning,\n    className,\n    name,\n    id,\n    \"data-testid\": testId,\n    accept,\n    capture,\n    multiple,\n    disabled,\n    sortable = false,\n    fileDescriptionMaxLength,\n    editableFileItems = false,\n    descriptionRequired = true,\n    descriptionLabel,\n    errorMessage,\n    readOnly,\n    customLabels,\n    onChange,\n    onDelete,\n    onEdit,\n    onSort,\n}: FileUploadProps) => {\n    const labels = {\n        uploadButton: customLabels?.uploadButtonLabel || \"Upload files\",\n    };\n    // =========================================================================\n    // CONST, STATE, REFS\n    // =========================================================================\n    const dropzoneRef = useRef<DropzoneElement>(null);\n    const fileListRef = useRef<FileListRef>(null);\n    const [activeId, setActiveId] = useState<string>();\n\n    // =========================================================================\n    // EVENT HANDLERS\n    // =========================================================================\n    const handleChange = (files: File[]) => {\n        const filesToProcess = limitIncomingFiles(files);\n\n        if (!disabled && onChange && filesToProcess.length > 0) {\n            onChange(filesToProcess);\n            fileListRef.current?.focus();\n        }\n    };\n\n    const handleItemDelete = (item: FileItemProps) => {\n        if (onDelete) {\n            onDelete(item);\n            fileListRef.current?.focus();\n        }\n    };\n\n    const handleUploadButtonClick = (\n        event: React.MouseEvent<HTMLButtonElement>\n    ) => {\n        if (!disabled) {\n            event.preventDefault();\n            if (dropzoneRef.current) {\n                dropzoneRef.current.openFileDialog();\n            }\n        }\n    };\n\n    const handleItemUpdate = (updatedItem: FileItemProps) => {\n        if (onEdit) {\n            onEdit(updatedItem);\n        }\n    };\n\n    const handleSort = (updatedItems: FileItemProps[]) => {\n        if (onSort) {\n            onSort(updatedItems);\n        }\n    };\n\n    // =========================================================================\n    // HELPER FUNCTIONS\n    // =========================================================================\n    const limitIncomingFiles = (files: File[]) => {\n        if (maxFiles === undefined) {\n            return files;\n        }\n\n        const existingItemsCount = fileItems?.length ?? 0;\n        const remainingSlots = Math.max(maxFiles - existingItemsCount, 0);\n\n        return files.slice(0, remainingSlots);\n    };\n\n    const reachedMaxFiles = () => {\n        return maxFiles && fileItems ? fileItems.length >= maxFiles : false;\n    };\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    const renderTitle = () => {\n        if (!title) {\n            return null;\n        }\n\n        if (typeof title === \"string\") {\n            return <Typography.BodyBL>{title}</Typography.BodyBL>;\n        }\n\n        return (\n            <Markup\n                className={styles.markupContainer}\n                baseTextSize=\"body-baseline\"\n            >\n                {title}\n            </Markup>\n        );\n    };\n\n    const renderDescription = () => {\n        if (!description) {\n            return null;\n        }\n\n        if (typeof description === \"string\") {\n            return (\n                <Typography.BodyMD className={styles.description}>\n                    {description}\n                </Typography.BodyMD>\n            );\n        }\n\n        return (\n            <Markup className={styles.markupContainer} baseTextSize=\"body-md\">\n                {description}\n            </Markup>\n        );\n    };\n\n    return (\n        <FileUploadContext.Provider value={{ activeId, setActiveId }}>\n            <FileUploadDropzone\n                ref={dropzoneRef}\n                onChange={handleChange}\n                id={id ? `${id}-dropzone` : \"dropzone\"}\n                accept={accept}\n                capture={capture}\n                border={styleType === \"bordered\"}\n                className={className}\n                data-testid={testId}\n                name={name}\n                multiple={multiple}\n                disabled={disabled || reachedMaxFiles() || readOnly}\n            >\n                {!!(title || description) && (\n                    <div className={styles.textContainer}>\n                        {renderTitle()}\n                        {renderDescription()}\n                    </div>\n                )}\n                {!!warning && (\n                    <Alert className={styles.warningAlert} type=\"warning\">\n                        {warning}\n                    </Alert>\n                )}\n                <FileList\n                    ref={fileListRef}\n                    fileItems={fileItems}\n                    editableFileItems={editableFileItems}\n                    descriptionRequired={descriptionRequired}\n                    descriptionLabel={descriptionLabel}\n                    fileDescriptionMaxLength={fileDescriptionMaxLength}\n                    sortable={sortable}\n                    disabled={disabled}\n                    readOnly={readOnly}\n                    onItemDelete={handleItemDelete}\n                    onItemUpdate={handleItemUpdate}\n                    onSort={handleSort}\n                />\n                {errorMessage && (\n                    <Alert className={styles.errorAlert} type=\"error\">\n                        {errorMessage}\n                    </Alert>\n                )}\n                {!readOnly && (\n                    <div className={styles.uploadButtonContainer}>\n                        <Button\n                            type=\"button\"\n                            sizeType=\"small\"\n                            styleType=\"secondary\"\n                            disabled={\n                                !!activeId || disabled || reachedMaxFiles()\n                            }\n                            onClick={handleUploadButtonClick}\n                            className={styles.uploadButton}\n                        >\n                            {labels.uploadButton}\n                        </Button>\n                        <Typography.BodyMD\n                            className={styles.uploadButtonText}\n                            weight=\"semibold\"\n                        >\n                            or drop them here\n                        </Typography.BodyMD>\n                    </div>\n                )}\n            </FileUploadDropzone>\n        </FileUploadContext.Provider>\n    );\n};\n"],"names":["FileUpload","styleType","fileItems","title","description","maxFiles","warning","className","name","id","testId","accept","capture","multiple","disabled","sortable","fileDescriptionMaxLength","editableFileItems","descriptionRequired","descriptionLabel","errorMessage","readOnly","customLabels","onChange","onDelete","onEdit","onSort","labels","uploadButton","uploadButtonLabel","dropzoneRef","useRef","fileListRef","activeId","setActiveId","useState","limitIncomingFiles","files","undefined","existingItemsCount","_a","length","remainingSlots","Math","max","slice","reachedMaxFiles","_jsx","FileUploadContext","Provider","value","children","_jsxs","FileUploadDropzone","ref","filesToProcess","current","focus","border","styles.textContainer","Typography","BodyBL","Markup","styles.markupContainer","baseTextSize","BodyMD","styles.description","Alert","styles.warningAlert","type","FileList","onItemDelete","item","onItemUpdate","updatedItem","updatedItems","styles.errorAlert","styles.uploadButtonContainer","Button","sizeType","onClick","event","preventDefault","openFileDialog","styles.uploadButton","styles.uploadButtonText","weight"],"mappings":"knBAmBO,MAAMA,EAAa,EACtBC,YAAY,WACZC,YACAC,QAAKC,YACLA,EACAC,WACAC,UACAC,YACAC,OACAC,KACA,cAAeC,EACfC,SACAC,UACAC,WACAC,WACAC,YAAW,EACXC,2BACAC,qBAAoB,EACpBC,uBAAsB,EACtBC,mBACAC,eACAC,WACAC,eACAC,WACAC,WACAC,SACAC,aAEA,MAAMC,EAAS,CACXC,cAAcN,eAAAA,EAAcO,oBAAqB,gBAK/CC,EAAcC,EAAwB,MACtCC,EAAcD,EAAoB,OACjCE,EAAUC,GAAeC,IA+C1BC,EAAsBC,UACxB,QAAiBC,IAAbjC,EACA,OAAOgC,EAGX,MAAME,EAAsC,QAAjBC,EAAAtC,aAAS,EAATA,EAAWuC,cAAM,IAAAD,EAAAA,EAAI,EAC1CE,EAAiBC,KAAKC,IAAIvC,EAAWkC,EAAoB,GAE/D,OAAOF,EAAMQ,MAAM,EAAGH,EAAe,EAGnCI,EAAkB,OACbzC,IAAYH,IAAYA,EAAUuC,QAAUpC,EA6CvD,OACI0C,EAACC,EAAkBC,SAAQ,CAACC,MAAO,CAAEjB,WAAUC,eAAaiB,SACxDC,EAACC,EAAkB,CACfC,IAAKxB,EACLP,SAvGUc,UAClB,MAAMkB,EAAiBnB,EAAmBC,IAErCvB,GAAYS,GAAYgC,EAAed,OAAS,IACjDlB,EAASgC,GACU,QAAnBf,EAAAR,EAAYwB,eAAO,IAAAhB,GAAAA,EAAEiB,QACzB,EAkGQhD,GAAIA,EAAK,GAAGA,aAAgB,WAC5BE,OAAQA,EACRC,QAASA,EACT8C,OAAsB,aAAdzD,EACRM,UAAWA,EAAS,cACPG,EACbF,KAAMA,EACNK,SAAUA,EACVC,SAAUA,GAAYgC,KAAqBzB,EAAQ8B,SAAA,IAE/ChD,IAASC,IACTgD,EAAA,MAAA,CAAK7C,UAAWoD,EAAoBR,SAAA,CAtD3ChD,EAIgB,iBAAVA,EACA4C,EAACa,EAAWC,OAAM,CAAAV,SAAEhD,IAI3B4C,EAACe,EAAM,CACHvD,UAAWwD,EACXC,aAAa,yBAEZ7D,IAZE,KAkBNC,EAIsB,iBAAhBA,EAEH2C,EAACa,EAAWK,OAAM,CAAC1D,UAAW2D,EAAkBf,SAC3C/C,IAMT2C,EAACe,EAAM,CAACvD,UAAWwD,EAAwBC,aAAa,mBACnD5D,IAbE,UAuCAE,GACCyC,EAACoB,EAAK,CAAC5D,UAAW6D,EAAqBC,KAAK,UAASlB,SAChD7C,IAGTyC,EAACuB,EAAQ,CACLhB,IAAKtB,EACL9B,UAAWA,EACXe,kBAAmBA,EACnBC,oBAAqBA,EACrBC,iBAAkBA,EAClBH,yBAA0BA,EAC1BD,SAAUA,EACVD,SAAUA,EACVO,SAAUA,EACVkD,aA9HUC,UAClBhD,IACAA,EAASgD,GACU,QAAnBhC,EAAAR,EAAYwB,eAAO,IAAAhB,GAAAA,EAAEiB,QACzB,EA2HYgB,aA7GUC,IAClBjD,GACAA,EAAOiD,EACX,EA2GYhD,OAxGIiD,IACZjD,GACAA,EAAOiD,EACX,IAuGSvD,GACG2B,EAACoB,EAAK,CAAC5D,UAAWqE,EAAmBP,KAAK,QAAOlB,SAC5C/B,KAGPC,GACE+B,EAAA,MAAA,CAAK7C,UAAWsE,EAA4B1B,SAAA,CACxCJ,EAAC+B,EAAM,CACHT,KAAK,SACLU,SAAS,QACT9E,UAAU,YACVa,WACMmB,GAAYnB,GAAYgC,IAE9BkC,QAxIpBC,IAEKnE,IACDmE,EAAMC,iBACFpD,EAAY0B,SACZ1B,EAAY0B,QAAQ2B,iBAE5B,EAkIoB5E,UAAW6E,EAAmBjC,SAE7BxB,EAAOC,eAEZmB,EAACa,EAAWK,OAAM,CACd1D,UAAW8E,EACXC,OAAO,WAAUnC,SAAA,6BAOR"}

package/file-upload/file-upload.styles.d.ts

@@ -1,40 +1,8 @@
-export declare const TextContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
-export declare const Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-} & {
-    as?: import("styled-components").WebTarget | undefined;
-    forwardedAs?: import("styled-components").WebTarget | undefined;
-}, never> & Partial<Pick<import("..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-} & {
-    as?: import("styled-components").WebTarget | undefined;
-    forwardedAs?: import("styled-components").WebTarget | undefined;
-}, never>>> & string;
-export declare const TitleContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
-export declare const Description: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-} & {
-    as?: import("styled-components").WebTarget | undefined;
-    forwardedAs?: import("styled-components").WebTarget | undefined;
-}, never> & Partial<Pick<import("..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-} & {
-    as?: import("styled-components").WebTarget | undefined;
-    forwardedAs?: import("styled-components").WebTarget | undefined;
-}, never>>> & string;
-export declare const DescriptionContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
-export declare const WarningAlert: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").AlertProps, never> & Partial<Pick<import("..").AlertProps, never>>> & string & Omit<({ type, className, children, actionLink, actionLinkIcon, sizeType, showIcon, customIcon, maxCollapsedHeight, role, ...otherProps }: import("..").AlertProps) => JSX.Element, keyof import("react").Component<any, {}, any>>;
-export declare const UploadButtonContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
-export declare const UploadButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>, never>>> & string & Omit<(props: import("..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
-export declare const UploadButtonText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-} & {
-    as?: import("styled-components").WebTarget | undefined;
-    forwardedAs?: import("styled-components").WebTarget | undefined;
-}, never> & Partial<Pick<import("..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | undefined;
-} & {
-    as?: import("styled-components").WebTarget | undefined;
-    forwardedAs?: import("styled-components").WebTarget | undefined;
-}, never>>> & string;
-export declare const ErrorAlert: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").AlertProps, never> & Partial<Pick<import("..").AlertProps, never>>> & string & Omit<({ type, className, children, actionLink, actionLinkIcon, sizeType, showIcon, customIcon, maxCollapsedHeight, role, ...otherProps }: import("..").AlertProps) => JSX.Element, keyof import("react").Component<any, {}, any>>;
+export declare const textContainer: import("@linaria/core").LinariaClassName;
+export declare const markupContainer: import("@linaria/core").LinariaClassName;
+export declare const description: import("@linaria/core").LinariaClassName;
+export declare const warningAlert: import("@linaria/core").LinariaClassName;
+export declare const uploadButtonContainer: import("@linaria/core").LinariaClassName;
+export declare const uploadButton: import("@linaria/core").LinariaClassName;
+export declare const uploadButtonText: import("@linaria/core").LinariaClassName;
+export declare const errorAlert: import("@linaria/core").LinariaClassName;

package/file-upload/file-upload.styles.js

@@ -1,43 +1,2 @@
-import t from"styled-components";import{Alert as i}from"../alert/alert.js";import{Button as o}from"../button/button.js";import{applyHtmlContentStyle as e}from"../shared/html-content/html-content.js";import{Spacing as m,Colour as r,MediaQuery as n}from"../theme/index.js";import{Typography as d}from"../typography/typography.js";const l=t.div`
-    display: flex;
-    flex-direction: column;
-    margin-bottom: ${m["spacing-32"]};
-    gap: ${m["spacing-8"]};
-`,a=t(d.BodyBL)``,s=t.div`
-    color: ${r.text};
-    ${e({textSize:"body-baseline"})}
-`,p=t(d.BodyMD)`
-    color: ${r["text-subtler"]};
-`,c=t.div`
-    color: ${r.text};
-    ${e({textSize:"body-md"})}
-`,x=t(i)`
-    margin-bottom: ${m["spacing-32"]};
-`,g=t.div`
-    width: 100%;
-    display: flex;
-    flex-direction: column;
-    align-items: flex-end;
-
-    ${n.MaxWidth.md} {
-        align-items: flex-start;
-    }
-`,h=t(o.Small)`
-    width: 10rem;
-
-    ${n.MaxWidth.md} {
-        width: 100%;
-    }
-`,y=t(d.BodyMD)`
-    color: ${r["text-subtler"]};
-    margin-top: ${m["spacing-8"]};
-    width: 10rem;
-    text-align: center;
-    ${n.MaxWidth.md} {
-        display: none;
-        visibility: hidden;
-    }
-`,$=t(i)`
-    margin-bottom: ${m["spacing-32"]};
-`;export{p as Description,c as DescriptionContainer,$ as ErrorAlert,l as TextContainer,a as Title,s as TitleContainer,h as UploadButton,g as UploadButtonContainer,y as UploadButtonText,x as WarningAlert};
+import"./file-upload.styles_9ffwcd.css";const l="t9vodht",u="m7vp3hf",f="dhybrj2",d="wq1el8u",e="u723luu",o="u7dp799",p="u1rz06ff",t="emjmrml";export{f as description,t as errorAlert,u as markupContainer,l as textContainer,o as uploadButton,e as uploadButtonContainer,p as uploadButtonText,d as warningAlert};
 //# sourceMappingURL=file-upload.styles.js.map

package/file-upload/file-upload.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"file-upload.styles.js","sources":["../../src/file-upload/file-upload.styles.tsx"],"sourcesContent":["import styled from \"styled-components\";\nimport { Alert } from \"../alert\";\nimport { Button } from \"../button\";\nimport { applyHtmlContentStyle } from \"../shared/html-content/html-content\";\nimport { Colour, MediaQuery, Spacing } from \"../theme\";\nimport { Typography } from \"../typography\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const TextContainer = styled.div`\n    display: flex;\n    flex-direction: column;\n    margin-bottom: ${Spacing[\"spacing-32\"]};\n    gap: ${Spacing[\"spacing-8\"]};\n`;\n\nexport const Title = styled(Typography.BodyBL)``;\n\nexport const TitleContainer = styled.div`\n    color: ${Colour.text};\n    ${applyHtmlContentStyle({ textSize: \"body-baseline\" })}\n`;\n\nexport const Description = styled(Typography.BodyMD)`\n    color: ${Colour[\"text-subtler\"]};\n`;\n\nexport const DescriptionContainer = styled.div`\n    color: ${Colour.text};\n    ${applyHtmlContentStyle({ textSize: \"body-md\" })}\n`;\n\nexport const WarningAlert = styled(Alert)`\n    margin-bottom: ${Spacing[\"spacing-32\"]};\n`;\n\nexport const UploadButtonContainer = styled.div`\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    align-items: flex-end;\n\n    ${MediaQuery.MaxWidth.md} {\n        align-items: flex-start;\n    }\n`;\n\nexport const UploadButton = styled(Button.Small)`\n    width: 10rem;\n\n    ${MediaQuery.MaxWidth.md} {\n        width: 100%;\n    }\n`;\n\nexport const UploadButtonText = styled(Typography.BodyMD)`\n    color: ${Colour[\"text-subtler\"]};\n    margin-top: ${Spacing[\"spacing-8\"]};\n    width: 10rem;\n    text-align: center;\n    ${MediaQuery.MaxWidth.md} {\n        display: none;\n        visibility: hidden;\n    }\n`;\n\nexport const ErrorAlert = styled(Alert)`\n    margin-bottom: ${Spacing[\"spacing-32\"]};\n`;\n"],"names":["TextContainer","styled","div","Spacing","Title","Typography","BodyBL","TitleContainer","Colour","text","applyHtmlContentStyle","textSize","Description","BodyMD","DescriptionContainer","WarningAlert","Alert","UploadButtonContainer","MediaQuery","MaxWidth","md","UploadButton","Button","Small","UploadButtonText","ErrorAlert"],"mappings":"wUAUO,MAAMA,EAAgBC,EAAOC,GAAG;;;qBAGlBC,EAAQ;WAClBA,EAAQ;EAGNC,EAAQH,EAAOI,EAAWC,OAAO,GAEjCC,EAAiBN,EAAOC,GAAG;aAC3BM,EAAOC;MACdC,EAAsB,CAAEC,SAAU;EAG3BC,EAAcX,EAAOI,EAAWQ,OAAO;aACvCL,EAAO;EAGPM,EAAuBb,EAAOC,GAAG;aACjCM,EAAOC;MACdC,EAAsB,CAAEC,SAAU;EAG3BI,EAAed,EAAOe,EAAM;qBACpBb,EAAQ;EAGhBc,EAAwBhB,EAAOC,GAAG;;;;;;MAMzCgB,EAAWC,SAASC;;;EAKbC,EAAepB,EAAOqB,EAAOC,MAAM;;;MAG1CL,EAAWC,SAASC;;;EAKbI,EAAmBvB,EAAOI,EAAWQ,OAAO;aAC5CL,EAAO;kBACFL,EAAQ;;;MAGpBe,EAAWC,SAASC;;;;EAMbK,EAAaxB,EAAOe,EAAM;qBAClBb,EAAQ;"}
+{"version":3,"file":"file-upload.styles.js","sources":["../../src/file-upload/file-upload.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, MediaQuery, Spacing } from \"../theme\";\n\nexport const textContainer = css`\n    display: flex;\n    flex-direction: column;\n    margin-bottom: ${Spacing[\"spacing-32\"]};\n    gap: ${Spacing[\"spacing-8\"]};\n`;\n\nexport const markupContainer = css`\n    color: ${Colour.text};\n`;\n\nexport const description = css`\n    color: ${Colour[\"text-subtler\"]};\n`;\n\nexport const warningAlert = css`\n    margin-bottom: ${Spacing[\"spacing-32\"]};\n`;\n\nexport const uploadButtonContainer = css`\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n    align-items: flex-end;\n\n    ${MediaQuery.MaxWidth.md} {\n        align-items: flex-start;\n    }\n`;\n\nexport const uploadButton = css`\n    width: 10rem;\n\n    ${MediaQuery.MaxWidth.md} {\n        width: 100%;\n    }\n`;\n\nexport const uploadButtonText = css`\n    color: ${Colour[\"text-subtler\"]};\n    margin-top: ${Spacing[\"spacing-8\"]};\n    width: 10rem;\n    text-align: center;\n\n    ${MediaQuery.MaxWidth.md} {\n        display: none;\n        visibility: hidden;\n    }\n`;\n\nexport const errorAlert = css`\n    margin-bottom: ${Spacing[\"spacing-32\"]};\n`;\n"],"names":["textContainer","markupContainer","description","warningAlert","uploadButtonContainer","uploadButton","uploadButtonText","errorAlert"],"mappings":"mEAIO,MAAMA,EAAa,UAObC,EAAe,UAIfC,EAAW,UAIXC,EAAY,UAIZC,EAAqB,UAWrBC,EAAY,UAQZC,EAAgB,WAYhBC,EAAU"}

package/file-upload/file-upload.styles_9ffwcd.css

@@ -0,0 +1,8 @@
+@layer fds{.t9vodht{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin-bottom:var(--fds-spacing-32);gap:var(--fds-spacing-8);}
+.m7vp3hf{color:var(--fds-colour-text);}
+.dhybrj2{color:var(--fds-colour-text-subtler);}
+.wq1el8u{margin-bottom:var(--fds-spacing-32);}
+.u723luu{width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:flex-end;-webkit-box-align:flex-end;-ms-flex-align:flex-end;align-items:flex-end;}:where(body.fds-breakpoint-md-max) .u723luu{-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;}
+.u7dp799{width:10rem;}:where(body.fds-breakpoint-md-max) .u7dp799{width:100%;}
+.u1rz06ff{color:var(--fds-colour-text-subtler);margin-top:var(--fds-spacing-8);width:10rem;text-align:center;}:where(body.fds-breakpoint-md-max) .u1rz06ff{display:none;visibility:hidden;}
+.emjmrml{margin-bottom:var(--fds-spacing-32);}}

package/file-upload/helper.d.ts

@@ -1,6 +1,6 @@
-export declare namespace FileUploadHelper {
-    const PDF_MIME_TYPE = "application/pdf";
-    const PDF_ICON_URL = "https://assets.life.gov.sg/react-design-system/img/upload/pdf.svg";
-    const formatFileSizeDisplay: (size?: number) => string;
-    const isSupportedImageType: (type: string) => boolean;
+export declare class FileUploadHelper {
+    static readonly PDF_MIME_TYPE = "application/pdf";
+    static readonly PDF_ICON_URL = "https://assets.life.gov.sg/react-design-system/img/upload/pdf.svg";
+    static formatFileSizeDisplay(size?: number): string;
+    static isSupportedImageType(type: string): boolean;
 }

package/file-upload/helper.js

@@ -1,2 +1,2 @@
-var e;!function(e){e.PDF_MIME_TYPE="application/pdf",e.PDF_ICON_URL="https://assets.life.gov.sg/react-design-system/img/upload/pdf.svg",e.formatFileSizeDisplay=e=>{if(!e||0===e)return"0 KB";const i=Math.floor(Math.log(e)/Math.log(1024));return`${Number(e/Math.pow(1024,i)).toFixed(0)} ${["B","KB","MB","GB","TB","PB","EB","ZB","YB"][i]}`},e.isSupportedImageType=e=>["image/avif","image/gif","image/jpeg","image/png","image/svg+xml","image/webp"].includes(e)}(e||(e={}));export{e as FileUploadHelper};
+class e{static formatFileSizeDisplay(e){if(!e||0===e)return"0 KB";const a=Math.floor(Math.log(e)/Math.log(1024));return`${Number(e/Math.pow(1024,a)).toFixed(0)} ${["B","KB","MB","GB","TB","PB","EB","ZB","YB"][a]}`}static isSupportedImageType(e){return["image/avif","image/gif","image/jpeg","image/png","image/svg+xml","image/webp"].includes(e)}}e.PDF_MIME_TYPE="application/pdf",e.PDF_ICON_URL="https://assets.life.gov.sg/react-design-system/img/upload/pdf.svg";export{e as FileUploadHelper};
 //# sourceMappingURL=helper.js.map

package/file-upload/helper.js.map

@@ -1 +1 @@
-{"version":3,"file":"helper.js","sources":["../../src/file-upload/helper.ts"],"sourcesContent":["export namespace FileUploadHelper {\n    export const PDF_MIME_TYPE = \"application/pdf\";\n    export const PDF_ICON_URL =\n        \"https://assets.life.gov.sg/react-design-system/img/upload/pdf.svg\";\n\n    // Adapted from https://stackoverflow.com/questions/15900485/correct-way-to-convert-size-in-size-to-kb-mb-gb-in-javascript\n    export const formatFileSizeDisplay = (size?: number) => {\n        if (!size || size === 0) return \"0 KB\";\n\n        const sizes = [\"B\", \"KB\", \"MB\", \"GB\", \"TB\", \"PB\", \"EB\", \"ZB\", \"YB\"];\n\n        const index: number = Math.floor(Math.log(size) / Math.log(1024));\n\n        const value = Number(size / Math.pow(1024, index)).toFixed(0);\n        const measurement = sizes[index];\n\n        return `${value} ${measurement}`;\n    };\n\n    export const isSupportedImageType = (type: string) => {\n        /** Currently only images supported by html <img> */\n        const acceptedImageTypes = [\n            \"image/avif\",\n            \"image/gif\",\n            \"image/jpeg\",\n            \"image/png\",\n            \"image/svg+xml\",\n            \"image/webp\",\n        ];\n\n        return acceptedImageTypes.includes(type);\n    };\n}\n"],"names":["FileUploadHelper","PDF_MIME_TYPE","PDF_ICON_URL","formatFileSizeDisplay","size","index","Math","floor","log","Number","pow","toFixed","isSupportedImageType","type","includes"],"mappings":"AAAM,IAAWA,GAAjB,SAAiBA,GACAA,EAAAC,cAAgB,kBAChBD,EAAAE,aACT,oEAGSF,EAAAG,sBAAyBC,IAClC,IAAKA,GAAiB,IAATA,EAAY,MAAO,OAEhC,MAEMC,EAAgBC,KAAKC,MAAMD,KAAKE,IAAIJ,GAAQE,KAAKE,IAAI,OAK3D,MAAO,GAHOC,OAAOL,EAAOE,KAAKI,IAAI,KAAML,IAAQM,QAAQ,MAJ7C,CAAC,IAAK,KAAM,KAAM,KAAM,KAAM,KAAM,KAAM,KAAM,MAKpCN,IAEM,EAGvBL,EAAAY,qBAAwBC,GAEN,CACvB,aACA,YACA,aACA,YACA,gBACA,cAGsBC,SAASD,EAE1C,CAhCD,CAAiBb,IAAAA,EAAgB,CAAA"}
+{"version":3,"file":"helper.js","sources":["../../src/file-upload/helper.ts"],"sourcesContent":["export class FileUploadHelper {\n    public static readonly PDF_MIME_TYPE = \"application/pdf\";\n    public static readonly PDF_ICON_URL =\n        \"https://assets.life.gov.sg/react-design-system/img/upload/pdf.svg\";\n\n    // Adapted from https://stackoverflow.com/questions/15900485/correct-way-to-convert-size-in-size-to-kb-mb-gb-in-javascript\n    public static formatFileSizeDisplay(size?: number) {\n        if (!size || size === 0) return \"0 KB\";\n\n        const sizes = [\"B\", \"KB\", \"MB\", \"GB\", \"TB\", \"PB\", \"EB\", \"ZB\", \"YB\"];\n\n        const index: number = Math.floor(Math.log(size) / Math.log(1024));\n\n        const value = Number(size / Math.pow(1024, index)).toFixed(0);\n        const measurement = sizes[index];\n\n        return `${value} ${measurement}`;\n    }\n\n    public static isSupportedImageType(type: string): boolean {\n        /** Currently only images supported by html <img> */\n        const acceptedImageTypes = [\n            \"image/avif\",\n            \"image/gif\",\n            \"image/jpeg\",\n            \"image/png\",\n            \"image/svg+xml\",\n            \"image/webp\",\n        ];\n\n        return acceptedImageTypes.includes(type);\n    }\n}\n"],"names":["FileUploadHelper","formatFileSizeDisplay","size","index","Math","floor","log","Number","pow","toFixed","isSupportedImageType","type","includes","PDF_MIME_TYPE","PDF_ICON_URL"],"mappings":"MAAaA,EAMF,4BAAOC,CAAsBC,GAChC,IAAKA,GAAiB,IAATA,EAAY,MAAO,OAEhC,MAEMC,EAAgBC,KAAKC,MAAMD,KAAKE,IAAIJ,GAAQE,KAAKE,IAAI,OAK3D,MAAO,GAHOC,OAAOL,EAAOE,KAAKI,IAAI,KAAML,IAAQM,QAAQ,MAJ7C,CAAC,IAAK,KAAM,KAAM,KAAM,KAAM,KAAM,KAAM,KAAM,MAKpCN,IAG9B,CAEO,2BAAOO,CAAqBC,GAW/B,MAT2B,CACvB,aACA,YACA,aACA,YACA,gBACA,cAGsBC,SAASD,EACvC,EA9BuBX,EAAAa,cAAgB,kBAChBb,EAAAc,aACnB"}

package/file-upload/types.d.ts

@@ -1,28 +1,59 @@
-import { FormLabelProps } from "../form/types";
+import type { FormLabelProps } from "../form/form-label/types";
+/**
+ * Represents a single file entry managed by `FileUpload`.
+ */
 export interface FileItemProps {
+    /** Unique identifier used to target delete, edit, and sort operations. */
     id: string;
-    /** The name of the file */
+    /** The display name of the file */
     name: string;
-    /** The MIME type of the file */
+    /** The MIME type of the file (e.g. `"application/pdf"`). */
     type: string;
-    /** The size of the file in bytes */
+    /** The size of the file in bytes. Displayed as formatted text when provided. */
     size: number;
     /** The alt text or description of the file */
     description?: string | undefined;
-    /** The upload progress display. Values from 0 to 1 */
+    /**
+     * Upload progress expressed as a fraction between 0 and 1.
+     * When provided, a progress indicator is rendered on the file item.
+     */
     progress?: number | undefined;
-    /** The error message display to indicate file upload error */
+    /**
+     * Error message shown on the file item to indicate an upload failure.
+     * Accepts a plain string or a React node for richer error display.
+     */
     errorMessage?: string | React.ReactNode | undefined;
-    /** The thumbnail of the file that will be rendered */
+    /**
+     * URL or data URL for a thumbnail image shown alongside the file entry.
+     * When not provided, a PDF icon is displayed for PDF files only;
+     * other file types show no default icon.
+     */
     thumbnailImageDataUrl?: string | undefined;
-    /** Indicates if text should be truncated */
+    /**
+     * Truncates long file names with an ellipsis when `true`.
+     *
+     * @default true
+     */
     truncateText?: boolean | undefined;
 }
+/**
+ * Visual style variant for `FileUpload`.
+ *
+ * - `"bordered"` — renders a visible border around the component.
+ * - `"no-border"` — renders the component without a border.
+ */
 export type FileUploadStyle = "bordered" | "no-border";
+/**
+ * Native file-input props forwarded to the underlying `<input type="file">` element.
+ */
 export interface FileInputProps {
     /** Defines the file types that is accepted */
     accept?: string | undefined;
-    /** Specifies which camera to use for capture of image or video data  */
+    /**
+     * Specifies which camera to use for capture of image or video data
+     *
+     * @see https://www.w3.org/TR/html-media-capture/#the-capture-attribute
+     */
     capture?: boolean | "user" | "environment" | undefined;
     /** Specifies if user is allowed to select more than one file. */
     multiple?: boolean | undefined;
@@ -32,39 +63,111 @@ export interface FileInputProps {
     "data-testid"?: string | undefined;
     name?: string | undefined;
 }
+/** Props for the `FileUpload` component. */
 export interface FileUploadProps extends FileInputProps {
-    /** Component specific */
+    /**
+     * Heading rendered at the top of the component. Accepts a plain string or a JSX
+     * element for rich formatting.
+     */
     title?: string | JSX.Element | undefined;
+    /**
+     * Supporting text rendered below `title`. Accepts a plain string or a JSX
+     * element for rich formatting.
+     */
     description?: string | JSX.Element | undefined;
-    /** The style type for the component. Values "bordered" | "no-border" */
+    /**
+     * Visual style variant for the component.
+     *
+     * @default "bordered"
+     */
     styleType?: FileUploadStyle | undefined;
+    /**
+     * Maximum number of files the component will accept.
+     * Once `fileItems.length` reaches this value, uploading is disabled until an item is removed.
+     */
     maxFiles?: number | undefined;
+    /**
+     * Warning message rendered inside the component. Accepts a plain string
+     * or a JSX element for rich formatting.
+     */
     warning?: string | JSX.Element | undefined;
+    /**
+     * Controlled list of file items displayed in the file list.
+     * Update this array in response to `onChange`, `onDelete`, `onEdit`, and
+     * `onSort` to reflect the current upload state.
+     */
     fileItems?: FileItemProps[] | undefined;
-    /** If set, file items will have editable descriptions (only image files) */
+    /**
+     * When `true`, image file items render an editable description field.
+     * Editing triggers `onEdit` with the updated `FileItemProps`.
+     *
+     * @default false
+     */
     editableFileItems?: boolean | undefined;
-    /** The max length of the description of the file (only image files) */
+    /**
+     * Character limit for the description input on editable image file items.
+     * Only applies when `editableFileItems` is `true`.
+     */
     fileDescriptionMaxLength?: number | undefined;
-    /** When false, save button is enabled even with empty description. Default: true */
+    /**
+     * When `false`, the save button on an editable file item is enabled even
+     * when the description field is empty.
+     *
+     * @default true
+     */
     descriptionRequired?: boolean | undefined;
-    /** Overrides default label and subtext for description field */
+    /**
+     * Overrides the default label and subtext for the description input field
+     * on editable file items.
+     */
     descriptionLabel?: FormLabelProps | undefined;
-    /** Specifies if sorting is enabled for the file items */
+    /**
+     * When `true`, file items can be reordered via drag-and-drop.
+     * The reordered list is emitted via `onSort`.
+     *
+     * @default false
+     */
     sortable?: boolean | undefined;
-    /** The general error message for the component */
+    /**
+     * General error message rendered below the file list.
+     * Accepts a plain string or a JSX element for rich formatting.
+     */
     errorMessage?: string | JSX.Element | undefined;
-    /** Indicates if the component is in the readonly state */
+    /**
+     * When `true`, the upload button and drop zone are hidden and file items
+     * are rendered without delete or edit controls.
+     */
     readOnly?: boolean | undefined;
-    /** Specify custom label text for elements within the component */
+    /**
+     * Overrides default label text for elements within the component.
+     */
     customLabels?: {
         uploadButtonLabel?: string | undefined;
     } | undefined;
-    /** Called when an upload happens via drag drop or click */
+    /**
+     * Called with the newly uploaded files.
+     * Receives only the files that fit within the remaining `maxFiles` slots.
+     *
+     * @param files Array of `File` objects added by the user.
+     */
     onChange?: ((files: File[]) => void) | undefined;
-    /** Called when an update to the description happens */
+    /**
+     * Called when the user saves an edited description on a file item.
+     *
+     * @param fileItem The updated `FileItemProps` with the new description.
+     */
     onEdit?: ((fileItem: FileItemProps) => void) | undefined;
-    /** Called when a file item's delete button is clicked */
+    /**
+     * Called when the user clicks the delete button on a file item.
+     *
+     * @param fileItem The item to be removed.
+     */
     onDelete?: ((fileItem: FileItemProps) => void) | undefined;
-    /** Called when a drag sort is made */
+    /**
+     * Called after the user reorders file items via drag-and-drop.
+     * Only fired when `sortable` is `true`.
+     *
+     * @param fileItems The full reordered array of `FileItemProps`.
+     */
     onSort?: ((fileItems: FileItemProps[]) => void) | undefined;
 }

package/filter/addons/filter-item-checkbox-helpers.d.ts

@@ -1,5 +1,5 @@
-import { FilterItemCheckboxOptionProps } from "../types";
-import { FlattenedFilterOption } from "./types";
+import type { FlattenedFilterOption } from "./internal-types";
+import type { FilterItemCheckboxOptionProps } from "./types";
 /**
  * Builds a key path string from an array of keys
  */

package/filter/addons/filter-item-checkbox-helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-item-checkbox-helpers.js","sources":["../../../src/filter/addons/filter-item-checkbox-helpers.ts"],"sourcesContent":["import { FilterItemCheckboxOptionProps } from \"../types\";\nimport { FlattenedFilterOption } from \"./types\";\n\n// =============================================================================\n// HELPER FUNCTIONS FOR NESTED OPTIONS\n// =============================================================================\n\n/**\n * Builds a key path string from an array of keys\n */\nexport const buildKeyPath = (keyPath: string[]): string => {\n    return keyPath.join(\".\");\n};\n\n/**\n * Flattens nested options into a flat array for rendering\n */\nexport const flattenNestedOptions = <T = FilterItemCheckboxOptionProps>(\n    nestedOptions: T[],\n    parentKeyPath: string[] = [],\n    valueExtractor?: (item: T) => string,\n    labelExtractor?: (item: T) => string\n): FlattenedFilterOption<T>[] => {\n    const flattened: FlattenedFilterOption<T>[] = [];\n\n    nestedOptions.forEach((option, index) => {\n        const value: string = valueExtractor\n            ? valueExtractor(option)\n            : (option as any).value;\n        const label: string = labelExtractor\n            ? labelExtractor(option)\n            : (option as any).label;\n        const options: any[] = (option as any).options;\n        const keyPath = [...parentKeyPath, value];\n        const hasChildren = !!(options && options.length > 0);\n\n        flattened.push({\n            originalItem: option,\n            value,\n            label,\n            keyPath,\n            level: parentKeyPath.length,\n            hasChildren,\n            parentKeyPath: parentKeyPath.length > 0 ? parentKeyPath : undefined,\n            indexInParent: index,\n            parentSetSize: nestedOptions.length,\n        });\n\n        // Recursively flatten children\n        if (hasChildren) {\n            flattened.push(\n                ...flattenNestedOptions(\n                    options,\n                    keyPath,\n                    valueExtractor,\n                    labelExtractor\n                )\n            );\n        }\n    });\n\n    return flattened;\n};\n\n/**\n * Checks if a child key path is a descendant of a parent key path\n */\nconst isChild = (parentKeyPath: string[], childKeyPath: string[]): boolean => {\n    if (childKeyPath.length <= parentKeyPath.length) return false;\n\n    const parentKeyPathString = buildKeyPath(parentKeyPath);\n    const childKeyPathString = buildKeyPath(childKeyPath);\n\n    return childKeyPathString.startsWith(parentKeyPathString + \".\");\n};\n\n/**\n * Gets all descendant key paths (children, grandchildren, etc.) for a given parent\n */\nexport const getAllDescendantKeyPaths = <T = FilterItemCheckboxOptionProps>(\n    flattenedOptions: FlattenedFilterOption<T>[],\n    parentKeyPath: string[]\n): string[][] => {\n    return flattenedOptions\n        .filter((option) => isChild(parentKeyPath, option.keyPath))\n        .map((option) => option.keyPath);\n};\n\n/**\n * Gets all descendant leaf children (non-parent items)\n */\nexport const getAllDescendantChildren = <T = FilterItemCheckboxOptionProps>(\n    flattenedOptions: FlattenedFilterOption<T>[],\n    parentKeyPath: string[]\n): T[] => {\n    const parentKeyPathString = buildKeyPath(parentKeyPath);\n    const children: T[] = [];\n\n    const parentIndex = flattenedOptions.findIndex(\n        (option) => buildKeyPath(option.keyPath) === parentKeyPathString\n    );\n\n    if (parentIndex === -1) return children;\n\n    // Single pass: iterate from parent+1 until we find an item that's not a descendant\n    for (let i = parentIndex + 1; i < flattenedOptions.length; i++) {\n        const option = flattenedOptions[i];\n\n        // Check if this item is a descendant\n        if (isChild(parentKeyPath, option.keyPath)) {\n            // Only include leaf nodes (non-parent items)\n            if (!option.hasChildren) {\n                children.push(option.originalItem as T);\n            }\n        } else {\n            // No more descendants - we can break early\n            break;\n        }\n    }\n\n    return children;\n};\n\n/**\n * Checks if an option has nested options\n */\nexport const hasNestedOptions = <T = FilterItemCheckboxOptionProps>(\n    options: T[],\n    optionsExtractor?: (item: T) => T[]\n): boolean => {\n    return options.some((option: T) => {\n        const nestedOptions: any[] = optionsExtractor\n            ? optionsExtractor(option)\n            : (option as any).options;\n        return nestedOptions && nestedOptions.length > 0;\n    });\n};\n"],"names":["buildKeyPath","keyPath","join","flattenNestedOptions","nestedOptions","parentKeyPath","valueExtractor","labelExtractor","flattened","forEach","option","index","value","label","options","hasChildren","length","push","originalItem","level","undefined","indexInParent","parentSetSize","isChild","childKeyPath","parentKeyPathString","startsWith","getAllDescendantKeyPaths","flattenedOptions","filter","map","getAllDescendantChildren","children","parentIndex","findIndex","i","hasNestedOptions","optionsExtractor","some"],"mappings":"AAUO,MAAMA,EAAgBC,GAClBA,EAAQC,KAAK,KAMXC,EAAuB,CAChCC,EACAC,EAA0B,GAC1BC,EACAC,KAEA,MAAMC,EAAwC,GAsC9C,OApCAJ,EAAcK,SAAQ,CAACC,EAAQC,KAC3B,MAAMC,EAAgBN,EAChBA,EAAeI,GACdA,EAAeE,MAChBC,EAAgBN,EAChBA,EAAeG,GACdA,EAAeG,MAChBC,EAAkBJ,EAAeI,QACjCb,EAAU,IAAII,EAAeO,GAC7BG,KAAiBD,GAAWA,EAAQE,OAAS,GAEnDR,EAAUS,KAAK,CACXC,aAAcR,EACdE,QACAC,QACAZ,UACAkB,MAAOd,EAAcW,OACrBD,cACAV,cAAeA,EAAcW,OAAS,EAAIX,OAAgBe,EAC1DC,cAAeV,EACfW,cAAelB,EAAcY,SAI7BD,GACAP,EAAUS,QACHd,EACCW,EACAb,EACAK,EACAC,GAGZ,IAGGC,CAAS,EAMde,EAAU,CAAClB,EAAyBmB,KACtC,GAAIA,EAAaR,QAAUX,EAAcW,OAAQ,OAAO,EAExD,MAAMS,EAAsBzB,EAAaK,GAGzC,OAF2BL,EAAawB,GAEdE,WAAWD,EAAsB,IAAI,EAMtDE,EAA2B,CACpCC,EACAvB,IAEOuB,EACFC,QAAQnB,GAAWa,EAAQlB,EAAeK,EAAOT,WACjD6B,KAAKpB,GAAWA,EAAOT,UAMnB8B,EAA2B,CACpCH,EACAvB,KAEA,MAAMoB,EAAsBzB,EAAaK,GACnC2B,EAAgB,GAEhBC,EAAcL,EAAiBM,WAChCxB,GAAWV,EAAaU,EAAOT,WAAawB,IAGjD,IAAoB,IAAhBQ,EAAoB,OAAOD,EAG/B,IAAK,IAAIG,EAAIF,EAAc,EAAGE,EAAIP,EAAiBZ,OAAQmB,IAAK,CAC5D,MAAMzB,EAASkB,EAAiBO,GAGhC,IAAIZ,EAAQlB,EAAeK,EAAOT,SAO9B,MALKS,EAAOK,aACRiB,EAASf,KAAKP,EAAOQ,aAMjC,CAEA,OAAOc,CAAQ,EAMNI,EAAmB,CAC5BtB,EACAuB,IAEOvB,EAAQwB,MAAM5B,IACjB,MAAMN,EAAuBiC,EACvBA,EAAiB3B,GAChBA,EAAeI,QACtB,OAAOV,GAAiBA,EAAcY,OAAS,CAAC"}
+{"version":3,"file":"filter-item-checkbox-helpers.js","sources":["../../../src/filter/addons/filter-item-checkbox-helpers.ts"],"sourcesContent":["import type { FlattenedFilterOption } from \"./internal-types\";\nimport type { FilterItemCheckboxOptionProps } from \"./types\";\n\n// =============================================================================\n// HELPER FUNCTIONS FOR NESTED OPTIONS\n// =============================================================================\n\n/**\n * Builds a key path string from an array of keys\n */\nexport const buildKeyPath = (keyPath: string[]): string => {\n    return keyPath.join(\".\");\n};\n\n/**\n * Flattens nested options into a flat array for rendering\n */\nexport const flattenNestedOptions = <T = FilterItemCheckboxOptionProps>(\n    nestedOptions: T[],\n    parentKeyPath: string[] = [],\n    valueExtractor?: (item: T) => string,\n    labelExtractor?: (item: T) => string\n): FlattenedFilterOption<T>[] => {\n    const flattened: FlattenedFilterOption<T>[] = [];\n\n    nestedOptions.forEach((option, index) => {\n        const value: string = valueExtractor\n            ? valueExtractor(option)\n            : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n              (option as any).value;\n        const label: string = labelExtractor\n            ? labelExtractor(option)\n            : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n              (option as any).label;\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        const options: any[] = (option as any).options;\n        const keyPath = [...parentKeyPath, value];\n        const hasChildren = !!(options && options.length > 0);\n\n        flattened.push({\n            originalItem: option,\n            value,\n            label,\n            keyPath,\n            level: parentKeyPath.length,\n            hasChildren,\n            parentKeyPath: parentKeyPath.length > 0 ? parentKeyPath : undefined,\n            indexInParent: index,\n            parentSetSize: nestedOptions.length,\n        });\n\n        // Recursively flatten children\n        if (hasChildren) {\n            flattened.push(\n                ...flattenNestedOptions(\n                    options,\n                    keyPath,\n                    valueExtractor,\n                    labelExtractor\n                )\n            );\n        }\n    });\n\n    return flattened;\n};\n\n/**\n * Checks if a child key path is a descendant of a parent key path\n */\nconst isChild = (parentKeyPath: string[], childKeyPath: string[]): boolean => {\n    if (childKeyPath.length <= parentKeyPath.length) return false;\n\n    const parentKeyPathString = buildKeyPath(parentKeyPath);\n    const childKeyPathString = buildKeyPath(childKeyPath);\n\n    return childKeyPathString.startsWith(parentKeyPathString + \".\");\n};\n\n/**\n * Gets all descendant key paths (children, grandchildren, etc.) for a given parent\n */\nexport const getAllDescendantKeyPaths = <T = FilterItemCheckboxOptionProps>(\n    flattenedOptions: FlattenedFilterOption<T>[],\n    parentKeyPath: string[]\n): string[][] => {\n    return flattenedOptions\n        .filter((option) => isChild(parentKeyPath, option.keyPath))\n        .map((option) => option.keyPath);\n};\n\n/**\n * Gets all descendant leaf children (non-parent items)\n */\nexport const getAllDescendantChildren = <T = FilterItemCheckboxOptionProps>(\n    flattenedOptions: FlattenedFilterOption<T>[],\n    parentKeyPath: string[]\n): T[] => {\n    const parentKeyPathString = buildKeyPath(parentKeyPath);\n    const children: T[] = [];\n\n    const parentIndex = flattenedOptions.findIndex(\n        (option) => buildKeyPath(option.keyPath) === parentKeyPathString\n    );\n\n    if (parentIndex === -1) return children;\n\n    // Single pass: iterate from parent+1 until we find an item that's not a descendant\n    for (let i = parentIndex + 1; i < flattenedOptions.length; i++) {\n        const option = flattenedOptions[i];\n\n        // Check if this item is a descendant\n        if (isChild(parentKeyPath, option.keyPath)) {\n            // Only include leaf nodes (non-parent items)\n            if (!option.hasChildren) {\n                children.push(option.originalItem as T);\n            }\n        } else {\n            // No more descendants - we can break early\n            break;\n        }\n    }\n\n    return children;\n};\n\n/**\n * Checks if an option has nested options\n */\nexport const hasNestedOptions = <T = FilterItemCheckboxOptionProps>(\n    options: T[],\n    optionsExtractor?: (item: T) => T[]\n): boolean => {\n    return options.some((option: T) => {\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        const nestedOptions: any[] = optionsExtractor\n            ? optionsExtractor(option)\n            : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n              (option as any).options;\n        return nestedOptions && nestedOptions.length > 0;\n    });\n};\n"],"names":["buildKeyPath","keyPath","join","flattenNestedOptions","nestedOptions","parentKeyPath","valueExtractor","labelExtractor","flattened","forEach","option","index","value","label","options","hasChildren","length","push","originalItem","level","undefined","indexInParent","parentSetSize","isChild","childKeyPath","parentKeyPathString","startsWith","getAllDescendantKeyPaths","flattenedOptions","filter","map","getAllDescendantChildren","children","parentIndex","findIndex","i","hasNestedOptions","optionsExtractor","some"],"mappings":"AAUO,MAAMA,EAAgBC,GAClBA,EAAQC,KAAK,KAMXC,EAAuB,CAChCC,EACAC,EAA0B,GAC1BC,EACAC,KAEA,MAAMC,EAAwC,GAyC9C,OAvCAJ,EAAcK,SAAQ,CAACC,EAAQC,KAC3B,MAAMC,EAAgBN,EAChBA,EAAeI,GAEdA,EAAeE,MAChBC,EAAgBN,EAChBA,EAAeG,GAEdA,EAAeG,MAEhBC,EAAkBJ,EAAeI,QACjCb,EAAU,IAAII,EAAeO,GAC7BG,KAAiBD,GAAWA,EAAQE,OAAS,GAEnDR,EAAUS,KAAK,CACXC,aAAcR,EACdE,QACAC,QACAZ,UACAkB,MAAOd,EAAcW,OACrBD,cACAV,cAAeA,EAAcW,OAAS,EAAIX,OAAgBe,EAC1DC,cAAeV,EACfW,cAAelB,EAAcY,SAI7BD,GACAP,EAAUS,QACHd,EACCW,EACAb,EACAK,EACAC,GAGZ,IAGGC,CAAS,EAMde,EAAU,CAAClB,EAAyBmB,KACtC,GAAIA,EAAaR,QAAUX,EAAcW,OAAQ,OAAO,EAExD,MAAMS,EAAsBzB,EAAaK,GAGzC,OAF2BL,EAAawB,GAEdE,WAAWD,EAAsB,IAAI,EAMtDE,EAA2B,CACpCC,EACAvB,IAEOuB,EACFC,QAAQnB,GAAWa,EAAQlB,EAAeK,EAAOT,WACjD6B,KAAKpB,GAAWA,EAAOT,UAMnB8B,EAA2B,CACpCH,EACAvB,KAEA,MAAMoB,EAAsBzB,EAAaK,GACnC2B,EAAgB,GAEhBC,EAAcL,EAAiBM,WAChCxB,GAAWV,EAAaU,EAAOT,WAAawB,IAGjD,IAAoB,IAAhBQ,EAAoB,OAAOD,EAG/B,IAAK,IAAIG,EAAIF,EAAc,EAAGE,EAAIP,EAAiBZ,OAAQmB,IAAK,CAC5D,MAAMzB,EAASkB,EAAiBO,GAGhC,IAAIZ,EAAQlB,EAAeK,EAAOT,SAO9B,MALKS,EAAOK,aACRiB,EAASf,KAAKP,EAAOQ,aAMjC,CAEA,OAAOc,CAAQ,EAMNI,EAAmB,CAC5BtB,EACAuB,IAEOvB,EAAQwB,MAAM5B,IAEjB,MAAMN,EAAuBiC,EACvBA,EAAiB3B,GAEhBA,EAAeI,QACtB,OAAOV,GAAiBA,EAAcY,OAAS,CAAC"}

package/filter/addons/filter-item-checkbox.d.ts

@@ -1,4 +1,4 @@
-import { FilterItemCheckboxOptionProps, FilterItemCheckboxProps } from "../types";
+import type { FilterItemCheckboxOptionProps, FilterItemCheckboxProps } from "./types";
 export declare const FilterItemCheckbox: {
     <T = FilterItemCheckboxOptionProps>({ selectedOptions, options, showAsCheckboxInMobile, minimisableOptions, onSelect, labelExtractor, valueExtractor, useToggleContentWidth, ...filterItemProps }: FilterItemCheckboxProps<T>): import("react/jsx-runtime").JSX.Element;
     displayName: string;

package/filter/addons/filter-item-checkbox.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"../../_virtual/_tslib.js";import{jsx as t,jsxs as i,Fragment as l}from"react/jsx-runtime";import{useContext as n,useState as r,useRef as o,useMemo as a,useCallback as s,useEffect as c}from"react";import{useResizeDetector as d}from"../../external/react-resize-detector/build/index.esm.js";import{FilterContext as h}from"../filter-context.js";import{hasNestedOptions as m,flattenNestedOptions as u,buildKeyPath as g,getAllDescendantChildren as f,getAllDescendantKeyPaths as p}from"./filter-item-checkbox-helpers.js";import{StyledFilterItem as v,Group as b,SelectAllButton as k,StyledToggle as x,Item as C,StyledCheckbox as y}from"./filter-item-checkbox.styles.js";const I=I=>{var{selectedOptions:S,options:j,showAsCheckboxInMobile:O=!1,minimisableOptions:E=!0,onSelect:M,labelExtractor:T,valueExtractor:$,useToggleContentWidth:z}=I,P=e(I,["selectedOptions","options","showAsCheckboxInMobile","minimisableOptions","onSelect","labelExtractor","valueExtractor","useToggleContentWidth"]);const{mode:W}=n(h),[w,A]=r(S||[]),[H,D]=r(),[R,_]=r(j.length),F=o(null),K=o(null),L=a((()=>m(j,(e=>e.options))),[j]),N="mobile"===W&&!O&&!L,q=a((()=>u(j,[],$||(e=>e.value),T||(e=>e.label))),[j,$,T]),B=q.length,G=e=>()=>{const t=q.find((t=>t.originalItem===e));if(t)if(t.hasChildren){const e=f(q,t.keyPath),i=e.filter((e=>w.some((t=>Y(t)===Y(e)))));let l=[...w];i.length===e.length?l=l.filter((t=>!e.some((e=>Y(e)===Y(t))))):e.forEach((e=>{l.some((t=>Y(t)===Y(e)))||l.push(e)})),A(l),null==M||M(l)}else{const t=[...w],i=w.findIndex((t=>Y(t)===Y(e)));i>=0?t.splice(i,1):t.push(e),A(t),null==M||M(t)}},J=()=>{if(L)if(w.length>0)A([]),null==M||M([]);else{const e=q.filter((e=>!e.hasChildren)).map((e=>e.originalItem));A(e),null==M||M(e)}else{const e=w.length?[]:j;A(e),null==M||M(e)}},Q=e=>t=>{!L||" "!==t.key&&"Enter"!==t.key||(t.preventDefault(),G(e)())},U=e=>()=>{L||G(e)()},V=e=>{if(!e.hasChildren)return{checked:w.some((t=>Y(t)===Y(e.originalItem))),indeterminate:!1};const t=p(q,e.keyPath).map((e=>q.find((t=>g(t.keyPath)===g(e))))).filter((e=>e&&!e.hasChildren)).map((e=>e.originalItem)),i=t.filter((e=>w.some((t=>Y(t)===Y(e)))));return{checked:i.length===t.length&&t.length>0,indeterminate:i.length>0&&i.length<t.length}},X=e=>{var t;return T?T(e):null!==(t=e.label)&&void 0!==t?t:null==e?void 0:e.toString()},Y=e=>{var t;return $?$(e):null!==(t=e.value)&&void 0!==t?t:null==e?void 0:e.toString()},Z=()=>{const e=K.current?K.current.offsetTop+K.current.clientHeight:void 0;D(e)},ee=s((()=>{if(!F.current)return void D(void 0);const e=Array.from(F.current.children);let t=0,i=0,l=-1;for(let n=0;n<e.length;n++){const r=e[n].offsetTop;if(r>l&&(i++,l=r,i>2))break;t=n}_(t),D(i>2?l-8:void 0)}),[]);c((()=>{S!==w&&A(S||[])}),[S]),c((()=>{N?ee():Z()}),[j]),d({handleWidth:!0,handleHeight:!1,skipOnMount:!0,refreshMode:"throttle",targetRef:F,onResize:N?ee:Z});const te=(e,i)=>{const{checked:l,indeterminate:n}=V(i);return t(y,{displaySize:"small",checked:l,indeterminate:n,onChange:U(e),tabIndex:L?-1:void 0,"aria-hidden":L?"true":void 0})},ie=()=>{var e;return B<3?null:t(k,{styleType:"link",type:"button",onClick:J,"aria-label":w.length?"Clear all selections":`Select all in ${(null===(e=F.current)||void 0===e?void 0:e.ariaLabel)||"this group"}`,children:w.length?"Clear all":"Select all"})};return t(v,Object.assign({minimisable:!!E&&(N?!!H:B>5),minimisedHeight:H},P,{children:(e,{minimised:n})=>i(l,{children:[ie(),t(b,{role:L?"tree":"group","aria-label":P.title,"aria-multiselectable":!0,ref:F,$isMobileToggleMode:N,children:q.map(((e,l)=>N?((e,i,l)=>{const n=e.originalItem,r=X(n),o=Y(n),a=!!w.find((e=>Y(e)===o));return t(x,{type:"checkbox",checked:a,$visible:!l||!!H&&i<=R,onChange:G(n),useContentWidth:z,children:r},o)})(e,l,n):((e,t,l)=>{const n=e.originalItem,r=X(n),{checked:o,indeterminate:a}=V(e),s=o||a,c=!l||t<5,d=L?{"aria-checked":a?"mixed":o,"aria-selected":!!o,"aria-level":e.level+1,"aria-posinset":e.indexInParent+1,"aria-setsize":e.parentSetSize}:{};return i(C,Object.assign({as:L?"div":"label",role:L?"treeitem":void 0},d,{onClick:L?G(n):void 0,onKeyDown:Q(n),tabIndex:L?0:void 0,$visible:c,$selected:s,$level:e.level,ref:4===t?K:void 0,children:[te(n,e),r]}),g(e.keyPath))})(e,l,n)))})]})}))};I.displayName="Filter.Checkbox";export{I as FilterItemCheckbox};
+import{__rest as e}from"../../_virtual/_tslib.js";import{jsx as t,jsxs as l,Fragment as i}from"react/jsx-runtime";import n from"clsx";import{useContext as r,useState as o,useRef as a,useMemo as s,useCallback as c,useEffect as m}from"react";import{useResizeDetector as h}from"../../external/react-resize-detector/build/index.esm.js";import{Button as d}from"../../button/button.js";import{Checkbox as u}from"../../checkbox/checkbox.js";import{Toggle as f}from"../../toggle/toggle.js";import{FilterContext as p}from"../filter-context.js";import{FilterItem as g}from"../filter-item.js";import{group as b,groupMobileToggleMode as v,filterItem as k,selectAllButton as x,toggle as y,toggleHidden as C,item as j,itemHidden as I,itemSelected as S,checkbox as N,tokens as O}from"./filter-item-checkbox.styles.js";import{hasNestedOptions as P,flattenNestedOptions as z,buildKeyPath as E,getAllDescendantChildren as T,getAllDescendantKeyPaths as w}from"./filter-item-checkbox-helpers.js";const M=M=>{var{selectedOptions:W,options:A,showAsCheckboxInMobile:D=!1,minimisableOptions:H=!0,onSelect:K,labelExtractor:R,valueExtractor:_,useToggleContentWidth:F}=M,L=e(M,["selectedOptions","options","showAsCheckboxInMobile","minimisableOptions","onSelect","labelExtractor","valueExtractor","useToggleContentWidth"]);const{mode:$}=r(p),[q,B]=o(W||[]),[G,J]=o(),[Q,U]=o(A.length),V=a(null),X=a(null),Y=s((()=>P(A,(e=>e.options))),[A]),Z="mobile"===$&&!D&&!Y,ee=s((()=>z(A,[],_||(e=>e.value),R||(e=>e.label))),[A,_,R]),te=ee.length,le=e=>()=>{const t=ee.find((t=>t.originalItem===e));if(t)if(t.hasChildren){const e=T(ee,t.keyPath),l=e.filter((e=>q.some((t=>se(t)===se(e)))));let i=[...q];l.length===e.length?i=i.filter((t=>!e.some((e=>se(e)===se(t))))):e.forEach((e=>{i.some((t=>se(t)===se(e)))||i.push(e)})),B(i),null==K||K(i)}else{const t=[...q],l=q.findIndex((t=>se(t)===se(e)));l>=0?t.splice(l,1):t.push(e),B(t),null==K||K(t)}},ie=()=>{if(Y)if(q.length>0)B([]),null==K||K([]);else{const e=ee.filter((e=>!e.hasChildren)).map((e=>e.originalItem));B(e),null==K||K(e)}else{const e=q.length?[]:A;B(e),null==K||K(e)}},ne=e=>t=>{!Y||" "!==t.key&&"Enter"!==t.key||(t.preventDefault(),le(e)())},re=e=>()=>{Y||le(e)()},oe=e=>{if(!e.hasChildren)return{checked:q.some((t=>se(t)===se(e.originalItem))),indeterminate:!1};const t=w(ee,e.keyPath).map((e=>ee.find((t=>E(t.keyPath)===E(e))))).filter((e=>e&&!e.hasChildren)).map((e=>e.originalItem)),l=t.filter((e=>q.some((t=>se(t)===se(e)))));return{checked:l.length===t.length&&t.length>0,indeterminate:l.length>0&&l.length<t.length}},ae=e=>{var t;return R?R(e):null!==(t=e.label)&&void 0!==t?t:null==e?void 0:e.toString()},se=e=>{var t;return _?_(e):null!==(t=e.value)&&void 0!==t?t:null==e?void 0:e.toString()},ce=()=>{const e=X.current?X.current.offsetTop+X.current.clientHeight:void 0;J(e)},me=c((()=>{if(!V.current)return void J(void 0);const e=Array.from(V.current.children);let t=0,l=0,i=-1;for(let n=0;n<e.length;n++){const r=e[n].offsetTop;if(r>i&&(l++,i=r,l>2))break;t=n}U(t),J(l>2?i-8:void 0)}),[]);m((()=>{W!==q&&B(W||[])}),[W]),m((()=>{Z?me():ce()}),[A]),h({handleWidth:!0,handleHeight:!1,skipOnMount:!0,refreshMode:"throttle",targetRef:V,onResize:Z?me:ce});const he=(e,l)=>{const{checked:i,indeterminate:n}=oe(l);return t(u,{className:N,displaySize:"small",checked:i,indeterminate:n,onChange:re(e),tabIndex:Y?-1:void 0,"aria-hidden":Y?"true":void 0})},de=()=>{var e;return te<3?null:t(d,{className:x,styleType:"link",type:"button",sizeType:"small",onClick:ie,"aria-label":q.length?"Clear all selections":`Select all in ${(null===(e=V.current)||void 0===e?void 0:e.ariaLabel)||"this group"}`,children:q.length?"Clear all":"Select all"})};return t(g,Object.assign({minimisable:!!H&&(Z?!!G:te>5),minimisedHeight:G},L,{className:n(k,L.className),children:(e,{minimised:r})=>l(i,{children:[de(),t("div",{role:Y?"tree":"group","aria-label":L.title,"aria-multiselectable":!0,ref:V,className:n(b,Z&&v),children:ee.map(((e,o)=>Z?((e,l,i)=>{const r=e.originalItem,o=ae(r),a=se(r),s=!!q.find((e=>se(e)===a));return t(f,{type:"checkbox",checked:s,className:n(!F&&y,!(!i||G&&l<=Q)&&C),onChange:le(r),useContentWidth:F,children:o},a)})(e,o,r):((e,r,o)=>{const a=e.originalItem,s=ae(a),{checked:c,indeterminate:m}=oe(e),h=c||m,d=!o||r<5,u=Y?{"aria-checked":m?"mixed":c,"aria-selected":!!c,"aria-level":e.level+1,"aria-posinset":e.indexInParent+1,"aria-setsize":e.parentSetSize}:{},f=t=>{t&&e.level&&t.style.setProperty(O.item.level,String(e.level)),4===r&&(X.current=t)},p=n(j,!d&&I,h&&S),g=l(i,{children:[he(a,e),s]});return Y?t("div",Object.assign({role:"treeitem"},u,{onClick:le(a),onKeyDown:ne(a),tabIndex:0,className:p,ref:f,children:g}),E(e.keyPath)):t("label",{onKeyDown:ne(a),className:p,ref:f,children:g},E(e.keyPath))})(e,o,r)))})]})}))};M.displayName="Filter.Checkbox";export{M as FilterItemCheckbox};
 //# sourceMappingURL=filter-item-checkbox.js.map