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

package/cjs/e-signature/e-signature-canvas.js.map

@@ -1 +1 @@
-{"version":3,"file":"e-signature-canvas.js","sources":["../../../src/e-signature/e-signature-canvas.tsx"],"sourcesContent":["import { Canvas as FabricCanvas, FabricImage, PencilBrush } from \"fabric\";\nimport type { Ref } from \"react\";\nimport {\n    forwardRef,\n    useCallback,\n    useContext,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n} from \"react\";\nimport { ThemeContext } from \"styled-components\";\n\nimport { V3_Colour } from \"../v3_theme\";\nimport {\n    SignatureCanvas,\n    SignatureCanvasContainer,\n} from \"./e-signature.styles\";\n\ninterface ESignatureCanvasProps {\n    baseImageDataURL?: string | null | undefined;\n    forwardedRef?: Ref<ESignatureCanvasRef> | undefined;\n}\n\nexport interface ESignatureCanvasRef {\n    clear: VoidFunction;\n    export: () => string | null;\n}\n\nconst Component = (\n    props: ESignatureCanvasProps,\n    ref: Ref<ESignatureCanvasRef>\n) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const { baseImageDataURL } = props;\n    const containerRef = useRef<HTMLDivElement>(null);\n    const canvasRef = useRef<HTMLCanvasElement>(null);\n    const fabricCanvas = useRef<FabricCanvas>();\n    const pencilBrush = useRef<PencilBrush>();\n    const theme = useContext(ThemeContext);\n\n    // =============================================================================\n    // HOOKS\n    // =============================================================================\n    useImperativeHandle(ref, () => ({\n        clear: () => fabricCanvas.current?.clear(),\n        export: () => exportAsImage(),\n    }));\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const exportAsImage = () => {\n        if (!fabricCanvas.current) return null;\n        if (!fabricCanvas.current.getObjects().length) return null;\n        const dataURL = fabricCanvas.current.toDataURL({\n            multiplier: 1,\n            format: \"png\",\n            quality: 1,\n            enableRetinaScaling: true,\n        });\n        return dataURL;\n    };\n\n    const handleResize = useCallback(async () => {\n        // slight delay for fabricjs to update on orientation change\n        await new Promise((resolve) => setTimeout(resolve));\n        if (containerRef.current && canvasRef.current && fabricCanvas.current) {\n            const canvasWidth = containerRef.current.clientWidth;\n            const canvasHeight = containerRef.current.clientHeight;\n            canvasRef.current.width = canvasWidth;\n            canvasRef.current.height = canvasHeight;\n            fabricCanvas.current.setDimensions({\n                width: canvasWidth,\n                height: canvasHeight,\n            });\n\n            fabricCanvas.current.forEachObject((obj) => {\n                if (fabricCanvas.current) {\n                    fabricCanvas.current.centerObject(obj);\n                }\n            });\n        }\n    }, []);\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    // initialise fabric and brushes\n    useEffect(() => {\n        if (containerRef.current && canvasRef.current) {\n            fabricCanvas.current = new FabricCanvas(\"eSignatureCanvas\");\n            fabricCanvas.current.selection = false;\n            fabricCanvas.current.isDrawingMode = true;\n\n            pencilBrush.current = new PencilBrush(fabricCanvas.current);\n            pencilBrush.current.color = V3_Colour[\"text\"]({ theme });\n            pencilBrush.current.width = 3;\n\n            fabricCanvas.current.freeDrawingBrush = pencilBrush.current;\n\n            return () => {\n                fabricCanvas.current?.dispose();\n            };\n        }\n    }, []);\n\n    // resize\n    useEffect(() => {\n        if (window) {\n            window.addEventListener(\"resize\", handleResize);\n            screen.orientation?.addEventListener(\"change\", handleResize);\n            handleResize();\n            return () => {\n                window.removeEventListener(\"resize\", handleResize);\n                screen.orientation?.removeEventListener(\"change\", handleResize);\n            };\n        }\n    }, [handleResize]);\n\n    // update base image\n    useEffect(() => {\n        const updateImage = async () => {\n            if (baseImageDataURL) {\n                const img = await FabricImage.fromURL(baseImageDataURL);\n                if (fabricCanvas.current) {\n                    fabricCanvas.current.clear();\n                    img.selectable = false;\n                    img.hoverCursor = \"default\";\n\n                    if (fabricCanvas.current.width && img.width) {\n                        img.scale(fabricCanvas.current.width / img.width);\n                    }\n                    fabricCanvas.current.add(img);\n                    fabricCanvas.current.centerObject(img);\n                }\n            }\n        };\n\n        updateImage();\n    }, [baseImageDataURL]);\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    return (\n        <SignatureCanvasContainer ref={containerRef}>\n            <SignatureCanvas id=\"eSignatureCanvas\" ref={canvasRef} />\n        </SignatureCanvasContainer>\n    );\n};\n\nexport const ESignatureCanvas = forwardRef<\n    ESignatureCanvasRef,\n    ESignatureCanvasProps\n>(Component);\n"],"names":["ESignatureCanvas","forwardRef","props","ref","baseImageDataURL","containerRef","useRef","canvasRef","fabricCanvas","pencilBrush","theme","useContext","ThemeContext","useImperativeHandle","clear","_a","current","export","exportAsImage","getObjects","length","toDataURL","multiplier","format","quality","enableRetinaScaling","handleResize","useCallback","__awaiter","Promise","resolve","setTimeout","canvasWidth","clientWidth","canvasHeight","clientHeight","width","height","setDimensions","forEachObject","obj","centerObject","useEffect","FabricCanvas","selection","isDrawingMode","PencilBrush","color","V3_Colour","freeDrawingBrush","dispose","window","addEventListener","screen","orientation","removeEventListener","img","FabricImage","fromURL","selectable","hoverCursor","scale","add","_jsx","SignatureCanvasContainer","SignatureCanvas","id"],"mappings":"gOA4BA,MA6HaA,EAAmBC,EAAAA,YA7Hd,CACdC,EACAC,KAKA,MAAMC,iBAAEA,GAAqBF,EACvBG,EAAeC,EAAAA,OAAuB,MACtCC,EAAYD,EAAAA,OAA0B,MACtCE,EAAeF,EAAAA,SACfG,EAAcH,EAAAA,SACdI,EAAQC,EAAAA,WAAWC,gBAKzBC,EAAAA,oBAAoBV,GAAK,KAAA,CACrBW,MAAO,KAAK,IAAAC,EAAC,OAAoB,QAApBA,EAAAP,EAAaQ,eAAO,IAAAD,OAAA,EAAAA,EAAED,OAAO,EAC1CG,OAAQ,IAAMC,QAMlB,MAAMA,EAAgB,KAClB,IAAKV,EAAaQ,QAAS,OAAO,KAClC,IAAKR,EAAaQ,QAAQG,aAAaC,OAAQ,OAAO,KAOtD,OANgBZ,EAAaQ,QAAQK,UAAU,CAC3CC,WAAY,EACZC,OAAQ,MACRC,QAAS,EACTC,qBAAqB,GAEX,EAGZC,EAAeC,EAAAA,aAAY,IAAWC,EAAAA,eAAA,OAAA,OAAA,GAAA,YAGxC,SADM,IAAIC,SAASC,GAAYC,WAAWD,KACtCzB,EAAaW,SAAWT,EAAUS,SAAWR,EAAaQ,QAAS,CACnE,MAAMgB,EAAc3B,EAAaW,QAAQiB,YACnCC,EAAe7B,EAAaW,QAAQmB,aAC1C5B,EAAUS,QAAQoB,MAAQJ,EAC1BzB,EAAUS,QAAQqB,OAASH,EAC3B1B,EAAaQ,QAAQsB,cAAc,CAC/BF,MAAOJ,EACPK,OAAQH,IAGZ1B,EAAaQ,QAAQuB,eAAeC,IAC5BhC,EAAaQ,SACbR,EAAaQ,QAAQyB,aAAaD,EACtC,GAER,CACJ,KAAG,IA8DH,OAxDAE,EAAAA,WAAU,KACN,GAAIrC,EAAaW,SAAWT,EAAUS,QAWlC,OAVAR,EAAaQ,QAAU,IAAI2B,EAAAA,OAAa,oBACxCnC,EAAaQ,QAAQ4B,WAAY,EACjCpC,EAAaQ,QAAQ6B,eAAgB,EAErCpC,EAAYO,QAAU,IAAI8B,cAAYtC,EAAaQ,SACnDP,EAAYO,QAAQ+B,MAAQC,EAAAA,UAAgB,KAAE,CAAEtC,UAChDD,EAAYO,QAAQoB,MAAQ,EAE5B5B,EAAaQ,QAAQiC,iBAAmBxC,EAAYO,QAE7C,WACiB,QAApBD,EAAAP,EAAaQ,eAAO,IAAAD,GAAAA,EAAEmC,SAAS,CAEvC,GACD,IAGHR,EAAAA,WAAU,WACN,GAAIS,OAIA,OAHAA,OAAOC,iBAAiB,SAAU1B,GAChB,QAAlBX,EAAAsC,OAAOC,mBAAW,IAAAvC,GAAAA,EAAEqC,iBAAiB,SAAU1B,GAC/CA,IACO,WACHyB,OAAOI,oBAAoB,SAAU7B,GACnB,QAAlBX,EAAAsC,OAAOC,mBAAW,IAAAvC,GAAAA,EAAEwC,oBAAoB,SAAU7B,EAAa,CAEvE,GACD,CAACA,IAGJgB,EAAAA,WAAU,KACyBd,EAAAA,eAAA,OAAA,OAAA,GAAA,YAC3B,GAAIxB,EAAkB,CAClB,MAAMoD,QAAYC,cAAYC,QAAQtD,GAClCI,EAAaQ,UACbR,EAAaQ,QAAQF,QACrB0C,EAAIG,YAAa,EACjBH,EAAII,YAAc,UAEdpD,EAAaQ,QAAQoB,OAASoB,EAAIpB,OAClCoB,EAAIK,MAAMrD,EAAaQ,QAAQoB,MAAQoB,EAAIpB,OAE/C5B,EAAaQ,QAAQ8C,IAAIN,GACzBhD,EAAaQ,QAAQyB,aAAae,GAE1C,CACJ,GAEa,GACd,CAACpD,IAMA2D,EAAAA,IAACC,EAAAA,yBAAwB,CAAC7D,IAAKE,WAC3B0D,EAAAA,IAACE,EAAAA,iBAAgBC,GAAG,mBAAmB/D,IAAKI,KACrB"}
+{"version":3,"file":"e-signature-canvas.js","sources":["../../../src/e-signature/e-signature-canvas.tsx"],"sourcesContent":["import { Canvas as FabricCanvas, FabricImage, PencilBrush } from \"fabric\";\nimport type { Ref } from \"react\";\nimport {\n    forwardRef,\n    useCallback,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n} from \"react\";\n\nimport { Colour } from \"../theme\";\nimport { useDesignTokenOverride } from \"../theme/utils\";\nimport * as styles from \"./e-signature.styles\";\n\ninterface ESignatureCanvasProps {\n    baseImageDataURL?: string | null | undefined;\n    forwardedRef?: Ref<ESignatureCanvasRef> | undefined;\n}\n\nexport interface ESignatureCanvasRef {\n    clear: VoidFunction;\n    export: () => string | null;\n}\n\nconst Component = (\n    props: ESignatureCanvasProps,\n    ref: Ref<ESignatureCanvasRef>\n) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const { baseImageDataURL } = props;\n    const containerRef = useRef<HTMLDivElement>(null);\n    const canvasRef = useRef<HTMLCanvasElement>(null);\n    const fabricCanvas = useRef<FabricCanvas>();\n    const pencilBrush = useRef<PencilBrush>();\n    const resolvedColor = useDesignTokenOverride({ token: Colour[\"text\"] });\n\n    // =============================================================================\n    // HOOKS\n    // =============================================================================\n    useImperativeHandle(ref, () => ({\n        clear: () => fabricCanvas.current?.clear(),\n        export: () => exportAsImage(),\n    }));\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const exportAsImage = () => {\n        if (!fabricCanvas.current) return null;\n        if (!fabricCanvas.current.getObjects().length) return null;\n        const dataURL = fabricCanvas.current.toDataURL({\n            multiplier: 1,\n            format: \"png\",\n            quality: 1,\n            enableRetinaScaling: true,\n        });\n        return dataURL;\n    };\n\n    const handleResize = useCallback(async () => {\n        // slight delay for fabricjs to update on orientation change\n        await new Promise((resolve) => setTimeout(resolve));\n        if (containerRef.current && canvasRef.current && fabricCanvas.current) {\n            const canvasWidth = containerRef.current.clientWidth;\n            const canvasHeight = containerRef.current.clientHeight;\n            canvasRef.current.width = canvasWidth;\n            canvasRef.current.height = canvasHeight;\n            fabricCanvas.current.setDimensions({\n                width: canvasWidth,\n                height: canvasHeight,\n            });\n\n            fabricCanvas.current.forEachObject((obj) => {\n                if (fabricCanvas.current) {\n                    fabricCanvas.current.centerObject(obj);\n                }\n            });\n        }\n    }, []);\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    // initialise fabric and brushes\n    useEffect(() => {\n        if (containerRef.current && canvasRef.current) {\n            fabricCanvas.current = new FabricCanvas(\"eSignatureCanvas\");\n            fabricCanvas.current.selection = false;\n            fabricCanvas.current.isDrawingMode = true;\n\n            pencilBrush.current = new PencilBrush(fabricCanvas.current);\n            pencilBrush.current.color = resolvedColor || \"#000000\";\n            pencilBrush.current.width = 3;\n\n            fabricCanvas.current.freeDrawingBrush = pencilBrush.current;\n\n            return () => {\n                fabricCanvas.current?.dispose();\n            };\n        }\n        // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, []);\n\n    useEffect(() => {\n        if (pencilBrush.current && resolvedColor) {\n            pencilBrush.current.color = resolvedColor;\n        }\n    }, [resolvedColor]);\n\n    // resize\n    useEffect(() => {\n        if (window) {\n            window.addEventListener(\"resize\", handleResize);\n            screen.orientation?.addEventListener(\"change\", handleResize);\n            handleResize();\n            return () => {\n                window.removeEventListener(\"resize\", handleResize);\n                screen.orientation?.removeEventListener(\"change\", handleResize);\n            };\n        }\n    }, [handleResize]);\n\n    // update base image\n    useEffect(() => {\n        const updateImage = async () => {\n            if (baseImageDataURL) {\n                const img = await FabricImage.fromURL(baseImageDataURL);\n                if (fabricCanvas.current) {\n                    fabricCanvas.current.clear();\n                    img.selectable = false;\n                    img.hoverCursor = \"default\";\n\n                    if (fabricCanvas.current.width && img.width) {\n                        img.scale(fabricCanvas.current.width / img.width);\n                    }\n                    fabricCanvas.current.add(img);\n                    fabricCanvas.current.centerObject(img);\n                }\n            }\n        };\n\n        updateImage();\n    }, [baseImageDataURL]);\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    return (\n        <div className={styles.signatureCanvasContainer} ref={containerRef}>\n            <canvas\n                className={styles.signatureCanvas}\n                id=\"eSignatureCanvas\"\n                ref={canvasRef}\n            />\n        </div>\n    );\n};\n\nexport const ESignatureCanvas = forwardRef<\n    ESignatureCanvasRef,\n    ESignatureCanvasProps\n>(Component);\n"],"names":["ESignatureCanvas","forwardRef","props","ref","baseImageDataURL","containerRef","useRef","canvasRef","fabricCanvas","pencilBrush","resolvedColor","useDesignTokenOverride","token","Colour","useImperativeHandle","clear","_a","current","export","exportAsImage","getObjects","length","toDataURL","multiplier","format","quality","enableRetinaScaling","handleResize","useCallback","__awaiter","Promise","resolve","setTimeout","canvasWidth","clientWidth","canvasHeight","clientHeight","width","height","setDimensions","forEachObject","obj","centerObject","useEffect","FabricCanvas","selection","isDrawingMode","PencilBrush","color","freeDrawingBrush","dispose","window","addEventListener","screen","orientation","removeEventListener","img","FabricImage","fromURL","selectable","hoverCursor","scale","add","_jsx","className","styles.signatureCanvasContainer","children","styles.signatureCanvas","id"],"mappings":"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"}

