@lifesg/react-design-system 4.0.0-alpha.1 → 4.0.0-alpha.2

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

@@ -1,16 +1,64 @@
-export declare const TextContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<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;
-}, 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>> & string;
-export declare const Description: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").TypographyProps & {
-    ref?: import("react").RefObject<HTMLParagraphElement> | 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>> & string;
-export declare const WarningAlert: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<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>> & string;
-export declare const UploadButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<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;
-}, never>> & string;
-export declare const ErrorAlert: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<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("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<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never> & Partial<Pick<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never>>> & string & Omit<(props: Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const TitleContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").MarkupProps & import("react").RefAttributes<HTMLDivElement>, never> & Partial<Pick<import("..").MarkupProps & import("react").RefAttributes<HTMLDivElement>, never>>> & string & Omit<(props: import("..").MarkupProps & import("react").RefAttributes<HTMLDivElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const Description: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never> & Partial<Pick<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never>>> & string & Omit<(props: Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const DescriptionContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").MarkupProps & import("react").RefAttributes<HTMLDivElement>, never> & Partial<Pick<import("..").MarkupProps & import("react").RefAttributes<HTMLDivElement>, never>>> & string & Omit<(props: import("..").MarkupProps & import("react").RefAttributes<HTMLDivElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+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<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never> & Partial<Pick<Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>, never>>> & string & Omit<(props: Omit<any, "ref"> & {
+    weight?: import("..").TypographyWeight | undefined;
+    inline?: boolean | undefined;
+    paragraph?: boolean | undefined;
+    maxLines?: number | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").RefAttributes<HTMLParagraphElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+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>>;

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

@@ -1,43 +1,41 @@
-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{Typography as m}from"../typography/index.js";import{V3_Spacing as n,V3_Colour as r,V3_MediaQuery as d}from"../v3_theme/index.js";const l=t.div`
+import t from"styled-components";import{Alert as i}from"../alert/alert.js";import{Button as o}from"../button/button.js";import{Markup as r}from"../markup/markup.js";import{Typography as e}from"../typography/index.js";import{V3_Spacing as m,V3_Colour as n,V3_MediaQuery as a}from"../v3_theme/index.js";const d=t.div`
     display: flex;
     flex-direction: column;
-    margin-bottom: ${n["spacing-32"]};
-    gap: ${n["spacing-8"]};
-`,a=t(m.BodyBL)``,s=t.div`
-    color: ${r.text};
-    ${e({textSize:"body-baseline"})}
-`,p=t(m.BodyMD)`
-    color: ${r["text-subtler"]};
-`,x=t.div`
-    color: ${r.text};
-    ${e({textSize:"body-md"})}
+    margin-bottom: ${m["spacing-32"]};
+    gap: ${m["spacing-8"]};
+`,l=t(e.BodyBL)``,p=t(r)`
+    color: ${n.text};
+`,s=t(e.BodyMD)`
+    color: ${n["text-subtler"]};
+`,x=t(r)`
+    color: ${n.text};
 `,c=t(i)`
-    margin-bottom: ${n["spacing-32"]};
+    margin-bottom: ${m["spacing-32"]};
 `,g=t.div`
     width: 100%;
     display: flex;
     flex-direction: column;
     align-items: flex-end;
 
-    ${d.MaxWidth.md} {
+    ${a.MaxWidth.md} {
         align-items: flex-start;
     }
-`,$=t(o.Small)`
+`,f=t(o.Small)`
     width: 10rem;
 
-    ${d.MaxWidth.md} {
+    ${a.MaxWidth.md} {
         width: 100%;
     }
-`,h=t(m.BodyMD)`
-    color: ${r["text-subtler"]};
-    margin-top: ${n["spacing-8"]};
+`,$=t(e.BodyMD)`
+    color: ${n["text-subtler"]};
+    margin-top: ${m["spacing-8"]};
     width: 10rem;
     text-align: center;
-    ${d.MaxWidth.md} {
+    ${a.MaxWidth.md} {
         display: none;
         visibility: hidden;
     }
-`,f=t(i)`
-    margin-bottom: ${n["spacing-32"]};
-`;export{p as Description,x as DescriptionContainer,f as ErrorAlert,l as TextContainer,a as Title,s as TitleContainer,$ as UploadButton,g as UploadButtonContainer,h as UploadButtonText,c as WarningAlert};
+`,h=t(i)`
+    margin-bottom: ${m["spacing-32"]};
+`;export{s as Description,x as DescriptionContainer,h as ErrorAlert,d as TextContainer,l as Title,p as TitleContainer,f as UploadButton,g as UploadButtonContainer,$ as UploadButtonText,c 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\";\n\nimport { Alert } from \"../alert\";\nimport { Button } from \"../button\";\nimport { applyHtmlContentStyle } from \"../shared/html-content/html-content\";\nimport { Typography } from \"../typography\";\nimport { V3_Colour, V3_MediaQuery, V3_Spacing } from \"../v3_theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const TextContainer = styled.div`\n    display: flex;\n    flex-direction: column;\n    margin-bottom: ${V3_Spacing[\"spacing-32\"]};\n    gap: ${V3_Spacing[\"spacing-8\"]};\n`;\n\nexport const Title = styled(Typography.BodyBL)``;\n\nexport const TitleContainer = styled.div`\n    color: ${V3_Colour.text};\n    ${applyHtmlContentStyle({ textSize: \"body-baseline\" })}\n`;\n\nexport const Description = styled(Typography.BodyMD)`\n    color: ${V3_Colour[\"text-subtler\"]};\n`;\n\nexport const DescriptionContainer = styled.div`\n    color: ${V3_Colour.text};\n    ${applyHtmlContentStyle({ textSize: \"body-md\" })}\n`;\n\nexport const WarningAlert = styled(Alert)`\n    margin-bottom: ${V3_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    ${V3_MediaQuery.MaxWidth.md} {\n        align-items: flex-start;\n    }\n`;\n\nexport const UploadButton = styled(Button.Small)`\n    width: 10rem;\n\n    ${V3_MediaQuery.MaxWidth.md} {\n        width: 100%;\n    }\n`;\n\nexport const UploadButtonText = styled(Typography.BodyMD)`\n    color: ${V3_Colour[\"text-subtler\"]};\n    margin-top: ${V3_Spacing[\"spacing-8\"]};\n    width: 10rem;\n    text-align: center;\n    ${V3_MediaQuery.MaxWidth.md} {\n        display: none;\n        visibility: hidden;\n    }\n`;\n\nexport const ErrorAlert = styled(Alert)`\n    margin-bottom: ${V3_Spacing[\"spacing-32\"]};\n`;\n"],"names":["TextContainer","styled","div","V3_Spacing","Title","Typography","BodyBL","TitleContainer","V3_Colour","text","applyHtmlContentStyle","textSize","Description","BodyMD","DescriptionContainer","WarningAlert","Alert","UploadButtonContainer","V3_MediaQuery","MaxWidth","md","UploadButton","Button","Small","UploadButtonText","ErrorAlert"],"mappings":"+UAWO,MAAMA,EAAgBC,EAAOC,GAAG;;;qBAGlBC,EAAW;WACrBA,EAAW;EAGTC,EAAQH,EAAOI,EAAWC,OAAO,GAEjCC,EAAiBN,EAAOC,GAAG;aAC3BM,EAAUC;MACjBC,EAAsB,CAAEC,SAAU;EAG3BC,EAAcX,EAAOI,EAAWQ,OAAO;aACvCL,EAAU;EAGVM,EAAuBb,EAAOC,GAAG;aACjCM,EAAUC;MACjBC,EAAsB,CAAEC,SAAU;EAG3BI,EAAed,EAAOe,EAAM;qBACpBb,EAAW;EAGnBc,EAAwBhB,EAAOC,GAAG;;;;;;MAMzCgB,EAAcC,SAASC;;;EAKhBC,EAAepB,EAAOqB,EAAOC,MAAM;;;MAG1CL,EAAcC,SAASC;;;EAKhBI,EAAmBvB,EAAOI,EAAWQ,OAAO;aAC5CL,EAAU;kBACLL,EAAW;;;MAGvBe,EAAcC,SAASC;;;;EAMhBK,EAAaxB,EAAOe,EAAM;qBAClBb,EAAW;"}
+{"version":3,"file":"file-upload.styles.js","sources":["../../src/file-upload/file-upload.styles.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { Alert } from \"../alert\";\nimport { Button } from \"../button\";\nimport { Markup } from \"../markup\";\nimport { Typography } from \"../typography\";\nimport { V3_Colour, V3_MediaQuery, V3_Spacing } from \"../v3_theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\nexport const TextContainer = styled.div`\n    display: flex;\n    flex-direction: column;\n    margin-bottom: ${V3_Spacing[\"spacing-32\"]};\n    gap: ${V3_Spacing[\"spacing-8\"]};\n`;\n\nexport const Title = styled(Typography.BodyBL)``;\n\nexport const TitleContainer = styled(Markup)`\n    color: ${V3_Colour.text};\n`;\n\nexport const Description = styled(Typography.BodyMD)`\n    color: ${V3_Colour[\"text-subtler\"]};\n`;\n\nexport const DescriptionContainer = styled(Markup)`\n    color: ${V3_Colour.text};\n`;\n\nexport const WarningAlert = styled(Alert)`\n    margin-bottom: ${V3_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    ${V3_MediaQuery.MaxWidth.md} {\n        align-items: flex-start;\n    }\n`;\n\nexport const UploadButton = styled(Button.Small)`\n    width: 10rem;\n\n    ${V3_MediaQuery.MaxWidth.md} {\n        width: 100%;\n    }\n`;\n\nexport const UploadButtonText = styled(Typography.BodyMD)`\n    color: ${V3_Colour[\"text-subtler\"]};\n    margin-top: ${V3_Spacing[\"spacing-8\"]};\n    width: 10rem;\n    text-align: center;\n    ${V3_MediaQuery.MaxWidth.md} {\n        display: none;\n        visibility: hidden;\n    }\n`;\n\nexport const ErrorAlert = styled(Alert)`\n    margin-bottom: ${V3_Spacing[\"spacing-32\"]};\n`;\n"],"names":["TextContainer","styled","div","V3_Spacing","Title","Typography","BodyBL","TitleContainer","Markup","V3_Colour","text","Description","BodyMD","DescriptionContainer","WarningAlert","Alert","UploadButtonContainer","V3_MediaQuery","MaxWidth","md","UploadButton","Button","Small","UploadButtonText","ErrorAlert"],"mappings":"6SAWO,MAAMA,EAAgBC,EAAOC,GAAG;;;qBAGlBC,EAAW;WACrBA,EAAW;EAGTC,EAAQH,EAAOI,EAAWC,OAAO,GAEjCC,EAAiBN,EAAOO,EAAO;aAC/BC,EAAUC;EAGVC,EAAcV,EAAOI,EAAWO,OAAO;aACvCH,EAAU;EAGVI,EAAuBZ,EAAOO,EAAO;aACrCC,EAAUC;EAGVI,EAAeb,EAAOc,EAAM;qBACpBZ,EAAW;EAGnBa,EAAwBf,EAAOC,GAAG;;;;;;MAMzCe,EAAcC,SAASC;;;EAKhBC,EAAenB,EAAOoB,EAAOC,MAAM;;;MAG1CL,EAAcC,SAASC;;;EAKhBI,EAAmBtB,EAAOI,EAAWO,OAAO;aAC5CH,EAAU;kBACLN,EAAW;;;MAGvBc,EAAcC,SAASC;;;;EAMhBK,EAAavB,EAAOc,EAAM;qBAClBZ,EAAW;"}

package/file-upload/helper.d.ts

@@ -1,4 +1,6 @@
 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 @@
-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)}}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 class FileUploadHelper {\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"],"mappings":"MAAaA,EAEF,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"}
+{"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/filter/addons/filter-item-checkbox.styles.d.ts

@@ -1,17 +1,25 @@
-export declare const StyledFilterItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").FilterItemProps, never>> & string & Omit<{
+export declare const StyledFilterItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").FilterItemProps, never> & Partial<Pick<import("..").FilterItemProps, never>>> & string & Omit<{
     ({ collapsible: desktopCollapsible, initialExpanded, expanded: controlledExpanded, onExpandChange, minimisable, minimisedHeight, showDivider, showMobileDivider, title, addon, children, ...otherProps }: import("..").FilterItemProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 }, keyof import("react").Component<any, {}, any>>;
-export declare const Group: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+export declare const Group: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$isMobileToggleMode"> & {
     $isMobileToggleMode: boolean;
-}>> & string;
-export declare const Item: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$isMobileToggleMode"> & {
+    $isMobileToggleMode: boolean;
+}, never>>> & string;
+export declare const Item: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "$visible" | "$selected" | "$level"> & {
     $visible: boolean;
     $selected: boolean;
     $level?: number;
-}>> & string;
-export declare const StyledCheckbox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../..").CheckboxProps, never>> & string & Omit<({ className, checked, disabled, indeterminate, displaySize, id, ...otherProps }: import("../..").CheckboxProps) => JSX.Element, keyof import("react").Component<any, {}, any>>;
-export declare const StyledToggle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("../..").ToggleProps, {
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "$visible" | "$selected" | "$level"> & {
+    $visible: boolean;
+    $selected: boolean;
+    $level?: number;
+}, never>>> & string;
+export declare const StyledCheckbox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../..").CheckboxProps, never> & Partial<Pick<import("../..").CheckboxProps, never>>> & string & Omit<({ className, checked, disabled, focusableWhenDisabled, indeterminate, displaySize, onChange, id, tabIndex, ...otherProps }: import("../..").CheckboxProps) => JSX.Element, keyof import("react").Component<any, {}, any>>;
+export declare const StyledToggle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("../..").ToggleProps, "$visible"> & {
+    $visible: boolean;
+}, never> & Partial<Pick<import("styled-components").FastOmit<import("../..").ToggleProps, "$visible"> & {
     $visible: boolean;
-}>> & string & Omit<({ type, indicator, checked, styleType, children, childrenMaxLines, subLabel, disabled, error, name, id, className, compositeSection, removable, onRemove, "data-testid": testId, onChange, useContentWidth, "aria-describedby": ariaDescribedBy, ...otherProps }: import("../..").ToggleProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
-export declare const SelectAllButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<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>>;
+}, never>>> & string & Omit<({ type, indicator, checked, styleType, children, childrenMaxLines, subLabel, disabled, error, name, id, className, compositeSection, removable, focusableWhenDisabled, useContentWidth, onRemove, onChange, "data-testid": testId, "aria-describedby": ariaDescribedBy, ...otherProps }: import("../..").ToggleProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
+export declare const SelectAllButton: 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>>;

package/filter/filter-item-page.styles.d.ts

@@ -1 +1 @@
-export declare const FilterItemPageContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const FilterItemPageContainer: 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;

package/filter/filter-item.js

@@ -1,2 +1,2 @@
-import{__rest as i}from"../_virtual/_tslib.js";import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useSpring as r}from"@react-spring/web";import n from"../external/lodash/isNil.js";import{useContext as d,useState as l,useRef as o,useEffect as a}from"react";import{useResizeDetector as s}from"../external/react-resize-detector/build/index.esm.js";import{PopoverAddon as m}from"../form/form-label-addon.js";import{VisuallyHidden as c,inertValue as h}from"../shared/accessibility/index.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{SimpleIdGenerator as p}from"../util/simple-id-generator.js";import"../util/string-helper.js";import{FilterContext as b}from"./filter-context.js";import{FilterItemWrapper as f,Divider as u,FilterItemHeader as x,FilterItemTitle as g,FilterItemExpandButton as v,ChevronIcon as j,ExpandableItem as $,FilterItemBody as y,MinimisableContent as w,FilterItemMinimiseButton as M}from"./filter-item.styles.js";const D=D=>{var C,{collapsible:E=!0,initialExpanded:N=!1,expanded:k,onExpandChange:H,minimisable:O=!1,minimisedHeight:_,showDivider:z=!0,showMobileDivider:F=!0,title:I,addon:T,children:V}=D,q=i(D,["collapsible","initialExpanded","expanded","onExpandChange","minimisable","minimisedHeight","showDivider","showMobileDivider","title","addon","children"]);const{mode:A,rootNode:B}=d(b),G="mobile"===A,[J,K]=l(ii()),[L,P]=l(O),Q=!G&&E,R=s(),S=s(),U=r({height:J?R.height:0}),W=L?null!=_?_:Math.min(.5*(null!==(C=S.height)&&void 0!==C?C:0),216):S.height,X=o(p.generate()),Y=`${X.current}-content`,Z=`${X.current}-title`;a((()=>{K(ii())}),[E,k]),a((()=>{P(O)}),[O]);function ii(){return!!G||(n(k)?!E||N:k)}return e(f,{$isMobile:G,$collapsible:Q,"aria-labelledby":Z,children:[t(u,{$isMobile:G,$showDivider:z,$showMobileDivider:F}),(I||Q)&&e(x,{$isMobile:G,children:[I&&e(g,{id:Z,"data-testid":"filter-item-title",$isMobile:G,children:[I," ",T&&("popover"===(null==T?void 0:T.type)?t(m,{addon:T,rootNode:G?B:void 0}):null)]}),Q&&e(v,{"data-testid":"expand-collapse-button",focusHighlight:!1,focusOutline:"browser",onClick:()=>{const i=!J;n(k)&&K(i),H&&H(i)},"aria-expanded":J,"aria-disabled":!Q,"aria-controls":Y,children:[I&&t(c,{children:I}),t(j,{$expanded:J,"aria-hidden":!0})]})]}),t($,{id:Y,"data-testid":"expandable-container","data-expanded":J,style:U,inert:h(!J),children:t("div",{ref:R.ref,children:e(y,Object.assign({},q,{children:[t(w,{"data-testid":"minimisable-container",$height:W,$minimisable:O,children:t("div",{ref:S.ref,children:t("div",{"data-id":"content-container",children:"function"==typeof V?V(A,{minimised:L}):V})})}),O&&e(M,{"data-id":"minimise-button",styleType:"link",type:"button",onClick:()=>{P(!L)},children:[t(c,{children:`view ${L?"more":"less"} in ${I}`}),e("span",{"aria-hidden":!0,children:["View ",L?"more":"less"]})]})]}))})})]})};D.displayName="Filter.Item";export{D as FilterItem};
+import{__rest as i}from"../_virtual/_tslib.js";import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useSpring as r}from"@react-spring/web";import n from"../external/lodash/isNil.js";import{useContext as d,useState as l,useEffect as o}from"react";import{useResizeDetector as a}from"../external/react-resize-detector/build/index.esm.js";import{PopoverAddon as s}from"../form/form-label-addon.js";import{VisuallyHidden as m,inertValue as c}from"../shared/accessibility/index.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{useId as h}from"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{FilterContext as p}from"./filter-context.js";import{FilterItemWrapper as b,Divider as f,FilterItemHeader as u,FilterItemTitle as x,FilterItemExpandButton as v,ChevronIcon as g,ExpandableItem as j,FilterItemBody as $,MinimisableContent as y,FilterItemMinimiseButton as w}from"./filter-item.styles.js";const M=M=>{var D,{collapsible:C=!0,initialExpanded:E=!1,expanded:N,onExpandChange:k,minimisable:H=!1,minimisedHeight:O,showDivider:_=!0,showMobileDivider:z=!0,title:F,addon:I,children:T}=M,V=i(M,["collapsible","initialExpanded","expanded","onExpandChange","minimisable","minimisedHeight","showDivider","showMobileDivider","title","addon","children"]);const{mode:q,rootNode:A}=d(p),B="mobile"===q,[G,J]=l(Z()),[K,L]=l(H),P=!B&&C,Q=a(),R=a(),S=r({height:G?Q.height:0}),U=K?null!=O?O:Math.min(.5*(null!==(D=R.height)&&void 0!==D?D:0),216):R.height,W=h(),X=`${W}-content`,Y=`${W}-title`;o((()=>{J(Z())}),[C,N]),o((()=>{L(H)}),[H]);function Z(){return!!B||(n(N)?!C||E:N)}return e(b,{$isMobile:B,$collapsible:P,"aria-labelledby":Y,children:[t(f,{$isMobile:B,$showDivider:_,$showMobileDivider:z}),(F||P)&&e(u,{$isMobile:B,children:[F&&e(x,{id:Y,"data-testid":"filter-item-title",$isMobile:B,children:[F," ",I&&("popover"===(null==I?void 0:I.type)?t(s,{addon:I,rootNode:B?A:void 0}):null)]}),P&&e(v,{"data-testid":"expand-collapse-button",focusHighlight:!1,focusOutline:"browser",onClick:()=>{const i=!G;n(N)&&J(i),k&&k(i)},"aria-expanded":G,"aria-disabled":!P,"aria-controls":X,children:[F&&t(m,{children:F}),t(g,{$expanded:G,"aria-hidden":!0})]})]}),t(j,{id:X,"data-testid":"expandable-container","data-expanded":G,style:S,inert:c(!G),children:t("div",{ref:Q.ref,children:e($,Object.assign({},V,{children:[t(y,{"data-testid":"minimisable-container",$height:U,$minimisable:H,children:t("div",{ref:R.ref,children:t("div",{"data-id":"content-container",children:"function"==typeof T?T(q,{minimised:K}):T})})}),H&&e(w,{"data-id":"minimise-button",styleType:"link",type:"button",onClick:()=>{L(!K)},children:[t(m,{children:`view ${K?"more":"less"} in ${F}`}),e("span",{"aria-hidden":!0,children:["View ",K?"more":"less"]})]})]}))})})]})};M.displayName="Filter.Item";export{M as FilterItem};
 //# sourceMappingURL=filter-item.js.map

package/filter/filter-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-item.js","sources":["../../src/filter/filter-item.tsx"],"sourcesContent":["import { useSpring } from \"@react-spring/web\";\nimport isNil from \"lodash/isNil\";\nimport { useContext, useEffect, useRef, useState } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport { PopoverAddon } from \"../form/form-label-addon\";\nimport { inertValue, VisuallyHidden } from \"../shared/accessibility\";\nimport { SimpleIdGenerator } from \"../util\";\nimport { FilterContext } from \"./filter-context\";\nimport {\n    ChevronIcon,\n    Divider,\n    ExpandableItem,\n    FilterItemBody,\n    FilterItemExpandButton,\n    FilterItemHeader,\n    FilterItemMinimiseButton,\n    FilterItemTitle,\n    FilterItemWrapper,\n    MinimisableContent,\n} from \"./filter-item.styles\";\nimport type { FilterItemProps } from \"./types\";\n\nexport const FilterItem = ({\n    collapsible: desktopCollapsible = true,\n    initialExpanded = false,\n    expanded: controlledExpanded,\n    onExpandChange,\n    minimisable = false,\n    minimisedHeight,\n    showDivider = true,\n    showMobileDivider = true,\n    title,\n    addon,\n    children,\n    ...otherProps\n}: FilterItemProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const { mode, rootNode } = useContext(FilterContext);\n    const isMobile = mode === \"mobile\";\n    const [expanded, setExpanded] = useState(getInitialExpandState());\n    const [contentMinimised, setContentMinimised] = useState(minimisable);\n    const collapsible = !isMobile && desktopCollapsible;\n\n    const itemResizeDetector = useResizeDetector();\n    const contentResizeDetector = useResizeDetector();\n    const itemAnimationStyles = useSpring({\n        height: expanded ? itemResizeDetector.height : 0,\n    });\n    const contentHeight = contentMinimised\n        ? minimisedHeight ??\n          Math.min((contentResizeDetector.height ?? 0) * 0.5, 216)\n        : contentResizeDetector.height;\n    const internalId = useRef(SimpleIdGenerator.generate());\n    const contentId = `${internalId.current}-content`;\n    const titleId = `${internalId.current}-title`;\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        setExpanded(getInitialExpandState());\n    }, [desktopCollapsible, controlledExpanded]);\n\n    useEffect(() => {\n        setContentMinimised(minimisable);\n    }, [minimisable]);\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleExpandCollapse = () => {\n        const nextState = !expanded;\n\n        if (isNil(controlledExpanded)) {\n            setExpanded(nextState);\n        }\n\n        if (onExpandChange) {\n            onExpandChange(nextState);\n        }\n    };\n\n    const handleMinimise = () => {\n        setContentMinimised(!contentMinimised);\n    };\n\n    // =============================================================================\n    // HELPERS\n    // =============================================================================\n    function getInitialExpandState() {\n        if (isMobile) {\n            return true;\n        }\n        if (isNil(controlledExpanded)) {\n            return !desktopCollapsible || initialExpanded;\n        }\n        return controlledExpanded;\n    }\n\n    // =============================================================================\n    // RENDER\n    // =============================================================================\n\n    const renderAddon = () => {\n        switch (addon?.type) {\n            case \"popover\":\n                return (\n                    <PopoverAddon\n                        addon={addon}\n                        rootNode={isMobile ? rootNode : undefined}\n                    />\n                );\n            default:\n                return null;\n        }\n    };\n\n    return (\n        <FilterItemWrapper\n            $isMobile={isMobile}\n            $collapsible={collapsible}\n            aria-labelledby={titleId}\n        >\n            <Divider\n                $isMobile={isMobile}\n                $showDivider={showDivider}\n                $showMobileDivider={showMobileDivider}\n            />\n            {(title || collapsible) && (\n                <FilterItemHeader $isMobile={isMobile}>\n                    {title && (\n                        <FilterItemTitle\n                            id={titleId}\n                            data-testid=\"filter-item-title\"\n                            $isMobile={isMobile}\n                        >\n                            {title} {addon && renderAddon()}\n                        </FilterItemTitle>\n                    )}\n                    {collapsible && (\n                        <FilterItemExpandButton\n                            data-testid={\"expand-collapse-button\"}\n                            focusHighlight={false}\n                            focusOutline=\"browser\"\n                            onClick={handleExpandCollapse}\n                            aria-expanded={expanded}\n                            aria-disabled={!collapsible}\n                            aria-controls={contentId}\n                        >\n                            {title && <VisuallyHidden>{title}</VisuallyHidden>}\n                            <ChevronIcon $expanded={expanded} aria-hidden />\n                        </FilterItemExpandButton>\n                    )}\n                </FilterItemHeader>\n            )}\n            <ExpandableItem\n                id={contentId}\n                data-testid={\"expandable-container\"}\n                data-expanded={expanded}\n                style={itemAnimationStyles}\n                inert={inertValue(!expanded)}\n            >\n                <div ref={itemResizeDetector.ref}>\n                    <FilterItemBody {...otherProps}>\n                        <MinimisableContent\n                            data-testid=\"minimisable-container\"\n                            $height={contentHeight}\n                            $minimisable={minimisable}\n                        >\n                            <div ref={contentResizeDetector.ref}>\n                                <div data-id=\"content-container\">\n                                    {typeof children === \"function\"\n                                        ? children(mode, {\n                                              minimised: contentMinimised,\n                                          })\n                                        : children}\n                                </div>\n                            </div>\n                        </MinimisableContent>\n                        {minimisable && (\n                            <FilterItemMinimiseButton\n                                data-id=\"minimise-button\"\n                                styleType=\"link\"\n                                type=\"button\"\n                                onClick={handleMinimise}\n                            >\n                                <VisuallyHidden>{`view ${\n                                    contentMinimised ? \"more\" : \"less\"\n                                } in ${title}`}</VisuallyHidden>\n                                <span aria-hidden>\n                                    View {contentMinimised ? \"more\" : \"less\"}\n                                </span>\n                            </FilterItemMinimiseButton>\n                        )}\n                    </FilterItemBody>\n                </div>\n            </ExpandableItem>\n        </FilterItemWrapper>\n    );\n};\n\nFilterItem.displayName = \"Filter.Item\";\n"],"names":["FilterItem","_a","collapsible","desktopCollapsible","initialExpanded","expanded","controlledExpanded","onExpandChange","minimisable","minimisedHeight","showDivider","showMobileDivider","title","addon","children","otherProps","__rest","mode","rootNode","useContext","FilterContext","isMobile","setExpanded","useState","getInitialExpandState","contentMinimised","setContentMinimised","itemResizeDetector","useResizeDetector","contentResizeDetector","itemAnimationStyles","useSpring","height","contentHeight","Math","min","_b","internalId","useRef","SimpleIdGenerator","generate","contentId","current","titleId","useEffect","isNil","_jsxs","FilterItemWrapper","$isMobile","_jsx","Divider","$showDivider","$showMobileDivider","FilterItemHeader","FilterItemTitle","id","type","PopoverAddon","undefined","FilterItemExpandButton","focusHighlight","focusOutline","onClick","nextState","VisuallyHidden","ChevronIcon","$expanded","ExpandableItem","style","inert","inertValue","ref","FilterItemBody","Object","assign","MinimisableContent","$height","$minimisable","minimised","FilterItemMinimiseButton","styleType","displayName"],"mappings":"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"}
+{"version":3,"file":"filter-item.js","sources":["../../src/filter/filter-item.tsx"],"sourcesContent":["import { useSpring } from \"@react-spring/web\";\nimport isNil from \"lodash/isNil\";\nimport { useContext, useEffect, useState } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport { PopoverAddon } from \"../form/form-label-addon\";\nimport { inertValue, VisuallyHidden } from \"../shared/accessibility\";\nimport { useId } from \"../util\";\nimport { FilterContext } from \"./filter-context\";\nimport {\n    ChevronIcon,\n    Divider,\n    ExpandableItem,\n    FilterItemBody,\n    FilterItemExpandButton,\n    FilterItemHeader,\n    FilterItemMinimiseButton,\n    FilterItemTitle,\n    FilterItemWrapper,\n    MinimisableContent,\n} from \"./filter-item.styles\";\nimport type { FilterItemProps } from \"./types\";\n\nexport const FilterItem = ({\n    collapsible: desktopCollapsible = true,\n    initialExpanded = false,\n    expanded: controlledExpanded,\n    onExpandChange,\n    minimisable = false,\n    minimisedHeight,\n    showDivider = true,\n    showMobileDivider = true,\n    title,\n    addon,\n    children,\n    ...otherProps\n}: FilterItemProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const { mode, rootNode } = useContext(FilterContext);\n    const isMobile = mode === \"mobile\";\n    const [expanded, setExpanded] = useState(getInitialExpandState());\n    const [contentMinimised, setContentMinimised] = useState(minimisable);\n    const collapsible = !isMobile && desktopCollapsible;\n\n    const itemResizeDetector = useResizeDetector();\n    const contentResizeDetector = useResizeDetector();\n    const itemAnimationStyles = useSpring({\n        height: expanded ? itemResizeDetector.height : 0,\n    });\n    const contentHeight = contentMinimised\n        ? minimisedHeight ??\n          Math.min((contentResizeDetector.height ?? 0) * 0.5, 216)\n        : contentResizeDetector.height;\n    const internalId = useId();\n    const contentId = `${internalId}-content`;\n    const titleId = `${internalId}-title`;\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        setExpanded(getInitialExpandState());\n    }, [desktopCollapsible, controlledExpanded]);\n\n    useEffect(() => {\n        setContentMinimised(minimisable);\n    }, [minimisable]);\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleExpandCollapse = () => {\n        const nextState = !expanded;\n\n        if (isNil(controlledExpanded)) {\n            setExpanded(nextState);\n        }\n\n        if (onExpandChange) {\n            onExpandChange(nextState);\n        }\n    };\n\n    const handleMinimise = () => {\n        setContentMinimised(!contentMinimised);\n    };\n\n    // =============================================================================\n    // HELPERS\n    // =============================================================================\n    function getInitialExpandState() {\n        if (isMobile) {\n            return true;\n        }\n        if (isNil(controlledExpanded)) {\n            return !desktopCollapsible || initialExpanded;\n        }\n        return controlledExpanded;\n    }\n\n    // =============================================================================\n    // RENDER\n    // =============================================================================\n\n    const renderAddon = () => {\n        switch (addon?.type) {\n            case \"popover\":\n                return (\n                    <PopoverAddon\n                        addon={addon}\n                        rootNode={isMobile ? rootNode : undefined}\n                    />\n                );\n            default:\n                return null;\n        }\n    };\n\n    return (\n        <FilterItemWrapper\n            $isMobile={isMobile}\n            $collapsible={collapsible}\n            aria-labelledby={titleId}\n        >\n            <Divider\n                $isMobile={isMobile}\n                $showDivider={showDivider}\n                $showMobileDivider={showMobileDivider}\n            />\n            {(title || collapsible) && (\n                <FilterItemHeader $isMobile={isMobile}>\n                    {title && (\n                        <FilterItemTitle\n                            id={titleId}\n                            data-testid=\"filter-item-title\"\n                            $isMobile={isMobile}\n                        >\n                            {title} {addon && renderAddon()}\n                        </FilterItemTitle>\n                    )}\n                    {collapsible && (\n                        <FilterItemExpandButton\n                            data-testid={\"expand-collapse-button\"}\n                            focusHighlight={false}\n                            focusOutline=\"browser\"\n                            onClick={handleExpandCollapse}\n                            aria-expanded={expanded}\n                            aria-disabled={!collapsible}\n                            aria-controls={contentId}\n                        >\n                            {title && <VisuallyHidden>{title}</VisuallyHidden>}\n                            <ChevronIcon $expanded={expanded} aria-hidden />\n                        </FilterItemExpandButton>\n                    )}\n                </FilterItemHeader>\n            )}\n            <ExpandableItem\n                id={contentId}\n                data-testid={\"expandable-container\"}\n                data-expanded={expanded}\n                style={itemAnimationStyles}\n                inert={inertValue(!expanded)}\n            >\n                <div ref={itemResizeDetector.ref}>\n                    <FilterItemBody {...otherProps}>\n                        <MinimisableContent\n                            data-testid=\"minimisable-container\"\n                            $height={contentHeight}\n                            $minimisable={minimisable}\n                        >\n                            <div ref={contentResizeDetector.ref}>\n                                <div data-id=\"content-container\">\n                                    {typeof children === \"function\"\n                                        ? children(mode, {\n                                              minimised: contentMinimised,\n                                          })\n                                        : children}\n                                </div>\n                            </div>\n                        </MinimisableContent>\n                        {minimisable && (\n                            <FilterItemMinimiseButton\n                                data-id=\"minimise-button\"\n                                styleType=\"link\"\n                                type=\"button\"\n                                onClick={handleMinimise}\n                            >\n                                <VisuallyHidden>{`view ${\n                                    contentMinimised ? \"more\" : \"less\"\n                                } in ${title}`}</VisuallyHidden>\n                                <span aria-hidden>\n                                    View {contentMinimised ? \"more\" : \"less\"}\n                                </span>\n                            </FilterItemMinimiseButton>\n                        )}\n                    </FilterItemBody>\n                </div>\n            </ExpandableItem>\n        </FilterItemWrapper>\n    );\n};\n\nFilterItem.displayName = \"Filter.Item\";\n"],"names":["FilterItem","_a","collapsible","desktopCollapsible","initialExpanded","expanded","controlledExpanded","onExpandChange","minimisable","minimisedHeight","showDivider","showMobileDivider","title","addon","children","otherProps","__rest","mode","rootNode","useContext","FilterContext","isMobile","setExpanded","useState","getInitialExpandState","contentMinimised","setContentMinimised","itemResizeDetector","useResizeDetector","contentResizeDetector","itemAnimationStyles","useSpring","height","contentHeight","Math","min","_b","internalId","useId","contentId","titleId","useEffect","isNil","_jsxs","FilterItemWrapper","$isMobile","_jsx","Divider","$showDivider","$showMobileDivider","FilterItemHeader","FilterItemTitle","id","type","PopoverAddon","undefined","FilterItemExpandButton","focusHighlight","focusOutline","onClick","nextState","VisuallyHidden","ChevronIcon","$expanded","ExpandableItem","style","inert","inertValue","ref","FilterItemBody","Object","assign","MinimisableContent","$height","$minimisable","minimised","FilterItemMinimiseButton","styleType","displayName"],"mappings":"w9BAuBO,MAAMA,EAAcC,WACvBC,YAAaC,GAAqB,EAAIC,gBACtCA,GAAkB,EAClBC,SAAUC,EAAkBC,eAC5BA,EAAcC,YACdA,GAAc,EAAKC,gBACnBA,EAAeC,YACfA,GAAc,EAAIC,kBAClBA,GAAoB,EAAIC,MACxBA,EAAKC,MACLA,EAAKC,SACLA,GAAQb,EACLc,EAAUC,EAAAf,EAZU,4JAiBvB,MAAMgB,KAAEA,EAAIC,SAAEA,GAAaC,EAAWC,GAChCC,EAAoB,WAATJ,GACVZ,EAAUiB,GAAeC,EAASC,MAClCC,EAAkBC,GAAuBH,EAASf,GACnDN,GAAemB,GAAYlB,EAE3BwB,EAAqBC,IACrBC,EAAwBD,IACxBE,EAAsBC,EAAU,CAClCC,OAAQ3B,EAAWsB,EAAmBK,OAAS,IAE7CC,EAAgBR,EAChBhB,QAAAA,EACAyB,KAAKC,IAA0C,IAAT,QAA5BC,EAAAP,EAAsBG,cAAM,IAAAI,EAAAA,EAAI,GAAU,KACpDP,EAAsBG,OACtBK,EAAaC,IACbC,EAAY,GAAGF,YACfG,EAAU,GAAGH,UAKnBI,GAAU,KACNnB,EAAYE,IAAwB,GACrC,CAACrB,EAAoBG,IAExBmC,GAAU,KACNf,EAAoBlB,EAAY,GACjC,CAACA,IAuBJ,SAASgB,IACL,QAAIH,IAGAqB,EAAMpC,IACEH,GAAsBC,EAE3BE,EACX,CAoBA,OACIqC,EAACC,EAAiB,CAAAC,UACHxB,eACGnB,EAAW,kBACRsC,EAAO1B,SAAA,CAExBgC,EAACC,EAAO,CAAAF,UACOxB,EAAQ2B,aACLtC,EAAWuC,mBACLtC,KAEtBC,GAASV,IACPyC,EAACO,EAAgB,CAAAL,UAAYxB,EAAQP,SAAA,CAChCF,GACG+B,EAACQ,EAAe,CACZC,GAAIZ,EAAO,cACC,oBAAmBK,UACpBxB,YAEVT,EAAK,IAAGC,IA/BpB,aADDA,aAAK,EAALA,EAAOwC,MAGHP,EAACQ,EAAY,CACTzC,MAAOA,EACPK,SAAUG,EAAWH,OAAWqC,IAIjC,SA0BFrD,GACGyC,EAACa,iBACgB,yBACbC,gBAAgB,EAChBC,aAAa,UACbC,QA1EK,KACzB,MAAMC,GAAavD,EAEfqC,EAAMpC,IACNgB,EAAYsC,GAGZrD,GACAA,EAAeqD,EACnB,EAiEiD,gBACdvD,EAAQ,iBACPH,EAAW,gBACZqC,EAASzB,SAAA,CAEvBF,GAASkC,EAACe,EAAc,CAAA/C,SAAEF,IAC3BkC,EAACgB,EAAW,CAAAC,UAAY1D,EAAQ,eAAA,UAKhDyC,EAACkB,EAAc,CACXZ,GAAIb,EAAS,cACA,uBAAsB,gBACpBlC,EACf4D,MAAOnC,EACPoC,MAAOC,GAAY9D,GAASS,SAE5BgC,EAAA,MAAA,CAAKsB,IAAKzC,EAAmByC,IAAGtD,SAC5B6B,EAAC0B,EAAcC,OAAAC,OAAA,GAAKxD,EAAU,CAAAD,SAAA,CAC1BgC,EAAC0B,EAAkB,CAAA,cACH,wBAAuBC,QAC1BxC,EAAayC,aACRlE,EAAWM,SAEzBgC,EAAA,MAAA,CAAKsB,IAAKvC,EAAsBuC,aAC5BtB,EAAA,MAAA,CAAA,UAAa,6BACY,mBAAbhC,EACFA,EAASG,EAAM,CACX0D,UAAWlD,IAEfX,QAIjBN,GACGmC,EAACiC,EAAwB,CAAA,UACb,kBACRC,UAAU,OACVxB,KAAK,SACLM,QAtGL,KACnBjC,GAAqBD,EAAiB,EAqGSX,SAAA,CAEvBgC,EAACe,YAAgB,QACbpC,EAAmB,OAAS,aACzBb,MACP+B,EAAA,OAAA,CAAA,eAAA,EAAA7B,SAAA,CAAA,QACUW,EAAmB,OAAS,uBAO1C,EAI5BzB,EAAW8E,YAAc"}

