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

package/cjs/breadcrumb/breadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb.js","sources":["../../../src/breadcrumb/breadcrumb.tsx"],"sourcesContent":["import { useContext, useRef, useState } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\nimport { ThemeContext } from \"styled-components\";\n\nimport { useEvent, useEventListener, useIsomorphicLayoutEffect } from \"../util\";\nimport { V3_Breakpoint } from \"../v3_theme\";\nimport {\n    Caret,\n    Content,\n    CurrentLabel,\n    Fade,\n    Item,\n    PreviousLink,\n    Slash,\n    Wrapper,\n} from \"./breadcrumb.style\";\nimport type { BreadcrumbProps, FadeColorSet } from \"./types\";\n\nexport const Breadcrumb = ({\n    links,\n    fadeColor,\n    fadePosition = \"both\",\n    itemStyle,\n    id,\n    separatorStyle = \"chevron\",\n    ...otherProps\n}: BreadcrumbProps) => {\n    // =========================================================================\n    // CONST, STATE, REFS\n    // =========================================================================\n    const [showFade, setShowFade] = useState<boolean>(false);\n    const [showFadeLeft, setShowFadeLeft] = useState<boolean>(false);\n    const [showFadeRight, setShowFadeRight] = useState<boolean>(false);\n    const shouldShowFadeLeft =\n        fadePosition === \"left\" || fadePosition === \"both\";\n    const shouldShowFadeRight =\n        fadePosition === \"right\" || fadePosition === \"both\";\n\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const contentRef = useRef<HTMLUListElement>(null);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n\n    const theme = useContext(ThemeContext);\n    const tabletBreakpoint = V3_Breakpoint[\"lg-max\"]({ theme });\n\n    const onResize = useEvent(() => {\n        const content = contentRef.current;\n        const wrapper = wrapperRef.current;\n\n        if (\n            content &&\n            wrapper &&\n            links &&\n            links.length > 1 &&\n            window.innerWidth <= tabletBreakpoint\n        ) {\n            content.scrollLeft = content.scrollWidth - wrapper.offsetWidth;\n        }\n    });\n\n    const handleShowFadeToggle = useEvent(() => {\n        const nextShowFade = window.innerWidth <= tabletBreakpoint;\n        setShowFade(nextShowFade);\n\n        const content = contentRef.current;\n        const wrapper = wrapperRef.current;\n        if (content && wrapper && nextShowFade) {\n            if (content.scrollWidth > wrapper.offsetWidth) {\n                // set 1px margin of error to handle sub-pixel differences\n                setShowFadeLeft(content.scrollLeft >= 1);\n                setShowFadeRight(\n                    content.scrollWidth - content.scrollLeft - 1 >\n                        wrapper.offsetWidth\n                );\n                return;\n            }\n        }\n\n        setShowFadeLeft(false);\n        setShowFadeRight(false);\n    });\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEventListener(\"resize\", handleShowFadeToggle);\n    useEventListener(\"scroll\", handleShowFadeToggle, contentRef.current);\n\n    useIsomorphicLayoutEffect(() => {\n        onResize();\n        handleShowFadeToggle();\n    }, [onResize, handleShowFadeToggle]);\n\n    // To scroll left when wrapper resizes\n    useResizeDetector({\n        onResize,\n        targetRef: wrapperRef,\n        refreshMode: \"debounce\",\n        refreshRate: 50,\n        skipOnMount: true,\n    });\n\n    // =========================================================================\n    // RENDER\n    // =========================================================================\n    if (!links) return null;\n\n    const renderLinks = () => {\n        return links.map((link, index) => {\n            let element: JSX.Element;\n            if (!link.children) {\n                return null;\n            }\n\n            if (index === links.length - 1 || !link.href) {\n                element = (\n                    <CurrentLabel weight=\"semibold\" forwardedAs=\"span\">\n                        {link.children}\n                    </CurrentLabel>\n                );\n            } else {\n                element = (\n                    <PreviousLink\n                        {...link}\n                        weight=\"semibold\"\n                        underlineStyle=\"none\"\n                    />\n                );\n            }\n\n            return (\n                <Item\n                    key={index}\n                    $styleProps={itemStyle}\n                    {...(index === links.length - 1 && {\n                        \"aria-current\": \"page\",\n                    })}\n                >\n                    {element}\n                    {index < links.length - 1 &&\n                        (separatorStyle === \"chevron\" ? (\n                            <Caret aria-hidden />\n                        ) : (\n                            <Slash inline aria-hidden>\n                                /\n                            </Slash>\n                        ))}\n                </Item>\n            );\n        });\n    };\n\n    const renderFade = () => {\n        let fadeColorSet: FadeColorSet;\n\n        if (Array.isArray(fadeColor) && fadeColor.length > 0) {\n            // Single array, apply same color\n            fadeColorSet = {\n                left: fadeColor,\n                right: fadeColor,\n            };\n        } else if (!fadeColor) {\n            fadeColorSet = {\n                left: undefined,\n                right: undefined,\n            };\n        } else {\n            fadeColorSet = fadeColor as FadeColorSet;\n        }\n\n        return (\n            <>\n                {showFadeLeft && shouldShowFadeLeft && (\n                    <Fade\n                        $backgroundColor={fadeColorSet.left}\n                        $position=\"left\"\n                    />\n                )}\n                {showFadeRight && shouldShowFadeRight && (\n                    <Fade\n                        $backgroundColor={fadeColorSet.right}\n                        $position=\"right\"\n                    />\n                )}\n            </>\n        );\n    };\n\n    return (\n        <Wrapper ref={wrapperRef} id={id || \"breadcrumb\"} {...otherProps}>\n            <nav aria-label=\"Breadcrumb\">\n                <Content ref={contentRef}>{renderLinks()}</Content>\n            </nav>\n            {showFade && renderFade()}\n        </Wrapper>\n    );\n};\n"],"names":["_a","links","fadeColor","fadePosition","itemStyle","id","separatorStyle","otherProps","__rest","showFade","setShowFade","useState","showFadeLeft","setShowFadeLeft","showFadeRight","setShowFadeRight","shouldShowFadeLeft","shouldShowFadeRight","wrapperRef","useRef","contentRef","theme","useContext","ThemeContext","tabletBreakpoint","V3_Breakpoint","onResize","useEvent","content","current","wrapper","length","window","innerWidth","scrollLeft","scrollWidth","offsetWidth","handleShowFadeToggle","nextShowFade","useEventListener","useIsomorphicLayoutEffect","useResizeDetector","targetRef","refreshMode","refreshRate","skipOnMount","_jsxs","Wrapper","Object","assign","ref","_jsx","children","Content","map","link","index","element","href","PreviousLink","weight","underlineStyle","CurrentLabel","forwardedAs","Item","$styleProps","Caret","Slash","inline","fadeColorSet","Array","isArray","left","right","undefined","_Fragment","Fade","$position","$backgroundColor","renderFade"],"mappings":"yhBAkB2BA,QAAAC,MACvBA,EAAKC,UACLA,EAASC,aACTA,EAAe,OAAMC,UACrBA,EAASC,GACTA,EAAEC,eACFA,EAAiB,WAASN,EACvBO,EAAUC,EAAAA,OAAAR,EAPU,wEAYvB,MAAOS,EAAUC,GAAeC,EAAAA,UAAkB,IAC3CC,EAAcC,GAAmBF,EAAAA,UAAkB,IACnDG,EAAeC,GAAoBJ,EAAAA,UAAkB,GACtDK,EACe,SAAjBb,GAA4C,SAAjBA,EACzBc,EACe,UAAjBd,GAA6C,SAAjBA,EAE1Be,EAAaC,EAAAA,OAAuB,MACpCC,EAAaD,EAAAA,OAAyB,MAMtCE,EAAQC,EAAAA,WAAWC,gBACnBC,EAAmBC,EAAAA,cAAc,UAAU,CAAEJ,UAE7CK,EAAWC,EAAAA,UAAS,KACtB,MAAMC,EAAUR,EAAWS,QACrBC,EAAUZ,EAAWW,QAGvBD,GACAE,GACA7B,GACAA,EAAM8B,OAAS,GACfC,OAAOC,YAAcT,IAErBI,EAAQM,WAAaN,EAAQO,YAAcL,EAAQM,YACvD,IAGEC,EAAuBV,EAAAA,UAAS,KAClC,MAAMW,EAAeN,OAAOC,YAAcT,EAC1Cd,EAAY4B,GAEZ,MAAMV,EAAUR,EAAWS,QACrBC,EAAUZ,EAAWW,QAC3B,GAAID,GAAWE,GAAWQ,GAClBV,EAAQO,YAAcL,EAAQM,YAO9B,OALAvB,EAAgBe,EAAQM,YAAc,QACtCnB,EACIa,EAAQO,YAAcP,EAAQM,WAAa,EACvCJ,EAAQM,aAMxBvB,GAAgB,GAChBE,GAAiB,EAAM,IA0B3B,GApBAwB,EAAAA,iBAAiB,SAAUF,GAC3BE,EAAAA,iBAAiB,SAAUF,EAAsBjB,EAAWS,SAE5DW,EAAAA,2BAA0B,KACtBd,IACAW,GAAsB,GACvB,CAACX,EAAUW,IAGdI,oBAAkB,CACdf,WACAgB,UAAWxB,EACXyB,YAAa,WACbC,YAAa,GACbC,aAAa,KAMZ5C,EAAO,OAAO,KAmFnB,OACI6C,EAAAA,KAACC,EAAAA,QAAOC,OAAAC,OAAA,CAACC,IAAKhC,EAAYb,GAAIA,GAAM,cAAkBE,aAClD4C,EAAAA,IAAA,MAAA,CAAA,aAAgB,aAAYC,SACxBD,EAAAA,IAACE,EAAAA,QAAO,CAACH,IAAK9B,WAnFfnB,EAAMqD,KAAI,CAACC,EAAMC,KACpB,IAAIC,EACJ,OAAKF,EAAKH,UAWNK,EAPAD,IAAUvD,EAAM8B,OAAS,GAAMwB,EAAKG,KAQhCP,EAAAA,IAACQ,EAAAA,aAAYX,OAAAC,OAAA,CAAA,EACLM,EAAI,CACRK,OAAO,WACPC,eAAe,UATnBV,EAAAA,IAACW,eAAY,CAACF,OAAO,WAAWG,YAAY,OAAMX,SAC7CG,EAAKH,WAcdN,OAACkB,EAAAA,KAAIhB,OAAAC,OAAA,CAAAgB,YAEY7D,GACRoD,IAAUvD,EAAM8B,OAAS,GAAK,CAC/B,eAAgB,QAClB,CAAAqB,SAAA,CAEDK,EACAD,EAAQvD,EAAM8B,OAAS,IACA,YAAnBzB,EACG6C,EAAAA,IAACe,QAAK,CAAA,eAAA,IAENf,EAAAA,IAACgB,QAAK,CAACC,QAAM,EAAA,eAAA,EAAAhB,SAAA,UAXhBI,IArBF,IAoCA,QA8CV/C,GAzCU,MACf,IAAI4D,EAiBJ,OAbIA,EAFAC,MAAMC,QAAQrE,IAAcA,EAAU6B,OAAS,EAEhC,CACXyC,KAAMtE,EACNuE,MAAOvE,GAEHA,GACO,CACXsE,UAAME,EACND,WAAOC,GAOX5B,EAAAA,KAAA6B,EAAAA,SAAA,CAAAvB,SAAA,CACKxC,GAAgBI,GACbmC,EAAAA,IAACyB,EAAAA,uBACqBP,EAAaG,KAAIK,UACzB,SAGjB/D,GAAiBG,GACdkC,EAAAA,IAACyB,EAAAA,KAAI,CAAAE,iBACiBT,EAAaI,gBACrB,YAGnB,EASUM,MACP"}
+{"version":3,"file":"breadcrumb.js","sources":["../../../src/breadcrumb/breadcrumb.tsx"],"sourcesContent":["import { ChevronRightIcon } from \"@lifesg/react-icons/chevron-right\";\nimport clsx from \"clsx\";\nimport { useRef, useState } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport { parsePxOrRemValue, useApplyStyle, useDesignToken } from \"../theme\";\nimport { Breakpoint } from \"../theme/tokens\";\nimport { Typography } from \"../typography\";\nimport { useEvent, useEventListener, useIsomorphicLayoutEffect } from \"../util\";\nimport * as styles from \"./breadcrumb.styles\";\nimport type { BreadcrumbProps, FadeColorSet } from \"./types\";\n\nexport const Breadcrumb = ({\n    links,\n    fadeColor,\n    fadePosition = \"both\",\n    id,\n    separatorStyle = \"chevron\",\n    className,\n    ...otherProps\n}: BreadcrumbProps) => {\n    // =========================================================================\n    // CONST, STATE, REFS\n    // =========================================================================\n    const [showFade, setShowFade] = useState<boolean>(false);\n    const [showFadeLeft, setShowFadeLeft] = useState<boolean>(false);\n    const [showFadeRight, setShowFadeRight] = useState<boolean>(false);\n    const shouldShowFadeLeft =\n        fadePosition === \"left\" || fadePosition === \"both\";\n    const shouldShowFadeRight =\n        fadePosition === \"right\" || fadePosition === \"both\";\n\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const contentRef = useRef<HTMLUListElement>(null);\n    const fadeLeftRef = useRef<HTMLDivElement>(null);\n    const fadeRightRef = useRef<HTMLDivElement>(null);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n\n    const tabletBreakpointToken = useDesignToken(Breakpoint[\"lg-max\"]);\n    const tabletBreakpoint = parsePxOrRemValue(\n        tabletBreakpointToken || \"1200px\"\n    );\n\n    // =============================================================================\n    // FADE COLOR CALCULATION\n    // =============================================================================\n    let fadeColorSet: FadeColorSet;\n\n    if (Array.isArray(fadeColor) && fadeColor.length > 0) {\n        fadeColorSet = {\n            left: fadeColor,\n            right: fadeColor,\n        };\n    } else if (fadeColor) {\n        fadeColorSet = fadeColor as FadeColorSet;\n    } else {\n        fadeColorSet = {\n            left: undefined,\n            right: undefined,\n        };\n    }\n\n    // =============================================================================\n    // CSS VARIABLES\n    // =============================================================================\n    useApplyStyle(fadeLeftRef, {\n        [styles.tokens.fade.backgroundColor]: fadeColorSet?.left?.join(\", \"),\n    });\n\n    useApplyStyle(fadeRightRef, {\n        [styles.tokens.fade.backgroundColor]: fadeColorSet?.right?.join(\", \"),\n    });\n\n    const onResize = useEvent(() => {\n        const content = contentRef.current;\n        const wrapper = wrapperRef.current;\n\n        if (\n            content &&\n            wrapper &&\n            links &&\n            links.length > 1 &&\n            window.innerWidth <= tabletBreakpoint\n        ) {\n            content.scrollLeft = content.scrollWidth - wrapper.offsetWidth;\n        }\n    });\n\n    const handleShowFadeToggle = useEvent(() => {\n        const nextShowFade = window.innerWidth <= tabletBreakpoint;\n        setShowFade(nextShowFade);\n\n        const content = contentRef.current;\n        const wrapper = wrapperRef.current;\n        if (content && wrapper && nextShowFade) {\n            if (content.scrollWidth > wrapper.offsetWidth) {\n                // set 1px margin of error to handle sub-pixel differences\n                setShowFadeLeft(content.scrollLeft >= 1);\n                setShowFadeRight(\n                    content.scrollWidth - content.scrollLeft - 1 >\n                        wrapper.offsetWidth\n                );\n                return;\n            }\n        }\n\n        setShowFadeLeft(false);\n        setShowFadeRight(false);\n    });\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEventListener(\"resize\", handleShowFadeToggle);\n    useEventListener(\"scroll\", handleShowFadeToggle, contentRef.current);\n\n    useIsomorphicLayoutEffect(() => {\n        onResize();\n        handleShowFadeToggle();\n    }, [onResize, handleShowFadeToggle]);\n\n    // To scroll left when wrapper resizes\n    useResizeDetector({\n        onResize,\n        targetRef: wrapperRef,\n        refreshMode: \"debounce\",\n        refreshRate: 50,\n        skipOnMount: true,\n    });\n\n    // =========================================================================\n    // RENDER\n    // =========================================================================\n    if (!links) return null;\n\n    const renderLinks = () => {\n        return links.map((link, index) => {\n            let element: JSX.Element;\n            if (!link.children) {\n                return null;\n            }\n\n            if (index === links.length - 1 || !link.href) {\n                element = (\n                    <Typography.BodyMD\n                        weight=\"semibold\"\n                        as=\"span\"\n                        className={styles.currentLabel}\n                    >\n                        {link.children}\n                    </Typography.BodyMD>\n                );\n            } else {\n                element = (\n                    <Typography.LinkMD\n                        {...link}\n                        weight=\"semibold\"\n                        underlineStyle=\"none\"\n                        className={styles.previousLink}\n                    />\n                );\n            }\n\n            return (\n                <li\n                    key={index}\n                    className={styles.item}\n                    {...(index === links.length - 1 && {\n                        \"aria-current\": \"page\",\n                    })}\n                >\n                    {element}\n                    {index < links.length - 1 &&\n                        (separatorStyle === \"chevron\" ? (\n                            <ChevronRightIcon\n                                aria-hidden\n                                className={styles.caret}\n                            />\n                        ) : (\n                            <Typography.BodyMD\n                                inline\n                                aria-hidden\n                                className={styles.slash}\n                            >\n                                /\n                            </Typography.BodyMD>\n                        ))}\n                </li>\n            );\n        });\n    };\n\n    const renderFade = () => {\n        return (\n            <>\n                {showFadeLeft && shouldShowFadeLeft && (\n                    <div\n                        ref={fadeLeftRef}\n                        className={clsx(styles.fade, styles.fadeLeft)}\n                    />\n                )}\n                {showFadeRight && shouldShowFadeRight && (\n                    <div\n                        ref={fadeRightRef}\n                        className={clsx(styles.fade, styles.fadeRight)}\n                    />\n                )}\n            </>\n        );\n    };\n\n    return (\n        <div\n            ref={wrapperRef}\n            id={id || \"breadcrumb\"}\n            className={clsx(styles.wrapper, className)}\n            {...otherProps}\n        >\n            <nav aria-label=\"Breadcrumb\">\n                <ul ref={contentRef} className={styles.content}>\n                    {renderLinks()}\n                </ul>\n            </nav>\n            {showFade && renderFade()}\n        </div>\n    );\n};\n"],"names":["_a","links","fadeColor","fadePosition","id","separatorStyle","className","otherProps","__rest","showFade","setShowFade","useState","showFadeLeft","setShowFadeLeft","showFadeRight","setShowFadeRight","shouldShowFadeLeft","shouldShowFadeRight","wrapperRef","useRef","contentRef","fadeLeftRef","fadeRightRef","tabletBreakpointToken","useDesignToken","Breakpoint","tabletBreakpoint","parsePxOrRemValue","fadeColorSet","Array","isArray","length","left","right","undefined","useApplyStyle","styles.tokens","fade","backgroundColor","_b","join","_c","onResize","useEvent","content","current","wrapper","window","innerWidth","scrollLeft","scrollWidth","offsetWidth","handleShowFadeToggle","nextShowFade","useEventListener","useIsomorphicLayoutEffect","useResizeDetector","targetRef","refreshMode","refreshRate","skipOnMount","_jsxs","ref","clsx","styles.wrapper","children","_jsx","styles.content","map","link","index","element","href","Typography","LinkMD","Object","assign","weight","underlineStyle","styles.previousLink","BodyMD","as","styles.currentLabel","styles.item","ChevronRightIcon","styles.caret","inline","styles.slash","_Fragment","styles.fade","styles.fadeLeft","styles.fadeRight"],"mappings":"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"}