package/cjs/e-signature/e-signature.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),t=require("@lifesg/react-icons"),n=require("react"),i=require("../external/react-responsive/dist/react-responsive.js"),s=require("styled-components"),a=require("../button/button.js"),o=require("../button-with-icon/button-with-icon.js"),l=require("../shared/progress-bar/progress-bar.js"),u=require("../typography/index.js"),d=require("../v3_theme/index.js"),c=require("./e-signature.styles.js");const g=n.lazy((()=>e.__awaiter(void 0,void 0,void 0,(function*(){return{default:(yield Promise.resolve().then((function(){return require("./e-signature-canvas.js")}))).ESignatureCanvas}}))));exports.ESignature=x=>{const{description:h,id:j,loadingProgress:p,loadingLabel:b="Uploading...",onChange:y,value:v,disabled:S}=x,m=e.__rest(x,["description","id","loadingProgress","loadingLabel","onChange","value","disabled"]),[B,f]=n.useState(!1),q=n.useRef(null),[C,E]=n.useState(v),M=n.useContext(s.ThemeContext),w=d.V3_Breakpoint["sm-max"]({theme:M}),_=i.reactResponsiveExports.useMediaQuery({maxWidth:w}),k=i.reactResponsiveExports.useMediaQuery({maxHeight:w,orientation:"landscape"}),I=()=>{var e;null===(e=q.current)||void 0===e||e.clear()},P=()=>{if(q.current){const e=q.current.export();E(e),f(!1),null==y||y(e)}};n.useEffect((()=>{E(v)}),[v]);return r.jsxs("div",Object.assign({},m,{children:[r.jsx(c.SignatureArea,{$disabled:S,children:"number"==typeof p?r.jsxs(c.ProgressBox,{children:[b&&r.jsx(u.Typography.BodyMD,{children:b}),r.jsx(l.ProgressBar,{progress:null!=p?p:0,"data-testid":`${j||"e-signature"}-progress-bar`})]}):C?r.jsxs(r.Fragment,{children:[r.jsx(c.SignaturePreviewImage,{src:C,alt:"Signature preview"}),r.jsx(c.EditSignatureButton,{styleType:"light",onClick:()=>f(!0),id:j,"aria-label":"Edit signature",disabled:S,children:r.jsx(t.PencilIcon,{})})]}):r.jsx(c.AddSignatureButton,{type:"button",styleType:"secondary","aria-label":"Add signature",id:j,onClick:()=>f(!0),disabled:S,children:"Add signature"})}),r.jsx(c.ScrollableModal,{"data-testid":"signature-modal",show:B,children:r.jsx(c.GrowContainer,{children:r.jsxs(c.ModalBox,{onClose:()=>f(!1),children:[r.jsx(c.ModalTitle,{children:"Signature"}),r.jsx(c.ESignatureContainer,{children:r.jsxs(c.ESignatureDrawable,{children:[r.jsx(c.SignatureLine,{}),r.jsx(n.Suspense,{fallback:null,children:B&&r.jsx(g,{ref:q,baseImageDataURL:C})})]})}),r.jsxs(c.ModalButtons,{children:[r.jsx(c.ModalActionButton,{as:k?o.ButtonWithIcon.Small:o.ButtonWithIcon.Default,type:"button",styleType:_&&!k?"light":"link",icon:r.jsx(t.EraserIcon,{}),onClick:I,children:"Clear"}),r.jsx(c.ModalActionButton,{as:k?a.Button.Small:a.Button.Default,type:"button",onClick:P,children:"Save"})]})]})})}),h?r.jsx(c.Instructions,{children:h}):null]}))};
+"use strict";var e=require("../_virtual/_tslib.js"),a=require("react/jsx-runtime"),r=require("@lifesg/react-icons"),s=require("react"),i=require("../button/button.js"),t=require("../dashed-border/dashed-border.js"),l=require("../modal/index.js"),n=require("../shared/progress-bar/progress-bar.js");require("../theme/theme-provider/index.js"),require("../theme/theme-provider/context.js");var o=require("../theme/tokens/border.js"),d=require("../theme/tokens/breakpoint.js"),u=require("../theme/tokens/colour.js");require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var c=require("../theme/tokens/radius.js");require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var m=require("../theme/utils/use-media-query.js"),g=require("../typography/index.js"),h=require("./e-signature.styles.js");const j=s.lazy((()=>e.__awaiter(void 0,void 0,void 0,(function*(){return{default:(yield Promise.resolve().then((function(){return require("./e-signature-canvas.js")}))).ESignatureCanvas}}))));exports.ESignature=p=>{const{description:b,id:x,loadingProgress:v,loadingLabel:y="Uploading...",onChange:q,value:B,disabled:k}=p,f=e.__rest(p,["description","id","loadingProgress","loadingLabel","onChange","value","disabled"]),[C,N]=s.useState(!1),S=s.useRef(null),[T,M]=s.useState(B),w=m.useMaxWidthMediaQuery("sm"),P=m.useResolvedBreakpointToken(d.Breakpoint["sm-max"]),_=m.useMediaQuery({clauses:[{feature:"orientation",value:"landscape"},{feature:"max-height",value:P}]}),A=()=>{var e;null===(e=S.current)||void 0===e||e.clear()},E=()=>{if(S.current){const e=S.current.export();M(e),N(!1),null==q||q(e)}};s.useEffect((()=>{M(B)}),[B]);return a.jsxs("div",Object.assign({},f,{children:[a.jsx(t.DashedBorder,{className:h.signatureArea,thickness:o.Border["width-040"],radius:c.Radius.sm,colour:k?u.Colour["border-disabled"]:u.Colour.border,backgroundColor:k?u.Colour["bg-disabled"]:u.Colour.bg,children:"number"==typeof v?a.jsxs("div",{className:h.progressBox,children:[y&&a.jsx(g.Typography.BodyMD,{children:y}),a.jsx(n.ProgressBar,{progress:null!=v?v:0,"data-testid":`${x||"e-signature"}-progress-bar`})]}):T?a.jsxs(a.Fragment,{children:[a.jsx("img",{className:h.signaturePreviewImage,src:T,alt:"Signature preview"}),a.jsx(i.Button,{className:h.editSignatureButton,styleType:"light",onClick:()=>N(!0),id:x,icon:a.jsx(r.PencilIcon,{}),"aria-label":"Edit signature",disabled:k})]}):a.jsx(i.Button,{className:h.addSignatureButton,type:"button",styleType:"secondary","aria-label":"Add signature",id:x,onClick:()=>N(!0),disabled:k,children:"Add signature"})}),a.jsx(l.Modal,{className:h.scrollableModal,"data-testid":"signature-modal",show:C,children:a.jsx("div",{className:h.growContainer,"data-mobile-landscape":_,children:a.jsxs(l.Modal.Box,{className:h.modalBox,"data-mobile-landscape":_,onClose:()=>N(!1),children:[a.jsx("h2",{className:h.modalTitle,"data-mobile-landscape":_,children:"Signature"}),a.jsx("div",{className:h.eSignatureContainer,"data-mobile-landscape":_,children:a.jsxs("div",{className:h.eSignatureDrawable,"data-mobile-landscape":_,children:[a.jsx("div",{className:h.signatureLine,"data-mobile-landscape":_}),a.jsx(s.Suspense,{fallback:null,children:C&&a.jsx(j,{ref:S,baseImageDataURL:T})})]})}),a.jsxs("div",{className:h.modalButtons,"data-mobile-landscape":_,children:[a.jsx(i.Button,{className:h.modalActionButton,"data-mobile-landscape":_,sizeType:_?"small":"default",type:"button",styleType:w&&!_?"light":"link",icon:a.jsx(r.EraserIcon,{}),onClick:A,children:"Clear"}),a.jsx(i.Button,{className:h.modalActionButton,"data-mobile-landscape":_,sizeType:_?"small":"default",type:"button",onClick:E,children:"Save"})]})]})})}),b?a.jsx(g.Typography.BodySM,{className:h.instructions,children:b}):null]}))};
 //# sourceMappingURL=e-signature.js.map

package/cjs/e-signature/e-signature.js.map