package/filter/filter-item.styles.d.ts

@@ -18,19 +18,21 @@ interface FilterItemHeaderStyleProps {
 interface FilterItemTitleStyleProps {
     $isMobile?: boolean;
 }
-export declare const FilterItemWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyleProps>> & string;
-export declare const Divider: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, DividerStyleProps>> & string;
-export declare const FilterItemHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, FilterItemHeaderStyleProps>> & string;
-export declare const FilterItemExpandButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>> & string & Omit<(props: import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
-export declare const ChevronIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
+export declare const FilterItemWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof StyleProps> & StyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof StyleProps> & StyleProps, never>>> & string;
+export declare const Divider: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof DividerStyleProps> & DividerStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof DividerStyleProps> & DividerStyleProps, never>>> & string;
+export declare const FilterItemHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$isMobile"> & FilterItemHeaderStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$isMobile"> & FilterItemHeaderStyleProps, never>>> & string;
+export declare const FilterItemExpandButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>>> & string & Omit<(props: import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const ChevronIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
     ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
-}, StyleProps>> & string & Omit<{
+}, keyof StyleProps> & StyleProps, never> & Partial<Pick<import("styled-components").FastOmit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
+    ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
+}, keyof StyleProps> & StyleProps, never>>> & string & Omit<{
     (props: import("react").SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 }, keyof import("react").Component<any, {}, any>>;
-export declare const FilterItemTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, FilterItemTitleStyleProps>> & string;
-export declare const ExpandableItem: import("@react-spring/web").AnimatedComponent<import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string>;
-export declare const FilterItemBody: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const MinimisableContent: import("@react-spring/web").AnimatedComponent<import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, MinimisableContentProps>> & string>;
-export declare const FilterItemMinimiseButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<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 FilterItemTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "$isMobile"> & FilterItemTitleStyleProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "$isMobile"> & FilterItemTitleStyleProps, never>>> & string;
+export declare const ExpandableItem: import("@react-spring/web").AnimatedComponent<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 FilterItemBody: 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 MinimisableContent: import("@react-spring/web").AnimatedComponent<import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof MinimisableContentProps> & MinimisableContentProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof MinimisableContentProps> & MinimisableContentProps, never>>> & string>;
+export declare const FilterItemMinimiseButton: 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 {};

package/filter/filter-modal.styles.d.ts

@@ -1,11 +1,15 @@
 type FilterHeaderProps = {
     $insetTop?: number | undefined;
 };
-export declare const MobileContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const MobileOverlayContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const FloatingWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const FilterHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, FilterHeaderProps>> & string;
-export declare const FilterTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>> & string;
-export declare const FilterClearButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<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 FilterButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("..").ButtonWithIconProps & import("react").RefAttributes<HTMLButtonElement>, never>> & string & Omit<(props: import("..").ButtonWithIconProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const MobileContainer: 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 MobileOverlayContainer: 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 FloatingWrapper: 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 FilterHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$insetTop"> & FilterHeaderProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$insetTop"> & FilterHeaderProps, never>>> & string;
+export declare const FilterTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>>> & string;
+export declare const FilterClearButton: 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 FilterButton: 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) & {
+    Default: (props: import("..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null;
+    Small: (props: import("..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null;
+    Large: (props: import("..").ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null;
+}, keyof import("react").Component<any, {}, any>>;
 export {};

package/filter/filter-modal.styles.js

@@ -1,30 +1,30 @@
-import t from"styled-components";import{Button as i}from"../button/button.js";import{ButtonWithIcon as o}from"../button-with-icon/button-with-icon.js";import{V3_Colour as n,V3_Font as e,V3_Spacing as r}from"../v3_theme/index.js";const d=t.div`
-    background-color: ${n["bg-strong"]};
+import i from"styled-components";import{Button as o}from"../button/button.js";import{V3_Colour as t,V3_Font as n,V3_Spacing as e}from"../v3_theme/index.js";const d=i.div`
+    background-color: ${t["bg-strong"]};
     height: 100%;
     width: 100%;
     display: flex;
     flex-direction: column;
-`,g=t.div`
-    background-color: ${n.bg};
+`,r=i.div`
+    background-color: ${t.bg};
     height: 100%;
     width: 100%;
-`,a=t.div`
+`,g=i.div`
     height: 100%;
-`,c=t.div`
+`,a=i.div`
     display: flex;
     align-items: center;
-    background-color: ${n.bg};
-    ${t=>t.$insetTop&&`padding-top: ${t.$insetTop}px;`}
-`,l=t.h2`
-    ${e["heading-xs-semibold"]}
+    background-color: ${t.bg};
+    ${i=>i.$insetTop&&`padding-top: ${i.$insetTop}px;`}
+`,c=i.h2`
+    ${n["heading-xs-semibold"]}
     flex: 1;
     text-align: center;
-    margin: ${r["spacing-24"]} 0;
-`,p=t(i.Small)`
+    margin: ${e["spacing-24"]} 0;
+`,l=i(o.Small)`
     background-color: transparent;
     height: 100%;
-    padding: ${r["spacing-24"]} ${r["spacing-20"]};
-`,s=t(o.Default)`
+    padding: ${e["spacing-24"]} ${e["spacing-20"]};
+`,p=i(o)`
     width: 100%;
-`;export{s as FilterButton,p as FilterClearButton,c as FilterHeader,l as FilterTitle,a as FloatingWrapper,d as MobileContainer,g as MobileOverlayContainer};
+`;export{p as FilterButton,l as FilterClearButton,a as FilterHeader,c as FilterTitle,g as FloatingWrapper,d as MobileContainer,r as MobileOverlayContainer};
 //# sourceMappingURL=filter-modal.styles.js.map

package/filter/filter-modal.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-modal.styles.js","sources":["../../src/filter/filter-modal.styles.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { Button } from \"../button\";\nimport { ButtonWithIcon } from \"../button-with-icon\";\nimport { V3_Colour, V3_Font, V3_Spacing } from \"../v3_theme\";\n\n// =============================================================================\n// STYLE INTERFACES\n// =============================================================================\ntype FilterHeaderProps = {\n    $insetTop?: number | undefined;\n};\n\n// =============================================================================\n// CONTAINER STYLES\n// =============================================================================\n\nexport const MobileContainer = styled.div`\n    background-color: ${V3_Colour[\"bg-strong\"]};\n    height: 100%;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n`;\n\nexport const MobileOverlayContainer = styled.div`\n    background-color: ${V3_Colour[\"bg\"]};\n    height: 100%;\n    width: 100%;\n`;\n\nexport const FloatingWrapper = styled.div`\n    height: 100%;\n`;\n\n// =============================================================================\n// HEADER STYLES\n// =============================================================================\n\nexport const FilterHeader = styled.div<FilterHeaderProps>`\n    display: flex;\n    align-items: center;\n    background-color: ${V3_Colour[\"bg\"]};\n    ${(props) => props.$insetTop && `padding-top: ${props.$insetTop}px;`}\n`;\n\nexport const FilterTitle = styled.h2`\n    ${V3_Font[\"heading-xs-semibold\"]}\n    flex: 1;\n    text-align: center;\n    margin: ${V3_Spacing[\"spacing-24\"]} 0;\n`;\n\nexport const FilterClearButton = styled(Button.Small)`\n    background-color: transparent;\n    height: 100%;\n    padding: ${V3_Spacing[\"spacing-24\"]} ${V3_Spacing[\"spacing-20\"]};\n`;\n\n// =============================================================================\n// COMPONENT STYLES\n// =============================================================================\n\nexport const FilterButton = styled(ButtonWithIcon.Default)`\n    width: 100%;\n`;\n"],"names":["MobileContainer","styled","div","V3_Colour","MobileOverlayContainer","FloatingWrapper","FilterHeader","props","$insetTop","FilterTitle","h2","V3_Font","V3_Spacing","FilterClearButton","Button","Small","FilterButton","ButtonWithIcon","Default"],"mappings":"qOAiBO,MAAMA,EAAkBC,EAAOC,GAAG;wBACjBC,EAAU;;;;;EAOrBC,EAAyBH,EAAOC,GAAG;wBACxBC,EAAc;;;EAKzBE,EAAkBJ,EAAOC,GAAG;;EAQ5BI,EAAeL,EAAOC,GAAsB;;;wBAGjCC,EAAc;MAC/BI,GAAUA,EAAMC,WAAa,gBAAgBD,EAAMC;EAG7CC,EAAcR,EAAOS,EAAE;MAC9BC,EAAQ;;;cAGAC,EAAW;EAGZC,EAAoBZ,EAAOa,EAAOC,MAAM;;;eAGtCH,EAAW,iBAAiBA,EAAW;EAOzCI,EAAef,EAAOgB,EAAeC,QAAQ;;"}
+{"version":3,"file":"filter-modal.styles.js","sources":["../../src/filter/filter-modal.styles.tsx"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { Button } from \"../button\";\nimport { V3_Colour, V3_Font, V3_Spacing } from \"../v3_theme\";\n\n// =============================================================================\n// STYLE INTERFACES\n// =============================================================================\ntype FilterHeaderProps = {\n    $insetTop?: number | undefined;\n};\n\n// =============================================================================\n// CONTAINER STYLES\n// =============================================================================\n\nexport const MobileContainer = styled.div`\n    background-color: ${V3_Colour[\"bg-strong\"]};\n    height: 100%;\n    width: 100%;\n    display: flex;\n    flex-direction: column;\n`;\n\nexport const MobileOverlayContainer = styled.div`\n    background-color: ${V3_Colour[\"bg\"]};\n    height: 100%;\n    width: 100%;\n`;\n\nexport const FloatingWrapper = styled.div`\n    height: 100%;\n`;\n\n// =============================================================================\n// HEADER STYLES\n// =============================================================================\n\nexport const FilterHeader = styled.div<FilterHeaderProps>`\n    display: flex;\n    align-items: center;\n    background-color: ${V3_Colour[\"bg\"]};\n    ${(props) => props.$insetTop && `padding-top: ${props.$insetTop}px;`}\n`;\n\nexport const FilterTitle = styled.h2`\n    ${V3_Font[\"heading-xs-semibold\"]}\n    flex: 1;\n    text-align: center;\n    margin: ${V3_Spacing[\"spacing-24\"]} 0;\n`;\n\nexport const FilterClearButton = styled(Button.Small)`\n    background-color: transparent;\n    height: 100%;\n    padding: ${V3_Spacing[\"spacing-24\"]} ${V3_Spacing[\"spacing-20\"]};\n`;\n\n// =============================================================================\n// COMPONENT STYLES\n// =============================================================================\n\nexport const FilterButton = styled(Button)`\n    width: 100%;\n`;\n"],"names":["MobileContainer","styled","div","V3_Colour","MobileOverlayContainer","FloatingWrapper","FilterHeader","props","$insetTop","FilterTitle","h2","V3_Font","V3_Spacing","FilterClearButton","Button","Small","FilterButton"],"mappings":"4JAgBO,MAAMA,EAAkBC,EAAOC,GAAG;wBACjBC,EAAU;;;;;EAOrBC,EAAyBH,EAAOC,GAAG;wBACxBC,EAAc;;;EAKzBE,EAAkBJ,EAAOC,GAAG;;EAQ5BI,EAAeL,EAAOC,GAAsB;;;wBAGjCC,EAAc;MAC/BI,GAAUA,EAAMC,WAAa,gBAAgBD,EAAMC;EAG7CC,EAAcR,EAAOS,EAAE;MAC9BC,EAAQ;;;cAGAC,EAAW;EAGZC,EAAoBZ,EAAOa,EAAOC,MAAM;;;eAGtCH,EAAW,iBAAiBA,EAAW;EAOzCI,EAAef,EAAOa,EAAO;;"}

package/filter/filter-sidebar.styles.d.ts

@@ -1,4 +1,4 @@
-export declare const DesktopContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const FilterHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const FilterTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>> & string;
-export declare const FilterClearButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<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 DesktopContainer: 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 FilterHeader: 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 FilterTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>>> & string;
+export declare const FilterClearButton: 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>>;

package/filter/filter.styles.d.ts

@@ -1,8 +1,8 @@
 type FilterFooterProps = {
     $insetBottom?: number | undefined;
 };
-export declare const FilterBody: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const FilterHeaderButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>> & string & Omit<(props: import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
-export declare const FilterFooter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, FilterFooterProps>> & string;
-export declare const FilterDoneButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<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 FilterBody: 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 FilterHeaderButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never> & Partial<Pick<import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>, never>>> & string & Omit<(props: import("../shared/clickable-icon").ClickableIconProps & import("react").RefAttributes<HTMLButtonElement>) => React.ReactElement | null, keyof import("react").Component<any, {}, any>>;
+export declare const FilterFooter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$insetBottom"> & FilterFooterProps, never> & Partial<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$insetBottom"> & FilterFooterProps, never>>> & string;
+export declare const FilterDoneButton: 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 {};

package/footer/footer-disclaimer-links-data.d.ts

@@ -1,3 +1,3 @@
-import type { V3_ResourceScheme } from "../v3_theme/types";
+import type { ThemeType } from "../theme/types";
 import type { InternalDisclaimerLinks } from "./footer-helper";
-export declare const getDefaultDisclaimerLinks: (resourceScheme?: V3_ResourceScheme) => InternalDisclaimerLinks;
+export declare const getDefaultDisclaimerLinks: (resourceScheme?: ThemeType) => InternalDisclaimerLinks;