package/cjs/breadcrumb/breadcrumb.styles.js

@@ -0,0 +1,2 @@
+"use strict";require("./breadcrumb.styles_1nl4aua.css");exports.caret="co9wmrd",exports.content="c10gatr7",exports.currentLabel="c1mfqdvn",exports.fade="fbyhxo7",exports.fadeLeft="f1xa0lk7",exports.fadeRight="f1oxmxuo",exports.item="ikhkv84",exports.previousLink="pm022dc",exports.slash="spyv6ve",exports.tokens={fade:{backgroundColor:"--fds-internal-breadcrumb-fade-backgroundColor"}},exports.wrapper="wcpniaz";
+//# sourceMappingURL=breadcrumb.styles.js.map

package/cjs/breadcrumb/breadcrumb.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumb.styles.js","sources":["../../../src/breadcrumb/breadcrumb.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, Font, MediaQuery, Spacing } from \"../theme\";\n\nexport const tokens = {\n    fade: {\n        backgroundColor: \"--fds-internal-breadcrumb-fade-backgroundColor\",\n    },\n};\n\n// =============================================================================\n// STYLE CLASSES\n// =============================================================================\nexport const wrapper = css`\n    position: relative;\n    width: 100%;\n    z-index: 1;\n    margin: ${Spacing[\"spacing-32\"]} 0;\n\n    ${MediaQuery.MaxWidth.xl} {\n        margin: ${Spacing[\"spacing-24\"]} 0;\n    }\n\n    ${MediaQuery.MaxWidth.lg} {\n        margin: ${Spacing[\"spacing-16\"]} 0;\n    }\n`;\n\nexport const content = css`\n    display: inline-flex;\n    width: 100%;\n    flex-wrap: wrap;\n    white-space: nowrap;\n    margin-left: calc(${Spacing[\"spacing-8\"]} * -1);\n    font-size: ${Font.Spec[\"body-size-md\"]};\n    overflow-x: scroll;\n    overflow-y: hidden;\n    scrollbar-width: none; /* Firefox */\n    -ms-overflow-style: none; /* IE 10+ */\n    &::-webkit-scrollbar {\n        display: none; /* Chrome/Safari/Webkit */\n    }\n\n    ${MediaQuery.MaxWidth.lg} {\n        flex-wrap: nowrap;\n    }\n`;\n\nexport const fade = css`\n    ${tokens.fade.backgroundColor}: initial;\n    width: ${Spacing[\"spacing-64\"]};\n    height: calc(1lh + ${Spacing[\"spacing-4\"]});\n    position: absolute;\n    top: 50%;\n    transform: translateY(-50%);\n    pointer-events: none;\n`;\n\nexport const fadeLeft = css`\n    ${MediaQuery.MaxWidth.lg} {\n        left: calc(${Spacing[\"spacing-8\"]} * -1);\n        background-image: linear-gradient(\n            to right,\n            var(${tokens.fade.backgroundColor}, ${Colour.bg}),\n            rgba(255, 255, 255, 0.001)\n        );\n    }\n`;\n\nexport const fadeRight = css`\n    ${MediaQuery.MaxWidth.lg} {\n        right: ${Spacing[\"spacing-8\"]};\n        background-image: linear-gradient(\n            to left,\n            var(${tokens.fade.backgroundColor}, ${Colour.bg}),\n            rgba(255, 255, 255, 0.001)\n        );\n    }\n`;\n\nexport const item = css`\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    line-height: inherit;\n    font-size: inherit;\n`;\n\nexport const caret = css`\n    height: 1em;\n    width: 1em;\n    color: ${Colour[\"icon-subtle\"]};\n`;\n\nexport const slash = css`\n    display: inline-block;\n    color: ${Colour[\"text-subtlest\"]};\n`;\n\nexport const currentLabel = css`\n    margin: ${Spacing[\"spacing-8\"]} !important;\n`;\n\nexport const previousLink = css`\n    margin: ${Spacing[\"spacing-8\"]} !important;\n`;\n"],"names":["fade","backgroundColor"],"mappings":"gGAwFkB,0BA5DE,gCAuEK,wBAnDR,2BAUI,6BAWC,wBAWL,+BAuBQ,wBATP,yBA1FI,CAClBA,KAAM,CACFC,gBAAiB,mEAOL"}

package/cjs/breadcrumb/breadcrumb.styles_1nl4aua.css

@@ -0,0 +1,18 @@
+.wcpniaz{position:relative;width:100%;z-index:1;margin:var(--fds-spacing-32) 0;}:where(body.fds-breakpoint-xl-max) .wcpniaz{margin:var(--fds-spacing-24) 0;}:where(body.fds-breakpoint-lg-max) .wcpniaz{margin:var(--fds-spacing-16) 0;}
+.c10gatr7{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:100%;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;white-space:nowrap;margin-left:calc(var(--fds-spacing-8) * -1);font-size:var(--fds-font-body-size-md);overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;}.c10gatr7::-webkit-scrollbar{display:none;}:where(body.fds-breakpoint-lg-max) .c10gatr7{-webkit-box-flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;}
+.fbyhxo7{--fds-internal-breadcrumb-fade-backgroundColor:initial;width:var(--fds-spacing-64);height:calc(1lh + var(--fds-spacing-4));position:absolute;top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);pointer-events:none;}
+:where(body.fds-breakpoint-lg-max) .f1xa0lk7{left:calc(var(--fds-spacing-8) * -1);background-image:linear-gradient(
+            to right,
+            var(--fds-internal-breadcrumb-fade-backgroundColor, var(--fds-colour-bg)),
+            rgba(255, 255, 255, 0.001)
+        );}
+:where(body.fds-breakpoint-lg-max) .f1oxmxuo{right:var(--fds-spacing-8);background-image:linear-gradient(
+            to left,
+            var(--fds-internal-breadcrumb-fade-backgroundColor, var(--fds-colour-bg)),
+            rgba(255, 255, 255, 0.001)
+        );}
+.ikhkv84{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;line-height:inherit;font-size:inherit;}
+.co9wmrd{height:1em;width:1em;color:var(--fds-colour-icon-subtle);}
+.spyv6ve{display:inline-block;color:var(--fds-colour-text-subtlest);}
+.c1mfqdvn{margin:var(--fds-spacing-8)!important;}
+.pm022dc{margin:var(--fds-spacing-8)!important;}