@@ -1 +1 @@
-{"version":3,"file":"e-signature.js","sources":["../../../src/e-signature/e-signature.tsx"],"sourcesContent":["import { EraserIcon, PencilIcon } from \"@lifesg/react-icons\";\nimport { lazy, Suspense, useContext, useEffect, useRef, useState } from \"react\";\nimport { useMediaQuery } from \"react-responsive\";\nimport { ThemeContext } from \"styled-components\";\n\nimport { Button } from \"../button\";\nimport { ButtonWithIcon } from \"../button-with-icon\";\nimport { ProgressBar } from \"../shared/progress-bar\";\nimport { Typography } from \"../typography\";\nimport { V3_Breakpoint } from \"../v3_theme\";\nimport {\n    AddSignatureButton,\n    EditSignatureButton,\n    ESignatureContainer,\n    ESignatureDrawable,\n    GrowContainer,\n    Instructions,\n    ModalActionButton,\n    ModalBox,\n    ModalButtons,\n    ModalTitle,\n    ProgressBox,\n    ScrollableModal,\n    SignatureArea,\n    SignatureLine,\n    SignaturePreviewImage,\n} from \"./e-signature.styles\";\nimport type { ESignatureCanvasRef } from \"./e-signature-canvas\";\nimport type { EsignatureProps } from \"./types\";\n\n// lazy load to fix next.js SSR errors\nconst ESignatureCanvas = lazy(async () => ({\n    default: (await import(\"./e-signature-canvas\")).ESignatureCanvas,\n}));\n\nexport const ESignature = (props: EsignatureProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const {\n        description,\n        id,\n        loadingProgress,\n        loadingLabel = \"Uploading...\",\n        onChange,\n        value,\n        disabled,\n        ...otherProps\n    } = props;\n    const [showModal, setShowModal] = useState(false);\n    const eSignatureCanvasRef = useRef<ESignatureCanvasRef>(null);\n    const [dataURL, setDataURL] = useState<string | null | undefined>(value);\n    const theme = useContext(ThemeContext);\n    const mobileBreakpoint = V3_Breakpoint[\"sm-max\"]({ theme });\n    const isMobile = useMediaQuery({ maxWidth: mobileBreakpoint });\n    const isMobileLandscape = useMediaQuery({\n        maxHeight: mobileBreakpoint,\n        orientation: \"landscape\",\n    });\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleClearDrawing = () => {\n        eSignatureCanvasRef.current?.clear();\n    };\n\n    const handleClickSave = () => {\n        if (eSignatureCanvasRef.current) {\n            const dataURL = eSignatureCanvasRef.current.export();\n            setDataURL(dataURL);\n            setShowModal(false);\n            onChange?.(dataURL);\n        }\n    };\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        setDataURL(value);\n    }, [value]);\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderSignatureArea = () => {\n        if (!dataURL) {\n            return (\n                <AddSignatureButton\n                    type=\"button\"\n                    styleType=\"secondary\"\n                    aria-label=\"Add signature\"\n                    id={id}\n                    onClick={() => setShowModal(true)}\n                    disabled={disabled}\n                >\n                    Add signature\n                </AddSignatureButton>\n            );\n        }\n\n        return (\n            <>\n                <SignaturePreviewImage src={dataURL} alt=\"Signature preview\" />\n                <EditSignatureButton\n                    styleType=\"light\"\n                    onClick={() => setShowModal(true)}\n                    id={id}\n                    aria-label=\"Edit signature\"\n                    disabled={disabled}\n                >\n                    <PencilIcon />\n                </EditSignatureButton>\n            </>\n        );\n    };\n\n    const renderLoadingIndicator = () => {\n        return (\n            <ProgressBox>\n                {loadingLabel && (\n                    <Typography.BodyMD>{loadingLabel}</Typography.BodyMD>\n                )}\n                <ProgressBar\n                    progress={loadingProgress ?? 0}\n                    data-testid={`${id || \"e-signature\"}-progress-bar`}\n                />\n            </ProgressBox>\n        );\n    };\n\n    const renderModal = () => {\n        return (\n            <ScrollableModal data-testid=\"signature-modal\" show={showModal}>\n                <GrowContainer>\n                    <ModalBox onClose={() => setShowModal(false)}>\n                        <ModalTitle>Signature</ModalTitle>\n                        <ESignatureContainer>\n                            <ESignatureDrawable>\n                                <SignatureLine />\n                                <Suspense fallback={null}>\n                                    {showModal && (\n                                        <ESignatureCanvas\n                                            ref={eSignatureCanvasRef}\n                                            baseImageDataURL={dataURL}\n                                        />\n                                    )}\n                                </Suspense>\n                            </ESignatureDrawable>\n                        </ESignatureContainer>\n                        <ModalButtons>\n                            <ModalActionButton\n                                as={\n                                    isMobileLandscape\n                                        ? ButtonWithIcon.Small\n                                        : ButtonWithIcon.Default\n                                }\n                                type=\"button\"\n                                styleType={\n                                    isMobile && !isMobileLandscape\n                                        ? \"light\"\n                                        : \"link\"\n                                }\n                                icon={<EraserIcon />}\n                                onClick={handleClearDrawing}\n                            >\n                                Clear\n                            </ModalActionButton>\n                            <ModalActionButton\n                                as={\n                                    isMobileLandscape\n                                        ? Button.Small\n                                        : Button.Default\n                                }\n                                type=\"button\"\n                                onClick={handleClickSave}\n                            >\n                                Save\n                            </ModalActionButton>\n                        </ModalButtons>\n                    </ModalBox>\n                </GrowContainer>\n            </ScrollableModal>\n        );\n    };\n\n    const renderDescription = () => {\n        if (!description) return null;\n        return <Instructions>{description}</Instructions>;\n    };\n\n    return (\n        <div {...otherProps}>\n            <SignatureArea $disabled={disabled}>\n                {typeof loadingProgress === \"number\"\n                    ? renderLoadingIndicator()\n                    : renderSignatureArea()}\n            </SignatureArea>\n            {renderModal()}\n            {renderDescription()}\n        </div>\n    );\n};\n"],"names":["ESignatureCanvas","lazy","__awaiter","default","Promise","props","description","id","loadingProgress","loadingLabel","onChange","value","disabled","otherProps","__rest","showModal","setShowModal","useState","eSignatureCanvasRef","useRef","dataURL","setDataURL","theme","useContext","ThemeContext","mobileBreakpoint","V3_Breakpoint","isMobile","useMediaQuery","maxWidth","isMobileLandscape","maxHeight","orientation","handleClearDrawing","_a","current","clear","handleClickSave","export","useEffect","_jsxs","Object","assign","children","_jsx","SignatureArea","$disabled","ProgressBox","Typography","BodyMD","ProgressBar","progress","SignaturePreviewImage","src","alt","EditSignatureButton","styleType","onClick","PencilIcon","AddSignatureButton","type","ScrollableModal","show","GrowContainer","ModalBox","onClose","ModalTitle","ESignatureContainer","ESignatureDrawable","SignatureLine","Suspense","fallback","ref","baseImageDataURL","ModalButtons","ModalActionButton","as","ButtonWithIcon","Small","Default","icon","EraserIcon","Button","Instructions"],"mappings":"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"}
+{"version":3,"file":"e-signature.js","sources":["../../../src/e-signature/e-signature.tsx"],"sourcesContent":["import { EraserIcon, PencilIcon } from \"@lifesg/react-icons\";\nimport { lazy, Suspense, useEffect, useRef, useState } from \"react\";\n\nimport { Button } from \"../button\";\nimport { DashedBorder } from \"../dashed-border\";\nimport { Modal } from \"../modal\";\nimport { ProgressBar } from \"../shared/progress-bar\";\nimport {\n    Border,\n    Breakpoint,\n    Colour,\n    Radius,\n    useMaxWidthMediaQuery,\n    useMediaQuery,\n    useResolvedBreakpointToken,\n} from \"../theme\";\nimport { Typography } from \"../typography\";\nimport * as styles from \"./e-signature.styles\";\nimport type { ESignatureCanvasRef } from \"./e-signature-canvas\";\nimport type { EsignatureProps } from \"./types\";\n\n// lazy load to fix next.js SSR errors\nconst ESignatureCanvas = lazy(async () => ({\n    default: (await import(\"./e-signature-canvas\")).ESignatureCanvas,\n}));\n\n// @catalog\n/**\n * A field that lets users draw and save a signature.\n *\n * Use in forms that require a handwritten signature.\n * @keywords field, form, input, sign, signature\n */\nexport const ESignature = (props: EsignatureProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const {\n        description,\n        id,\n        loadingProgress,\n        loadingLabel = \"Uploading...\",\n        onChange,\n        value,\n        disabled,\n        ...otherProps\n    } = props;\n    const [showModal, setShowModal] = useState(false);\n    const eSignatureCanvasRef = useRef<ESignatureCanvasRef>(null);\n    const [dataURL, setDataURL] = useState<string | null | undefined>(value);\n    const isMobile = useMaxWidthMediaQuery(\"sm\");\n    const mobileBreakpoint = useResolvedBreakpointToken(Breakpoint[\"sm-max\"]);\n    const isMobileLandscape = useMediaQuery({\n        clauses: [\n            {\n                feature: \"orientation\",\n                value: \"landscape\",\n            },\n            {\n                feature: \"max-height\",\n                value: mobileBreakpoint,\n            },\n        ],\n    });\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleClearDrawing = () => {\n        eSignatureCanvasRef.current?.clear();\n    };\n\n    const handleClickSave = () => {\n        if (eSignatureCanvasRef.current) {\n            const dataURL = eSignatureCanvasRef.current.export();\n            setDataURL(dataURL);\n            setShowModal(false);\n            onChange?.(dataURL);\n        }\n    };\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        setDataURL(value);\n    }, [value]);\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderSignatureArea = () => {\n        if (!dataURL) {\n            return (\n                <Button\n                    className={styles.addSignatureButton}\n                    type=\"button\"\n                    styleType=\"secondary\"\n                    aria-label=\"Add signature\"\n                    id={id}\n                    onClick={() => setShowModal(true)}\n                    disabled={disabled}\n                >\n                    Add signature\n                </Button>\n            );\n        }\n\n        return (\n            <>\n                <img\n                    className={styles.signaturePreviewImage}\n                    src={dataURL}\n                    alt=\"Signature preview\"\n                />\n                <Button\n                    className={styles.editSignatureButton}\n                    styleType=\"light\"\n                    onClick={() => setShowModal(true)}\n                    id={id}\n                    icon={<PencilIcon />}\n                    aria-label=\"Edit signature\"\n                    disabled={disabled}\n                />\n            </>\n        );\n    };\n\n    const renderLoadingIndicator = () => {\n        return (\n            <div className={styles.progressBox}>\n                {loadingLabel && (\n                    <Typography.BodyMD>{loadingLabel}</Typography.BodyMD>\n                )}\n                <ProgressBar\n                    progress={loadingProgress ?? 0}\n                    data-testid={`${id || \"e-signature\"}-progress-bar`}\n                />\n            </div>\n        );\n    };\n\n    const renderModal = () => {\n        return (\n            <Modal\n                className={styles.scrollableModal}\n                data-testid=\"signature-modal\"\n                show={showModal}\n            >\n                <div\n                    className={styles.growContainer}\n                    data-mobile-landscape={isMobileLandscape}\n                >\n                    <Modal.Box\n                        className={styles.modalBox}\n                        data-mobile-landscape={isMobileLandscape}\n                        onClose={() => setShowModal(false)}\n                    >\n                        <h2\n                            className={styles.modalTitle}\n                            data-mobile-landscape={isMobileLandscape}\n                        >\n                            Signature\n                        </h2>\n                        <div\n                            className={styles.eSignatureContainer}\n                            data-mobile-landscape={isMobileLandscape}\n                        >\n                            <div\n                                className={styles.eSignatureDrawable}\n                                data-mobile-landscape={isMobileLandscape}\n                            >\n                                <div\n                                    className={styles.signatureLine}\n                                    data-mobile-landscape={isMobileLandscape}\n                                />\n                                <Suspense fallback={null}>\n                                    {showModal && (\n                                        <ESignatureCanvas\n                                            ref={eSignatureCanvasRef}\n                                            baseImageDataURL={dataURL}\n                                        />\n                                    )}\n                                </Suspense>\n                            </div>\n                        </div>\n                        <div\n                            className={styles.modalButtons}\n                            data-mobile-landscape={isMobileLandscape}\n                        >\n                            <Button\n                                className={styles.modalActionButton}\n                                data-mobile-landscape={isMobileLandscape}\n                                sizeType={\n                                    isMobileLandscape ? \"small\" : \"default\"\n                                }\n                                type=\"button\"\n                                styleType={\n                                    isMobile && !isMobileLandscape\n                                        ? \"light\"\n                                        : \"link\"\n                                }\n                                icon={<EraserIcon />}\n                                onClick={handleClearDrawing}\n                            >\n                                Clear\n                            </Button>\n                            <Button\n                                className={styles.modalActionButton}\n                                data-mobile-landscape={isMobileLandscape}\n                                sizeType={\n                                    isMobileLandscape ? \"small\" : \"default\"\n                                }\n                                type=\"button\"\n                                onClick={handleClickSave}\n                            >\n                                Save\n                            </Button>\n                        </div>\n                    </Modal.Box>\n                </div>\n            </Modal>\n        );\n    };\n\n    const renderDescription = () => {\n        if (!description) return null;\n        return (\n            <Typography.BodySM className={styles.instructions}>\n                {description}\n            </Typography.BodySM>\n        );\n    };\n\n    return (\n        <div {...otherProps}>\n            <DashedBorder\n                className={styles.signatureArea}\n                thickness={Border[\"width-040\"]}\n                radius={Radius[\"sm\"]}\n                colour={disabled ? Colour[\"border-disabled\"] : Colour[\"border\"]}\n                backgroundColor={\n                    disabled ? Colour[\"bg-disabled\"] : Colour[\"bg\"]\n                }\n            >\n                {typeof loadingProgress === \"number\"\n                    ? renderLoadingIndicator()\n                    : renderSignatureArea()}\n            </DashedBorder>\n            {renderModal()}\n            {renderDescription()}\n        </div>\n    );\n};\n"],"names":["ESignatureCanvas","lazy","__awaiter","default","Promise","props","description","id","loadingProgress","loadingLabel","onChange","value","disabled","otherProps","__rest","showModal","setShowModal","useState","eSignatureCanvasRef","useRef","dataURL","setDataURL","isMobile","useMaxWidthMediaQuery","mobileBreakpoint","useResolvedBreakpointToken","Breakpoint","isMobileLandscape","useMediaQuery","clauses","feature","handleClearDrawing","_a","current","clear","handleClickSave","export","useEffect","_jsxs","Object","assign","children","_jsx","DashedBorder","className","styles.signatureArea","thickness","Border","radius","Radius","colour","Colour","backgroundColor","styles.progressBox","Typography","BodyMD","ProgressBar","progress","_Fragment","styles.signaturePreviewImage","src","alt","Button","styles.editSignatureButton","styleType","onClick","icon","PencilIcon","styles.addSignatureButton","type","Modal","styles.scrollableModal","show","styles.growContainer","Box","styles.modalBox","onClose","styles.modalTitle","styles.eSignatureContainer","styles.eSignatureDrawable","styles.signatureLine","Suspense","fallback","ref","baseImageDataURL","styles.modalButtons","styles.modalActionButton","sizeType","EraserIcon","BodySM","styles.instructions"],"mappings":"y7BAsBA,MAAMA,EAAmBC,EAAAA,MAAK,IAAWC,EAAAA,eAAA,OAAA,OAAA,GAAA,YAAC,MAAA,CACtCC,eAAgBC,kDAAO,0BAAsB,KAAGJ,iBAClD,yBASyBK,IAIvB,MAAMC,YACFA,EAAWC,GACXA,EAAEC,gBACFA,EAAeC,aACfA,EAAe,eAAcC,SAC7BA,EAAQC,MACRA,EAAKC,SACLA,GAEAP,EADGQ,EAAUC,SACbT,EATE,CAAA,cAAA,KAAA,kBAAA,eAAA,WAAA,QAAA,cAUCU,EAAWC,GAAgBC,EAAAA,UAAS,GACrCC,EAAsBC,EAAAA,OAA4B,OACjDC,EAASC,GAAcJ,EAAAA,SAAoCN,GAC5DW,EAAWC,EAAAA,sBAAsB,MACjCC,EAAmBC,EAAAA,2BAA2BC,EAAAA,WAAW,WACzDC,EAAoBC,EAAAA,cAAc,CACpCC,QAAS,CACL,CACIC,QAAS,cACTnB,MAAO,aAEX,CACImB,QAAS,aACTnB,MAAOa,MAQbO,EAAqB,WACI,QAA3BC,EAAAd,EAAoBe,eAAO,IAAAD,GAAAA,EAAEE,OAAO,EAGlCC,EAAkB,KACpB,GAAIjB,EAAoBe,QAAS,CAC7B,MAAMb,EAAUF,EAAoBe,QAAQG,SAC5Cf,EAAWD,GACXJ,GAAa,GACbN,SAAAA,EAAWU,EACf,GAMJiB,EAAAA,WAAU,KACNhB,EAAWV,EAAM,GAClB,CAACA,IAoJJ,OACI2B,EAAAA,KAAA,MAAAC,OAAAC,OAAA,GAAS3B,EAAU,CAAA4B,SAAA,CACfC,EAAAA,IAACC,EAAAA,aAAY,CACTC,UAAWC,EAAAA,cACXC,UAAWC,SAAO,aAClBC,OAAQC,EAAAA,OAAW,GACnBC,OAAQtC,EAAWuC,EAAAA,OAAO,mBAAqBA,EAAAA,OAAe,OAC9DC,gBACIxC,EAAWuC,EAAAA,OAAO,eAAiBA,EAAAA,OAAW,GAACV,SAGvB,iBAApBjC,EAnHZ8B,EAAAA,KAAA,MAAA,CAAKM,UAAWS,EAAAA,YAAkBZ,SAAA,CAC7BhC,GACGiC,EAAAA,IAACY,EAAAA,WAAWC,OAAM,CAAAd,SAAEhC,IAExBiC,EAAAA,IAACc,EAAAA,aACGC,SAAUjD,QAAAA,EAAmB,EAAC,cACjB,GAAGD,GAAM,kCA5C7Ba,EAiBDkB,EAAAA,KAAAoB,EAAAA,SAAA,CAAAjB,SAAA,CACIC,MAAA,MAAA,CACIE,UAAWe,EAAAA,sBACXC,IAAKxC,EACLyC,IAAI,sBAERnB,MAACoB,EAAAA,OAAM,CACHlB,UAAWmB,EAAAA,oBACXC,UAAU,QACVC,QAAS,IAAMjD,GAAa,GAC5BT,GAAIA,EACJ2D,KAAMxB,EAAAA,IAACyB,aAAU,CAAA,GAAG,aACT,iBACXvD,SAAUA,OA5Bd8B,EAAAA,IAACoB,SAAM,CACHlB,UAAWwB,EAAAA,mBACXC,KAAK,SACLL,UAAU,YAAW,aACV,gBACXzD,GAAIA,EACJ0D,QAAS,IAAMjD,GAAa,GAC5BJ,SAAUA,EAAQ6B,SAAA,oBA2C1BC,MAAC4B,EAAAA,MAAK,CACF1B,UAAW2B,EAAAA,8BACC,kBACZC,KAAMzD,EAAS0B,SAEfC,EAAAA,IAAA,MAAA,CACIE,UAAW6B,gBAAoB,wBACR9C,WAEvBW,EAAAA,KAACgC,QAAMI,KACH9B,UAAW+B,EAAAA,SAAe,wBACHhD,EACvBiD,QAAS,IAAM5D,GAAa,GAAMyB,SAAA,CAElCC,EAAAA,UACIE,UAAWiC,EAAAA,WAAiB,wBACLlD,EAAiBc,SAAA,cAI5CC,EAAAA,WACIE,UAAWkC,EAAAA,oBAA0B,wBACdnD,EAAiBc,SAExCH,EAAAA,KAAA,MAAA,CACIM,UAAWmC,EAAAA,2CACYpD,EAAiBc,SAAA,CAExCC,EAAAA,IAAA,MAAA,CACIE,UAAWoC,EAAAA,sCACYrD,IAE3Be,EAAAA,IAACuC,EAAAA,SAAQ,CAACC,SAAU,cACfnE,GACG2B,EAAAA,IAAC1C,EAAgB,CACbmF,IAAKjE,EACLkE,iBAAkBhE,WAMtCkB,cACIM,UAAWyC,eAAmB,wBACP1D,EAAiBc,SAAA,CAExCC,EAAAA,IAACoB,EAAAA,OAAM,CACHlB,UAAW0C,oBAAwB,wBACZ3D,EACvB4D,SACI5D,EAAoB,QAAU,UAElC0C,KAAK,SACLL,UACI1C,IAAaK,EACP,QACA,OAEVuC,KAAMxB,EAAAA,IAAC8C,EAAAA,WAAU,CAAA,GACjBvB,QAASlC,EAAkBU,SAAA,UAI/BC,EAAAA,IAACoB,EAAAA,OAAM,CACHlB,UAAW0C,EAAAA,kBAAwB,wBACZ3D,EACvB4D,SACI5D,EAAoB,QAAU,UAElC0C,KAAK,SACLJ,QAAS9B,EAAeM,SAAA,mBAY3CnC,EAEDoC,EAAAA,IAACY,EAAAA,WAAWmC,OAAM,CAAC7C,UAAW8C,eAAmBjD,SAC5CnC,IAHgB,QAyBnB"}