package/cjs/button/button.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),a=require("react/jsx-runtime"),t=require("react"),l=require("./button.style.js"),d=require("./button-helper.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(t);const s=(t,i)=>{const{children:n,disabled:s=!1,loading:r=!1,styleType:o="default",danger:u=!1,focusableWhenDisabled:b=!1,onClick:c}=t,h=e.__rest(t,["children","disabled","loading","styleType","danger","focusableWhenDisabled","onClick"]),f={$buttonStyle:s?"disabled":o,$buttonSizeStyle:"default",$buttonIsDanger:u};return a.jsxs(l.Main,Object.assign({ref:i,"data-testid":h["data-testid"]||"button",disabled:s&&!b,"aria-disabled":s,"aria-busy":r,onClick:s?void 0:c},f,h,{children:[r&&a.jsx(l.Spinner,{$hasChildren:d.hasValidChildren(n)}),a.jsx("span",{children:n})]}))};s.displayName="Button.Default";const r=(t,i)=>{const{children:n,disabled:s=!1,loading:r=!1,styleType:o="default",danger:u=!1,focusableWhenDisabled:b=!1,onClick:c}=t,h=e.__rest(t,["children","disabled","loading","styleType","danger","focusableWhenDisabled","onClick"]),f={$buttonStyle:s?"disabled":o,$buttonSizeStyle:"small",$buttonIsDanger:u};return a.jsxs(l.Main,Object.assign({ref:i,"data-testid":h["data-testid"]||"button",disabled:s&&!b,"aria-disabled":s,"aria-busy":r,onClick:s?void 0:c},f,h,{children:[r&&a.jsx(l.Spinner,{$hasChildren:d.hasValidChildren(n)}),a.jsx("span",{children:n})]}))};r.displayName="Button.Small";const o=(t,i)=>{const{children:n,disabled:s=!1,loading:r=!1,styleType:o="default",danger:u=!1,focusableWhenDisabled:b=!1,onClick:c}=t,h=e.__rest(t,["children","disabled","loading","styleType","danger","focusableWhenDisabled","onClick"]),f={$buttonStyle:s?"disabled":o,$buttonSizeStyle:"large",$buttonIsDanger:u};return a.jsxs(l.Main,Object.assign({ref:i,"data-testid":h["data-testid"]||"button",disabled:s&&!b,"aria-disabled":s,"aria-busy":r,onClick:s?void 0:c},f,h,{children:[r&&a.jsx(l.Spinner,{$hasChildren:d.hasValidChildren(n)}),a.jsx("span",{children:n})]}))};o.displayName="Button.Large";const u={Default:n.default.forwardRef(s),Small:n.default.forwardRef(r),Large:n.default.forwardRef(o)};exports.Button=u;
+"use strict";var e=require("../_virtual/_tslib.js"),a=require("react/jsx-runtime"),n=require("clsx"),i=require("react"),l=require("../shared/component-loading-spinner/component-loading-spinner.js"),t=require("./button.styles.js"),s=require("./button-helper.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=r(n),o=r(i);const u={disabled:{base:t.mainStyleDisabled,danger:t.mainStyleDisabled},default:{base:t.mainStyleDefault,danger:t.mainStyleDefaultDanger},secondary:{base:t.mainStyleSecondary,danger:t.mainStyleSecondaryDanger},light:{base:t.mainStyleLight,danger:t.mainStyleLightDanger},link:{base:t.mainStyleLink,danger:t.mainStyleLinkDanger}},c={default:{base:t.mainSizeDefault,iconOnly:t.mainSizeDefaultIconOnly},small:{base:t.mainSizeSmall,iconOnly:t.mainSizeSmallIconOnly},large:{base:t.mainSizeLarge,iconOnly:t.mainSizeLargeIconOnly}},f=(e,a)=>{var n,i;return a?null===(n=u[e])||void 0===n?void 0:n.danger:null===(i=u[e])||void 0===i?void 0:i.base},m=(e,a)=>{var n,i,l;return a?d.default(null===(n=c[e])||void 0===n?void 0:n.base,null===(i=c[e])||void 0===i?void 0:i.iconOnly):null===(l=c[e])||void 0===l?void 0:l.base},y=(n,i)=>{const{children:r,className:u,disabled:c=!1,loading:y=!1,styleType:b="default",sizeType:g="default",danger:p=!1,focusableWhenDisabled:S=!1,icon:h,iconPosition:v="left",onClick:j}=n,D=e.__rest(n,["children","className","disabled","loading","styleType","sizeType","danger","focusableWhenDisabled","icon","iconPosition","onClick"]),z=s.hasValidChildren(r),O=!!h&&!z,x=c?"disabled":b;return a.jsxs("button",Object.assign({ref:i,"data-testid":D["data-testid"]||"button",disabled:c&&!S,"aria-disabled":c,"aria-busy":y,onClick:c?void 0:j,className:d.default(t.main,h&&"right"===v&&t.mainIconPositionRight,!O&&t.mainHasMinWidth,f(x,p),m(g,O),u)},D,{children:[y?a.jsx(l.ComponentLoadingSpinner,{className:d.default(z&&t.spinnerHasChildren)}):h?o.default.cloneElement(h,{"aria-hidden":!0}):null,z&&a.jsx("span",{children:r})]}))};y.displayName="Button";const b=o.default.forwardRef(y),g=(e,n)=>{var i;return a.jsx(b,Object.assign({},e,{sizeType:null!==(i=e.sizeType)&&void 0!==i?i:"default",ref:n}))};g.displayName="Button.Default";const p=(e,n)=>a.jsx(b,Object.assign({},e,{sizeType:"small",ref:n}));p.displayName="Button.Small";const S=(e,n)=>a.jsx(b,Object.assign({},e,{sizeType:"large",ref:n}));S.displayName="Button.Large";const h=Object.assign(b,{Default:o.default.forwardRef(g),Small:o.default.forwardRef(p),Large:o.default.forwardRef(S)});exports.Button=h;
 //# sourceMappingURL=button.js.map

package/cjs/button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sources":["../../../src/button/button.tsx"],"sourcesContent":["import React from \"react\";\n\nimport type { MainStyleProps } from \"./button.style\";\nimport { Main, Spinner } from \"./button.style\";\nimport { hasValidChildren } from \"./button-helper\";\nimport type { ButtonProps, ButtonRef } from \"./types\";\n\n/**\n * NOTE: Due to the way we intend to customise both components, with forwardRef behaviour\n * we are unable to create a single component and have them share.\n *\n * Will refactor if there is a better way\n */\nconst DefaultComponent = (props: ButtonProps, ref: ButtonRef) => {\n    const {\n        children,\n        disabled = false,\n        loading = false,\n        styleType = \"default\",\n        danger = false,\n        focusableWhenDisabled = false,\n        onClick,\n        ...otherProps\n    } = props;\n\n    const mainStyle: MainStyleProps = {\n        $buttonStyle: disabled ? \"disabled\" : styleType,\n        $buttonSizeStyle: \"default\",\n        $buttonIsDanger: danger,\n    };\n\n    return (\n        <Main\n            ref={ref}\n            data-testid={otherProps[\"data-testid\"] || \"button\"}\n            disabled={disabled && !focusableWhenDisabled}\n            aria-disabled={disabled}\n            aria-busy={loading}\n            onClick={disabled ? undefined : onClick}\n            {...mainStyle}\n            {...otherProps}\n        >\n            {loading && <Spinner $hasChildren={hasValidChildren(children)} />}\n            <span>{children}</span>\n        </Main>\n    );\n};\nDefaultComponent.displayName = \"Button.Default\";\n\nconst SmallComponent = (props: ButtonProps, ref: ButtonRef) => {\n    const {\n        children,\n        disabled = false,\n        loading = false,\n        styleType = \"default\",\n        danger = false,\n        focusableWhenDisabled = false,\n        onClick,\n        ...otherProps\n    } = props;\n\n    const mainStyle: MainStyleProps = {\n        $buttonStyle: disabled ? \"disabled\" : styleType,\n        $buttonSizeStyle: \"small\",\n        $buttonIsDanger: danger,\n    };\n\n    return (\n        <Main\n            ref={ref}\n            data-testid={otherProps[\"data-testid\"] || \"button\"}\n            disabled={disabled && !focusableWhenDisabled}\n            aria-disabled={disabled}\n            aria-busy={loading}\n            onClick={disabled ? undefined : onClick}\n            {...mainStyle}\n            {...otherProps}\n        >\n            {loading && <Spinner $hasChildren={hasValidChildren(children)} />}\n            <span>{children}</span>\n        </Main>\n    );\n};\nSmallComponent.displayName = \"Button.Small\";\n\nconst LargeComponent = (props: ButtonProps, ref: ButtonRef) => {\n    const {\n        children,\n        disabled = false,\n        loading = false,\n        styleType = \"default\",\n        danger = false,\n        focusableWhenDisabled = false,\n        onClick,\n        ...otherProps\n    } = props;\n\n    const mainStyle: MainStyleProps = {\n        $buttonStyle: disabled ? \"disabled\" : styleType,\n        $buttonSizeStyle: \"large\",\n        $buttonIsDanger: danger,\n    };\n\n    return (\n        <Main\n            ref={ref}\n            data-testid={otherProps[\"data-testid\"] || \"button\"}\n            disabled={disabled && !focusableWhenDisabled}\n            aria-disabled={disabled}\n            aria-busy={loading}\n            onClick={disabled ? undefined : onClick}\n            {...mainStyle}\n            {...otherProps}\n        >\n            {loading && <Spinner $hasChildren={hasValidChildren(children)} />}\n            <span>{children}</span>\n        </Main>\n    );\n};\nLargeComponent.displayName = \"Button.Large\";\n\nexport const Button = {\n    Default: React.forwardRef(DefaultComponent),\n    Small: React.forwardRef(SmallComponent),\n    Large: React.forwardRef(LargeComponent),\n};\n"],"names":["DefaultComponent","props","ref","children","disabled","loading","styleType","danger","focusableWhenDisabled","onClick","otherProps","__rest","mainStyle","$buttonStyle","$buttonSizeStyle","$buttonIsDanger","_jsxs","Main","Object","assign","undefined","_jsx","Spinner","$hasChildren","hasValidChildren","displayName","SmallComponent","LargeComponent","Button","Default","React","forwardRef","Small","Large"],"mappings":"wPAaA,MAAMA,EAAmB,CAACC,EAAoBC,KAC1C,MAAMC,SACFA,EAAQC,SACRA,GAAW,EAAKC,QAChBA,GAAU,EAAKC,UACfA,EAAY,UAASC,OACrBA,GAAS,EAAKC,sBACdA,GAAwB,EAAKC,QAC7BA,GAEAR,EADGS,EAAUC,SACbV,EATE,CAAA,WAAA,WAAA,UAAA,YAAA,SAAA,wBAAA,YAWAW,EAA4B,CAC9BC,aAAcT,EAAW,WAAaE,EACtCQ,iBAAkB,UAClBC,gBAAiBR,GAGrB,OACIS,EAAAA,KAACC,OAAIC,OAAAC,OAAA,CACDjB,IAAKA,EAAG,cACKQ,EAAW,gBAAkB,SAC1CN,SAAUA,IAAaI,EAAqB,gBAC7BJ,EAAQ,YACZC,EACXI,QAASL,OAAWgB,EAAYX,GAC5BG,EACAF,EAAU,CAAAP,SAAA,CAEbE,GAAWgB,EAAAA,IAACC,EAAAA,QAAO,CAAAC,aAAeC,EAAAA,iBAAiBrB,KACpDkB,EAAAA,IAAA,OAAA,CAAAlB,SAAOA,OACJ,EAGfH,EAAiByB,YAAc,iBAE/B,MAAMC,EAAiB,CAACzB,EAAoBC,KACxC,MAAMC,SACFA,EAAQC,SACRA,GAAW,EAAKC,QAChBA,GAAU,EAAKC,UACfA,EAAY,UAASC,OACrBA,GAAS,EAAKC,sBACdA,GAAwB,EAAKC,QAC7BA,GAEAR,EADGS,EAAUC,SACbV,EATE,CAAA,WAAA,WAAA,UAAA,YAAA,SAAA,wBAAA,YAWAW,EAA4B,CAC9BC,aAAcT,EAAW,WAAaE,EACtCQ,iBAAkB,QAClBC,gBAAiBR,GAGrB,OACIS,EAAAA,KAACC,OAAIC,OAAAC,OAAA,CACDjB,IAAKA,EAAG,cACKQ,EAAW,gBAAkB,SAC1CN,SAAUA,IAAaI,EAAqB,gBAC7BJ,EAAQ,YACZC,EACXI,QAASL,OAAWgB,EAAYX,GAC5BG,EACAF,EAAU,CAAAP,SAAA,CAEbE,GAAWgB,EAAAA,IAACC,EAAAA,QAAO,CAAAC,aAAeC,EAAAA,iBAAiBrB,KACpDkB,EAAAA,IAAA,OAAA,CAAAlB,SAAOA,OACJ,EAGfuB,EAAeD,YAAc,eAE7B,MAAME,EAAiB,CAAC1B,EAAoBC,KACxC,MAAMC,SACFA,EAAQC,SACRA,GAAW,EAAKC,QAChBA,GAAU,EAAKC,UACfA,EAAY,UAASC,OACrBA,GAAS,EAAKC,sBACdA,GAAwB,EAAKC,QAC7BA,GAEAR,EADGS,EAAUC,SACbV,EATE,CAAA,WAAA,WAAA,UAAA,YAAA,SAAA,wBAAA,YAWAW,EAA4B,CAC9BC,aAAcT,EAAW,WAAaE,EACtCQ,iBAAkB,QAClBC,gBAAiBR,GAGrB,OACIS,EAAAA,KAACC,OAAIC,OAAAC,OAAA,CACDjB,IAAKA,EAAG,cACKQ,EAAW,gBAAkB,SAC1CN,SAAUA,IAAaI,EAAqB,gBAC7BJ,EAAQ,YACZC,EACXI,QAASL,OAAWgB,EAAYX,GAC5BG,EACAF,EAAU,CAAAP,SAAA,CAEbE,GAAWgB,EAAAA,IAACC,EAAAA,QAAO,CAAAC,aAAeC,EAAAA,iBAAiBrB,KACpDkB,EAAAA,IAAA,OAAA,CAAAlB,SAAOA,OACJ,EAGfwB,EAAeF,YAAc,eAEtB,MAAMG,EAAS,CAClBC,QAASC,EAAAA,QAAMC,WAAW/B,GAC1BgC,MAAOF,EAAAA,QAAMC,WAAWL,GACxBO,MAAOH,EAAAA,QAAMC,WAAWJ"}
+{"version":3,"file":"button.js","sources":["../../../src/button/button.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\n\nimport { ComponentLoadingSpinner } from \"../shared/component-loading-spinner\";\nimport * as styles from \"./button.styles\";\nimport { hasValidChildren } from \"./button-helper\";\nimport type { ButtonProps, ButtonRef } from \"./types\";\n\nconst styleClassMap: Record<string, Record<string, string>> = {\n    disabled: {\n        base: styles.mainStyleDisabled,\n        danger: styles.mainStyleDisabled,\n    },\n    default: {\n        base: styles.mainStyleDefault,\n        danger: styles.mainStyleDefaultDanger,\n    },\n    secondary: {\n        base: styles.mainStyleSecondary,\n        danger: styles.mainStyleSecondaryDanger,\n    },\n    light: { base: styles.mainStyleLight, danger: styles.mainStyleLightDanger },\n    link: { base: styles.mainStyleLink, danger: styles.mainStyleLinkDanger },\n};\n\nconst sizeClassMap: Record<string, { base: string; iconOnly: string }> = {\n    default: {\n        base: styles.mainSizeDefault,\n        iconOnly: styles.mainSizeDefaultIconOnly,\n    },\n    small: {\n        base: styles.mainSizeSmall,\n        iconOnly: styles.mainSizeSmallIconOnly,\n    },\n    large: {\n        base: styles.mainSizeLarge,\n        iconOnly: styles.mainSizeLargeIconOnly,\n    },\n};\n\nconst getStyleClass = (effectiveStyle: string, danger: boolean) =>\n    danger\n        ? styleClassMap[effectiveStyle]?.danger\n        : styleClassMap[effectiveStyle]?.base;\n\nconst getSizeClass = (sizeType: string, iconOnly: boolean) =>\n    iconOnly\n        ? clsx(sizeClassMap[sizeType]?.base, sizeClassMap[sizeType]?.iconOnly)\n        : sizeClassMap[sizeType]?.base;\n\nconst Component = (props: ButtonProps, ref: ButtonRef) => {\n    const {\n        children,\n        className,\n        disabled = false,\n        loading = false,\n        styleType = \"default\",\n        sizeType = \"default\",\n        danger = false,\n        focusableWhenDisabled = false,\n        icon,\n        iconPosition = \"left\",\n        onClick,\n        ...otherProps\n    } = props;\n\n    const hasChildren = hasValidChildren(children);\n    const iconOnly = !!icon && !hasChildren;\n    const effectiveStyle = disabled ? \"disabled\" : styleType;\n\n    return (\n        <button\n            ref={ref}\n            data-testid={otherProps[\"data-testid\"] || \"button\"}\n            disabled={disabled && !focusableWhenDisabled}\n            aria-disabled={disabled}\n            aria-busy={loading}\n            onClick={disabled ? undefined : onClick}\n            className={clsx(\n                styles.main,\n                icon &&\n                    iconPosition === \"right\" &&\n                    styles.mainIconPositionRight,\n                !iconOnly && styles.mainHasMinWidth,\n                getStyleClass(effectiveStyle, danger),\n                getSizeClass(sizeType, iconOnly),\n                className\n            )}\n            {...otherProps}\n        >\n            {loading ? (\n                <ComponentLoadingSpinner\n                    className={clsx(hasChildren && styles.spinnerHasChildren)}\n                />\n            ) : icon ? (\n                React.cloneElement(icon, { \"aria-hidden\": true })\n            ) : null}\n            {hasChildren && <span>{children}</span>}\n        </button>\n    );\n};\n\nComponent.displayName = \"Button\";\n\nconst BaseButton = React.forwardRef(Component);\n\nconst DefaultButtonComponent = (props: ButtonProps, ref: ButtonRef) => (\n    <BaseButton {...props} sizeType={props.sizeType ?? \"default\"} ref={ref} />\n);\nDefaultButtonComponent.displayName = \"Button.Default\";\n\nconst SmallButtonComponent = (props: ButtonProps, ref: ButtonRef) => (\n    <BaseButton {...props} sizeType=\"small\" ref={ref} />\n);\nSmallButtonComponent.displayName = \"Button.Small\";\n\nconst LargeButtonComponent = (props: ButtonProps, ref: ButtonRef) => (\n    <BaseButton {...props} sizeType=\"large\" ref={ref} />\n);\nLargeButtonComponent.displayName = \"Button.Large\";\n\nexport const Button = Object.assign(BaseButton, {\n    /** @deprecated Use the `sizeType` prop instead: `<Button>` or `<Button sizeType=\"default\">` */\n    Default: React.forwardRef(DefaultButtonComponent),\n    /** @deprecated Use the `sizeType` prop instead: `<Button sizeType=\"small\">` */\n    Small: React.forwardRef(SmallButtonComponent),\n    /** @deprecated Use the `sizeType` prop instead: `<Button sizeType=\"large\">` */\n    Large: React.forwardRef(LargeButtonComponent),\n});\n"],"names":["styleClassMap","disabled","base","styles.mainStyleDisabled","danger","default","styles.mainStyleDefault","styles.mainStyleDefaultDanger","secondary","styles.mainStyleSecondary","styles.mainStyleSecondaryDanger","light","styles.mainStyleLight","styles.mainStyleLightDanger","link","styles.mainStyleLink","styles.mainStyleLinkDanger","sizeClassMap","styles.mainSizeDefault","iconOnly","styles.mainSizeDefaultIconOnly","small","styles.mainSizeSmall","styles.mainSizeSmallIconOnly","large","styles.mainSizeLarge","styles.mainSizeLargeIconOnly","getStyleClass","effectiveStyle","_a","_b","getSizeClass","sizeType","clsx","_c","Component","props","ref","children","className","loading","styleType","focusableWhenDisabled","icon","iconPosition","onClick","otherProps","hasChildren","hasValidChildren","_jsxs","undefined","styles.main","styles.mainIconPositionRight","styles.mainHasMinWidth","_jsx","ComponentLoadingSpinner","styles.spinnerHasChildren","React","cloneElement","displayName","BaseButton","forwardRef","DefaultButtonComponent","Object","assign","SmallButtonComponent","LargeButtonComponent","Button","Default","Small","Large"],"mappings":"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"}

package/cjs/button/button.styles.js

@@ -0,0 +1,2 @@
+"use strict";require("./button.styles_142m6cx.css");exports.main="mf6do54",exports.mainHasMinWidth="m1en642a",exports.mainIconPositionRight="moaxzdy",exports.mainSizeDefault="m1knftbn",exports.mainSizeDefaultIconOnly="m18n5exw",exports.mainSizeLarge="m1c1mlhm",exports.mainSizeLargeIconOnly="me78sau",exports.mainSizeSmall="m3n7mqo",exports.mainSizeSmallIconOnly="m1ytkx3r",exports.mainStyleDefault="m1jxbf2q",exports.mainStyleDefaultDanger="mharb8i",exports.mainStyleDisabled="mc532iy",exports.mainStyleLight="m8hnmz5",exports.mainStyleLightDanger="m53fwwa",exports.mainStyleLink="m1557ko0",exports.mainStyleLinkDanger="m70z5yw",exports.mainStyleSecondary="mbs4ndg",exports.mainStyleSecondaryDanger="m1taerhv",exports.spinnerHasChildren="s17i3scc";
+//# sourceMappingURL=button.styles.js.map

package/cjs/button/button.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.styles.js","sources":["../../../src/button/button.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport {\n    Border,\n    Colour,\n    Font,\n    MediaQuery,\n    Motion,\n    Radius,\n    Spacing,\n} from \"../theme\";\n\nexport const main = css`\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} transparent;\n    transition: all ${Motion[\"duration-250\"]} ${Motion[\"ease-default\"]};\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: ${Spacing[\"spacing-8\"]} ${Spacing[\"spacing-16\"]};\n    gap: 0.5rem;\n    border-radius: ${Radius.sm};\n\n    svg,\n    img {\n        flex-shrink: 0;\n        height: 1em;\n        width: 1em;\n    }\n`;\n\nexport const mainIconPositionRight = css`\n    flex-direction: row-reverse;\n`;\n\nexport const mainHasMinWidth = css`\n    min-width: 4rem;\n`;\n\n// -------------------------------------------------------------------------\n// BUTTON STYLE + TEXT COLOR\n// -------------------------------------------------------------------------\nexport const mainStyleDefault = css`\n    background-color: ${Colour[\"bg-primary\"]};\n    color: ${Colour[\"text-inverse\"]};\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: ${Colour[\"bg-primary-hover\"]};\n        }\n    }\n`;\n\nexport const mainStyleDefaultDanger = css`\n    background-color: ${Colour[\"bg-error-strong\"]};\n    color: ${Colour[\"text-inverse\"]};\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: ${Colour[\"bg-error-strong-hover\"]};\n        }\n    }\n`;\n\nexport const mainStyleSecondary = css`\n    background-color: ${Colour.bg};\n    border-color: ${Colour[\"border-primary\"]};\n    color: ${Colour[\"text-primary\"]};\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: ${Colour[\"bg-hover-neutral\"]};\n        }\n    }\n`;\n\nexport const mainStyleSecondaryDanger = css`\n    background-color: ${Colour.bg};\n    border-color: ${Colour[\"border-error-strong\"]};\n    color: ${Colour[\"text-error\"]};\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: ${Colour[\"bg-hover-neutral\"]};\n        }\n    }\n`;\n\nexport const mainStyleLight = css`\n    background-color: ${Colour.bg};\n    border-color: ${Colour.border};\n    color: ${Colour[\"text-primary\"]};\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: ${Colour[\"bg-hover-neutral\"]};\n        }\n    }\n`;\n\nexport const mainStyleLightDanger = css`\n    background-color: ${Colour.bg};\n    border-color: ${Colour.border};\n    color: ${Colour[\"text-error\"]};\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: ${Colour[\"bg-hover-neutral\"]};\n        }\n    }\n`;\n\nexport const mainStyleLink = css`\n    background-color: transparent;\n    color: ${Colour[\"text-primary\"]};\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: ${Colour[\"bg-hover-neutral\"]};\n        }\n    }\n`;\n\nexport const mainStyleLinkDanger = css`\n    background-color: transparent;\n    color: ${Colour[\"text-error\"]};\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: ${Colour[\"bg-hover-neutral\"]};\n        }\n    }\n`;\n\nexport const mainStyleDisabled = css`\n    background-color: ${Colour[\"bg-disabled\"]};\n    cursor: not-allowed;\n    color: ${Colour[\"text-disabled\"]};\n    &:hover {\n        box-shadow: none;\n    }\n`;\n\n// -------------------------------------------------------------------------\n// BUTTON SIZE\n// -------------------------------------------------------------------------\nexport const mainSizeDefault = css`\n    height: 3rem;\n    ${Font[\"heading-xs-semibold\"]}\n    ${MediaQuery.MaxWidth.xxs} {\n        height: auto;\n    }\n`;\n\nexport const mainSizeDefaultIconOnly = css`\n    height: 3rem;\n    width: 3rem;\n`;\n\nexport const mainSizeSmall = css`\n    height: 2.5rem;\n    ${Font[\"body-md-semibold\"]}\n    ${MediaQuery.MaxWidth.xxs} {\n        height: auto;\n    }\n`;\n\nexport const mainSizeSmallIconOnly = css`\n    height: 2.5rem;\n    width: 2.5rem;\n`;\n\nexport const mainSizeLarge = css`\n    height: 4rem;\n    ${Font[\"heading-md-semibold\"]}\n    ${MediaQuery.MaxWidth.xxs} {\n        height: auto;\n    }\n`;\n\nexport const mainSizeLargeIconOnly = css`\n    height: 4rem;\n    width: 4rem;\n`;\n\nexport const spinnerHasChildren = css`\n    margin-right: 0.5rem;\n`;\n"],"names":[],"mappings":"uFAYiB,kCAuBW,yCAJM,kCAmHN,2CAQQ,iCAkBV,yCAQQ,gCArBR,wCAQQ,oCA7HL,0CAWM,oCAiFL,iCA9CH,uCAYM,gCAYP,uCAWM,qCA3DD,2CAYM,sCA6GN"}

package/cjs/button/button.styles_142m6cx.css

@@ -0,0 +1,19 @@
+.mf6do54{border:var(--fds-border-width-010) var(--fds-border-style-solid) transparent;-webkit-transition:all var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);transition:all var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);cursor:pointer;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;padding:var(--fds-spacing-8) var(--fds-spacing-16);gap:0.5rem;border-radius:var(--fds-radius-sm);}.mf6do54 svg,.mf6do54 img{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;height:1em;width:1em;}
+.moaxzdy{-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;}
+.m1en642a{min-width:4rem;}
+.m1jxbf2q{background-color:var(--fds-colour-bg-primary);color:var(--fds-colour-text-inverse);}@media (pointer: fine){.m1jxbf2q:hover,.m1jxbf2q:active{background-color:var(--fds-colour-bg-primary-hover);}}
+.mharb8i{background-color:var(--fds-colour-bg-error-strong);color:var(--fds-colour-text-inverse);}@media (pointer: fine){.mharb8i:hover,.mharb8i:active{background-color:var(--fds-colour-bg-error-strong-hover);}}
+.mbs4ndg{background-color:var(--fds-colour-bg);border-color:var(--fds-colour-border-primary);color:var(--fds-colour-text-primary);}@media (pointer: fine){.mbs4ndg:hover,.mbs4ndg:active{background-color:var(--fds-colour-bg-hover-neutral);}}
+.m1taerhv{background-color:var(--fds-colour-bg);border-color:var(--fds-colour-border-error-strong);color:var(--fds-colour-text-error);}@media (pointer: fine){.m1taerhv:hover,.m1taerhv:active{background-color:var(--fds-colour-bg-hover-neutral);}}
+.m8hnmz5{background-color:var(--fds-colour-bg);border-color:var(--fds-colour-border);color:var(--fds-colour-text-primary);}@media (pointer: fine){.m8hnmz5:hover,.m8hnmz5:active{background-color:var(--fds-colour-bg-hover-neutral);}}
+.m53fwwa{background-color:var(--fds-colour-bg);border-color:var(--fds-colour-border);color:var(--fds-colour-text-error);}@media (pointer: fine){.m53fwwa:hover,.m53fwwa:active{background-color:var(--fds-colour-bg-hover-neutral);}}
+.m1557ko0{background-color:transparent;color:var(--fds-colour-text-primary);}@media (pointer: fine){.m1557ko0:hover,.m1557ko0:active{background-color:var(--fds-colour-bg-hover-neutral);}}
+.m70z5yw{background-color:transparent;color:var(--fds-colour-text-error);}@media (pointer: fine){.m70z5yw:hover,.m70z5yw:active{background-color:var(--fds-colour-bg-hover-neutral);}}
+.mc532iy{background-color:var(--fds-colour-bg-disabled);cursor:not-allowed;color:var(--fds-colour-text-disabled);}.mc532iy:hover{box-shadow:none;}
+.m1knftbn{height:3rem;font-family:var(--fds-font-family);font-variant:var(--fds-font-variant);font-size:var(--fds-font-heading-size-xs);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-heading-lh-xs);letter-spacing:var(--fds-font-heading-ls-xs);}:where(body.fds-breakpoint-xxs-max) .m1knftbn{height:auto;}
+.m18n5exw{height:3rem;width:3rem;}
+.m3n7mqo{height:2.5rem;font-family:var(--fds-font-family);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);}:where(body.fds-breakpoint-xxs-max) .m3n7mqo{height:auto;}
+.m1ytkx3r{height:2.5rem;width:2.5rem;}
+.m1c1mlhm{height:4rem;font-family:var(--fds-font-family);font-variant:var(--fds-font-variant);font-size:var(--fds-font-heading-size-md);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-heading-lh-md);letter-spacing:var(--fds-font-heading-ls-md);}:where(body.fds-breakpoint-xxs-max) .m1c1mlhm{height:auto;}
+.me78sau{height:4rem;width:4rem;}
+.s17i3scc{margin-right:0.5rem;}

package/cjs/calendar/calendar.js

@@ -1,15 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),a=require("react"),n=require("styled-components");require("../shared/internal-calendar/calendar-dropdown.js");var t=require("../shared/internal-calendar/internal-calendar.js"),s=require("../v3_theme/index.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const l=i(n).default.div`
-    --vertical-inset: ${s.V3_Spacing["spacing-24"]};
-    --horizontal-inset: ${s.V3_Spacing["spacing-32"]};
-    --header-bottom-spacing: ${s.V3_Spacing["spacing-8"]};
-
-    width: 41rem;
-
-    ${e=>{if(e.$hasBorder)return n.css`
-                border: ${s.V3_Border["width-010"]} ${s.V3_Border.solid}
-                    ${s.V3_Colour.border};
-                border-radius: ${s.V3_Radius.lg};
-                overflow: hidden;
-            `}}
-`;exports.Calendar=n=>{var{className:s,styleType:i="bordered",value:d,onSelect:o}=n,c=e.__rest(n,["className","styleType","value","onSelect"]);const[u,p]=a.useState(d);return a.useEffect((()=>{p(d)}),[d]),r.jsx(l,{className:s,$hasBorder:"bordered"===i,children:r.jsx(t.InternalCalendar,Object.assign({value:u,initialCalendarDate:u,isFocusable:!0,onSelect:e=>{p(e),null==o||o(e)}},c))})};
+"use strict";var e=require("react/jsx-runtime"),a=require("clsx"),l=require("react");require("../shared/internal-calendar/calendar-dropdown.js");var r=require("../shared/internal-calendar/internal-calendar.js"),n=require("./calendar.styles.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=t(a);exports.Calendar=a=>{const{className:t,styleType:d="bordered",variant:o,id:s,minDate:c,maxDate:v,disabledDates:u,allowDisabledSelection:h,showActiveMonthDaysOnly:m,onHover:D,onYearMonthDisplayChange:b,"data-testid":p}=a,y="multi"===a.variant,x=y?void 0:a.value,S=y?a.values:void 0,C=y?a.minSelectable:void 0,f=y?a.maxSelectable:void 0,[j,w]=l.useState((()=>void 0!==S?S:void 0!==x?[x]:[]));l.useEffect((()=>{w(void 0===S?void 0===x?[]:[x]:S)}),[x,S]);return e.jsx("div",{className:i.default(n.wrapper,"bordered"===d&&n.wrapperBordered,t),id:s,"data-testid":p,children:e.jsx(r.InternalCalendar,{value:j[0],values:j,initialCalendarDate:j[0],isFocusable:!0,variant:o,minDate:c,maxDate:v,disabledDates:u,allowDisabledSelection:h,showActiveMonthDaysOnly:m,onHover:D,onYearMonthDisplayChange:b,onSelect:e=>{var l,r;w([e]),"multi"!==a.variant&&(null===(l=a.onChange)||void 0===l||l.call(a,e),null===(r=a.onSelect)||void 0===r||r.call(a,e))},onChange:e=>{var l;w(e),"multi"===a.variant&&(null===(l=a.onChange)||void 0===l||l.call(a,e))},minSelectable:C,maxSelectable:f})})};
 //# sourceMappingURL=calendar.js.map

package/cjs/calendar/calendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.js","sources":["../../../src/calendar/calendar.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport styled, { css } from \"styled-components\";\n\nimport { InternalCalendar } from \"../shared/internal-calendar\";\nimport { V3_Border, V3_Colour, V3_Radius, V3_Spacing } from \"../v3_theme\";\nimport type { CalendarProps } from \"./types\";\n\nexport const Calendar = ({\n    className,\n    styleType = \"bordered\",\n    value,\n    onSelect,\n    ...otherProps\n}: CalendarProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const [selectedDate, setSelectedDate] = useState<string | undefined>(value); // YYYY-MM-DD\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        setSelectedDate(value);\n    }, [value]);\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n    return (\n        <Wrapper className={className} $hasBorder={styleType === \"bordered\"}>\n            <InternalCalendar\n                value={selectedDate}\n                initialCalendarDate={selectedDate}\n                isFocusable={true}\n                onSelect={(value) => {\n                    setSelectedDate(value);\n                    onSelect?.(value);\n                }}\n                {...otherProps}\n            />\n        </Wrapper>\n    );\n};\n\n// =============================================================================\n// STYLE INTERFACE\n// =============================================================================\ninterface StyleProps {\n    $hasBorder?: boolean;\n}\n\n// =============================================================================\n// STYLING\n// =============================================================================\nconst Wrapper = styled.div<StyleProps>`\n    --vertical-inset: ${V3_Spacing[\"spacing-24\"]};\n    --horizontal-inset: ${V3_Spacing[\"spacing-32\"]};\n    --header-bottom-spacing: ${V3_Spacing[\"spacing-8\"]};\n\n    width: 41rem;\n\n    ${(props) => {\n        if (props.$hasBorder) {\n            return css`\n                border: ${V3_Border[\"width-010\"]} ${V3_Border.solid}\n                    ${V3_Colour.border};\n                border-radius: ${V3_Radius[\"lg\"]};\n                overflow: hidden;\n            `;\n        }\n    }}\n`;\n"],"names":["Wrapper","styled","div","V3_Spacing","props","$hasBorder","css","V3_Border","solid","V3_Colour","border","V3_Radius","_a","className","styleType","value","onSelect","otherProps","__rest","selectedDate","setSelectedDate","useState","useEffect","_jsx","children","InternalCalendar","Object","assign","initialCalendarDate","isFocusable"],"mappings":"6WAOO,MAgDDA,OAAUC,QAAOC,GAAe;wBACdC,EAAAA,WAAW;0BACTA,EAAAA,WAAW;+BACNA,EAAAA,WAAW;;;;MAInCC,IACC,GAAIA,EAAMC,WACN,OAAOC,KAAG;0BACIC,EAAAA,UAAU,gBAAgBA,EAAAA,UAAUC;sBACxCC,EAAAA,UAAUC;iCACCC,EAAAA,UAAc;;aAGvC;mBA/DiBC,IAAA,IAAAC,UACrBA,EAASC,UACTA,EAAY,WAAUC,MACtBA,EAAKC,SACLA,GAAQJ,EACLK,EAAUC,EAAAA,OAAAN,EALQ,8CAUrB,MAAOO,EAAcC,GAAmBC,EAAAA,SAA6BN,GAYrE,OAPAO,EAAAA,WAAU,KACNF,EAAgBL,EAAM,GACvB,CAACA,IAMAQ,EAAAA,IAACvB,EAAO,CAACa,UAAWA,EAASR,WAA4B,aAAdS,EAAwBU,SAC/DD,MAACE,EAAAA,iBAAgBC,OAAAC,OAAA,CACbZ,MAAOI,EACPS,oBAAqBT,EACrBU,aAAa,EACbb,SAAWD,IACPK,EAAgBL,GAChBC,SAAAA,EAAWD,EAAM,GAEjBE,KAEF"}
+{"version":3,"file":"calendar.js","sources":["../../../src/calendar/calendar.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useEffect, useState } from \"react\";\n\nimport { InternalCalendar } from \"../shared/internal-calendar\";\nimport * as styles from \"./calendar.styles\";\nimport type { CalendarProps } from \"./types\";\n\nexport const Calendar = (props: CalendarProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const {\n        className,\n        styleType = \"bordered\",\n        variant,\n        id,\n        minDate,\n        maxDate,\n        disabledDates,\n        allowDisabledSelection,\n        showActiveMonthDaysOnly,\n        onHover,\n        onYearMonthDisplayChange,\n        \"data-testid\": dataTestId,\n    } = props;\n\n    const isMultiVariant = props.variant === \"multi\";\n    const controlledValue = isMultiVariant ? undefined : props.value;\n    const controlledValues = isMultiVariant ? props.values : undefined;\n    const minSelectable = isMultiVariant ? props.minSelectable : undefined;\n    const maxSelectable = isMultiVariant ? props.maxSelectable : undefined;\n\n    const resolveValues = (): string[] => {\n        if (controlledValues !== undefined) return controlledValues;\n        if (controlledValue !== undefined) return [controlledValue];\n        return [];\n    };\n\n    const [selectedValues, setSelectedValues] =\n        useState<string[]>(resolveValues);\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        if (controlledValues !== undefined) {\n            setSelectedValues(controlledValues);\n            return;\n        }\n\n        if (controlledValue !== undefined) {\n            setSelectedValues([controlledValue]);\n            return;\n        }\n\n        setSelectedValues([]);\n    }, [controlledValue, controlledValues]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleSelect = (date: string) => {\n        setSelectedValues([date]);\n        if (props.variant === \"multi\") {\n            return;\n        }\n\n        props.onChange?.(date);\n        props.onSelect?.(date);\n    };\n\n    const handleMultiSelect = (nextValues: string[]) => {\n        setSelectedValues(nextValues);\n        if (props.variant === \"multi\") {\n            props.onChange?.(nextValues);\n        }\n    };\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n    return (\n        <div\n            className={clsx(\n                styles.wrapper,\n                styleType === \"bordered\" && styles.wrapperBordered,\n                className\n            )}\n            id={id}\n            data-testid={dataTestId}\n        >\n            <InternalCalendar\n                value={selectedValues[0]}\n                values={selectedValues}\n                initialCalendarDate={selectedValues[0]}\n                isFocusable={true}\n                variant={variant}\n                minDate={minDate}\n                maxDate={maxDate}\n                disabledDates={disabledDates}\n                allowDisabledSelection={allowDisabledSelection}\n                showActiveMonthDaysOnly={showActiveMonthDaysOnly}\n                onHover={onHover}\n                onYearMonthDisplayChange={onYearMonthDisplayChange}\n                onSelect={handleSelect}\n                onChange={handleMultiSelect}\n                minSelectable={minSelectable}\n                maxSelectable={maxSelectable}\n            />\n        </div>\n    );\n};\n"],"names":["props","className","styleType","variant","id","minDate","maxDate","disabledDates","allowDisabledSelection","showActiveMonthDaysOnly","onHover","onYearMonthDisplayChange","dataTestId","isMultiVariant","controlledValue","undefined","value","controlledValues","values","minSelectable","maxSelectable","selectedValues","setSelectedValues","useState","useEffect","_jsx","clsx","styles.wrapper","styles.wrapperBordered","children","InternalCalendar","initialCalendarDate","isFocusable","onSelect","date","_a","onChange","call","_b","nextValues"],"mappings":"yVAOyBA,IAIrB,MAAMC,UACFA,EAASC,UACTA,EAAY,WAAUC,QACtBA,EAAOC,GACPA,EAAEC,QACFA,EAAOC,QACPA,EAAOC,cACPA,EAAaC,uBACbA,EAAsBC,wBACtBA,EAAuBC,QACvBA,EAAOC,yBACPA,EACA,cAAeC,GACfZ,EAEEa,EAAmC,UAAlBb,EAAMG,QACvBW,EAAkBD,OAAiBE,EAAYf,EAAMgB,MACrDC,EAAmBJ,EAAiBb,EAAMkB,YAASH,EACnDI,EAAgBN,EAAiBb,EAAMmB,mBAAgBJ,EACvDK,EAAgBP,EAAiBb,EAAMoB,mBAAgBL,GAQtDM,EAAgBC,GACnBC,EAAAA,UAPkB,SACOR,IAArBE,EAAuCA,OACnBF,IAApBD,EAAsC,CAACA,GACpC,KASXU,EAAAA,WAAU,KAWNF,OAVyBP,IAArBE,OAKoBF,IAApBD,EAKc,GAJI,CAACA,GALDG,EASD,GACtB,CAACH,EAAiBG,IAyBrB,OACIQ,EAAAA,WACIxB,UAAWyB,EAAAA,QACPC,EAAAA,QACc,aAAdzB,GAA4B0B,EAAAA,gBAC5B3B,GAEJG,GAAIA,gBACSQ,EAAUiB,SAEvBJ,EAAAA,IAACK,mBAAgB,CACbd,MAAOK,EAAe,GACtBH,OAAQG,EACRU,oBAAqBV,EAAe,GACpCW,aAAa,EACb7B,QAASA,EACTE,QAASA,EACTC,QAASA,EACTC,cAAeA,EACfC,uBAAwBA,EACxBC,wBAAyBA,EACzBC,QAASA,EACTC,yBAA0BA,EAC1BsB,SA3CUC,YAClBZ,EAAkB,CAACY,IACG,UAAlBlC,EAAMG,UAII,QAAdgC,EAAAnC,EAAMoC,gBAAQ,IAAAD,GAAAA,EAAAE,KAAArC,EAAGkC,GACH,QAAdI,EAAAtC,EAAMiC,gBAAQ,IAAAK,GAAAA,EAAAD,KAAArC,EAAGkC,GAAK,EAqCdE,SAlCeG,UACvBjB,EAAkBiB,GACI,UAAlBvC,EAAMG,UACQ,QAAdgC,EAAAnC,EAAMoC,gBAAQ,IAAAD,GAAAA,EAAAE,KAAArC,EAAGuC,GACrB,EA+BQpB,cAAeA,EACfC,cAAeA,KAEjB"}

package/cjs/calendar/calendar.styles.js

@@ -0,0 +1,2 @@
+"use strict";require("./calendar.styles_11ho5x8.css");exports.wrapper="wavc298",exports.wrapperBordered="w1incl4u";
+//# sourceMappingURL=calendar.styles.js.map

package/cjs/calendar/calendar.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.styles.js","sources":["../../../src/calendar/calendar.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport * as calendarDropdownStyles from \"../shared/internal-calendar/calendar-dropdown.styles\";\nimport { Border, Colour, Radius, Spacing } from \"../theme\";\n\nexport const wrapper = css`\n    ${calendarDropdownStyles.tokens.verticalInset}: ${Spacing[\"spacing-24\"]};\n    ${calendarDropdownStyles.tokens.horizontalInset}: ${Spacing[\"spacing-32\"]};\n    ${calendarDropdownStyles.tokens.headerBottomSpacing}: ${Spacing[\n        \"spacing-8\"\n    ]};\n\n    width: 41rem;\n`;\n\nexport const wrapperBordered = css`\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${Colour[\"border\"]};\n    border-radius: ${Radius[\"lg\"]};\n    overflow: hidden;\n`;\n"],"names":[],"mappings":"8FAKoB,kCAUQ"}