package/cjs/e-signature/e-signature.styles.js

@@ -1,169 +1,2 @@
-"use strict";var e=require("styled-components"),t=require("../button/button.js"),i=require("../dashed-border/dashed-border.js"),r=require("../icon-button/icon-button.js"),a=require("../modal/index.js");require("../theme/theme-provider/index.js"),require("react"),require("../theme/theme-provider/context.js");var o=require("../theme/tokens/border.js"),n=require("../theme/tokens/colour.js");require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var d=require("../theme/tokens/radius.js");require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/string-helper.js");var s=require("../typography/index.js"),u=require("../v3_theme/index.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var g=l(e);const c=e.css`
-    ${e=>`\n        ${u.V3_MediaQuery.MaxWidth.sm(e)},\n        (orientation: landscape) and (max-height: ${u.V3_Breakpoint["sm-max"](e)}px)\n    `}
-`,p=e.css`
-    ${e=>`\n        @media (orientation: landscape) and (max-height: ${u.V3_Breakpoint["sm-max"](e)}px)\n    `}
-`,h=g.default(i.DashedBorder).attrs((e=>({thickness:o.Border["width-040"],radius:d.Radius.sm,colour:e.$disabled?n.Colour["border-disabled"]:n.Colour.border,backgroundColor:e.$disabled?n.Colour["bg-disabled"]:n.Colour.bg})))`
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 14.125rem;
-`,m=g.default(t.Button.Default)`
-    width: fit-content;
-    margin: 0 ${u.V3_Spacing["spacing-20"]};
-
-    &:disabled {
-        border-color: ${u.V3_Colour["border-strong"]};
-    }
-`,x=g.default(r.IconButton)`
-    position: absolute;
-    top: ${u.V3_Spacing["spacing-16"]};
-    right: ${u.V3_Spacing["spacing-16"]};
-
-    &:disabled {
-        border-color: ${u.V3_Colour["border-strong"]};
-    }
-`,$=g.default.img`
-    display: block;
-    object-fit: contain;
-    object-position: center;
-    width: calc(100% - (3rem + ${u.V3_Spacing["spacing-16"]}) * 2);
-    height: 100%;
-`,b=g.default.div`
-    background: ${u.V3_Colour["bg-primary-subtlest"]};
-    border: ${u.V3_Border["width-010"]} ${u.V3_Border.solid}
-        ${u.V3_Colour.border};
-    border-radius: ${u.V3_Radius.sm};
-    margin: 0 ${u.V3_Spacing["spacing-20"]};
-    padding: ${u.V3_Spacing["spacing-16"]};
-    display: flex;
-    gap: ${u.V3_Spacing["spacing-16"]};
-    flex: 1;
-    flex-direction: column;
-    align-items: center;
-`,f=g.default(s.Typography.BodySM)`
-    margin-top: ${u.V3_Spacing["spacing-16"]};
-`,_=g.default(a.Modal)`
-    /* increase specificity as the styles are overwritten */
-    && {
-        height: 100%;
-        overflow-y: auto;
-    }
-`,V=g.default.div`
-    width: 100%;
-    margin: auto;
-    padding: ${u.V3_Spacing["layout-xxl"]} ${u.V3_Spacing["layout-sm"]};
-
-    ${c} {
-        padding: 0;
-        width: 100%;
-        height: 100%;
-    }
-`,S=g.default(a.Modal.Box)`
-    width: 100%;
-    height: 29rem;
-    max-width: 672px;
-    max-height: none;
-    margin: 0 auto;
-    padding: ${u.V3_Spacing["spacing-16"]};
-
-    ${c} {
-        display: flex;
-        flex-direction: column;
-        max-width: none;
-        height: 100%;
-        border-radius: 0;
-        padding: 0;
-
-        --close-button-top-inset: ${u.V3_Spacing["spacing-8"]};
-        --close-button-right-inset: ${u.V3_Spacing["spacing-20"]};
-    }
-`,y=g.default.h2`
-    ${u.V3_Font["body-baseline-semibold"]}
-    color: ${u.V3_Colour.text};
-    margin-bottom: ${u.V3_Spacing["spacing-16"]};
-    text-align: center;
-
-    ${c} {
-        ${u.V3_Font["body-md-semibold"]}
-        margin: ${u.V3_Spacing["spacing-12"]} 0;
-    }
-`,w=g.default.div`
-    width: 100%;
-    height: 20rem;
-    border-radius: ${u.V3_Radius.lg};
-    overflow: hidden;
-
-    ${c} {
-        border-radius: 0;
-        flex: 1;
-    }
-
-    ${p} {
-        background: ${u.V3_Colour["bg-strong"]};
-    }
-`,v=g.default.div`
-    position: relative;
-    width: 100%;
-    height: 100%;
-    background: ${u.V3_Colour["bg-stronger"]};
-    margin: auto;
-
-    ${c} {
-        aspect-ratio: 4/3;
-    }
-    ${u.V3_MediaQuery.MaxWidth.sm} {
-        width: 100%;
-        height: auto;
-    }
-    ${p} {
-        width: auto;
-        height: 100%;
-    }
-`,j=g.default.div`
-    position: absolute;
-    left: 50%;
-    top: calc(75% - 1px);
-    width: 300px;
-    height: 2px;
-    transform: translateX(-50%);
-    background-color: ${u.V3_Colour["border-strong"]};
-    pointer-events: none;
-
-    ${c} {
-        width: calc(100% - ${u.V3_Spacing["spacing-40"]});
-        max-width: 300px;
-        left: 50%;
-    }
-`,q=g.default.div`
-    display: flex;
-    justify-content: space-between;
-    margin-top: ${u.V3_Spacing["spacing-16"]};
-
-    ${u.V3_MediaQuery.MaxWidth.sm} {
-        flex-direction: column-reverse;
-        margin: ${u.V3_Spacing["spacing-16"]} ${u.V3_Spacing["spacing-24"]}
-            ${u.V3_Spacing["spacing-48"]};
-        gap: ${u.V3_Spacing["spacing-16"]};
-    }
-
-    ${p} {
-        flex-direction: row;
-        margin: ${u.V3_Spacing["spacing-16"]} ${u.V3_Spacing["spacing-20"]};
-    }
-`,C=g.default(t.Button.Default)`
-    width: 8.5rem;
-    ${u.V3_MediaQuery.MaxWidth.sm} {
-        width: 100%;
-    }
-    ${p} {
-        height: 2.5rem;
-    }
-`,B=g.default.div`
-    width: 100%;
-    height: 100%;
-    overflow: hidden;
-`,M=g.default.canvas`
-    cursor: crosshair;
-`;exports.AddSignatureButton=m,exports.ESignatureContainer=w,exports.ESignatureDrawable=v,exports.EditSignatureButton=x,exports.GrowContainer=V,exports.Instructions=f,exports.ModalActionButton=C,exports.ModalBox=S,exports.ModalButtons=q,exports.ModalTitle=y,exports.ProgressBox=b,exports.ScrollableModal=_,exports.SignatureArea=h,exports.SignatureCanvas=M,exports.SignatureCanvasContainer=B,exports.SignatureLine=j,exports.SignaturePreviewImage=$;
+"use strict";require("./e-signature.styles_lukd9f.css");exports.addSignatureButton="ar63c10",exports.eSignatureContainer="e7vuxoj",exports.eSignatureDrawable="e17mguy2",exports.editSignatureButton="ewm2h5q",exports.growContainer="g1i75dqj",exports.instructions="i1djtjln",exports.modalActionButton="m19bpnkq",exports.modalBox="mokviza",exports.modalButtons="mkkmrzr",exports.modalTitle="ml7zlxm",exports.progressBox="pvyk01w",exports.scrollableModal="s4jcnfi",exports.signatureArea="sf6ex5f",exports.signatureCanvas="s13sbvhj",exports.signatureCanvasContainer="s1ngo83b",exports.signatureLine="sv01snj",exports.signaturePreviewImage="s10kgaon";
 //# sourceMappingURL=e-signature.styles.js.map

package/cjs/e-signature/e-signature.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"e-signature.styles.js","sources":["../../../src/e-signature/e-signature.styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { Button } from \"../button\";\nimport { DashedBorder } from \"../dashed-border\";\nimport { IconButton } from \"../icon-button\";\nimport { Modal } from \"../modal\";\nimport { Border, Colour, Radius } from \"../theme\";\nimport { Typography } from \"../typography\";\nimport {\n    V3_Border,\n    V3_Breakpoint,\n    V3_Colour,\n    V3_Font,\n    V3_MediaQuery,\n    V3_Radius,\n    V3_Spacing,\n} from \"../v3_theme\";\n\n// =============================================================================\n// STYLE INTERFACES\n// =============================================================================\ninterface SignatureAreaProps {\n    $disabled: boolean | undefined;\n}\n\n// =============================================================================\n// CUSTOM MEDIA QUERIES\n// =============================================================================\n// for mobileL and below in both orientations\nconst mobileMediaQuery = css`\n    ${(props) => `\n        ${V3_MediaQuery.MaxWidth.sm(props)},\n        (orientation: landscape) and (max-height: ${V3_Breakpoint[\"sm-max\"](\n            props\n        )}px)\n    `}\n`;\nconst mobileLandscapeMediaQuery = css`\n    ${(props) => `\n        @media (orientation: landscape) and (max-height: ${V3_Breakpoint[\n            \"sm-max\"\n        ](props)}px)\n    `}\n`;\n\n// =============================================================================\n// STYLING\n// =============================================================================\n\n// -----------------------------------------------------------------------------\n// MAIN FIELD\n// -----------------------------------------------------------------------------\n\nexport const SignatureArea = styled(DashedBorder).attrs<SignatureAreaProps>(\n    (props) => ({\n        thickness: Border[\"width-040\"],\n        radius: Radius[\"sm\"],\n        colour: props.$disabled ? Colour[\"border-disabled\"] : Colour[\"border\"],\n        backgroundColor: props.$disabled ? Colour[\"bg-disabled\"] : Colour[\"bg\"],\n    })\n)<SignatureAreaProps>`\n    position: relative;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: 14.125rem;\n`;\n\nexport const AddSignatureButton = styled(Button.Default)`\n    width: fit-content;\n    margin: 0 ${V3_Spacing[\"spacing-20\"]};\n\n    &:disabled {\n        border-color: ${V3_Colour[\"border-strong\"]};\n    }\n`;\n\nexport const EditSignatureButton = styled(IconButton)`\n    position: absolute;\n    top: ${V3_Spacing[\"spacing-16\"]};\n    right: ${V3_Spacing[\"spacing-16\"]};\n\n    &:disabled {\n        border-color: ${V3_Colour[\"border-strong\"]};\n    }\n`;\n\nexport const SignaturePreviewImage = styled.img`\n    display: block;\n    object-fit: contain;\n    object-position: center;\n    width: calc(100% - (3rem + ${V3_Spacing[\"spacing-16\"]}) * 2);\n    height: 100%;\n`;\n\nexport const ProgressBox = styled.div`\n    background: ${V3_Colour[\"bg-primary-subtlest\"]};\n    border: ${V3_Border[\"width-010\"]} ${V3_Border[\"solid\"]}\n        ${V3_Colour[\"border\"]};\n    border-radius: ${V3_Radius[\"sm\"]};\n    margin: 0 ${V3_Spacing[\"spacing-20\"]};\n    padding: ${V3_Spacing[\"spacing-16\"]};\n    display: flex;\n    gap: ${V3_Spacing[\"spacing-16\"]};\n    flex: 1;\n    flex-direction: column;\n    align-items: center;\n`;\n\nexport const Instructions = styled(Typography.BodySM)`\n    margin-top: ${V3_Spacing[\"spacing-16\"]};\n`;\n\n// -----------------------------------------------------------------------------\n// SIGNATURE MODAL\n// -----------------------------------------------------------------------------\n\nexport const ScrollableModal = styled(Modal)`\n    /* increase specificity as the styles are overwritten */\n    && {\n        height: 100%;\n        overflow-y: auto;\n    }\n`;\n\nexport const GrowContainer = styled.div`\n    width: 100%;\n    margin: auto;\n    padding: ${V3_Spacing[\"layout-xxl\"]} ${V3_Spacing[\"layout-sm\"]};\n\n    ${mobileMediaQuery} {\n        padding: 0;\n        width: 100%;\n        height: 100%;\n    }\n`;\n\nexport const ModalBox = styled(Modal.Box)`\n    width: 100%;\n    height: 29rem;\n    max-width: 672px;\n    max-height: none;\n    margin: 0 auto;\n    padding: ${V3_Spacing[\"spacing-16\"]};\n\n    ${mobileMediaQuery} {\n        display: flex;\n        flex-direction: column;\n        max-width: none;\n        height: 100%;\n        border-radius: 0;\n        padding: 0;\n\n        --close-button-top-inset: ${V3_Spacing[\"spacing-8\"]};\n        --close-button-right-inset: ${V3_Spacing[\"spacing-20\"]};\n    }\n`;\n\nexport const ModalTitle = styled.h2`\n    ${V3_Font[\"body-baseline-semibold\"]}\n    color: ${V3_Colour[\"text\"]};\n    margin-bottom: ${V3_Spacing[\"spacing-16\"]};\n    text-align: center;\n\n    ${mobileMediaQuery} {\n        ${V3_Font[\"body-md-semibold\"]}\n        margin: ${V3_Spacing[\"spacing-12\"]} 0;\n    }\n`;\n\nexport const ESignatureContainer = styled.div`\n    width: 100%;\n    height: 20rem;\n    border-radius: ${V3_Radius[\"lg\"]};\n    overflow: hidden;\n\n    ${mobileMediaQuery} {\n        border-radius: 0;\n        flex: 1;\n    }\n\n    ${mobileLandscapeMediaQuery} {\n        background: ${V3_Colour[\"bg-strong\"]};\n    }\n`;\n\nexport const ESignatureDrawable = styled.div`\n    position: relative;\n    width: 100%;\n    height: 100%;\n    background: ${V3_Colour[\"bg-stronger\"]};\n    margin: auto;\n\n    ${mobileMediaQuery} {\n        aspect-ratio: 4/3;\n    }\n    ${V3_MediaQuery.MaxWidth.sm} {\n        width: 100%;\n        height: auto;\n    }\n    ${mobileLandscapeMediaQuery} {\n        width: auto;\n        height: 100%;\n    }\n`;\n\nexport const SignatureLine = styled.div`\n    position: absolute;\n    left: 50%;\n    top: calc(75% - 1px);\n    width: 300px;\n    height: 2px;\n    transform: translateX(-50%);\n    background-color: ${V3_Colour[\"border-strong\"]};\n    pointer-events: none;\n\n    ${mobileMediaQuery} {\n        width: calc(100% - ${V3_Spacing[\"spacing-40\"]});\n        max-width: 300px;\n        left: 50%;\n    }\n`;\n\nexport const ModalButtons = styled.div`\n    display: flex;\n    justify-content: space-between;\n    margin-top: ${V3_Spacing[\"spacing-16\"]};\n\n    ${V3_MediaQuery.MaxWidth.sm} {\n        flex-direction: column-reverse;\n        margin: ${V3_Spacing[\"spacing-16\"]} ${V3_Spacing[\"spacing-24\"]}\n            ${V3_Spacing[\"spacing-48\"]};\n        gap: ${V3_Spacing[\"spacing-16\"]};\n    }\n\n    ${mobileLandscapeMediaQuery} {\n        flex-direction: row;\n        margin: ${V3_Spacing[\"spacing-16\"]} ${V3_Spacing[\"spacing-20\"]};\n    }\n`;\n\nexport const ModalActionButton = styled(Button.Default)`\n    width: 8.5rem;\n    ${V3_MediaQuery.MaxWidth.sm} {\n        width: 100%;\n    }\n    ${mobileLandscapeMediaQuery} {\n        height: 2.5rem;\n    }\n`;\n\nexport const SignatureCanvasContainer = styled.div`\n    width: 100%;\n    height: 100%;\n    overflow: hidden;\n`;\n\nexport const SignatureCanvas = styled.canvas`\n    cursor: crosshair;\n`;\n"],"names":["mobileMediaQuery","css","props","V3_MediaQuery","MaxWidth","sm","V3_Breakpoint","mobileLandscapeMediaQuery","SignatureArea","styled","DashedBorder","attrs","thickness","Border","radius","Radius","colour","$disabled","Colour","backgroundColor","AddSignatureButton","Button","Default","V3_Spacing","V3_Colour","EditSignatureButton","IconButton","SignaturePreviewImage","img","ProgressBox","div","V3_Border","V3_Radius","Instructions","Typography","BodySM","ScrollableModal","Modal","GrowContainer","ModalBox","Box","ModalTitle","h2","V3_Font","ESignatureContainer","ESignatureDrawable","SignatureLine","ModalButtons","ModalActionButton","SignatureCanvasContainer","SignatureCanvas","canvas"],"mappings":"gxBA6BA,MAAMA,EAAmBC,EAAAA,GAAG;MACrBC,GAAU,aACPC,gBAAcC,SAASC,GAAGH,0DACgBI,gBAAc,UACtDJ;EAINK,EAA4BN,EAAAA,GAAG;MAC9BC,GAAU,8DAC0CI,gBAC/C,UACFJ;EAYGM,EAAgBC,EAAAA,QAAOC,EAAAA,cAAcC,OAC7CT,IAAK,CACFU,UAAWC,EAAAA,OAAO,aAClBC,OAAQC,EAAAA,OAAW,GACnBC,OAAQd,EAAMe,UAAYC,EAAAA,OAAO,mBAAqBA,EAAAA,OAAe,OACrEC,gBAAiBjB,EAAMe,UAAYC,EAAAA,OAAO,eAAiBA,EAAAA,OAAW,MAEzD;;;;;;EAQRE,EAAqBX,EAAAA,QAAOY,SAAOC,QAAQ;;gBAExCC,EAAAA,WAAW;;;wBAGHC,EAAAA,UAAU;;EAIrBC,EAAsBhB,EAAAA,QAAOiB,EAAAA,WAAW;;WAE1CH,EAAAA,WAAW;aACTA,EAAAA,WAAW;;;wBAGAC,EAAAA,UAAU;;EAIrBG,EAAwBlB,EAAAA,QAAOmB,GAAG;;;;iCAIdL,EAAAA,WAAW;;EAI/BM,EAAcpB,EAAAA,QAAOqB,GAAG;kBACnBN,EAAAA,UAAU;cACdO,EAAAA,UAAU,gBAAgBA,EAAAA,UAAiB;UAC/CP,EAAAA,UAAkB;qBACPQ,EAAAA,UAAc;gBACnBT,EAAAA,WAAW;eACZA,EAAAA,WAAW;;WAEfA,EAAAA,WAAW;;;;EAMTU,EAAexB,EAAAA,QAAOyB,aAAWC,OAAO;kBACnCZ,EAAAA,WAAW;EAOhBa,EAAkB3B,EAAAA,QAAO4B,EAAAA,MAAM;;;;;;EAQ/BC,EAAgB7B,EAAAA,QAAOqB,GAAG;;;eAGxBP,EAAAA,WAAW,iBAAiBA,EAAAA,WAAW;;MAEhDvB;;;;;EAOOuC,EAAW9B,EAAAA,QAAO4B,QAAMG,IAAI;;;;;;eAM1BjB,EAAAA,WAAW;;MAEpBvB;;;;;;;;oCAQ8BuB,EAAAA,WAAW;sCACTA,EAAAA,WAAW;;EAIpCkB,EAAahC,EAAAA,QAAOiC,EAAE;MAC7BC,EAAAA,QAAQ;aACDnB,EAAAA,UAAgB;qBACRD,EAAAA,WAAW;;;MAG1BvB;UACI2C,EAAAA,QAAQ;kBACApB,EAAAA,WAAW;;EAIhBqB,EAAsBnC,EAAAA,QAAOqB,GAAG;;;qBAGxBE,EAAAA,UAAc;;;MAG7BhC;;;;;MAKAO;sBACgBiB,EAAAA,UAAU;;EAInBqB,EAAqBpC,EAAAA,QAAOqB,GAAG;;;;kBAI1BN,EAAAA,UAAU;;;MAGtBxB;;;MAGAG,EAAAA,cAAcC,SAASC;;;;MAIvBE;;;;EAMOuC,EAAgBrC,EAAAA,QAAOqB,GAAG;;;;;;;wBAOfN,EAAAA,UAAU;;;MAG5BxB;6BACuBuB,EAAAA,WAAW;;;;EAM3BwB,EAAetC,EAAAA,QAAOqB,GAAG;;;kBAGpBP,EAAAA,WAAW;;MAEvBpB,EAAAA,cAAcC,SAASC;;kBAEXkB,EAAAA,WAAW,iBAAiBA,EAAAA,WAAW;cAC3CA,EAAAA,WAAW;eACVA,EAAAA,WAAW;;;MAGpBhB;;kBAEYgB,EAAAA,WAAW,iBAAiBA,EAAAA,WAAW;;EAI5CyB,EAAoBvC,EAAAA,QAAOY,SAAOC,QAAQ;;MAEjDnB,EAAAA,cAAcC,SAASC;;;MAGvBE;;;EAKO0C,EAA2BxC,EAAAA,QAAOqB,GAAG;;;;EAMrCoB,EAAkBzC,EAAAA,QAAO0C,MAAM;;"}
+{"version":3,"file":"e-signature.styles.js","sources":["../../../src/e-signature/e-signature.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport * as modalStyles from \"../modal/modal.styles\";\nimport { Border, Colour, Font, MediaQuery, Radius, Spacing } from \"../theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\n\n// -----------------------------------------------------------------------------\n// MAIN FIELD\n// -----------------------------------------------------------------------------\n\nexport const signatureArea = css`\n    position: relative;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: 14.125rem;\n`;\n\nexport const addSignatureButton = css`\n    width: fit-content;\n    margin: 0 ${Spacing[\"spacing-20\"]};\n\n    &:disabled {\n        border-color: ${Colour[\"border-strong\"]};\n    }\n`;\n\nexport const editSignatureButton = css`\n    position: absolute;\n    top: ${Spacing[\"spacing-16\"]};\n    right: ${Spacing[\"spacing-16\"]};\n\n    &:disabled {\n        border-color: ${Colour[\"border-strong\"]};\n    }\n`;\n\nexport const signaturePreviewImage = css`\n    display: block;\n    object-fit: contain;\n    object-position: center;\n    width: calc(100% - (3rem + ${Spacing[\"spacing-16\"]}) * 2);\n    height: 100%;\n\n    [data-fds-theme-mode=\"dark\"] & {\n        filter: invert(1);\n    }\n`;\n\nexport const progressBox = css`\n    background: ${Colour[\"bg-primary-subtlest\"]};\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${Colour[\"border\"]};\n    border-radius: ${Radius[\"sm\"]};\n    margin: 0 ${Spacing[\"spacing-20\"]};\n    padding: ${Spacing[\"spacing-16\"]};\n    display: flex;\n    gap: ${Spacing[\"spacing-16\"]};\n    flex: 1;\n    flex-direction: column;\n    align-items: center;\n`;\n\nexport const instructions = css`\n    margin-top: ${Spacing[\"spacing-16\"]};\n`;\n\n// -----------------------------------------------------------------------------\n// SIGNATURE MODAL\n// -----------------------------------------------------------------------------\n\nexport const scrollableModal = css`\n    /* increase specificity as the styles are overwritten */\n    && {\n        height: 100%;\n        overflow-y: auto;\n    }\n`;\n\nexport const growContainer = css`\n    width: 100%;\n    margin: auto;\n    padding: ${Spacing[\"layout-xxl\"]} ${Spacing[\"layout-sm\"]};\n\n    ${MediaQuery.MaxWidth.sm}, &[data-mobile-landscape=\"true\"] {\n        padding: 0;\n        width: 100%;\n        height: 100%;\n    }\n`;\n\nexport const modalBox = css`\n    width: 100%;\n    height: 29rem;\n    max-width: 672px;\n    max-height: none;\n    margin: 0 auto;\n    padding: ${Spacing[\"spacing-16\"]};\n\n    ${MediaQuery.MaxWidth.sm}, &[data-mobile-landscape=\"true\"] {\n        display: flex;\n        flex-direction: column;\n        max-width: none;\n        height: 100%;\n        border-radius: 0;\n        padding: 0;\n\n        ${modalStyles.tokens.closeButton.topInset}: ${Spacing[\"spacing-8\"]};\n        ${modalStyles.tokens.closeButton.rightInset}: ${Spacing[\"spacing-20\"]};\n    }\n`;\n\nexport const modalTitle = css`\n    ${Font[\"body-baseline-semibold\"]}\n    color: ${Colour[\"text\"]};\n    margin-bottom: ${Spacing[\"spacing-16\"]};\n    text-align: center;\n\n    ${MediaQuery.MaxWidth.sm}, &[data-mobile-landscape=\"true\"] {\n        ${Font[\"body-md-semibold\"]}\n        margin: ${Spacing[\"spacing-12\"]} 0;\n    }\n`;\n\nexport const eSignatureContainer = css`\n    width: 100%;\n    height: 20rem;\n    border-radius: ${Radius[\"lg\"]};\n    overflow: hidden;\n\n    ${MediaQuery.MaxWidth.sm}, &[data-mobile-landscape=\"true\"] {\n        border-radius: 0;\n        flex: 1;\n    }\n\n    &[data-mobile-landscape=\"true\"] {\n        background: ${Colour[\"bg-strong\"]};\n    }\n`;\n\nexport const eSignatureDrawable = css`\n    position: relative;\n    width: 100%;\n    height: 100%;\n    background: ${Colour[\"bg-stronger\"]};\n    margin: auto;\n\n    ${MediaQuery.MaxWidth.sm}, &[data-mobile-landscape=\"true\"] {\n        aspect-ratio: 4/3;\n    }\n\n    ${MediaQuery.MaxWidth.sm} {\n        width: 100%;\n        height: auto;\n    }\n\n    &[data-mobile-landscape=\"true\"] {\n        width: auto;\n        height: 100%;\n    }\n`;\n\nexport const signatureLine = css`\n    position: absolute;\n    left: 50%;\n    top: calc(75% - 1px);\n    width: 300px;\n    height: 2px;\n    transform: translateX(-50%);\n    background-color: ${Colour[\"border-strong\"]};\n    pointer-events: none;\n\n    ${MediaQuery.MaxWidth.sm}, &[data-mobile-landscape=\"true\"] {\n        width: calc(100% - ${Spacing[\"spacing-40\"]});\n        max-width: 300px;\n        left: 50%;\n    }\n`;\n\nexport const modalButtons = css`\n    display: flex;\n    justify-content: space-between;\n    margin-top: ${Spacing[\"spacing-16\"]};\n\n    ${MediaQuery.MaxWidth.sm} {\n        flex-direction: column-reverse;\n        margin: ${Spacing[\"spacing-16\"]} ${Spacing[\"spacing-24\"]}\n            ${Spacing[\"spacing-48\"]};\n        gap: ${Spacing[\"spacing-16\"]};\n    }\n\n    &[data-mobile-landscape=\"true\"] {\n        flex-direction: row;\n        margin: ${Spacing[\"spacing-16\"]} ${Spacing[\"spacing-20\"]};\n    }\n`;\n\nexport const modalActionButton = css`\n    width: 8.5rem;\n\n    ${MediaQuery.MaxWidth.sm} {\n        width: 100%;\n    }\n\n    &[data-mobile-landscape=\"true\"] {\n        height: 2.5rem;\n    }\n`;\n\nexport const signatureCanvasContainer = css`\n    width: 100%;\n    height: 100%;\n    overflow: hidden;\n`;\n\nexport const signatureCanvas = css`\n    cursor: crosshair;\n\n    [data-fds-theme-mode=\"dark\"] & {\n        filter: invert(1);\n    }\n`;\n"],"names":[],"mappings":"8GAqB+B,sCAyGC,qCAgBD,uCAhHC,gCAmDN,gCAhBD,qCAsIK,4BA1GT,+BAwFI,6BAnEF,8BA9DC,kCAqBI,gCA5DF,kCA4ME,4CANS,iCA/CX,wCA5HQ"}