package/cjs/calendar/calendar.styles_11ho5x8.css

@@ -0,0 +1,2 @@
+.wavc298{--fds-internal-calendarDropdown-verticalInset:var(--fds-spacing-24);--fds-internal-calendarDropdown-horizontalInset:var(--fds-spacing-32);--fds-internal-calendarDropdown-headerBottomSpacing:var(--fds-spacing-8);width:41rem;}
+.w1incl4u{border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-radius:var(--fds-radius-lg);overflow:hidden;}

package/cjs/card/card.js

@@ -1,2 +1,2 @@
-"use strict";var r=require("../_virtual/_tslib.js"),e=require("react/jsx-runtime"),t=require("../typography/index.js"),s=require("./card.style.js");exports.Card=i=>{var{children:a}=i,d=r.__rest(i,["children"]);const c=d["data-testid"]||"card";return e.jsx(s.StyledCard,Object.assign({},d,{"data-testid":c,children:"string"==typeof a?e.jsx(t.Typography.BodyBL,{children:a}):a}))};
+"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),t=require("clsx"),a=require("react"),s=require("../theme/theme-provider/context.js"),d=require("../typography/index.js"),i=require("./card.styles.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=c(t);exports.Card=t=>{var{children:c,className:u,"data-testid":o="card"}=t,l=e.__rest(t,["children","className","data-testid"]);const h=a.useContext(s.ThemeContext),j="dark"===(null==h?void 0:h.mode);return r.jsx("div",Object.assign({},l,{"data-testid":o,className:n.default(i.card,j?i.cardDarkMode:i.cardLightMode,u),children:"string"==typeof c?r.jsx(d.Typography.BodyBL,{children:c}):c}))};
 //# sourceMappingURL=card.js.map

package/cjs/card/card.js.map

@@ -1 +1 @@
-{"version":3,"file":"card.js","sources":["../../../src/card/card.tsx"],"sourcesContent":["import { Typography } from \"../typography\";\nimport { StyledCard } from \"./card.style\";\nimport type { CardProps } from \"./types\";\n\nexport const Card = ({ children, ...otherProps }: CardProps): JSX.Element => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const testId = otherProps[\"data-testid\"] || \"card\";\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderContent = () =>\n        typeof children === \"string\" ? (\n            <Typography.BodyBL>{children}</Typography.BodyBL>\n        ) : (\n            children\n        );\n\n    return (\n        <StyledCard {...otherProps} data-testid={testId}>\n            {renderContent()}\n        </StyledCard>\n    );\n};\n"],"names":["_a","children","otherProps","__rest","testId","_jsx","StyledCard","Object","assign","Typography","BodyBL"],"mappings":"iKAIqBA,IAAA,IAAAC,SAAEA,GAAQD,EAAKE,EAAUC,EAAAA,OAAAH,EAAzB,cAIjB,MAAMI,EAASF,EAAW,gBAAkB,OAY5C,OACIG,EAAAA,IAACC,EAAAA,WAAUC,OAAAC,OAAA,CAAA,EAAKN,EAAU,CAAA,cAAeE,EAAMH,SAP3B,iBAAbA,EACHI,EAAAA,IAACI,aAAWC,OAAM,CAAAT,SAAEA,IAA6B,IAQxC"}
+{"version":3,"file":"card.js","sources":["../../../src/card/card.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useContext } from \"react\";\n\nimport { ThemeContext } from \"../theme/theme-provider/context\";\nimport { Typography } from \"../typography\";\nimport * as styles from \"./card.styles\";\nimport type { CardProps } from \"./types\";\n\nexport const Card = ({\n    children,\n    className,\n    \"data-testid\": dataTestId = \"card\",\n    ...otherProps\n}: CardProps): JSX.Element => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const theme = useContext(ThemeContext);\n    const isDarkMode = theme?.mode === \"dark\";\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderContent = () =>\n        typeof children === \"string\" ? (\n            <Typography.BodyBL>{children}</Typography.BodyBL>\n        ) : (\n            children\n        );\n\n    return (\n        <div\n            {...otherProps}\n            data-testid={dataTestId}\n            className={clsx(\n                styles.card,\n                isDarkMode ? styles.cardDarkMode : styles.cardLightMode,\n                className\n            )}\n        >\n            {renderContent()}\n        </div>\n    );\n};\n"],"names":["_a","children","className","dataTestId","otherProps","__rest","theme","useContext","ThemeContext","isDarkMode","mode","_jsx","Object","assign","clsx","styles.card","styles.cardDarkMode","styles.cardLightMode","Typography","BodyBL"],"mappings":"0UAQqBA,IAAA,IAAAC,SACjBA,EAAQC,UACRA,EACA,cAAeC,EAAa,QAAMH,EAC/BI,EAAUC,EAAAA,OAAAL,EAJI,wCASjB,MAAMM,EAAQC,EAAAA,WAAWC,gBACnBC,EAA6B,UAAhBH,aAAK,EAALA,EAAOI,MAY1B,OACIC,EAAAA,IAAA,MAAAC,OAAAC,OAAA,CAAA,EACQT,EAAU,CAAA,cACDD,EACbD,UAAWY,EAAAA,QACPC,EAAAA,KACAN,EAAaO,EAAAA,aAAsBC,EAAAA,cACnCf,GACHD,SAde,iBAAbA,EACHU,EAAAA,IAACO,aAAWC,OAAM,CAAAlB,SAAEA,IAA6B,IAgB/C"}

package/cjs/card/card.styles.js

@@ -0,0 +1,2 @@
+"use strict";require("./card.styles_1gh9gs3.css");exports.card="c13vbbsi",exports.cardDarkMode="c10ivu5q",exports.cardLightMode="c13s9i3s";
+//# sourceMappingURL=card.styles.js.map

package/cjs/card/card.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.styles.js","sources":["../../../src/card/card.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Radius, Shadow, Spacing } from \"../theme\";\n\nexport const card = css`\n    border-radius: ${Radius[\"md\"]};\n    background: ${Colour.bg};\n    padding: ${Spacing[\"spacing-16\"]} ${Spacing[\"spacing-32\"]};\n`;\n\nexport const cardDarkMode = css`\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${Colour[\"border\"]};\n`;\n\nexport const cardLightMode = css`\n    box-shadow: ${Shadow[\"md-subtle\"]};\n`;\n"],"names":[],"mappings":"mFAIiB,gCAMQ,iCAIC"}

package/cjs/card/card.styles_1gh9gs3.css

@@ -0,0 +1,3 @@
+.c13vbbsi{border-radius:var(--fds-radius-md);background:var(--fds-colour-bg);padding:var(--fds-spacing-16) var(--fds-spacing-32);}
+.c10ivu5q{border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}
+.c13s9i3s{box-shadow:var(--fds-shadow-md-subtle);}

package/cjs/checkbox/checkbox.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),d=require("react/jsx-runtime"),t=require("react"),a=require("./checkbox.style.js");exports.Checkbox=i=>{var{className:c,checked:s,disabled:r,indeterminate:n,displaySize:l="default",id:h}=i,b=e.__rest(i,["className","checked","disabled","indeterminate","displaySize","id"]);const u=t.useRef(null);t.useEffect((()=>{u.current&&(u.current.indeterminate=null!=n&&n)}),[n]);return d.jsxs(a.Container,{className:c,"data-testid":"checkbox",$displaySize:l,children:[d.jsx(a.Input,Object.assign({id:h,"data-testid":"checkbox-input",type:"checkbox",checked:s,ref:u,tabIndex:r?-1:0,disabled:r,"aria-checked":n?"mixed":s},b)),n?d.jsx(a.StyledInteremediateIcon,{$disabled:r,"data-testid":"indeterminate","aria-hidden":!0}):s?d.jsx(a.StyledCheckedIcon,{$disabled:r,"data-testid":"checkmark","aria-hidden":!0}):r?d.jsx(a.StyledUncheckedDisabledIcon,{"data-testid":"empty-disabled-checkbox","aria-hidden":!0}):d.jsx(a.StyledUncheckedIcon,{$disabled:r,"data-testid":"empty-checkbox","aria-hidden":!0})]})};
+"use strict";var e=require("../_virtual/_tslib.js"),a=require("react/jsx-runtime"),i=require("@lifesg/react-icons"),t=require("clsx"),c=require("react"),d=require("./checkbox.styles.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=s(t);exports.Checkbox=t=>{var{className:s,checked:l,disabled:r,focusableWhenDisabled:u,indeterminate:o,displaySize:b="default",onChange:h,id:x,tabIndex:f}=t,m=e.__rest(t,["className","checked","disabled","focusableWhenDisabled","indeterminate","displaySize","onChange","id","tabIndex"]);const k=c.useRef(null),p=!!r&&!!u,j=!!r&&!u;c.useEffect((()=>{k.current&&(k.current.indeterminate=null!=o&&o)}),[o]);return a.jsxs("div",{className:n.default(d.container,"small"===b&&d.containerSmall,s),"data-testid":"checkbox",children:[a.jsx("input",Object.assign({id:x,className:n.default(d.input,!r&&d.inputActive,r&&d.inputDisabledVisual),"data-testid":"checkbox-input",type:"checkbox",checked:l,ref:k,tabIndex:p?0:f,disabled:j,"aria-disabled":p,"aria-checked":o?"mixed":l,onChange:e=>{r?e.preventDefault():null==h||h(e)}},m)),o?a.jsx(i.MinusSquareFillIcon,{className:n.default(d.icon,d.selectedIcon,r&&d.iconDisabled),"data-testid":"indeterminate","aria-hidden":!0}):l?a.jsx(i.SquareTickFillIcon,{className:n.default(d.icon,d.selectedIcon,r&&d.iconDisabled),"data-testid":"checkmark","aria-hidden":!0}):r?a.jsx(i.SquareFillIcon,{className:n.default(d.icon,d.iconDisabled),"data-testid":"empty-disabled-checkbox","aria-hidden":!0}):a.jsx(i.SquareIcon,{className:n.default(d.icon,d.uncheckedIcon),"data-testid":"empty-checkbox","aria-hidden":!0})]})};
 //# sourceMappingURL=checkbox.js.map

package/cjs/checkbox/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.js","sources":["../../../src/checkbox/checkbox.tsx"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\nimport {\n    Container,\n    Input,\n    StyledCheckedIcon,\n    StyledInteremediateIcon,\n    StyledUncheckedDisabledIcon,\n    StyledUncheckedIcon,\n} from \"./checkbox.style\";\nimport type { CheckboxProps } from \"./types\";\n\nexport const Checkbox = ({\n    className,\n    checked,\n    disabled,\n    indeterminate,\n    displaySize = \"default\",\n    id,\n    ...otherProps\n}: CheckboxProps): JSX.Element => {\n    // =============================================================================\n    // REFS, EFFECTS\n    // =============================================================================\n    const checkRef = useRef<HTMLInputElement>(null);\n\n    useEffect(() => {\n        if (checkRef.current) {\n            checkRef.current.indeterminate = indeterminate ?? false;\n        }\n    }, [indeterminate]);\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n    const renderIcon = () => {\n        if (indeterminate) {\n            return (\n                <StyledInteremediateIcon\n                    $disabled={disabled}\n                    data-testid=\"indeterminate\"\n                    aria-hidden\n                />\n            );\n        }\n\n        if (checked) {\n            return (\n                <StyledCheckedIcon\n                    $disabled={disabled}\n                    data-testid=\"checkmark\"\n                    aria-hidden\n                />\n            );\n        }\n\n        if (disabled) {\n            return (\n                <StyledUncheckedDisabledIcon\n                    data-testid=\"empty-disabled-checkbox\"\n                    aria-hidden\n                />\n            );\n        }\n\n        return (\n            <StyledUncheckedIcon\n                $disabled={disabled}\n                data-testid=\"empty-checkbox\"\n                aria-hidden\n            />\n        );\n    };\n\n    return (\n        <Container\n            className={className}\n            data-testid=\"checkbox\"\n            $displaySize={displaySize}\n        >\n            <Input\n                id={id}\n                data-testid=\"checkbox-input\"\n                type=\"checkbox\"\n                checked={checked}\n                ref={checkRef}\n                tabIndex={disabled ? -1 : 0}\n                disabled={disabled}\n                aria-checked={indeterminate ? \"mixed\" : checked}\n                {...otherProps}\n            />\n            {renderIcon()}\n        </Container>\n    );\n};\n"],"names":["_a","className","checked","disabled","indeterminate","displaySize","id","otherProps","__rest","checkRef","useRef","useEffect","current","_jsxs","Container","$displaySize","children","_jsx","Input","Object","assign","type","ref","tabIndex","StyledInteremediateIcon","$disabled","StyledCheckedIcon","StyledUncheckedDisabledIcon","StyledUncheckedIcon"],"mappings":"wJAYyBA,IAAA,IAAAC,UACrBA,EAASC,QACTA,EAAOC,SACPA,EAAQC,cACRA,EAAaC,YACbA,EAAc,UAASC,GACvBA,GAAEN,EACCO,EAAUC,SAAAR,EAPQ,uEAYrB,MAAMS,EAAWC,EAAAA,OAAyB,MAE1CC,EAAAA,WAAU,KACFF,EAASG,UACTH,EAASG,QAAQR,cAAgBA,SAAAA,EACrC,GACD,CAACA,IA4CJ,OACIS,EAAAA,KAACC,EAAAA,UAAS,CACNb,UAAWA,EAAS,cACR,WAAUc,aACRV,EAAWW,SAAA,CAEzBC,EAAAA,IAACC,EAAAA,MAAKC,OAAAC,OAAA,CACFd,GAAIA,EAAE,cACM,iBACZe,KAAK,WACLnB,QAASA,EACToB,IAAKb,EACLc,SAAUpB,KAAgB,EAC1BA,SAAUA,EAAQ,eACJC,EAAgB,QAAUF,GACpCK,IArDRH,EAEIa,EAAAA,IAACO,0BAAuB,CAAAC,UACTtB,EAAQ,cACP,gBAAe,eAAA,IAMnCD,EAEIe,EAAAA,IAACS,oBAAiB,CAAAD,UACHtB,EAAQ,cACP,YAAW,eAAA,IAM/BA,EAEIc,EAAAA,IAACU,EAAAA,2CACe,0BAAyB,eAAA,IAO7CV,EAAAA,IAACW,sBAAmB,CAAAH,UACLtB,EAAQ,cACP,iBAAgB,eAAA,MAwBxB"}
+{"version":3,"file":"checkbox.js","sources":["../../../src/checkbox/checkbox.tsx"],"sourcesContent":["import {\n    MinusSquareFillIcon,\n    SquareFillIcon,\n    SquareIcon,\n    SquareTickFillIcon,\n} from \"@lifesg/react-icons\";\nimport clsx from \"clsx\";\nimport { useEffect, useRef } from \"react\";\n\nimport * as styles from \"./checkbox.styles\";\nimport type { CheckboxProps } from \"./types\";\n\nexport const Checkbox = ({\n    className,\n    checked,\n    disabled,\n    focusableWhenDisabled,\n    indeterminate,\n    displaySize = \"default\",\n    onChange,\n    id,\n    tabIndex,\n    ...otherProps\n}: CheckboxProps): JSX.Element => {\n    // =============================================================================\n    // REFS\n    // =============================================================================\n    const checkRef = useRef<HTMLInputElement>(null);\n\n    const isFocusableWhenDisabled = !!disabled && !!focusableWhenDisabled;\n    const isNativeDisabled = !!disabled && !focusableWhenDisabled;\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleOnChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n        if (disabled) {\n            event.preventDefault();\n            return;\n        }\n        onChange?.(event);\n    };\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n\n    useEffect(() => {\n        if (checkRef.current) {\n            checkRef.current.indeterminate = indeterminate ?? false;\n        }\n    }, [indeterminate]);\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n    const renderIcon = () => {\n        if (indeterminate) {\n            return (\n                <MinusSquareFillIcon\n                    className={clsx(\n                        styles.icon,\n                        styles.selectedIcon,\n                        disabled && styles.iconDisabled\n                    )}\n                    data-testid=\"indeterminate\"\n                    aria-hidden\n                />\n            );\n        }\n\n        if (checked) {\n            return (\n                <SquareTickFillIcon\n                    className={clsx(\n                        styles.icon,\n                        styles.selectedIcon,\n                        disabled && styles.iconDisabled\n                    )}\n                    data-testid=\"checkmark\"\n                    aria-hidden\n                />\n            );\n        }\n\n        if (disabled) {\n            return (\n                <SquareFillIcon\n                    className={clsx(styles.icon, styles.iconDisabled)}\n                    data-testid=\"empty-disabled-checkbox\"\n                    aria-hidden\n                />\n            );\n        }\n\n        return (\n            <SquareIcon\n                className={clsx(styles.icon, styles.uncheckedIcon)}\n                data-testid=\"empty-checkbox\"\n                aria-hidden\n            />\n        );\n    };\n\n    return (\n        <div\n            className={clsx(\n                styles.container,\n                displaySize === \"small\" && styles.containerSmall,\n                className\n            )}\n            data-testid=\"checkbox\"\n        >\n            <input\n                id={id}\n                className={clsx(\n                    styles.input,\n                    !disabled && styles.inputActive,\n                    disabled && styles.inputDisabledVisual\n                )}\n                data-testid=\"checkbox-input\"\n                type=\"checkbox\"\n                checked={checked}\n                ref={checkRef}\n                tabIndex={isFocusableWhenDisabled ? 0 : tabIndex}\n                disabled={isNativeDisabled}\n                aria-disabled={isFocusableWhenDisabled}\n                aria-checked={indeterminate ? \"mixed\" : checked}\n                onChange={handleOnChange}\n                {...otherProps}\n            />\n            {renderIcon()}\n        </div>\n    );\n};\n"],"names":["_a","className","checked","disabled","focusableWhenDisabled","indeterminate","displaySize","onChange","id","tabIndex","otherProps","__rest","checkRef","useRef","isFocusableWhenDisabled","isNativeDisabled","useEffect","current","_jsxs","clsx","styles.container","styles.containerSmall","children","_jsx","Object","assign","styles.input","styles.inputActive","styles.inputDisabledVisual","type","ref","event","preventDefault","MinusSquareFillIcon","styles.icon","styles.selectedIcon","styles.iconDisabled","SquareTickFillIcon","SquareFillIcon","SquareIcon","styles.uncheckedIcon"],"mappings":"+RAYyBA,QAAAC,UACrBA,EAASC,QACTA,EAAOC,SACPA,EAAQC,sBACRA,EAAqBC,cACrBA,EAAaC,YACbA,EAAc,UAASC,SACvBA,EAAQC,GACRA,EAAEC,SACFA,KACGC,EAAUC,EAAAA,OAAAX,EAVQ,CAAA,YAAA,UAAA,WAAA,wBAAA,gBAAA,cAAA,WAAA,KAAA,aAerB,MAAMY,EAAWC,EAAAA,OAAyB,MAEpCC,IAA4BX,KAAcC,EAC1CW,IAAqBZ,IAAaC,EAiBxCY,EAAAA,WAAU,KACFJ,EAASK,UACTL,EAASK,QAAQZ,cAAgBA,SAAAA,EACrC,GACD,CAACA,IAqDJ,OACIa,EAAAA,YACIjB,UAAWkB,EAAAA,QACPC,EAAAA,UACgB,UAAhBd,GAA2Be,EAAAA,eAC3BpB,GACH,cACW,WAAUqB,SAAA,CAEtBC,EAAAA,IAAA,QAAAC,OAAAC,OAAA,CACIjB,GAAIA,EACJP,UAAWkB,EAAAA,QACPO,EAAAA,OACCvB,GAAYwB,EAAAA,YACbxB,GAAYyB,EAAAA,qBACf,cACW,iBACZC,KAAK,WACL3B,QAASA,EACT4B,IAAKlB,EACLH,SAAUK,EAA0B,EAAIL,EACxCN,SAAUY,EAAgB,gBACXD,iBACDT,EAAgB,QAAUH,EACxCK,SA7FYwB,IAChB5B,EACA4B,EAAMC,iBAGVzB,SAAAA,EAAWwB,EAAM,GAyFLrB,IAxERL,EAEIkB,EAAAA,IAACU,EAAAA,oBAAmB,CAChBhC,UAAWkB,EAAAA,QACPe,EAAAA,KACAC,EAAAA,aACAhC,GAAYiC,EAAAA,cACf,cACW,gBAAe,eAAA,IAMnClC,EAEIqB,EAAAA,IAACc,EAAAA,mBAAkB,CACfpC,UAAWkB,EAAAA,QACPe,EAAAA,KACAC,EAAAA,aACAhC,GAAYiC,EAAAA,cACf,cACW,YAAW,eAAA,IAM/BjC,EAEIoB,MAACe,EAAAA,eAAc,CACXrC,UAAWkB,EAAAA,QAAKe,EAAAA,KAAaE,EAAAA,4BACjB,0BAAyB,eAAA,IAO7Cb,MAACgB,EAAAA,WAAU,CACPtC,UAAWkB,EAAAA,QAAKe,EAAAA,KAAaM,EAAAA,6BACjB,iBAAgB,eAAA,MAkC9B"}