package/cjs/e-signature/e-signature.styles_lukd9f.css

@@ -0,0 +1,17 @@
+@layer fds{.sf6ex5f{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;height:14.125rem;}
+.ar63c10{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;margin:0 var(--fds-spacing-20);}.ar63c10:disabled{border-color:var(--fds-colour-border-strong);}
+.ewm2h5q{position:absolute;top:var(--fds-spacing-16);right:var(--fds-spacing-16);}.ewm2h5q:disabled{border-color:var(--fds-colour-border-strong);}
+.s10kgaon{display:block;object-fit:contain;object-position:center;width:calc(100% - (3rem + var(--fds-spacing-16)) * 2);height:100%;}[data-fds-theme-mode="dark"] .s10kgaon{-webkit-filter:invert(1);filter:invert(1);}
+.pvyk01w{background:var(--fds-colour-bg-primary-subtlest);border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-radius:var(--fds-radius-sm);margin:0 var(--fds-spacing-20);padding:var(--fds-spacing-16);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--fds-spacing-16);-webkit-flex:1;-ms-flex:1;flex:1;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
+.i1djtjln{margin-top:var(--fds-spacing-16);}
+.s4jcnfi.s4jcnfi{height:100%;overflow-y:auto;}
+.g1i75dqj{width:100%;margin:auto;padding:var(--fds-layout-xxl) var(--fds-layout-sm);}:where(body.fds-breakpoint-sm-max) .g1i75dqj,.g1i75dqj[data-mobile-landscape="true"]{padding:0;width:100%;height:100%;}
+.mokviza{width:100%;height:29rem;max-width:672px;max-height:none;margin:0 auto;padding:var(--fds-spacing-16);}:where(body.fds-breakpoint-sm-max) .mokviza,.mokviza[data-mobile-landscape="true"]{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;max-width:none;height:100%;border-radius:0;padding:0;--fds-internal-modal-closeButton-topInset:var(--fds-spacing-8);--fds-internal-modal-closeButton-rightInset:var(--fds-spacing-20);}
+.ml7zlxm{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text);margin-bottom:var(--fds-spacing-16);text-align:center;}:where(body.fds-breakpoint-sm-max) .ml7zlxm,.ml7zlxm[data-mobile-landscape="true"]{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);margin:var(--fds-spacing-12) 0;}
+.e7vuxoj{width:100%;height:20rem;border-radius:var(--fds-radius-lg);overflow:hidden;}:where(body.fds-breakpoint-sm-max) .e7vuxoj,.e7vuxoj[data-mobile-landscape="true"]{border-radius:0;-webkit-flex:1;-ms-flex:1;flex:1;}.e7vuxoj[data-mobile-landscape="true"]{background:var(--fds-colour-bg-strong);}
+.e17mguy2{position:relative;width:100%;height:100%;background:var(--fds-colour-bg-stronger);margin:auto;}:where(body.fds-breakpoint-sm-max) .e17mguy2,.e17mguy2[data-mobile-landscape="true"]{aspect-ratio:4/3;}:where(body.fds-breakpoint-sm-max) .e17mguy2{width:100%;height:auto;}.e17mguy2[data-mobile-landscape="true"]{width:auto;height:100%;}
+.sv01snj{position:absolute;left:50%;top:calc(75% - 1px);width:300px;height:2px;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);background-color:var(--fds-colour-border-strong);pointer-events:none;}:where(body.fds-breakpoint-sm-max) .sv01snj,.sv01snj[data-mobile-landscape="true"]{width:calc(100% - var(--fds-spacing-40));max-width:300px;left:50%;}
+.mkkmrzr{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;margin-top:var(--fds-spacing-16);}:where(body.fds-breakpoint-sm-max) .mkkmrzr{-webkit-flex-direction:column-reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;margin:var(--fds-spacing-16) var(--fds-spacing-24) var(--fds-spacing-48);gap:var(--fds-spacing-16);}.mkkmrzr[data-mobile-landscape="true"]{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;margin:var(--fds-spacing-16) var(--fds-spacing-20);}
+.m19bpnkq{width:8.5rem;}:where(body.fds-breakpoint-sm-max) .m19bpnkq{width:100%;}.m19bpnkq[data-mobile-landscape="true"]{height:2.5rem;}
+.s1ngo83b{width:100%;height:100%;overflow:hidden;}
+.s13sbvhj{cursor:crosshair;}[data-fds-theme-mode="dark"] .s13sbvhj{-webkit-filter:invert(1);filter:invert(1);}}