package/cjs/checkbox/checkbox.styles.js

@@ -0,0 +1,2 @@
+"use strict";require("./checkbox.styles_gm5bu1.css");exports.container="cuj1wdj",exports.containerSmall="c1rz5cog",exports.icon="i76s810",exports.iconDisabled="i1k0dk4y",exports.input="iidy4i6",exports.inputActive="isykh53",exports.inputDisabledVisual="iihjvql",exports.selectedIcon="s8wyls8",exports.uncheckedIcon="ue1dgoy";
+//# sourceMappingURL=checkbox.styles.js.map

package/cjs/checkbox/checkbox.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.styles.js","sources":["../../../src/checkbox/checkbox.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, Motion } from \"../theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\n\nexport const icon = css`\n    @keyframes checkbox-icon-fade-in {\n        0% {\n            opacity: 0;\n        }\n        100% {\n            opacity: 1;\n        }\n    }\n\n    animation: ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]}\n        checkbox-icon-fade-in;\n    width: 100%;\n    height: 100%;\n    transition: color ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n`;\n\nexport const uncheckedIcon = css`\n    color: ${Colour[\"icon-primary-subtlest\"]};\n`;\n\nexport const selectedIcon = css`\n    color: ${Colour[\"icon-selected\"]};\n`;\n\nexport const iconDisabled = css`\n    color: ${Colour[\"icon-disabled-subtle\"]};\n`;\n\nexport const container = css`\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    position: relative;\n    height: 2rem;\n    width: 2rem;\n\n    input:focus-visible + svg {\n        outline: 2px solid ${Colour[\"focus-ring\"]};\n        outline-offset: 0px;\n        border-radius: 4px;\n    }\n`;\n\nexport const containerSmall = css`\n    height: 1.5rem;\n    width: 1.5rem;\n`;\n\nexport const input = css`\n    position: absolute;\n    opacity: 0;\n    width: 100%;\n    height: 100%;\n    cursor: pointer;\n`;\n\nexport const inputActive = css`\n    &:hover + svg {\n        @media (pointer: fine) {\n            color: ${Colour[\"icon-hover\"]};\n        }\n    }\n`;\n\nexport const inputDisabledVisual = css`\n    cursor: not-allowed;\n`;\n"],"names":[],"mappings":"+FAqCsB,iCAeK,wBA5CV,+BAyBQ,yBAwBP,8BAQM,sCAQQ,+BA5CP,gCAJC"}

package/cjs/checkbox/checkbox.styles_gm5bu1.css

@@ -0,0 +1,9 @@
+.i76s810{-webkit-animation:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default) checkbox-icon-fade-in-i76s810;animation:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default) checkbox-icon-fade-in-i76s810;width:100%;height:100%;-webkit-transition:color var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:color var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);}@-webkit-keyframes checkbox-icon-fade-in-i76s810{0%{opacity:0;}100%{opacity:1;}}@keyframes checkbox-icon-fade-in-i76s810{0%{opacity:0;}100%{opacity:1;}}
+.ue1dgoy{color:var(--fds-colour-icon-primary-subtlest);}
+.s8wyls8{color:var(--fds-colour-icon-selected);}
+.i1k0dk4y{color:var(--fds-colour-icon-disabled-subtle);}
+.cuj1wdj{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;height:2rem;width:2rem;}.cuj1wdj input:focus-visible+svg{outline:2px solid var(--fds-colour-focus-ring);outline-offset:0px;border-radius:4px;}
+.c1rz5cog{height:1.5rem;width:1.5rem;}
+.iidy4i6{position:absolute;opacity:0;width:100%;height:100%;cursor:pointer;}
+@media (pointer: fine){.isykh53:hover+svg{color:var(--fds-colour-icon-hover);}}
+.iihjvql{cursor:not-allowed;}