package/cjs/error-display/error-display-data.js

@@ -1,2 +1,2 @@
-"use strict";var s=require("./error-display-helper-comp.js"),e=require("./helper.js");const{imgAttributeHelper:t}=e.ErrorDisplayHelper,g={400:{base:"https://assets.life.gov.sg/react-design-system/img/error/400.png",md:"https://assets.life.gov.sg/react-design-system/img/error/400@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/400@3x.png",width:400,height:280},403:{base:"https://assets.life.gov.sg/react-design-system/img/error/403.png",md:"https://assets.life.gov.sg/react-design-system/img/error/403@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/403@3x.png",width:400,height:280},404:{base:"https://assets.life.gov.sg/react-design-system/img/error/404.png",md:"https://assets.life.gov.sg/react-design-system/img/error/404@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/404@3x.png",width:400,height:280},408:{base:"https://assets.life.gov.sg/react-design-system/img/error/408.png",md:"https://assets.life.gov.sg/react-design-system/img/error/408@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/408@3x.png",width:400,height:280},500:{base:"https://assets.life.gov.sg/react-design-system/img/error/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/generic-error@3x.png",width:400,height:280},502:{base:"https://assets.life.gov.sg/react-design-system/img/error/502.png",md:"https://assets.life.gov.sg/react-design-system/img/error/502@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/502@3x.png",width:400,height:280},503:{base:"https://assets.life.gov.sg/react-design-system/img/error/503.png",md:"https://assets.life.gov.sg/react-design-system/img/error/503@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/503@3x.png",width:400,height:280},504:{base:"https://assets.life.gov.sg/react-design-system/img/error/504.png",md:"https://assets.life.gov.sg/react-design-system/img/error/504@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/504@3x.png",width:400,height:280},confirmation:{base:"https://assets.life.gov.sg/react-design-system/img/error/confirmation.png",md:"https://assets.life.gov.sg/react-design-system/img/error/confirmation@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/confirmation@3x.png",width:400,height:280},"insufficient-credits":{base:"https://assets.life.gov.sg/react-design-system/img/error/insuffcient-credit.png",md:"https://assets.life.gov.sg/react-design-system/img/error/insuffcient-credit@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/insuffcient-credit@3x.png",width:400,height:280},inactivity:{base:"https://assets.life.gov.sg/react-design-system/img/error/inactivity.png",md:"https://assets.life.gov.sg/react-design-system/img/error/inactivity@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/inactivity@3x.png",width:400,height:280},"link-error":{base:"https://assets.life.gov.sg/react-design-system/img/error/link-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/link-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/link-error@3x.png",width:400,height:280},logout:{base:"https://assets.life.gov.sg/react-design-system/img/error/logout.png",md:"https://assets.life.gov.sg/react-design-system/img/error/logout@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/logout@3x.png",width:400,height:280},"no-item-found":{base:"https://assets.life.gov.sg/react-design-system/img/error/no-item-found.png",md:"https://assets.life.gov.sg/react-design-system/img/error/no-item-found@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/no-item-found@3x.png",width:400,height:280},"payment-unsuccessful":{base:"https://assets.life.gov.sg/react-design-system/img/error/payment-unsuccessful.png",md:"https://assets.life.gov.sg/react-design-system/img/error/payment-unsuccessful@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/payment-unsuccessful@3x.png",width:400,height:281},"transfer-unsuccessful":{base:"https://assets.life.gov.sg/react-design-system/img/error/transfer-unsuccessful.png",md:"https://assets.life.gov.sg/react-design-system/img/error/transfer-unsuccessful@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/transfer-unsuccessful@3x.png",width:400,height:280},"unsupported-browser":{base:"https://assets.life.gov.sg/react-design-system/img/error/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/generic-error@3x.png",width:400,height:280},warning:{base:"https://assets.life.gov.sg/react-design-system/img/error/warning.png",md:"https://assets.life.gov.sg/react-design-system/img/error/warning@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/warning@3x.png",width:400,height:280}},r={400:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/400.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/400@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/400@3x.png",width:400,height:215},403:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/403.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/403@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/403@3x.png",width:400,height:254},404:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/404.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/404@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/404@3x.png",width:400,height:319},408:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/408.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/408@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/408@3x.png",width:400,height:330},500:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error@3x.png",width:400,height:232},502:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/502.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/502@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/502@3x.png",width:400,height:215},503:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/503.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/503@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/503@3x.png",width:400,height:191},504:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/504.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/504@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/504@3x.png",width:400,height:261},confirmation:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/confirmation.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/confirmation@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/confirmation@3x.png",width:400,height:280},"insufficient-credits":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/insuffcient-credit.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/insuffcient-credit@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/insuffcient-credit@3x.png",width:400,height:280},inactivity:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/inactivity.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/inactivity@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/inactivity@3x.png",width:400,height:276},"link-error":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/link-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/link-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/link-error@3x.png",width:400,height:280},logout:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/logout.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/logout@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/logout@3x.png",width:400,height:280},"no-item-found":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/no-item-found.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/no-item-found@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/no-item-found@3x.png",width:400,height:290},"payment-unsuccessful":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/payment-unsuccessful.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/payment-unsuccessful@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/payment-unsuccessful@3x.png",width:400,height:280},"transfer-unsuccessful":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/transfer-unsuccessful.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/transfer-unsuccessful@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/transfer-unsuccessful@3x.png",width:400,height:280},"unsupported-browser":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error@3x.png",width:400,height:232},warning:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/warning.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/warning@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/warning@3x.png",width:400,height:280}},i=Object.assign(Object.assign({},g),{400:{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/400.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/400@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/400@3x.png",width:400,height:280},404:{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found@3x.png",width:400,height:280},500:{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error@3x.png",width:400,height:280},confirmation:{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/confirmation.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/confirmation@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/confirmation@3x.png",width:400,height:280},"no-item-found":{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found@3x.png",width:400,height:280},"unsupported-browser":{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error@3x.png",width:400,height:280},warning:{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/warning.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/warning@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/warning@3x.png",width:400,height:280}}),n=Object.assign(Object.assign({},g),{400:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/400.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/400@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/400@3x.png",width:400,height:280},403:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/403.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/403@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/403@3x.png",width:400,height:280},404:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/404.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/404@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/404@3x.png",width:400,height:280},408:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/408.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/408@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/408@3x.png",width:400,height:280},500:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/generic-error@3x.png",width:400,height:280},502:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/502.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/502@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/502@3x.png",width:400,height:280},503:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/503.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/503@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/503@3x.png",width:400,height:280},504:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/504.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/504@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/504@3x.png",width:400,height:280},confirmation:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/confirmation.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/confirmation@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/confirmation@3x.png",width:400,height:280},inactivity:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/inactivity.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/inactivity@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/inactivity@3x.png",width:400,height:280},"link-error":{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/link-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/link-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/link-error@3x.png",width:400,height:280},logout:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/logout.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/logout@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/logout@3x.png",width:400,height:280},warning:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/warning.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/warning@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/warning@3x.png",width:400,height:280},"payment-unsuccessful":{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/payment-unsuccessful.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/payment-unsuccessful@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/payment-unsuccessful@3x.png",width:400,height:280},"no-item-found":{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/no-item-found.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/no-item-found@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/no-item-found@3x.png",width:400,height:280}}),o=(e,g)=>new Map([["400",{img:t(e[400],g),title:"Something went wrong",description:"This could be a temporary problem, so please refresh the page or try again later."}],["403",{img:t(e[403],g),title:"Error loading page",description:"You may not have permission to view this page. If someone gave you this link, let them know about this error."}],["404",{img:t(e[404],g),title:"Page not found",description:"If you entered or pasted the URL, check that it’s correct. If someone gave you this link, let them know about this error."}],["408",{img:t(e[408],g),title:"Something went wrong",description:"This could be a temporary problem, so please refresh the page or try again later."}],["500",{img:t(e[500],g),title:"Something went wrong",description:"We're working on a fix for the problem. Please try again later."}],["502",{img:t(e[502],g),title:"Something went wrong",description:"This could be a temporary problem, so please refresh the page or try again later."}],["503",{img:t(e[503],g),title:"Service under maintenance",description:"This service is currently unavailable. Please try again later."}],["504",{img:t(e[504],g),title:"Something went wrong",description:"This could be a temporary problem, so please refresh the page or try again later."}],["confirmation",{img:t(e.confirmation,g),title:"Leave and lose changes?",description:"You have unsaved changes. If you leave this page, you will lose the changes you’ve made."}],["link-error",{img:t(e["link-error"],g),title:"Link has expired",description:"If you entered or pasted the URL, check that it’s correct. If someone gave you this link, let them know it has expired."}],["logout",{img:t(e.logout,g),title:"You’ve been logged out",description:"It looks like you’ve left, so we logged you out to protect your privacy."}],["insufficient-credits",{img:t(e["insufficient-credits"],g),title:"Insufficient credits",description:"You do not have enough credits to make this transaction."}],["inactivity",{img:t(e.inactivity,g),title:"Are you still there?",description:"You’ve been inactive for a while. To protect your privacy, you’ll be logged out soon.\n\nIf you wish to stay on this page, let us know now.",renderDescription:s.renderDescriptionWithProps("inactivity")}],["maintenance",{img:t(e[503],g),title:"Service under maintenance",description:"This service is currently unavailable. Please try again later.",renderDescription:s.renderDescriptionWithProps("maintenance")}],["no-item-found",{img:t(e["no-item-found"],g),title:"No results found",description:"Try adjusting your search or filters to find what you’re looking for."}],["payment-unsuccessful",{img:t(e["payment-unsuccessful"],g),title:"Unsuccessful payment",description:"Your payment was unsuccessful. Please try again."}],["transfer-unsuccessful",{img:t(e["transfer-unsuccessful"],g),title:"Unsuccessful transfer",description:"Your transfer was unsuccessful. Please try again."}],["unsupported-browser",{img:t(e["unsupported-browser"],g),title:"Browser not supported",description:"Download the latest version of Chrome, Edge, Firefox or Safari."}],["partially-supported-browser",{img:t(e["unsupported-browser"],g),title:"Browser version not supported",description:"Update to the latest version of Chrome, Edge, Firefox or Safari."}],["warning",{img:t(e.warning,g),title:"Are you sure?",description:"You will lose your progress."}]]);exports.generateErrorDisplayData=o,exports.getErrorDisplayData=(s,e,t)=>{switch(e){case"bookingsg":return o(r,t).get(s);case"ccube":return o(i,t).get(s);case"mylegacy":return o(n,t).get(s);default:return o(g,t).get(s)}};
+"use strict";var s=require("./error-display-helper-comp.js"),e=require("./helper.js");const{imgAttributeHelper:t}=e.ErrorDisplayHelper,g={400:{base:"https://assets.life.gov.sg/react-design-system/img/error/400.png",md:"https://assets.life.gov.sg/react-design-system/img/error/400@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/400@3x.png",width:400,height:280},403:{base:"https://assets.life.gov.sg/react-design-system/img/error/403.png",md:"https://assets.life.gov.sg/react-design-system/img/error/403@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/403@3x.png",width:400,height:280},404:{base:"https://assets.life.gov.sg/react-design-system/img/error/404.png",md:"https://assets.life.gov.sg/react-design-system/img/error/404@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/404@3x.png",width:400,height:280},408:{base:"https://assets.life.gov.sg/react-design-system/img/error/408.png",md:"https://assets.life.gov.sg/react-design-system/img/error/408@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/408@3x.png",width:400,height:280},500:{base:"https://assets.life.gov.sg/react-design-system/img/error/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/generic-error@3x.png",width:400,height:280},502:{base:"https://assets.life.gov.sg/react-design-system/img/error/502.png",md:"https://assets.life.gov.sg/react-design-system/img/error/502@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/502@3x.png",width:400,height:280},503:{base:"https://assets.life.gov.sg/react-design-system/img/error/503.png",md:"https://assets.life.gov.sg/react-design-system/img/error/503@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/503@3x.png",width:400,height:280},504:{base:"https://assets.life.gov.sg/react-design-system/img/error/504.png",md:"https://assets.life.gov.sg/react-design-system/img/error/504@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/504@3x.png",width:400,height:280},confirmation:{base:"https://assets.life.gov.sg/react-design-system/img/error/confirmation.png",md:"https://assets.life.gov.sg/react-design-system/img/error/confirmation@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/confirmation@3x.png",width:400,height:280},"insufficient-credits":{base:"https://assets.life.gov.sg/react-design-system/img/error/insuffcient-credit.png",md:"https://assets.life.gov.sg/react-design-system/img/error/insuffcient-credit@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/insuffcient-credit@3x.png",width:400,height:280},inactivity:{base:"https://assets.life.gov.sg/react-design-system/img/error/inactivity.png",md:"https://assets.life.gov.sg/react-design-system/img/error/inactivity@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/inactivity@3x.png",width:400,height:280},"link-error":{base:"https://assets.life.gov.sg/react-design-system/img/error/link-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/link-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/link-error@3x.png",width:400,height:280},logout:{base:"https://assets.life.gov.sg/react-design-system/img/error/logout.png",md:"https://assets.life.gov.sg/react-design-system/img/error/logout@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/logout@3x.png",width:400,height:280},"no-item-found":{base:"https://assets.life.gov.sg/react-design-system/img/error/no-item-found.png",md:"https://assets.life.gov.sg/react-design-system/img/error/no-item-found@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/no-item-found@3x.png",width:400,height:280},"payment-unsuccessful":{base:"https://assets.life.gov.sg/react-design-system/img/error/payment-unsuccessful.png",md:"https://assets.life.gov.sg/react-design-system/img/error/payment-unsuccessful@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/payment-unsuccessful@3x.png",width:400,height:281},"transfer-unsuccessful":{base:"https://assets.life.gov.sg/react-design-system/img/error/transfer-unsuccessful.png",md:"https://assets.life.gov.sg/react-design-system/img/error/transfer-unsuccessful@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/transfer-unsuccessful@3x.png",width:400,height:280},"unsupported-browser":{base:"https://assets.life.gov.sg/react-design-system/img/error/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/generic-error@3x.png",width:400,height:280},warning:{base:"https://assets.life.gov.sg/react-design-system/img/error/warning.png",md:"https://assets.life.gov.sg/react-design-system/img/error/warning@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/warning@3x.png",width:400,height:280}},r={400:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/400.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/400@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/400@3x.png",width:400,height:215},403:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/403.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/403@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/403@3x.png",width:400,height:254},404:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/404.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/404@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/404@3x.png",width:400,height:319},408:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/408.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/408@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/408@3x.png",width:400,height:330},500:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error@3x.png",width:400,height:232},502:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/502.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/502@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/502@3x.png",width:400,height:215},503:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/503.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/503@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/503@3x.png",width:400,height:191},504:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/504.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/504@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/504@3x.png",width:400,height:261},confirmation:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/confirmation.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/confirmation@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/confirmation@3x.png",width:400,height:280},"insufficient-credits":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/insuffcient-credit.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/insuffcient-credit@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/insuffcient-credit@3x.png",width:400,height:280},inactivity:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/inactivity.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/inactivity@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/inactivity@3x.png",width:400,height:276},"link-error":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/link-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/link-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/link-error@3x.png",width:400,height:280},logout:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/logout.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/logout@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/logout@3x.png",width:400,height:280},"no-item-found":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/no-item-found.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/no-item-found@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/no-item-found@3x.png",width:400,height:290},"payment-unsuccessful":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/payment-unsuccessful.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/payment-unsuccessful@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/payment-unsuccessful@3x.png",width:400,height:280},"transfer-unsuccessful":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/transfer-unsuccessful.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/transfer-unsuccessful@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/transfer-unsuccessful@3x.png",width:400,height:280},"unsupported-browser":{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/generic-error@3x.png",width:400,height:232},warning:{base:"https://assets.life.gov.sg/react-design-system/img/error/bsg/warning.png",md:"https://assets.life.gov.sg/react-design-system/img/error/bsg/warning@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/bsg/warning@3x.png",width:400,height:280}},i=Object.assign(Object.assign({},g),{400:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/400.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/400@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/400@3x.png",width:400,height:280},403:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/403.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/403@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/403@3x.png",width:400,height:284},404:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/404.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/404@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/404@3x.png",width:400,height:280},408:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/408.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/408@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/408@3x.png",width:400,height:280},500:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/generic-error@3x.png",width:400,height:280},502:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/502.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/502@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/502@3x.png",width:400,height:280},503:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/503.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/503@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/503@3x.png",width:400,height:220},504:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/504.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/504@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/504@3x.png",width:400,height:220},confirmation:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/confirmation.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/confirmation@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/confirmation@3x.png",width:400,height:280},inactivity:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/inactivity.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/inactivity@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/inactivity@3x.png",width:400,height:280},"link-error":{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/link-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/link-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/link-error@3x.png",width:400,height:280},logout:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/log-out.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/log-out@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/log-out@3x.png",width:400,height:280},"no-item-found":{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/no-item-found.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/no-item-found@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/no-item-found@3x.png",width:400,height:280},"unsupported-browser":{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/generic-error@3x.png",width:400,height:280},warning:{base:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/warning.png",md:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/warning@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/careercompass/warning@3x.png",width:400,height:280}}),a=Object.assign(Object.assign({},g),{400:{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/400.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/400@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/400@3x.png",width:400,height:280},404:{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found@3x.png",width:400,height:280},500:{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error@3x.png",width:400,height:280},confirmation:{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/confirmation.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/confirmation@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/confirmation@3x.png",width:400,height:280},"no-item-found":{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/no-item-found@3x.png",width:400,height:280},"unsupported-browser":{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/generic-error@3x.png",width:400,height:280},warning:{base:"https://assets.life.gov.sg/react-design-system/img/error/ccube/warning.png",md:"https://assets.life.gov.sg/react-design-system/img/error/ccube/warning@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/ccube/warning@3x.png",width:400,height:280}}),n=Object.assign(Object.assign({},g),{400:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/400.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/400@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/400@3x.png",width:400,height:280},403:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/403.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/403@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/403@3x.png",width:400,height:280},404:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/404.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/404@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/404@3x.png",width:400,height:280},408:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/408.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/408@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/408@3x.png",width:400,height:280},500:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/generic-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/generic-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/generic-error@3x.png",width:400,height:280},502:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/502.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/502@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/502@3x.png",width:400,height:280},503:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/503.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/503@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/503@3x.png",width:400,height:280},504:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/504.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/504@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/504@3x.png",width:400,height:280},confirmation:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/confirmation.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/confirmation@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/confirmation@3x.png",width:400,height:280},inactivity:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/inactivity.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/inactivity@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/inactivity@3x.png",width:400,height:280},"link-error":{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/link-error.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/link-error@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/link-error@3x.png",width:400,height:280},logout:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/logout.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/logout@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/logout@3x.png",width:400,height:280},warning:{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/warning.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/warning@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/warning@3x.png",width:400,height:280},"payment-unsuccessful":{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/payment-unsuccessful.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/payment-unsuccessful@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/payment-unsuccessful@3x.png",width:400,height:280},"no-item-found":{base:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/no-item-found.png",md:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/no-item-found@2x.png",lg:"https://assets.life.gov.sg/react-design-system/img/error/mylegacy/no-item-found@3x.png",width:400,height:280}}),o=e=>new Map([["400",{img:t(e[400]),title:"Something went wrong",description:"This could be a temporary problem, so please refresh the page or try again later."}],["403",{img:t(e[403]),title:"Error loading page",description:"You may not have permission to view this page. If someone gave you this link, let them know about this error."}],["404",{img:t(e[404]),title:"Page not found",description:"If you entered or pasted the URL, check that it’s correct. If someone gave you this link, let them know about this error."}],["408",{img:t(e[408]),title:"Something went wrong",description:"This could be a temporary problem, so please refresh the page or try again later."}],["500",{img:t(e[500]),title:"Something went wrong",description:"We're working on a fix for the problem. Please try again later."}],["502",{img:t(e[502]),title:"Something went wrong",description:"This could be a temporary problem, so please refresh the page or try again later."}],["503",{img:t(e[503]),title:"Service under maintenance",description:"This service is currently unavailable. Please try again later."}],["504",{img:t(e[504]),title:"Something went wrong",description:"This could be a temporary problem, so please refresh the page or try again later."}],["confirmation",{img:t(e.confirmation),title:"Leave and lose changes?",description:"You have unsaved changes. If you leave this page, you will lose the changes you’ve made."}],["link-error",{img:t(e["link-error"]),title:"Link has expired",description:"If you entered or pasted the URL, check that it’s correct. If someone gave you this link, let them know it has expired."}],["logout",{img:t(e.logout),title:"You’ve been logged out",description:"It looks like you’ve left, so we logged you out to protect your privacy."}],["insufficient-credits",{img:t(e["insufficient-credits"]),title:"Insufficient credits",description:"You do not have enough credits to make this transaction."}],["inactivity",{img:t(e.inactivity),title:"Are you still there?",description:"You’ve been inactive for a while. To protect your privacy, you’ll be logged out soon.\n\nIf you wish to stay on this page, let us know now.",renderDescription:s.renderDescriptionWithProps("inactivity")}],["maintenance",{img:t(e[503]),title:"Service under maintenance",description:"This service is currently unavailable. Please try again later.",renderDescription:s.renderDescriptionWithProps("maintenance")}],["no-item-found",{img:t(e["no-item-found"]),title:"No results found",description:"Try adjusting your search or filters to find what you’re looking for."}],["payment-unsuccessful",{img:t(e["payment-unsuccessful"]),title:"Unsuccessful payment",description:"Your payment was unsuccessful. Please try again."}],["transfer-unsuccessful",{img:t(e["transfer-unsuccessful"]),title:"Unsuccessful transfer",description:"Your transfer was unsuccessful. Please try again."}],["unsupported-browser",{img:t(e["unsupported-browser"]),title:"Browser not supported",description:"Download the latest version of Chrome, Edge, Firefox or Safari."}],["partially-supported-browser",{img:t(e["unsupported-browser"]),title:"Browser version not supported",description:"Update to the latest version of Chrome, Edge, Firefox or Safari."}],["warning",{img:t(e.warning),title:"Are you sure?",description:"You will lose your progress."}]]);exports.generateErrorDisplayData=o,exports.getErrorDisplayData=(s,e)=>{switch(e){case"bookingsg":return o(r).get(s);case"careercompass":return o(i).get(s);case"ccube":return o(a).get(s);case"mylegacy":case"smgs":return o(n).get(s);default:return o(g).get(s)}};
 //# sourceMappingURL=error-display-data.js.map