package/cjs/dashed-border/dashed-border.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),s=require("clsx"),o=require("react");require("../theme/theme-provider/index.js"),require("../theme/theme-provider/context.js");var u=require("../theme/tokens/border.js"),l=require("../theme/tokens/colour.js");require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var i=require("../theme/tokens/radius.js"),a=require("../theme/utils/token-resolver.js"),t=require("../theme/utils/use-apply-styles.js"),n=require("../theme/utils/use-design-token.js");require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js");var d=require("../util/merge-refs.js");require("../util/string-helper.js");var c=require("./dashed-border.styles.js"),k=require("./dashed-border.utils.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=m(s);const j=o.forwardRef(((s,m)=>{const{enabled:j=!0,thickness:v=u.BorderThickness["width-010"],radius:q=i.Radius.none,colour:f=l.Colour.border,backgroundColor:b,className:g,children:T}=s,y=e.__rest(s,["enabled","thickness","radius","colour","backgroundColor","className","children"]),C=n.useResolvedTokenValue({value:v,fallback:u.BorderThickness["width-010"],isToken:k.isThicknessToken,normalizeCustom:a.toCssValue}),p=n.useResolvedTokenValue({value:q,fallback:i.Radius.none,isToken:k.isRadiusToken,normalizeCustom:a.toCssValue}),R=n.useResolvedTokenValue({value:f,fallback:l.Colour.border,isToken:k.isColourToken,normalizeCustom:String}),x=n.useResolvedTokenValue({value:b,fallback:"none",isToken:k.isColourToken,normalizeCustom:String}),B=j||!!b,V=k.createSvgBackgroundImage({radius:p,colour:R,thickness:C,enabled:j}),S=o.useRef(null),z=o.useRef(null),N=m?d.mergeRefs(S,m):S;return t.useApplyStyle(S,{[c.tokens.rootRadius]:p,[c.tokens.rootBackgroundColor]:b?x:null}),t.useApplyStyle(z,{[c.tokens.overlayBackgroundImage]:B?V:null}),r.jsxs("div",Object.assign({ref:N,className:h.default(c.root,g)},y,{children:[B&&r.jsx("div",{"aria-hidden":"true",className:c.overlay,ref:z}),T]}))}));exports.DashedBorder=j;
+"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),s=require("clsx"),o=require("react");require("../theme/theme-provider/index.js"),require("../theme/theme-provider/context.js");var u=require("../theme/tokens/border.js"),i=require("../theme/tokens/colour.js");require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var l=require("../theme/tokens/radius.js"),a=require("../theme/utils/token-resolver.js"),t=require("../theme/utils/use-apply-styles.js"),n=require("../theme/utils/use-design-token.js");require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js");var d=require("../util/merge-refs.js");require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var c=require("../util/styling-helper.js"),k=require("./dashed-border.styles.js"),m=require("./dashed-border.utils.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var j=h(s);const q=o.forwardRef(((s,h)=>{const{enabled:q=!0,thickness:v=u.BorderThickness["width-010"],radius:f=l.Radius.none,colour:b=i.Colour.border,backgroundColor:g,className:T,children:p}=s,y=e.__rest(s,["enabled","thickness","radius","colour","backgroundColor","className","children"]),C=n.useResolvedTokenValue({value:v,fallback:u.BorderThickness["width-010"],isToken:c.isThicknessToken,normalizeCustom:a.toCssValue}),R=n.useResolvedTokenValue({value:f,fallback:l.Radius.none,isToken:c.isRadiusToken,normalizeCustom:a.toCssValue}),x=n.useResolvedTokenValue({value:b,fallback:i.Colour.border,isToken:c.isColourToken,normalizeCustom:String}),B=n.useResolvedTokenValue({value:g,fallback:"none",isToken:c.isColourToken,normalizeCustom:String}),V=q||!!g,S=m.createSvgBackgroundImage({radius:R,colour:x,thickness:C,enabled:q}),z=o.useRef(null),N=o.useRef(null),_=h?d.mergeRefs(z,h):z;return t.useApplyStyle(z,{[k.tokens.rootRadius]:R,[k.tokens.rootBackgroundColor]:g?B:null}),t.useApplyStyle(N,{[k.tokens.overlayBackgroundImage]:V?S:null}),r.jsxs("div",Object.assign({ref:_,className:j.default(k.root,T)},y,{children:[V&&r.jsx("div",{"aria-hidden":"true",className:k.overlay,ref:N}),p]}))}));exports.DashedBorder=q;
 //# sourceMappingURL=dashed-border.js.map

package/cjs/dashed-border/dashed-border.js.map

@@ -1 +1 @@
-{"version":3,"file":"dashed-border.js","sources":["../../../src/dashed-border/dashed-border.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef, useRef } from \"react\";\n\nimport {\n    BorderThickness,\n    Colour,\n    Radius,\n    toCssValue,\n    useApplyStyle,\n    useResolvedTokenValue,\n} from \"../theme\";\nimport { mergeRefs } from \"../util\";\nimport * as styles from \"./dashed-border.styles\";\nimport {\n    createSvgBackgroundImage,\n    isColourToken,\n    isRadiusToken,\n    isThicknessToken,\n} from \"./dashed-border.utils\";\nimport type { DashedBorderProps } from \"./types\";\n\nconst Component = (\n    props: DashedBorderProps,\n    ref: React.Ref<HTMLDivElement>\n) => {\n    const {\n        enabled = true,\n        thickness = BorderThickness[\"width-010\"],\n        radius = Radius[\"none\"],\n        colour = Colour[\"border\"],\n        backgroundColor,\n        className,\n        children,\n        ...otherProps\n    } = props;\n\n    const effectiveThickness = useResolvedTokenValue({\n        value: thickness,\n        fallback: BorderThickness[\"width-010\"],\n        isToken: isThicknessToken,\n        normalizeCustom: toCssValue,\n    });\n\n    const effectiveRadius = useResolvedTokenValue({\n        value: radius,\n        fallback: Radius[\"none\"],\n        isToken: isRadiusToken,\n        normalizeCustom: toCssValue,\n    });\n\n    const effectiveColour = useResolvedTokenValue({\n        value: colour,\n        fallback: Colour[\"border\"],\n        isToken: isColourToken,\n        normalizeCustom: String,\n    });\n\n    const effectiveBackgroundColor = useResolvedTokenValue({\n        value: backgroundColor,\n        fallback: \"none\",\n        isToken: isColourToken,\n        normalizeCustom: String,\n    });\n\n    const showSvg = enabled || !!backgroundColor;\n    const overlayBackgroundImage = createSvgBackgroundImage({\n        radius: effectiveRadius,\n        colour: effectiveColour,\n        thickness: effectiveThickness,\n        enabled,\n    });\n    const rootRef = useRef<HTMLDivElement>(null);\n    const overlayRef = useRef<HTMLDivElement>(null);\n    const mergedRootRef = ref ? mergeRefs(rootRef, ref) : rootRef;\n\n    useApplyStyle(rootRef, {\n        [styles.tokens.rootRadius]: effectiveRadius,\n        [styles.tokens.rootBackgroundColor]: backgroundColor\n            ? effectiveBackgroundColor\n            : null,\n    });\n\n    useApplyStyle(overlayRef, {\n        [styles.tokens.overlayBackgroundImage]: showSvg\n            ? overlayBackgroundImage\n            : null,\n    });\n\n    return (\n        <div\n            ref={mergedRootRef}\n            className={clsx(styles.root, className)}\n            {...otherProps}\n        >\n            {showSvg && (\n                <div\n                    aria-hidden=\"true\"\n                    className={styles.overlay}\n                    ref={overlayRef}\n                />\n            )}\n            {children}\n        </div>\n    );\n};\n\nexport const DashedBorder = forwardRef(Component);\n"],"names":["DashedBorder","forwardRef","props","ref","enabled","thickness","BorderThickness","radius","Radius","colour","Colour","backgroundColor","className","children","otherProps","__rest","effectiveThickness","useResolvedTokenValue","value","fallback","isToken","isThicknessToken","normalizeCustom","toCssValue","effectiveRadius","isRadiusToken","effectiveColour","isColourToken","String","effectiveBackgroundColor","showSvg","overlayBackgroundImage","createSvgBackgroundImage","rootRef","useRef","overlayRef","mergedRootRef","mergeRefs","useApplyStyle","styles.tokens","rootRadius","rootBackgroundColor","_jsxs","Object","assign","clsx","styles.root","_jsx","styles.overlay"],"mappings":"y2BAqBA,MAqFaA,EAAeC,EAAAA,YArFV,CACdC,EACAC,KAEA,MAAMC,QACFA,GAAU,EAAIC,UACdA,EAAYC,EAAAA,gBAAgB,aAAYC,OACxCA,EAASC,EAAAA,OAAa,KAACC,OACvBA,EAASC,EAAAA,OAAe,OAACC,gBACzBA,EAAeC,UACfA,EAASC,SACTA,GAEAX,EADGY,EAAUC,EAAAA,OACbb,EATE,CAAA,UAAA,YAAA,SAAA,SAAA,kBAAA,YAAA,aAWAc,EAAqBC,EAAAA,sBAAsB,CAC7CC,MAAOb,EACPc,SAAUb,EAAAA,gBAAgB,aAC1Bc,QAASC,EAAAA,iBACTC,gBAAiBC,EAAAA,aAGfC,EAAkBP,EAAAA,sBAAsB,CAC1CC,MAAOX,EACPY,SAAUX,EAAAA,OAAa,KACvBY,QAASK,EAAAA,cACTH,gBAAiBC,EAAAA,aAGfG,EAAkBT,EAAAA,sBAAsB,CAC1CC,MAAOT,EACPU,SAAUT,EAAAA,OAAe,OACzBU,QAASO,EAAAA,cACTL,gBAAiBM,SAGfC,EAA2BZ,EAAAA,sBAAsB,CACnDC,MAAOP,EACPQ,SAAU,OACVC,QAASO,EAAAA,cACTL,gBAAiBM,SAGfE,EAAU1B,KAAaO,EACvBoB,EAAyBC,EAAAA,yBAAyB,CACpDzB,OAAQiB,EACRf,OAAQiB,EACRrB,UAAWW,EACXZ,YAEE6B,EAAUC,EAAAA,OAAuB,MACjCC,EAAaD,EAAAA,OAAuB,MACpCE,EAAgBjC,EAAMkC,EAAAA,UAAUJ,EAAS9B,GAAO8B,EAetD,OAbAK,EAAAA,cAAcL,EAAS,CACnB,CAACM,EAAAA,OAAcC,YAAahB,EAC5B,CAACe,EAAAA,OAAcE,qBAAsB9B,EAC/BkB,EACA,OAGVS,EAAAA,cAAcH,EAAY,CACtB,CAACI,EAAAA,OAAcR,wBAAyBD,EAClCC,EACA,OAINW,EAAAA,KAAA,MAAAC,OAAAC,OAAA,CACIzC,IAAKiC,EACLxB,UAAWiC,EAAAA,QAAKC,EAAAA,KAAalC,IACzBE,EAAU,CAAAD,SAAA,CAEbiB,GACGiB,EAAAA,yBACgB,OACZnC,UAAWoC,UACX7C,IAAKgC,IAGZtB,KACC"}
+{"version":3,"file":"dashed-border.js","sources":["../../../src/dashed-border/dashed-border.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef, useRef } from \"react\";\n\nimport {\n    BorderThickness,\n    Colour,\n    Radius,\n    toCssValue,\n    useApplyStyle,\n    useResolvedTokenValue,\n} from \"../theme\";\nimport { mergeRefs } from \"../util\";\nimport {\n    isColourToken,\n    isRadiusToken,\n    isThicknessToken,\n} from \"../util/styling-helper\";\nimport * as styles from \"./dashed-border.styles\";\nimport { createSvgBackgroundImage } from \"./dashed-border.utils\";\nimport type { DashedBorderProps } from \"./types\";\n\nconst Component = (\n    props: DashedBorderProps,\n    ref: React.Ref<HTMLDivElement>\n) => {\n    const {\n        enabled = true,\n        thickness = BorderThickness[\"width-010\"],\n        radius = Radius[\"none\"],\n        colour = Colour[\"border\"],\n        backgroundColor,\n        className,\n        children,\n        ...otherProps\n    } = props;\n\n    const effectiveThickness = useResolvedTokenValue({\n        value: thickness,\n        fallback: BorderThickness[\"width-010\"],\n        isToken: isThicknessToken,\n        normalizeCustom: toCssValue,\n    });\n\n    const effectiveRadius = useResolvedTokenValue({\n        value: radius,\n        fallback: Radius[\"none\"],\n        isToken: isRadiusToken,\n        normalizeCustom: toCssValue,\n    });\n\n    const effectiveColour = useResolvedTokenValue({\n        value: colour,\n        fallback: Colour[\"border\"],\n        isToken: isColourToken,\n        normalizeCustom: String,\n    });\n\n    const effectiveBackgroundColor = useResolvedTokenValue({\n        value: backgroundColor,\n        fallback: \"none\",\n        isToken: isColourToken,\n        normalizeCustom: String,\n    });\n\n    const showSvg = enabled || !!backgroundColor;\n    const overlayBackgroundImage = createSvgBackgroundImage({\n        radius: effectiveRadius,\n        colour: effectiveColour,\n        thickness: effectiveThickness,\n        enabled,\n    });\n    const rootRef = useRef<HTMLDivElement>(null);\n    const overlayRef = useRef<HTMLDivElement>(null);\n    const mergedRootRef = ref ? mergeRefs(rootRef, ref) : rootRef;\n\n    useApplyStyle(rootRef, {\n        [styles.tokens.rootRadius]: effectiveRadius,\n        [styles.tokens.rootBackgroundColor]: backgroundColor\n            ? effectiveBackgroundColor\n            : null,\n    });\n\n    useApplyStyle(overlayRef, {\n        [styles.tokens.overlayBackgroundImage]: showSvg\n            ? overlayBackgroundImage\n            : null,\n    });\n\n    return (\n        <div\n            ref={mergedRootRef}\n            className={clsx(styles.root, className)}\n            {...otherProps}\n        >\n            {showSvg && (\n                <div\n                    aria-hidden=\"true\"\n                    className={styles.overlay}\n                    ref={overlayRef}\n                />\n            )}\n            {children}\n        </div>\n    );\n};\n\nexport const DashedBorder = forwardRef(Component);\n"],"names":["DashedBorder","forwardRef","props","ref","enabled","thickness","BorderThickness","radius","Radius","colour","Colour","backgroundColor","className","children","otherProps","__rest","effectiveThickness","useResolvedTokenValue","value","fallback","isToken","isThicknessToken","normalizeCustom","toCssValue","effectiveRadius","isRadiusToken","effectiveColour","isColourToken","String","effectiveBackgroundColor","showSvg","overlayBackgroundImage","createSvgBackgroundImage","rootRef","useRef","overlayRef","mergedRootRef","mergeRefs","useApplyStyle","styles.tokens","rootRadius","rootBackgroundColor","_jsxs","Object","assign","clsx","styles.root","_jsx","styles.overlay"],"mappings":"g+BAqBA,MAqFaA,EAAeC,EAAAA,YArFV,CACdC,EACAC,KAEA,MAAMC,QACFA,GAAU,EAAIC,UACdA,EAAYC,EAAAA,gBAAgB,aAAYC,OACxCA,EAASC,EAAAA,OAAa,KAACC,OACvBA,EAASC,EAAAA,OAAe,OAACC,gBACzBA,EAAeC,UACfA,EAASC,SACTA,GAEAX,EADGY,EAAUC,EAAAA,OACbb,EATE,CAAA,UAAA,YAAA,SAAA,SAAA,kBAAA,YAAA,aAWAc,EAAqBC,EAAAA,sBAAsB,CAC7CC,MAAOb,EACPc,SAAUb,EAAAA,gBAAgB,aAC1Bc,QAASC,EAAAA,iBACTC,gBAAiBC,EAAAA,aAGfC,EAAkBP,EAAAA,sBAAsB,CAC1CC,MAAOX,EACPY,SAAUX,EAAAA,OAAa,KACvBY,QAASK,EAAAA,cACTH,gBAAiBC,EAAAA,aAGfG,EAAkBT,EAAAA,sBAAsB,CAC1CC,MAAOT,EACPU,SAAUT,EAAAA,OAAe,OACzBU,QAASO,EAAAA,cACTL,gBAAiBM,SAGfC,EAA2BZ,EAAAA,sBAAsB,CACnDC,MAAOP,EACPQ,SAAU,OACVC,QAASO,EAAAA,cACTL,gBAAiBM,SAGfE,EAAU1B,KAAaO,EACvBoB,EAAyBC,EAAAA,yBAAyB,CACpDzB,OAAQiB,EACRf,OAAQiB,EACRrB,UAAWW,EACXZ,YAEE6B,EAAUC,EAAAA,OAAuB,MACjCC,EAAaD,EAAAA,OAAuB,MACpCE,EAAgBjC,EAAMkC,EAAAA,UAAUJ,EAAS9B,GAAO8B,EAetD,OAbAK,EAAAA,cAAcL,EAAS,CACnB,CAACM,EAAAA,OAAcC,YAAahB,EAC5B,CAACe,EAAAA,OAAcE,qBAAsB9B,EAC/BkB,EACA,OAGVS,EAAAA,cAAcH,EAAY,CACtB,CAACI,EAAAA,OAAcR,wBAAyBD,EAClCC,EACA,OAINW,EAAAA,KAAA,MAAAC,OAAAC,OAAA,CACIzC,IAAKiC,EACLxB,UAAWiC,EAAAA,QAAKC,EAAAA,KAAalC,IACzBE,EAAU,CAAAD,SAAA,CAEbiB,GACGiB,EAAAA,yBACgB,OACZnC,UAAWoC,UACX7C,IAAKgC,IAGZtB,KACC"}

package/cjs/dashed-border/dashed-border.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"dashed-border.styles.js","sources":["../../../src/dashed-border/dashed-border.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nexport const tokens = {\n    rootRadius: \"--fds-internal-dashedBorder-root-radius\",\n    rootBackgroundColor: \"--fds-internal-dashedBorder-root-backgroundColor\",\n    overlayBackgroundImage:\n        \"--fds-internal-dashedBorder-overlay-backgroundImage\",\n} as const;\n\nexport const root = css`\n    position: relative;\n    overflow: hidden;\n    border-radius: var(${tokens.rootRadius}, 0);\n    background-color: var(${tokens.rootBackgroundColor}, transparent);\n`;\n\nexport const overlay = css`\n    position: absolute;\n    inset: 0;\n    width: 100%;\n    height: 100%;\n    background-image: var(${tokens.overlayBackgroundImage}, none);\n    background-repeat: no-repeat;\n    background-position: center;\n    background-size: 100% 100%;\n    pointer-events: none;\n`;\n"],"names":["rootRadius","rootBackgroundColor","overlayBackgroundImage"],"mappings":"yFAgBoB,uBAPH,0BAPK,CAClBA,WAAY,0CACZC,oBAAqB,mDACrBC,uBACI"}
+{"version":3,"file":"dashed-border.styles.js","sources":["../../../src/dashed-border/dashed-border.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nexport const tokens = {\n    rootRadius: \"--fds-internal-dashedBorder-root-radius\",\n    rootBackgroundColor: \"--fds-internal-dashedBorder-root-backgroundColor\",\n    overlayBackgroundImage:\n        \"--fds-internal-dashedBorder-overlay-backgroundImage\",\n} as const;\n\nexport const root = css`\n    position: relative;\n    overflow: hidden;\n    border-radius: var(${tokens.rootRadius}, 0);\n    background-color: var(${tokens.rootBackgroundColor}, transparent);\n`;\n\nexport const overlay = css`\n    position: absolute;\n    inset: 0;\n    width: 100%;\n    height: 100%;\n    background-image: var(${tokens.overlayBackgroundImage}, none);\n    background-repeat: no-repeat;\n    background-position: center;\n    background-size: 100% 100%;\n    pointer-events: none;\n`;\n"],"names":["rootRadius","rootBackgroundColor","overlayBackgroundImage"],"mappings":"uGAgBoB,uBAPH,0BAPK,CAClBA,WAAY,0CACZC,oBAAqB,mDACrBC,uBACI"}

package/cjs/dashed-border/dashed-border.utils.js

@@ -1,2 +1,2 @@
-"use strict";require("../theme/theme-provider/index.js"),require("react"),require("../theme/theme-provider/context.js");var e=require("../theme/tokens/border.js");require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var r=require("../theme/tokens/radius.js"),s=require("../theme/utils/token-resolver.js");require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/string-helper.js");const t=new Set(Object.values(r.Radius)),o=new Set(Object.values(e.BorderThickness));exports.createSvgBackgroundImage=({colour:e,enabled:r,radius:s,thickness:t})=>`url("data:image/svg+xml,${encodeURIComponent(`\n    <svg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'>\n        <rect\n            width='100%' height='100%' fill='none'\n            rx='${s}'\n            ry='${s}'\n            stroke='${r?e:"none"}'\n            stroke-width='${r?t:0}'\n            stroke-dasharray='4, 8' stroke-dashoffset='0' stroke-linecap='square'\n        />\n    </svg>`)}")`,exports.isColourToken=e=>s.isTokenWithPrefix(e,"var(--fds-colour-"),exports.isRadiusToken=e=>s.isTokenFromSet(e,t),exports.isThicknessToken=e=>s.isTokenFromSet(e,o);
+"use strict";exports.createSvgBackgroundImage=({colour:e,enabled:n,radius:t,thickness:s})=>`url("data:image/svg+xml,${encodeURIComponent(`\n    <svg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'>\n        <rect\n            width='100%' height='100%' fill='none'\n            rx='${t}'\n            ry='${t}'\n            stroke='${n?e:"none"}'\n            stroke-width='${n?s:0}'\n            stroke-dasharray='4, 8' stroke-dashoffset='0' stroke-linecap='square'\n        />\n    </svg>`)}")`;
 //# sourceMappingURL=dashed-border.utils.js.map

package/cjs/dashed-border/dashed-border.utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"dashed-border.utils.js","sources":["../../../src/dashed-border/dashed-border.utils.ts"],"sourcesContent":["import type {\n    ColourCSSVariableString,\n    RadiusCSSVariableString,\n} from \"../theme\";\nimport {\n    BorderThickness,\n    isTokenFromSet,\n    isTokenWithPrefix,\n    Radius,\n} from \"../theme\";\nimport type { ValueOf } from \"../util/utility-types\";\n\nconst radiusTokenSet = new Set<string>(Object.values(Radius));\nconst thicknessTokenSet = new Set<string>(Object.values(BorderThickness));\n\nexport interface CreateSvgBackgroundImageOptions {\n    /** Resolved stroke color for the dashed border. */\n    colour: string;\n    /** Whether dashed stroke should be rendered. */\n    enabled: boolean;\n    /** Resolved CSS border radius for the SVG rect. */\n    radius: string;\n    /** Resolved stroke width for the dashed border. */\n    thickness: string;\n}\n\nexport const isRadiusToken = (\n    value: unknown\n): value is RadiusCSSVariableString => {\n    return isTokenFromSet<RadiusCSSVariableString>(value, radiusTokenSet);\n};\n\nexport const isThicknessToken = (\n    value: unknown\n): value is ValueOf<typeof BorderThickness> => {\n    return isTokenFromSet<ValueOf<typeof BorderThickness>>(\n        value,\n        thicknessTokenSet\n    );\n};\n\nexport const isColourToken = (\n    value: unknown\n): value is ColourCSSVariableString => {\n    return isTokenWithPrefix<ColourCSSVariableString>(\n        value,\n        \"var(--fds-colour-\"\n    );\n};\n\n/**\n * Builds a data-URI SVG used as the dashed border background image.\n * @param options SVG background image options.\n * @returns Encoded SVG as CSS `url(...)` string.\n */\nexport const createSvgBackgroundImage = ({\n    colour,\n    enabled,\n    radius,\n    thickness,\n}: CreateSvgBackgroundImageOptions) => {\n    const svg = `\n    <svg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'>\n        <rect\n            width='100%' height='100%' fill='none'\n            rx='${radius}'\n            ry='${radius}'\n            stroke='${enabled ? colour : \"none\"}'\n            stroke-width='${enabled ? thickness : 0}'\n            stroke-dasharray='4, 8' stroke-dashoffset='0' stroke-linecap='square'\n        />\n    </svg>`;\n\n    return `url(\"data:image/svg+xml,${encodeURIComponent(svg)}\")`;\n};\n"],"names":["radiusTokenSet","Set","Object","values","Radius","thicknessTokenSet","BorderThickness","colour","enabled","radius","thickness","encodeURIComponent","value","isTokenWithPrefix","isTokenFromSet"],"mappings":"keAYA,MAAMA,EAAiB,IAAIC,IAAYC,OAAOC,OAAOC,EAAAA,SAC/CC,EAAoB,IAAIJ,IAAYC,OAAOC,OAAOG,EAAAA,mDA0ChB,EACpCC,SACAC,UACAC,SACAC,eAcO,2BAA2BC,mBAZtB,iKAIEF,uBACAA,2BACID,EAAUD,EAAS,sCACbC,EAAUE,EAAY,2IA1B9CE,GAEOC,EAAAA,kBACHD,EACA,2CAnBJA,GAEOE,EAAAA,eAAwCF,EAAOZ,4BAItDY,GAEOE,EAAAA,eACHF,EACAP"}
+{"version":3,"file":"dashed-border.utils.js","sources":["../../../src/dashed-border/dashed-border.utils.ts"],"sourcesContent":["export interface CreateSvgBackgroundImageOptions {\n    /** Resolved stroke color for the dashed border. */\n    colour: string;\n    /** Whether dashed stroke should be rendered. */\n    enabled: boolean;\n    /** Resolved CSS border radius for the SVG rect. */\n    radius: string;\n    /** Resolved stroke width for the dashed border. */\n    thickness: string;\n}\n\n/**\n * Builds a data-URI SVG used as the dashed border background image.\n * @param options SVG background image options.\n * @returns Encoded SVG as CSS `url(...)` string.\n */\nexport const createSvgBackgroundImage = ({\n    colour,\n    enabled,\n    radius,\n    thickness,\n}: CreateSvgBackgroundImageOptions) => {\n    const svg = `\n    <svg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'>\n        <rect\n            width='100%' height='100%' fill='none'\n            rx='${radius}'\n            ry='${radius}'\n            stroke='${enabled ? colour : \"none\"}'\n            stroke-width='${enabled ? thickness : 0}'\n            stroke-dasharray='4, 8' stroke-dashoffset='0' stroke-linecap='square'\n        />\n    </svg>`;\n\n    return `url(\"data:image/svg+xml,${encodeURIComponent(svg)}\")`;\n};\n"],"names":["colour","enabled","radius","thickness","encodeURIComponent"],"mappings":"8CAgBwC,EACpCA,SACAC,UACAC,SACAC,eAcO,2BAA2BC,mBAZtB,iKAIEF,uBACAA,2BACID,EAAUD,EAAS,sCACbC,EAAUE,EAAY"}

package/cjs/data-table/data-table.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("@lifesg/react-icons"),n=require("react"),i=require("../external/react-intersection-observer/index.js"),l=require("../external/react-resize-detector/build/index.esm.js");require("../animations/loading-dots/loading-dots.js");var s=require("../animations/loading-dots-spinner/loading-dots-spinner.js");require("../animations/loading-spinner/loading-spinner.js"),require("styled-components");var o=require("../checkbox/checkbox.js"),d=require("../error-display/error-display.js");require("../v3_theme/index.js");var c=require("../typography/index.js"),a=require("../util/use-event-listener.js"),u=require("./data-table.styles.js");exports.DataTable=h=>{var{id:g,headers:p,rows:x,className:b,sortIndicators:j,alternatingRows:y,loadState:w="success",enableMultiSelect:f,selectedIds:m,disabledIds:C,enableActionBar:v,enableSelectAll:S,enableStickyHeader:$,emptyView:k,actionBarContent:B,renderCustomEmptyView:H,onHeaderClick:q,onSelect:R,onSelectAll:A,onClearSelectionClick:T}=h,I=e.__rest(h,["id","headers","rows","className","sortIndicators","alternatingRows","loadState","enableMultiSelect","selectedIds","disabledIds","enableActionBar","enableSelectAll","enableStickyHeader","emptyView","actionBarContent","renderCustomEmptyView","onHeaderClick","onSelect","onSelectAll","onClearSelectionClick"]);const E=n.useRef(null),D=n.useRef(null),V=n.useRef(null),W=n.useRef(null),L=n.useRef(null),[N,_]=n.useState(!1),[M,z]=n.useState(!1),[F,K]=n.useState(!1),[Y,O]=n.useState(!1),[U,G]=n.useState(!1),{ref:J,inView:P}=i.useInView(),Q=n.useCallback((()=>{if(!L.current||!W.current)return;const e=L.current.scrollHeight>L.current.clientHeight;_(e),e?W.current.style.transform="translateY(0)":le()}),[]);n.useEffect((()=>{Q()}),[]),l.useResizeDetector({onResize:Q});a.useEventListener("scroll",(()=>{requestAnimationFrame((()=>{N?ie():le()})),L.current&&K(L.current.getBoundingClientRect().bottom<=window.innerHeight)}),"window"),n.useEffect((()=>{se()}),[x]);const X=()=>(null==m?void 0:m.length)===(null==x?void 0:x.length),Z=e=>!!(null==m?void 0:m.includes(e)),ee=e=>!!y&&e%2==1,te=e=>!!(null==C?void 0:C.includes(e)),re=e=>{if(I["data-testid"])return`${I["data-testid"]}-${e}`},ne=()=>p.length+(f?1:0),ie=()=>{if(!L.current)return;const e=L.current.getBoundingClientRect();O(e.bottom>window.innerHeight+30&&e.top<window.innerHeight-200)},le=()=>{if(!(E.current&&D.current&&L.current&&W.current&&V.current))return;const e=D.current.getBoundingClientRect();if(e.top>window.innerHeight){const t=e.bottom-window.innerHeight,r=E.current.getBoundingClientRect().height-V.current.clientHeight-32,n=Math.min(t,r);W.current.style.transform=`translateY(-${n}px)`}else W.current.style.transform="translateY(0)"},se=()=>{E.current&&L.current&&G(E.current.clientHeight+(v?56:0)<L.current.clientHeight)},oe=e=>{const{fieldKey:r,label:n,clickable:i=!1,style:l}="string"==typeof e?{fieldKey:e,label:e,style:void 0}:e;return t.jsx(u.HeaderCell,{"data-testid":re(`header-${r}`),$clickable:i,onClick:()=>i&&(null==q?void 0:q(r)),style:l,$isCheckbox:!1,children:t.jsxs(u.HeaderCellWrapper,{children:["string"==typeof n?t.jsx(c.Typography.BodyBL,{weight:"bold",children:n}):n,de(r)]})},r)},de=e=>{const n=null==j?void 0:j[e];return n?"asc"===n?t.jsx(r.ArrowUpIcon,{"data-testid":re(`header-${e}-arrowup`)}):t.jsx(r.ArrowDownIcon,{"data-testid":re(`header-${e}-arrowdown`)}):t.jsx(t.Fragment,{})},ce=()=>t.jsx(u.HeaderCell,{"data-testid":re("header-selection"),$clickable:!1,$isCheckbox:!0,children:t.jsx(u.CheckBoxWrapper,{children:S&&t.jsx(o.Checkbox,{checked:X(),indeterminate:!!m&&0!==m.length&&!X(),onClick:()=>{A&&A(X())}})})}),ae=(e,r)=>{const n="string"!=typeof e?e.style:void 0,i="string"==typeof e?e:e.fieldKey,l=r.id.toString(),s=r[i],o=`${l}-${i}`;return t.jsx(u.BodyCell,{"data-testid":re(`row-${o}`),style:n,$isCheckbox:!1,children:"string"==typeof s||"number"==typeof s?t.jsx(u.BodyCellContent,{children:s}):"function"==typeof s?s(r,{isSelected:Z(l)}):s},o)},ue=e=>t.jsx(u.BodyCell,{"data-testid":re(`row-${e}-selection`),$isCheckbox:!0,children:t.jsx(u.CheckBoxWrapper,{children:t.jsx(o.Checkbox,{checked:Z(e),onClick:()=>{R&&R(e,!Z(e))},disabled:te(e)})})}),he=()=>t.jsx(d.ErrorDisplay,Object.assign({type:"no-item-found"},k,{title:(null==k?void 0:k.title)?"string"==typeof k.title?t.jsx(u.ErrorDisplayTitle,{weight:"bold",children:k.title}):k.title:t.jsx(u.ErrorDisplayTitle,{weight:"bold",children:"No <items> found"}),description:(null==k?void 0:k.description)?k.description:"No matching rows"}));return t.jsxs(u.TableWrapper,{id:g||"table-wrapper","data-testid":I["data-testid"]||"table",className:b,ref:L,onScroll:()=>{N&&L.current&&z(L.current.scrollTop+L.current.clientHeight>=L.current.scrollHeight)},tabIndex:0,children:[t.jsx(u.TableContainer,{children:t.jsxs(u.Table,{$end:F,$scrollable:N,ref:E,$stickyHeader:$,children:[t.jsx("thead",{ref:V,children:t.jsxs(u.HeaderRow,{children:[f&&ce(),p.map(oe)]})}),t.jsx(u.TableBody,{$showLastRowBottomBorder:U,children:"success"===w?!x||x.length<1?t.jsx("tr",{children:t.jsx(u.EmptyViewCell,{colSpan:ne(),children:H?H():he()})}):t.jsx(t.Fragment,{children:null==x?void 0:x.map(((e,r)=>t.jsxs(u.BodyRow,{"data-testid":re(`row-${e.id.toString()}`),$alternating:ee(r),$isSelectable:f,$isSelected:Z(e.id.toString()),children:[f&&ue(e.id.toString()),p.map((t=>ae(t,e)))]},e.id.toString())))}):t.jsx("tr",{children:t.jsx("td",{colSpan:ne(),children:t.jsx(u.LoaderWrapper,{children:"loading"===w&&t.jsx(s.LoadingDotsSpinner,{})})})})})]})}),v&&m&&m.length>0&&(()=>{var e,r,n,i;const l=null!==(e=null==m?void 0:m.length)&&void 0!==e?e:0;return t.jsx(u.ActionBarWrapper,{ref:W,$fixed:Y,$left:null===(n=null===(r=null==E?void 0:E.current)||void 0===r?void 0:r.getBoundingClientRect())||void 0===n?void 0:n.left,$width:null===(i=null==E?void 0:E.current)||void 0===i?void 0:i.clientWidth,children:t.jsxs(u.ActionBar,{$float:(N?!M:!P)||Y,$scrollable:N,children:[t.jsx(c.Typography.BodyMD,{weight:"semibold",children:`${l} item${l>1?"s":""} selected`}),t.jsx(u.TextButton,{type:"button",onClick:T,children:"Clear selection"}),B]})})})(),t.jsx("div",{ref:e=>{D.current=e,J(e)}})]})};
+"use strict";var e=require("../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("@lifesg/react-icons"),i=require("react"),n=require("../external/react-intersection-observer/index.js"),l=require("../external/react-resize-detector/build/index.esm.js");require("../animations/loading-dots/loading-dots.js");var s=require("../animations/loading-dots-spinner/loading-dots-spinner.js");require("../animations/loading-spinner/loading-spinner.js"),require("../theme/theme-provider/context.js");var a=require("../checkbox/checkbox.js"),o=require("../error-display/error-display.js"),d=require("../shared/accessibility/index.js"),c=require("../typography/index.js");require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js");var u=require("../util/simple-id-generator.js");require("../util/string-helper.js"),require("@react-aria/live-announcer");var h=require("../util/use-event-listener.js"),g=require("./data-table.styles.js");exports.DataTable=p=>{var{id:x,headers:b,rows:j,className:y,sortIndicators:f,alternatingRows:w,loadState:m="success",enableMultiSelect:C,selectedIds:$,disabledIds:v,enableActionBar:S,enableSelectAll:k,enableStickyHeader:B,emptyView:H,actionBarContent:q,renderCustomEmptyView:R,onHeaderClick:I,onSelect:A,onSelectAll:T,onClearSelectionClick:D}=p,E=e.__rest(p,["id","headers","rows","className","sortIndicators","alternatingRows","loadState","enableMultiSelect","selectedIds","disabledIds","enableActionBar","enableSelectAll","enableStickyHeader","emptyView","actionBarContent","renderCustomEmptyView","onHeaderClick","onSelect","onSelectAll","onClearSelectionClick"]);const V=i.useRef(null),W=i.useRef(null),L=i.useRef(null),N=i.useRef(null),K=i.useRef(null),M=u.useId(),_=b.filter((e=>"string"!=typeof e&&!!e.keyColumn)),[z,F]=i.useState(!1),[Y,O]=i.useState(!1),[U,G]=i.useState(!1),[J,P]=i.useState(!1),[Q,X]=i.useState(!1),{ref:Z,inView:ee}=n.useInView(),te=i.useCallback((()=>{if(!K.current||!N.current)return;const e=K.current.scrollHeight>K.current.clientHeight;F(e),e?N.current.style.transform="translateY(0)":pe()}),[]);i.useEffect((()=>{te()}),[]),l.useResizeDetector({onResize:te});h.useEventListener("scroll",(()=>{requestAnimationFrame((()=>{z?ge():pe()})),K.current&&G(K.current.getBoundingClientRect().bottom<=window.innerHeight)}),"window"),i.useEffect((()=>{xe()}),[j]);const re=()=>(null==$?void 0:$.length)===(null==j?void 0:j.length),ie=e=>!!(null==$?void 0:$.includes(e)),ne=e=>!!w&&e%2==1,le=e=>!!(null==v?void 0:v.includes(e)),se=e=>{if(E["data-testid"])return`${E["data-testid"]}-${e}`},ae=()=>b.length+(C?1:0),oe=e=>null==f?void 0:f[e],de=e=>{const t=oe(e);if(t)return"asc"===t?"ascending":"descending"},ce=e=>` by ${"asc"===oe(e)?"descending":"ascending"} order`,ue=(e,t)=>`${M}-row-${e}-${t}-key-column`,he=e=>{const t=_.map((t=>ue(e,t.fieldKey)));return d.concatIds(...t)},ge=()=>{if(!K.current)return;const e=K.current.getBoundingClientRect();P(e.bottom>window.innerHeight+30&&e.top<window.innerHeight-200)},pe=()=>{if(!(V.current&&W.current&&K.current&&N.current&&L.current))return;const e=W.current.getBoundingClientRect();if(e.top>window.innerHeight){const t=e.bottom-window.innerHeight,r=V.current.getBoundingClientRect().height-L.current.clientHeight-32,i=Math.min(t,r);N.current.style.transform=`translateY(-${i}px)`}else N.current.style.transform="translateY(0)"},xe=()=>{V.current&&K.current&&X(V.current.clientHeight+(S?56:0)<K.current.clientHeight)},be=e=>{const{fieldKey:r,label:i,clickable:n=!1,style:l}="string"==typeof e?{fieldKey:e,label:e,style:void 0}:e,s=!!oe(r),a=(e=>`${M}-header-${e}`)(r);return t.jsxs(g.HeaderCell,{"data-testid":se(`header-${r}`),$clickable:n,scope:"col","aria-sort":de(r),style:l,$isCheckbox:!1,children:[t.jsxs(g.HeaderCellWrapper,{id:a,children:["string"==typeof i?t.jsx(c.Typography.BodyBL,{weight:"bold",children:i}):i,je(r)]}),(n||s)&&t.jsx(d.VisuallyHidden,{children:t.jsxs("button",{onClick:()=>null==I?void 0:I(r),children:[s&&"Sort ",t.jsx("span",{"aria-labelledby":a}),s&&ce(r)]})})]},r)},je=e=>{const i=null==f?void 0:f[e];return i?"asc"===i?t.jsx(r.ArrowUpIcon,{"aria-hidden":!0,"data-testid":se(`header-${e}-arrowup`)}):t.jsx(r.ArrowDownIcon,{"aria-hidden":!0,"data-testid":se(`header-${e}-arrowdown`)}):t.jsx(t.Fragment,{})},ye=()=>t.jsx(g.HeaderCell,{"data-testid":se("header-selection"),$clickable:!1,$isCheckbox:!0,scope:"col",children:t.jsxs(g.CheckBoxWrapper,{children:[t.jsx(d.VisuallyHidden,{children:"Row selection"}),k&&t.jsx(a.Checkbox,{checked:re(),indeterminate:!!$&&0!==$.length&&!re(),"aria-label":"Select all rows",onClick:()=>{T&&T(re())}})]})}),fe=(e,r)=>{const i="string"!=typeof e?e.style:void 0,n="string"==typeof e?e:e.fieldKey,l=r.id.toString(),s=r[n],a=`${l}-${n}`;return t.jsx(g.BodyCell,{"data-testid":se(`row-${a}`),id:ue(l,n),style:i,$isCheckbox:!1,children:"string"==typeof s||"number"==typeof s?t.jsx(g.BodyCellContent,{children:s}):"function"==typeof s?s(r,{isSelected:ie(l)}):s},a)},we=e=>{const r=e.id.toString();return t.jsx(g.BodyCell,{"data-testid":se(`row-${r}-selection`),$isCheckbox:!0,children:t.jsx(g.CheckBoxWrapper,{children:t.jsx(a.Checkbox,{checked:ie(r),"aria-labelledby":he(r),onClick:()=>{A&&A(r,!ie(r))},disabled:le(r),focusableWhenDisabled:le(r)})})})},me=()=>t.jsx(o.ErrorDisplay,Object.assign({type:"no-item-found"},H,{title:(null==H?void 0:H.title)?"string"==typeof H.title?t.jsx(g.ErrorDisplayTitle,{weight:"bold",children:H.title}):H.title:t.jsx(g.ErrorDisplayTitle,{weight:"bold",children:"No <items> found"}),description:(null==H?void 0:H.description)?H.description:"No matching rows"}));return t.jsxs(g.TableWrapper,{id:x||"table-wrapper","data-testid":E["data-testid"]||"table",className:y,ref:K,onScroll:()=>{z&&K.current&&O(K.current.scrollTop+K.current.clientHeight>=K.current.scrollHeight)},tabIndex:0,children:[t.jsx(g.TableContainer,{children:t.jsxs(g.Table,{$end:U,$scrollable:z,ref:V,$stickyHeader:B,children:[t.jsx("thead",{ref:L,children:t.jsxs(g.HeaderRow,{children:[C&&ye(),b.map(be)]})}),t.jsx(g.TableBody,{$showLastRowBottomBorder:Q,children:"success"===m?!j||j.length<1?t.jsx("tr",{children:t.jsx(g.EmptyViewCell,{colSpan:ae(),children:R?R():me()})}):t.jsx(t.Fragment,{children:null==j?void 0:j.map(((e,r)=>t.jsxs(g.BodyRow,{"data-testid":se(`row-${e.id.toString()}`),$alternating:ne(r),$isSelectable:C,$isSelected:ie(e.id.toString()),children:[C&&we(e),b.map((t=>fe(t,e)))]},e.id.toString())))}):t.jsx("tr",{children:t.jsx("td",{colSpan:ae(),children:t.jsx(g.LoaderWrapper,{role:"status","aria-live":"polite","aria-label":"Loading table",children:"loading"===m&&t.jsx(s.LoadingDotsSpinner,{})})})})})]})}),S&&$&&$.length>0&&(()=>{var e,r,i,n;const l=null!==(e=null==$?void 0:$.length)&&void 0!==e?e:0;return t.jsx(g.ActionBarWrapper,{ref:N,$fixed:J,$left:null===(i=null===(r=null==V?void 0:V.current)||void 0===r?void 0:r.getBoundingClientRect())||void 0===i?void 0:i.left,$width:null===(n=null==V?void 0:V.current)||void 0===n?void 0:n.clientWidth,children:t.jsxs(g.ActionBar,{$float:(z?!Y:!ee)||J,$scrollable:z,children:[t.jsx(c.Typography.BodyMD,{weight:"semibold",children:`${l} item${l>1?"s":""} selected`}),t.jsx(g.TextButton,{type:"button","aria-label":`Clear selection of ${l} item${1===l?"":"s"}`,onClick:D,children:"Clear selection"}),q]})})})(),t.jsx("div",{ref:e=>{W.current=e,Z(e)}})]})};
 //# sourceMappingURL=data-table.js.map