@lifesg/react-design-system 4.0.0-alpha.6 → 4.0.0-alpha.8

package/cjs/shared/dropdown-wrapper/element-with-dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"element-with-dropdown.js","sources":["../../../../src/shared/dropdown-wrapper/element-with-dropdown.tsx"],"sourcesContent":["import type {\n    Middleware,\n    OpenChangeReason,\n    Placement,\n} from \"@floating-ui/react\";\nimport {\n    autoUpdate,\n    flip,\n    FloatingFocusManager,\n    FloatingPortal,\n    limitShift,\n    offset,\n    shift,\n    size,\n    useClick,\n    useDismiss,\n    useFloating,\n    useInteractions,\n    useTransitionStyles,\n} from \"@floating-ui/react\";\nimport type { CSSProperties, RefObject } from \"react\";\nimport { createContext, useContext, useRef } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport { useFloatingChild } from \"../../overlay/use-floating-context\";\nimport { useInheritedThemeScope, useMaxWidthMediaQuery } from \"../../theme\";\nimport * as elementWithDropdownStyles from \"./element-with-dropdown.styles\";\nimport type { DropdownAlignmentType } from \"./types\";\n\nexport interface DropdownRenderProps {\n    elementWidth: number;\n    styles: CSSProperties;\n    setFloatingRef: (node: HTMLElement | null) => void;\n    getFloatingProps: (\n        userProps?: React.HTMLProps<HTMLElement>\n    ) => Record<string, unknown>;\n}\n\ninterface ElementWithDropdownProps {\n    enabled: boolean;\n    isOpen: boolean;\n    onOpen?: () => void | undefined;\n    onClose?: (reason: OpenChangeReason | undefined) => void | undefined;\n    onDismiss?: () => void | undefined;\n    renderElement: () => React.ReactNode;\n    renderDropdown: (props: DropdownRenderProps) => React.ReactNode;\n    customZIndex?: number | undefined;\n    clickToToggle?: boolean | undefined;\n    /* the distance between the reference element and the dropdown */\n    offset?: number | undefined;\n    /* the alignment of the dropdown to the left or right of the reference element */\n    alignment?: DropdownAlignmentType | undefined;\n    fitAvailableHeight?: boolean | undefined;\n    /**\n     * The root element that contains the popover element. Defaults to the document body.\n     *\n     * If the parent that contains the trigger element has a higher z-index than the popover,\n     * the popover may not be visible. Specify the parent element here instead\n     */\n    rootNode?: RefObject<HTMLElement> | undefined;\n    /** If set, the `elementWidth` refers to this instead of the reference element */\n    positionRef?: RefObject<HTMLElement> | undefined;\n}\n\nconst getFloatingPlacement = (alignment: DropdownAlignmentType): Placement => {\n    switch (alignment) {\n        case \"right\":\n            return \"bottom-end\";\n        case \"left\":\n        default:\n            return \"bottom-start\";\n    }\n};\n\nconst DEFAULT_Z_INDEX = 50;\n\nexport const DropdownRenderContext = createContext<DropdownRenderProps>({\n    elementWidth: 0,\n    styles: {},\n    setFloatingRef: () => {\n        // noop\n    },\n    getFloatingProps: () => ({}),\n});\n\nexport const useDropdownRender = () => {\n    return useContext(DropdownRenderContext);\n};\n\n/**\n * A wrapper to handle the common pattern of a field with a card-based dropdown\n * using Floating UI\n *\n * Usage:\n * - Specify `renderElement` for the main field\n * - Specify `renderDropdown` for the dropdown\n * - Use `isOpen` to control the visibility of the dropdown\n * - Handle changes in visibility with `onOpen`, `onClose` and `onDismiss`\n * - If your dropdown can resize, set the css like so: `max-height: var(--available-height);`\n * - If your dropdown has a preferred max-height, set the css like so:\n *   `max-height: min(100px, var(--available-height, infinity * 1px))`\n *\n * Pass the floating props to the dropdown:\n * ```\n * <DropdownContainer\n *   ref={setFloatingRef}\n *   style={styles}\n *   {...getFloatingProps()}\n * >\n * </DropdownContainer>\n * ```\n *\n * If you need event listeners, pass them to `getFloatingProps()`:\n * ```\n * getFloatingProps({\n *   onClick: handleOnClick\n * })\n * ```\n */\nexport const ElementWithDropdown = ({\n    enabled,\n    isOpen,\n    onOpen,\n    onClose,\n    onDismiss,\n    renderElement,\n    renderDropdown,\n    customZIndex,\n    clickToToggle = false,\n    offset: dropdownOffset = 0,\n    alignment = \"left\",\n    fitAvailableHeight,\n    rootNode,\n    positionRef,\n}: ElementWithDropdownProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const isMobile = useMaxWidthMediaQuery(\"sm\");\n    const elementRef = useRef<HTMLDivElement | null>(null);\n    const { width: referenceWidth = 0 } = useResizeDetector({\n        targetRef: positionRef ?? elementRef,\n        handleHeight: false,\n    });\n    const center: Middleware = {\n        name: \"center\",\n        fn: ({ x, rects }) => {\n            const noGapInBetween =\n                x === 0 || x + rects.floating.width === window.innerWidth;\n            return {\n                x:\n                    noGapInBetween && isMobile\n                        ? (window.innerWidth - rects.floating.width) / 2\n                        : x,\n            };\n        },\n    };\n    const { refs, floatingStyles, context } = useFloating({\n        open: isOpen,\n        onOpenChange: (open, _event, reason) => {\n            if (reason === \"escape-key\") {\n                onDismiss?.();\n            } else if (open && !isOpen) {\n                onOpen?.();\n            } else if (!open && isOpen) {\n                onClose?.(reason);\n            }\n        },\n        whileElementsMounted: autoUpdate,\n        placement: getFloatingPlacement(alignment),\n        middleware: [\n            offset(dropdownOffset),\n            flip(),\n            shift({\n                limiter: limitShift(),\n            }),\n            size({\n                // shrink to fit available vertical space\n                apply({ availableHeight, elements }) {\n                    if (\n                        !fitAvailableHeight ||\n                        availableHeight >= elements.floating.scrollHeight\n                    ) {\n                        // reset this so that dropdown can expand as needed\n                        elements.floating.style.setProperty(\n                            elementWithDropdownStyles.tokens.availableHeight,\n                            \"\"\n                        );\n                        return;\n                    }\n\n                    elements.floating.style.setProperty(\n                        elementWithDropdownStyles.tokens.availableHeight,\n                        `${Math.max(0, availableHeight)}px`\n                    );\n                },\n            }),\n            center,\n        ],\n    });\n    const parentZIndex = useFloatingChild();\n\n    const { isMounted, styles } = useTransitionStyles(context, {\n        initial: { opacity: 0 },\n        open: { opacity: 1 },\n        duration: 300,\n    });\n    const { themeProps, themeStyle } = useInheritedThemeScope(isMounted);\n\n    const click = useClick(context, {\n        enabled,\n        toggle: clickToToggle,\n        keyboardHandlers: clickToToggle,\n    });\n    const dismiss = useDismiss(context, { enabled });\n\n    const { getReferenceProps, getFloatingProps } = useInteractions([\n        click,\n        dismiss,\n    ]);\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const dropdownRenderProps = {\n        elementWidth: referenceWidth,\n        styles: {\n            ...styles,\n            ...floatingStyles,\n            zIndex: customZIndex ?? parentZIndex ?? DEFAULT_Z_INDEX,\n        },\n        setFloatingRef: refs.setFloating,\n        getFloatingProps,\n    };\n\n    return (\n        <>\n            <div\n                ref={(node) => {\n                    elementRef.current = node;\n                    refs.setReference(node);\n                }}\n                {...getReferenceProps()}\n            >\n                {renderElement()}\n            </div>\n            {isMounted && (\n                <FloatingPortal root={rootNode}>\n                    <FloatingFocusManager\n                        context={context}\n                        modal={false}\n                        initialFocus={-1}\n                        returnFocus={false} // leads to focus trap. parent to handle the final focus state\n                    >\n                        <DropdownRenderContext.Provider\n                            value={dropdownRenderProps}\n                        >\n                            <div {...themeProps} style={themeStyle}>\n                                {renderDropdown(dropdownRenderProps)}\n                            </div>\n                        </DropdownRenderContext.Provider>\n                    </FloatingFocusManager>\n                </FloatingPortal>\n            )}\n        </>\n    );\n};\n"],"names":["getFloatingPlacement","alignment","DropdownRenderContext","createContext","elementWidth","styles","setFloatingRef","getFloatingProps","enabled","isOpen","onOpen","onClose","onDismiss","renderElement","renderDropdown","customZIndex","clickToToggle","offset","dropdownOffset","fitAvailableHeight","rootNode","positionRef","isMobile","useMaxWidthMediaQuery","elementRef","useRef","width","referenceWidth","useResizeDetector","targetRef","handleHeight","center","name","fn","x","rects","floating","window","innerWidth","refs","floatingStyles","context","useFloating","open","onOpenChange","_event","reason","whileElementsMounted","autoUpdate","placement","middleware","flip","shift","limiter","limitShift","size","apply","availableHeight","elements","scrollHeight","style","setProperty","elementWithDropdownStyles.tokens","Math","max","parentZIndex","useFloatingChild","isMounted","useTransitionStyles","initial","opacity","duration","themeProps","themeStyle","useInheritedThemeScope","click","useClick","toggle","keyboardHandlers","dismiss","useDismiss","getReferenceProps","useInteractions","dropdownRenderProps","zIndex","_a","setFloating","_jsxs","_jsx","Object","assign","ref","node","current","setReference","children","FloatingPortal","root","FloatingFocusManager","modal","initialFocus","returnFocus","Provider","value","useContext"],"mappings":"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"}
+{"version":3,"file":"element-with-dropdown.js","sources":["../../../../src/shared/dropdown-wrapper/element-with-dropdown.tsx"],"sourcesContent":["import type {\n    Middleware,\n    OpenChangeReason,\n    Placement,\n} from \"@floating-ui/react\";\nimport {\n    autoUpdate,\n    flip,\n    FloatingFocusManager,\n    FloatingPortal,\n    limitShift,\n    offset,\n    shift,\n    size,\n    useClick,\n    useDismiss,\n    useFloating,\n    useInteractions,\n    useTransitionStyles,\n} from \"@floating-ui/react\";\nimport type { CSSProperties, RefObject } from \"react\";\nimport { createContext, useContext, useEffect, useRef } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport { useFloatingChild } from \"../../overlay/use-floating-context\";\nimport { useInheritedThemeScope, useMaxWidthMediaQuery } from \"../../theme\";\nimport { useEvent, usePrevious } from \"../../util\";\nimport * as elementWithDropdownStyles from \"./element-with-dropdown.styles\";\nimport type { DropdownAlignmentType } from \"./types\";\n\nexport interface DropdownRenderProps {\n    elementWidth: number;\n    styles: CSSProperties;\n    setFloatingRef: (node: HTMLElement | null) => void;\n    getFloatingProps: (\n        userProps?: React.HTMLProps<HTMLElement>\n    ) => Record<string, unknown>;\n}\n\ninterface ElementWithDropdownProps {\n    enabled: boolean;\n    isOpen: boolean;\n    onOpen?: (() => void) | undefined;\n    onClose?: ((reason: OpenChangeReason | undefined) => void) | undefined;\n    onDismiss?: (() => void) | undefined;\n    onHide?: (() => void) | undefined;\n    renderElement: () => React.ReactNode;\n    renderDropdown: (props: DropdownRenderProps) => React.ReactNode;\n    customZIndex?: number | undefined;\n    clickToToggle?: boolean | undefined;\n    /* the distance between the reference element and the dropdown */\n    offset?: number | undefined;\n    /* the alignment of the dropdown to the left or right of the reference element */\n    alignment?: DropdownAlignmentType | undefined;\n    fitAvailableHeight?: boolean | undefined;\n    /**\n     * The root element that contains the popover element. Defaults to the document body.\n     *\n     * If the parent that contains the trigger element has a higher z-index than the popover,\n     * the popover may not be visible. Specify the parent element here instead\n     */\n    rootNode?: RefObject<HTMLElement> | undefined;\n    /** If set, the `elementWidth` refers to this instead of the reference element */\n    positionRef?: RefObject<HTMLElement> | undefined;\n}\n\nconst getFloatingPlacement = (alignment: DropdownAlignmentType): Placement => {\n    switch (alignment) {\n        case \"right\":\n            return \"bottom-end\";\n        case \"left\":\n        default:\n            return \"bottom-start\";\n    }\n};\n\nconst DEFAULT_Z_INDEX = 50;\n\nexport const DropdownRenderContext = createContext<DropdownRenderProps>({\n    elementWidth: 0,\n    styles: {},\n    setFloatingRef: () => {\n        // noop\n    },\n    getFloatingProps: () => ({}),\n});\n\nexport const useDropdownRender = () => {\n    return useContext(DropdownRenderContext);\n};\n\n/**\n * A wrapper to handle the common pattern of a field with a card-based dropdown\n * using Floating UI\n *\n * Usage:\n * - Specify `renderElement` for the main field\n * - Specify `renderDropdown` for the dropdown\n * - Use `isOpen` to control the visibility of the dropdown\n * - Handle changes in visibility with `onOpen`, `onClose` and `onDismiss`\n * - If your dropdown can resize, set the css like so: `max-height: var(--available-height);`\n * - If your dropdown has a preferred max-height, set the css like so:\n *   `max-height: min(100px, var(--available-height, infinity * 1px))`\n *\n * Pass the floating props to the dropdown:\n * ```\n * <DropdownContainer\n *   ref={setFloatingRef}\n *   style={styles}\n *   {...getFloatingProps()}\n * >\n * </DropdownContainer>\n * ```\n *\n * If you need event listeners, pass them to `getFloatingProps()`:\n * ```\n * getFloatingProps({\n *   onClick: handleOnClick\n * })\n * ```\n */\nexport const ElementWithDropdown = ({\n    enabled,\n    isOpen,\n    onOpen,\n    onClose,\n    onDismiss,\n    onHide,\n    renderElement,\n    renderDropdown,\n    customZIndex,\n    clickToToggle = false,\n    offset: dropdownOffset = 0,\n    alignment = \"left\",\n    fitAvailableHeight,\n    rootNode,\n    positionRef,\n}: ElementWithDropdownProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const isMobile = useMaxWidthMediaQuery(\"sm\");\n    const elementRef = useRef<HTMLDivElement | null>(null);\n    const { width: referenceWidth = 0 } = useResizeDetector({\n        targetRef: positionRef ?? elementRef,\n        handleHeight: false,\n    });\n    const center: Middleware = {\n        name: \"center\",\n        fn: ({ x, rects }) => {\n            const noGapInBetween =\n                x === 0 || x + rects.floating.width === window.innerWidth;\n            return {\n                x:\n                    noGapInBetween && isMobile\n                        ? (window.innerWidth - rects.floating.width) / 2\n                        : x,\n            };\n        },\n    };\n    const { refs, floatingStyles, context } = useFloating({\n        open: isOpen,\n        onOpenChange: (open, _event, reason) => {\n            if (reason === \"escape-key\") {\n                onDismiss?.();\n            } else if (open && !isOpen) {\n                onOpen?.();\n            } else if (!open && isOpen) {\n                onClose?.(reason);\n            }\n        },\n        whileElementsMounted: autoUpdate,\n        placement: getFloatingPlacement(alignment),\n        middleware: [\n            offset(dropdownOffset),\n            flip(),\n            shift({\n                limiter: limitShift(),\n            }),\n            size({\n                // shrink to fit available vertical space\n                apply({ availableHeight, elements }) {\n                    if (\n                        !fitAvailableHeight ||\n                        availableHeight >= elements.floating.scrollHeight\n                    ) {\n                        // reset this so that dropdown can expand as needed\n                        elements.floating.style.setProperty(\n                            elementWithDropdownStyles.tokens.availableHeight,\n                            \"\"\n                        );\n                        return;\n                    }\n\n                    elements.floating.style.setProperty(\n                        elementWithDropdownStyles.tokens.availableHeight,\n                        `${Math.max(0, availableHeight)}px`\n                    );\n                },\n            }),\n            center,\n        ],\n    });\n    const parentZIndex = useFloatingChild();\n\n    const { isMounted, styles } = useTransitionStyles(context, {\n        initial: { opacity: 0 },\n        open: { opacity: 1 },\n        duration: 300,\n    });\n    const { themeProps, themeStyle } = useInheritedThemeScope(isMounted);\n\n    const click = useClick(context, {\n        enabled,\n        toggle: clickToToggle,\n        keyboardHandlers: clickToToggle,\n    });\n    const dismiss = useDismiss(context, { enabled });\n\n    const { getReferenceProps, getFloatingProps } = useInteractions([\n        click,\n        dismiss,\n    ]);\n\n    // =========================================================================\n    // ON HIDE EFFECT\n    // =========================================================================\n    const prevIsMounted = usePrevious(isMounted);\n    const onHideEvent = useEvent(() => onHide?.());\n\n    useEffect(() => {\n        if (prevIsMounted && !isMounted) {\n            onHideEvent();\n        }\n    }, [prevIsMounted, isMounted, onHideEvent]);\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    const dropdownRenderProps = {\n        elementWidth: referenceWidth,\n        styles: {\n            ...styles,\n            ...floatingStyles,\n            zIndex: customZIndex ?? parentZIndex ?? DEFAULT_Z_INDEX,\n        },\n        setFloatingRef: refs.setFloating,\n        getFloatingProps,\n    };\n\n    return (\n        <>\n            <div\n                ref={(node) => {\n                    elementRef.current = node;\n                    refs.setReference(node);\n                }}\n                {...getReferenceProps()}\n            >\n                {renderElement()}\n            </div>\n            {isMounted && (\n                <FloatingPortal root={rootNode}>\n                    <FloatingFocusManager\n                        context={context}\n                        modal={false}\n                        initialFocus={-1}\n                        returnFocus={false} // leads to focus trap. parent to handle the final focus state\n                    >\n                        <DropdownRenderContext.Provider\n                            value={dropdownRenderProps}\n                        >\n                            <div {...themeProps} style={themeStyle}>\n                                {renderDropdown(dropdownRenderProps)}\n                            </div>\n                        </DropdownRenderContext.Provider>\n                    </FloatingFocusManager>\n                </FloatingPortal>\n            )}\n        </>\n    );\n};\n"],"names":["getFloatingPlacement","alignment","DropdownRenderContext","createContext","elementWidth","styles","setFloatingRef","getFloatingProps","enabled","isOpen","onOpen","onClose","onDismiss","onHide","renderElement","renderDropdown","customZIndex","clickToToggle","offset","dropdownOffset","fitAvailableHeight","rootNode","positionRef","isMobile","useMaxWidthMediaQuery","elementRef","useRef","width","referenceWidth","useResizeDetector","targetRef","handleHeight","center","name","fn","x","rects","floating","window","innerWidth","refs","floatingStyles","context","useFloating","open","onOpenChange","_event","reason","whileElementsMounted","autoUpdate","placement","middleware","flip","shift","limiter","limitShift","size","apply","availableHeight","elements","scrollHeight","style","setProperty","elementWithDropdownStyles.tokens","Math","max","parentZIndex","useFloatingChild","isMounted","useTransitionStyles","initial","opacity","duration","themeProps","themeStyle","useInheritedThemeScope","click","useClick","toggle","keyboardHandlers","dismiss","useDismiss","getReferenceProps","useInteractions","prevIsMounted","usePrevious","onHideEvent","useEvent","useEffect","dropdownRenderProps","zIndex","_a","setFloating","_jsxs","_jsx","Object","assign","ref","node","current","setReference","children","FloatingPortal","root","FloatingFocusManager","modal","initialFocus","returnFocus","Provider","value","useContext"],"mappings":"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"}

package/cjs/sidenav/sidenav.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidenav.js","sources":["../../../src/sidenav/sidenav.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useRef, useState } from \"react\";\n\nimport { useId } from \"../util\";\nimport * as styles from \"./sidenav.styles\";\nimport type { SidenavContextItem } from \"./sidenav-context\";\nimport { SidenavContext } from \"./sidenav-context\";\nimport { SidenavDrawerItem } from \"./sidenav-drawer-item\";\nimport { SidenavDrawerSubitem } from \"./sidenav-drawer-subitem\";\nimport { SidenavGroup } from \"./sidenav-group\";\nimport { SidenavItem } from \"./sidenav-item\";\nimport type { SidenavProps } from \"./types\";\n\nconst SidenavBase = ({\n    fixed = true,\n    children,\n    \"aria-label\": ariaLabel = \"Sidebar\",\n    className,\n    ...otherProps\n}: SidenavProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const menuRef = useRef<HTMLDivElement>(null);\n    const internalId = useId();\n\n    const [currentItem, setCurrentItem] = useState<\n        SidenavContextItem | undefined\n    >(undefined);\n    const [selectedItem, setSelectedItem] = useState<\n        SidenavContextItem | undefined\n    >(undefined);\n    const [previouslySelectedItemId, setPreviouslySelectedItemId] = useState<\n        string | undefined\n    >(undefined);\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    return (\n        <SidenavContext.Provider\n            value={{\n                internalId,\n                menuRef,\n                currentItem,\n                selectedItem,\n                previouslySelectedItemId,\n                setCurrentItem,\n                setSelectedItem,\n                setPreviouslySelectedItemId,\n            }}\n        >\n            <div\n                ref={wrapperRef}\n                {...otherProps}\n                className={clsx(\n                    styles.wrapper,\n                    fixed && styles.wrapperFixed,\n                    className\n                )}\n            >\n                <nav\n                    ref={menuRef}\n                    aria-label={ariaLabel}\n                    className={clsx(\n                        styles.containerBase,\n                        styles.desktopContainer\n                    )}\n                >\n                    {children}\n                </nav>\n                {/** NOTE: Since mobile view not supported yet, children will not be rendered */}\n                <nav\n                    className={clsx(\n                        styles.containerBase,\n                        styles.mobileContainer\n                    )}\n                ></nav>\n            </div>\n        </SidenavContext.Provider>\n    );\n};\n\n/**\n * A fixed sidebar navigation component for multi-level page navigation.\n *\n * Use `Sidenav` to present a persistent icon-based navigation rail with\n * optional menu drawers.\n */\nexport const Sidenav = Object.assign(SidenavBase, {\n    /** Renders a group of navigation items, optionally separated by a divider. */\n    Group: SidenavGroup,\n    /** Renders a single icon-and-label navigation entry that can open a menu drawer. */\n    Item: SidenavItem,\n    /** Renders a menu item inside an item's drawer, with optional collapsible sub-items. */\n    DrawerItem: SidenavDrawerItem,\n    /** Renders a leaf-level navigation entry inside a `Sidenav.DrawerItem`. */\n    DrawerSubitem: SidenavDrawerSubitem,\n});\n"],"names":["Sidenav","Object","assign","_a","fixed","children","ariaLabel","className","otherProps","__rest","wrapperRef","useRef","menuRef","internalId","useId","currentItem","setCurrentItem","useState","undefined","selectedItem","setSelectedItem","previouslySelectedItemId","setPreviouslySelectedItemId","_jsx","SidenavContext","Provider","value","_jsxs","ref","clsx","styles.wrapper","styles.wrapperFixed","styles.containerBase","styles.desktopContainer","styles.mobileContainer","Group","SidenavGroup","Item","SidenavItem","DrawerItem","SidenavDrawerItem","DrawerSubitem","SidenavDrawerSubitem"],"mappings":"0mBAaA,MA6EaA,EAAUC,OAAOC,QA7ETC,IAAA,IAAAC,MACjBA,GAAQ,EAAIC,SACZA,EACA,aAAcC,EAAY,UAASC,UACnCA,GAASJ,EACNK,EAAUC,EAAAA,OAAAN,EALI,+CAUjB,MAAMO,EAAaC,EAAAA,OAAuB,MACpCC,EAAUD,EAAAA,OAAuB,MACjCE,EAAaC,EAAAA,SAEZC,EAAaC,GAAkBC,EAAAA,cAEpCC,IACKC,EAAcC,GAAmBH,EAAAA,cAEtCC,IACKG,EAA0BC,GAA+BL,EAAAA,cAE9DC,GAKF,OACIK,MAACC,EAAAA,eAAeC,SAAQ,CACpBC,MAAO,CACHb,aACAD,UACAG,cACAI,eACAE,2BACAL,iBACAI,kBACAE,+BACHjB,SAEDsB,OAAA,MAAA1B,OAAAC,OAAA,CACI0B,IAAKlB,GACDF,EAAU,CACdD,UAAWsB,UACPC,EAAAA,QACA1B,GAAS2B,eACTxB,GACHF,SAAA,CAEDkB,MAAA,MAAA,CACIK,IAAKhB,EAAO,aACAN,EACZC,UAAWsB,EAAAA,QACPG,EAAAA,cACAC,oBACH5B,SAEAA,IAGLkB,EAAAA,IAAA,MAAA,CACIhB,UAAWsB,EAAAA,QACPG,EAAAA,cACAE,EAAAA,wBAIU,GAUgB,CAE9CC,MAAOC,EAAAA,aAEPC,KAAMC,EAAAA,YAENC,WAAYC,EAAAA,kBAEZC,cAAeC,EAAAA"}
+{"version":3,"file":"sidenav.js","sources":["../../../src/sidenav/sidenav.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useRef, useState } from \"react\";\n\nimport { useId } from \"../util\";\nimport * as styles from \"./sidenav.styles\";\nimport type { SidenavContextItem } from \"./sidenav-context\";\nimport { SidenavContext } from \"./sidenav-context\";\nimport { SidenavDrawerItem } from \"./sidenav-drawer-item\";\nimport { SidenavDrawerSubitem } from \"./sidenav-drawer-subitem\";\nimport { SidenavGroup } from \"./sidenav-group\";\nimport { SidenavItem } from \"./sidenav-item\";\nimport type { SidenavProps } from \"./types\";\n\nconst SidenavBase = ({\n    fixed = true,\n    children,\n    \"aria-label\": ariaLabel = \"Sidebar\",\n    className,\n    ...otherProps\n}: SidenavProps) => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const menuRef = useRef<HTMLDivElement>(null);\n    const internalId = useId();\n\n    const [currentItem, setCurrentItem] = useState<\n        SidenavContextItem | undefined\n    >(undefined);\n    const [selectedItem, setSelectedItem] = useState<\n        SidenavContextItem | undefined\n    >(undefined);\n    const [previouslySelectedItemId, setPreviouslySelectedItemId] = useState<\n        string | undefined\n    >(undefined);\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    return (\n        <SidenavContext.Provider\n            value={{\n                internalId,\n                menuRef,\n                currentItem,\n                selectedItem,\n                previouslySelectedItemId,\n                setCurrentItem,\n                setSelectedItem,\n                setPreviouslySelectedItemId,\n            }}\n        >\n            <div\n                ref={wrapperRef}\n                {...otherProps}\n                className={clsx(\n                    styles.wrapper,\n                    fixed && styles.wrapperFixed,\n                    className\n                )}\n            >\n                <nav\n                    ref={menuRef}\n                    aria-label={ariaLabel}\n                    className={clsx(\n                        styles.containerBase,\n                        styles.desktopContainer\n                    )}\n                >\n                    {children}\n                </nav>\n                {/** NOTE: Since mobile view not supported yet, children will not be rendered */}\n                <nav\n                    className={clsx(\n                        styles.containerBase,\n                        styles.mobileContainer\n                    )}\n                ></nav>\n            </div>\n        </SidenavContext.Provider>\n    );\n};\n\n// @catalog\n/**\n * A fixed sidebar navigation component for multi-level page navigation.\n *\n * Use `Sidenav` to present a persistent icon-based navigation rail with\n * optional menu drawers.\n */\nexport const Sidenav = Object.assign(SidenavBase, {\n    /** Renders a group of navigation items, optionally separated by a divider. */\n    Group: SidenavGroup,\n    /** Renders a single icon-and-label navigation entry that can open a menu drawer. */\n    Item: SidenavItem,\n    /** Renders a menu item inside an item's drawer, with optional collapsible sub-items. */\n    DrawerItem: SidenavDrawerItem,\n    /** Renders a leaf-level navigation entry inside a `Sidenav.DrawerItem`. */\n    DrawerSubitem: SidenavDrawerSubitem,\n});\n"],"names":["Sidenav","Object","assign","_a","fixed","children","ariaLabel","className","otherProps","__rest","wrapperRef","useRef","menuRef","internalId","useId","currentItem","setCurrentItem","useState","undefined","selectedItem","setSelectedItem","previouslySelectedItemId","setPreviouslySelectedItemId","_jsx","SidenavContext","Provider","value","_jsxs","ref","clsx","styles.wrapper","styles.wrapperFixed","styles.containerBase","styles.desktopContainer","styles.mobileContainer","Group","SidenavGroup","Item","SidenavItem","DrawerItem","SidenavDrawerItem","DrawerSubitem","SidenavDrawerSubitem"],"mappings":"0mBAaA,MA8EaA,EAAUC,OAAOC,QA9ETC,IAAA,IAAAC,MACjBA,GAAQ,EAAIC,SACZA,EACA,aAAcC,EAAY,UAASC,UACnCA,GAASJ,EACNK,EAAUC,EAAAA,OAAAN,EALI,+CAUjB,MAAMO,EAAaC,EAAAA,OAAuB,MACpCC,EAAUD,EAAAA,OAAuB,MACjCE,EAAaC,EAAAA,SAEZC,EAAaC,GAAkBC,EAAAA,cAEpCC,IACKC,EAAcC,GAAmBH,EAAAA,cAEtCC,IACKG,EAA0BC,GAA+BL,EAAAA,cAE9DC,GAKF,OACIK,MAACC,EAAAA,eAAeC,SAAQ,CACpBC,MAAO,CACHb,aACAD,UACAG,cACAI,eACAE,2BACAL,iBACAI,kBACAE,+BACHjB,SAEDsB,OAAA,MAAA1B,OAAAC,OAAA,CACI0B,IAAKlB,GACDF,EAAU,CACdD,UAAWsB,UACPC,EAAAA,QACA1B,GAAS2B,eACTxB,GACHF,SAAA,CAEDkB,MAAA,MAAA,CACIK,IAAKhB,EAAO,aACAN,EACZC,UAAWsB,EAAAA,QACPG,EAAAA,cACAC,oBACH5B,SAEAA,IAGLkB,EAAAA,IAAA,MAAA,CACIhB,UAAWsB,EAAAA,QACPG,EAAAA,cACAE,EAAAA,wBAIU,GAWgB,CAE9CC,MAAOC,EAAAA,aAEPC,KAAMC,EAAAA,YAENC,WAAYC,EAAAA,kBAEZC,cAAeC,EAAAA"}

package/cjs/singpass-button/singpass-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"singpass-button.js","sources":["../../../src/singpass-button/singpass-button.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef } from \"react\";\n\nimport { getSpLogo } from \"./singpass-assets\";\nimport * as styles from \"./singpass-button.styles\";\nimport type {\n    SingpassButtonProps,\n    SingpassButtonRef,\n    SingpassButtonSizeType,\n    SingpassButtonStyleType,\n} from \"./types\";\n\nconst styleClassMap: Record<SingpassButtonStyleType, string> = {\n    \"red-filled\": styles.mainStyleRedFilled,\n    \"white-filled\": styles.mainStyleWhiteFilled,\n};\n\nconst sizeClassMap: Record<SingpassButtonSizeType, string> = {\n    small: styles.mainSizeSmall,\n    large: styles.mainSizeLarge,\n    default: \"\",\n};\n\nconst Component = (props: SingpassButtonProps, ref: SingpassButtonRef) => {\n    const {\n        styleType = \"white-filled\",\n        sizeType = \"default\",\n        className,\n        \"data-testid\": testId = \"singpass-button\",\n        ...otherProps\n    } = props;\n\n    return (\n        <button\n            ref={ref}\n            data-testid={testId}\n            {...otherProps}\n            aria-label=\"Log in with Singpass\"\n            className={clsx(\n                styles.main,\n                sizeClassMap[sizeType],\n                styleClassMap[styleType],\n                className\n            )}\n        >\n            <span\n                className={clsx(\n                    styles.svgContainer,\n                    sizeType === \"large\" && styles.svgContainerSizeLarge\n                )}\n            >\n                <img src={getSpLogo(styleType)} alt=\"\" />\n            </span>\n        </button>\n    );\n};\n\nconst BaseSingpassButton = forwardRef(Component);\n\nconst DefaultSingpassButtonComponent = (\n    props: SingpassButtonProps,\n    ref: SingpassButtonRef\n) => (\n    <BaseSingpassButton\n        {...props}\n        sizeType={props.sizeType ?? \"default\"}\n        ref={ref}\n    />\n);\nDefaultSingpassButtonComponent.displayName = \"SingpassButton.Default\";\n\nconst SmallSingpassButtonComponent = (\n    props: SingpassButtonProps,\n    ref: SingpassButtonRef\n) => <BaseSingpassButton {...props} sizeType=\"small\" ref={ref} />;\nSmallSingpassButtonComponent.displayName = \"SingpassButton.Small\";\n\nconst LargeSingpassButtonComponent = (\n    props: SingpassButtonProps,\n    ref: SingpassButtonRef\n) => <BaseSingpassButton {...props} sizeType=\"large\" ref={ref} />;\nLargeSingpassButtonComponent.displayName = \"SingpassButton.Large\";\n\n/**\n * Call-to-action for Singpass authentication,\n * following the brand [guidelines](https://docs.developer.singpass.gov.sg/docs/products/login/singpass-button-guidelines-for-developers-and-designers).\n *\n * Use `SingpassButton` to let users log in with their Singpass account.\n */\nexport const SingpassButton = Object.assign(BaseSingpassButton, {\n    /** @deprecated Use the `sizeType` prop instead: `<SingpassButton>` or `<SingpassButton sizeType=\"default\">` */\n    Default: forwardRef(DefaultSingpassButtonComponent),\n    /** @deprecated Use the `sizeType` prop instead: `<SingpassButton sizeType=\"small\">` */\n    Small: forwardRef(SmallSingpassButtonComponent),\n    /** @deprecated Use the `sizeType` prop instead: `<SingpassButton sizeType=\"large\">` */\n    Large: forwardRef(LargeSingpassButtonComponent),\n});\n"],"names":["styleClassMap","styles.mainStyleRedFilled","styles.mainStyleWhiteFilled","sizeClassMap","small","styles.mainSizeSmall","large","styles.mainSizeLarge","default","BaseSingpassButton","forwardRef","props","ref","styleType","sizeType","className","testId","otherProps","__rest","_jsx","Object","assign","clsx","styles.main","children","styles.svgContainer","styles.svgContainerSizeLarge","src","getSpLogo","alt","DefaultSingpassButtonComponent","_a","displayName","SmallSingpassButtonComponent","LargeSingpassButtonComponent","SingpassButton","Default","Small","Large"],"mappings":"sRAYA,MAAMA,EAAyD,CAC3D,aAAcC,EAAAA,mBACd,eAAgBC,EAAAA,sBAGdC,EAAuD,CACzDC,MAAOC,EAAAA,cACPC,MAAOC,EAAAA,cACPC,QAAS,IAqCPC,EAAqBC,EAAAA,YAlCT,CAACC,EAA4BC,KAC3C,MAAMC,UACFA,EAAY,eAAcC,SAC1BA,EAAW,UAASC,UACpBA,EACA,cAAeC,EAAS,mBAExBL,EADGM,EAAUC,EAAAA,OACbP,EANE,CAAA,YAAA,WAAA,YAAA,gBAQN,OACIQ,EAAAA,IAAA,SAAAC,OAAAC,OAAA,CACIT,IAAKA,EAAG,cACKI,GACTC,EAAU,CAAA,aACH,uBACXF,UAAWO,EAAAA,QACPC,EAAAA,KACApB,EAAaW,GACbd,EAAca,GACdE,GACHS,SAEDL,EAAAA,IAAA,OAAA,CACIJ,UAAWO,EAAAA,QACPG,EAAAA,aACa,UAAbX,GAAwBY,EAAAA,uBAC3BF,SAEDL,EAAAA,IAAA,MAAA,CAAKQ,IAAKC,EAAAA,UAAUf,GAAYgB,IAAI,SAEnC,IAMXC,EAAiC,CACnCnB,EACAC,WACC,OACDO,EAAAA,IAACV,EAAkBW,OAAAC,OAAA,CAAA,EACXV,EAAK,CACTG,SAAwB,QAAdiB,EAAApB,EAAMG,gBAAQ,IAAAiB,EAAAA,EAAI,UAC5BnB,IAAKA,IACP,EAENkB,EAA+BE,YAAc,yBAE7C,MAAMC,EAA+B,CACjCtB,EACAC,IACCO,EAAAA,IAACV,mBAAuBE,EAAK,CAAEG,SAAS,QAAQF,IAAKA,KAC1DqB,EAA6BD,YAAc,uBAE3C,MAAME,EAA+B,CACjCvB,EACAC,IACCO,EAAAA,IAACV,mBAAuBE,EAAK,CAAEG,SAAS,QAAQF,IAAKA,KAC1DsB,EAA6BF,YAAc,6BAQ9BG,EAAiBf,OAAOC,OAAOZ,EAAoB,CAE5D2B,QAAS1B,EAAAA,WAAWoB,GAEpBO,MAAO3B,EAAAA,WAAWuB,GAElBK,MAAO5B,EAAAA,WAAWwB"}
+{"version":3,"file":"singpass-button.js","sources":["../../../src/singpass-button/singpass-button.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef } from \"react\";\n\nimport { getSpLogo } from \"./singpass-assets\";\nimport * as styles from \"./singpass-button.styles\";\nimport type {\n    SingpassButtonProps,\n    SingpassButtonRef,\n    SingpassButtonSizeType,\n    SingpassButtonStyleType,\n} from \"./types\";\n\nconst styleClassMap: Record<SingpassButtonStyleType, string> = {\n    \"red-filled\": styles.mainStyleRedFilled,\n    \"white-filled\": styles.mainStyleWhiteFilled,\n};\n\nconst sizeClassMap: Record<SingpassButtonSizeType, string> = {\n    small: styles.mainSizeSmall,\n    large: styles.mainSizeLarge,\n    default: \"\",\n};\n\nconst Component = (props: SingpassButtonProps, ref: SingpassButtonRef) => {\n    const {\n        styleType = \"white-filled\",\n        sizeType = \"default\",\n        className,\n        \"data-testid\": testId = \"singpass-button\",\n        ...otherProps\n    } = props;\n\n    return (\n        <button\n            ref={ref}\n            data-testid={testId}\n            {...otherProps}\n            aria-label=\"Log in with Singpass\"\n            className={clsx(\n                styles.main,\n                sizeClassMap[sizeType],\n                styleClassMap[styleType],\n                className\n            )}\n        >\n            <span\n                className={clsx(\n                    styles.svgContainer,\n                    sizeType === \"large\" && styles.svgContainerSizeLarge\n                )}\n            >\n                <img src={getSpLogo(styleType)} alt=\"\" />\n            </span>\n        </button>\n    );\n};\n\nconst BaseSingpassButton = forwardRef(Component);\n\nconst DefaultSingpassButtonComponent = (\n    props: SingpassButtonProps,\n    ref: SingpassButtonRef\n) => (\n    <BaseSingpassButton\n        {...props}\n        sizeType={props.sizeType ?? \"default\"}\n        ref={ref}\n    />\n);\nDefaultSingpassButtonComponent.displayName = \"SingpassButton.Default\";\n\nconst SmallSingpassButtonComponent = (\n    props: SingpassButtonProps,\n    ref: SingpassButtonRef\n) => <BaseSingpassButton {...props} sizeType=\"small\" ref={ref} />;\nSmallSingpassButtonComponent.displayName = \"SingpassButton.Small\";\n\nconst LargeSingpassButtonComponent = (\n    props: SingpassButtonProps,\n    ref: SingpassButtonRef\n) => <BaseSingpassButton {...props} sizeType=\"large\" ref={ref} />;\nLargeSingpassButtonComponent.displayName = \"SingpassButton.Large\";\n\n// @catalog\n/**\n * Call-to-action for Singpass authentication,\n * following the brand [guidelines](https://docs.developer.singpass.gov.sg/docs/products/login/singpass-button-guidelines-for-developers-and-designers).\n *\n * Use `SingpassButton` to let users log in with their Singpass account.\n */\nexport const SingpassButton = Object.assign(BaseSingpassButton, {\n    /** @deprecated Use the `sizeType` prop instead: `<SingpassButton>` or `<SingpassButton sizeType=\"default\">` */\n    Default: forwardRef(DefaultSingpassButtonComponent),\n    /** @deprecated Use the `sizeType` prop instead: `<SingpassButton sizeType=\"small\">` */\n    Small: forwardRef(SmallSingpassButtonComponent),\n    /** @deprecated Use the `sizeType` prop instead: `<SingpassButton sizeType=\"large\">` */\n    Large: forwardRef(LargeSingpassButtonComponent),\n});\n"],"names":["styleClassMap","styles.mainStyleRedFilled","styles.mainStyleWhiteFilled","sizeClassMap","small","styles.mainSizeSmall","large","styles.mainSizeLarge","default","BaseSingpassButton","forwardRef","props","ref","styleType","sizeType","className","testId","otherProps","__rest","_jsx","Object","assign","clsx","styles.main","children","styles.svgContainer","styles.svgContainerSizeLarge","src","getSpLogo","alt","DefaultSingpassButtonComponent","_a","displayName","SmallSingpassButtonComponent","LargeSingpassButtonComponent","SingpassButton","Default","Small","Large"],"mappings":"sRAYA,MAAMA,EAAyD,CAC3D,aAAcC,EAAAA,mBACd,eAAgBC,EAAAA,sBAGdC,EAAuD,CACzDC,MAAOC,EAAAA,cACPC,MAAOC,EAAAA,cACPC,QAAS,IAqCPC,EAAqBC,EAAAA,YAlCT,CAACC,EAA4BC,KAC3C,MAAMC,UACFA,EAAY,eAAcC,SAC1BA,EAAW,UAASC,UACpBA,EACA,cAAeC,EAAS,mBAExBL,EADGM,EAAUC,EAAAA,OACbP,EANE,CAAA,YAAA,WAAA,YAAA,gBAQN,OACIQ,EAAAA,IAAA,SAAAC,OAAAC,OAAA,CACIT,IAAKA,EAAG,cACKI,GACTC,EAAU,CAAA,aACH,uBACXF,UAAWO,EAAAA,QACPC,EAAAA,KACApB,EAAaW,GACbd,EAAca,GACdE,GACHS,SAEDL,EAAAA,IAAA,OAAA,CACIJ,UAAWO,EAAAA,QACPG,EAAAA,aACa,UAAbX,GAAwBY,EAAAA,uBAC3BF,SAEDL,EAAAA,IAAA,MAAA,CAAKQ,IAAKC,EAAAA,UAAUf,GAAYgB,IAAI,SAEnC,IAMXC,EAAiC,CACnCnB,EACAC,WACC,OACDO,EAAAA,IAACV,EAAkBW,OAAAC,OAAA,CAAA,EACXV,EAAK,CACTG,SAAwB,QAAdiB,EAAApB,EAAMG,gBAAQ,IAAAiB,EAAAA,EAAI,UAC5BnB,IAAKA,IACP,EAENkB,EAA+BE,YAAc,yBAE7C,MAAMC,EAA+B,CACjCtB,EACAC,IACCO,EAAAA,IAACV,mBAAuBE,EAAK,CAAEG,SAAS,QAAQF,IAAKA,KAC1DqB,EAA6BD,YAAc,uBAE3C,MAAME,EAA+B,CACjCvB,EACAC,IACCO,EAAAA,IAACV,mBAAuBE,EAAK,CAAEG,SAAS,QAAQF,IAAKA,KAC1DsB,EAA6BF,YAAc,6BAS9BG,EAAiBf,OAAOC,OAAOZ,EAAoB,CAE5D2B,QAAS1B,EAAAA,WAAWoB,GAEpBO,MAAO3B,EAAAA,WAAWuB,GAElBK,MAAO5B,EAAAA,WAAWwB"}

package/cjs/singpass-button/singpass-button.styles.js

@@ -1,2 +1,2 @@
-"use strict";require("./singpass-button.styles_1miyex3.css");exports.main="m18jjb1",exports.mainSizeLarge="mijymjd",exports.mainSizeSmall="m6wtgnj",exports.mainStyleRedFilled="m1y6qkg6",exports.mainStyleWhiteFilled="mmpvnp1",exports.svgContainer="s1mju8fq",exports.svgContainerSizeLarge="sreiq2p";
+"use strict";require("./singpass-button.styles_1fj2lru.css");exports.main="m18jjb1",exports.mainSizeLarge="mijymjd",exports.mainSizeSmall="m6wtgnj",exports.mainStyleRedFilled="m1y6qkg6",exports.mainStyleWhiteFilled="mmpvnp1",exports.svgContainer="s1mju8fq",exports.svgContainerSizeLarge="sreiq2p";
 //# sourceMappingURL=singpass-button.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"singpass-button.styles.js","sources":["../../../src/singpass-button/singpass-button.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { ComponentToken, Motion, Spacing } from \"../theme\";\n\n// =============================================================================\n// MAIN BUTTON\n// =============================================================================\nexport const main = css`\n    padding: ${Spacing[\"spacing-8\"]} ${Spacing[\"spacing-16\"]};\n    transition: all ${Motion[\"duration-250\"]} ${Motion[\"ease-default\"]};\n    border-radius: ${ComponentToken.Button[\"radius\"]};\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-height: 3rem;\n`;\n\nexport const mainSizeSmall = css`\n    height: 2.5rem;\n    min-height: unset;\n`;\n\nexport const mainSizeLarge = css`\n    min-height: 4rem;\n`;\n\nexport const mainStyleRedFilled = css`\n    background-color: #f4333d;\n    border: none;\n\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: #b0262d;\n        }\n    }\n`;\n\nexport const mainStyleWhiteFilled = css`\n    background-color: #ffffff;\n    border: 1px #c8c9cc solid;\n\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: #f5f5f7;\n        }\n    }\n`;\n\n// =============================================================================\n// SVG CONTAINER\n// =============================================================================\nexport const svgContainer = css`\n    height: 1.5rem;\n\n    img {\n        height: 100%;\n    }\n`;\n\nexport const svgContainerSizeLarge = css`\n    height: 2.5rem;\n`;\n"],"names":[],"mappings":"yGAOiB,gCAgBS,gCALA,qCASK,wCAYE,+BAeR,yCAQS"}
+{"version":3,"file":"singpass-button.styles.js","sources":["../../../src/singpass-button/singpass-button.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, ComponentToken, Motion, Spacing } from \"../theme\";\n\n// =============================================================================\n// MAIN BUTTON\n// =============================================================================\nexport const main = css`\n    padding: ${Spacing[\"spacing-8\"]} ${Spacing[\"spacing-16\"]};\n    transition: all ${Motion[\"duration-250\"]} ${Motion[\"ease-default\"]};\n    border-radius: ${ComponentToken.Button[\"radius\"]};\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    min-height: 3rem;\n`;\n\nexport const mainSizeSmall = css`\n    min-height: 2.5rem;\n    padding: calc(${Spacing[\"spacing-8\"]} - ${Border[\"width-010\"]})\n        ${Spacing[\"spacing-16\"]};\n`;\n\nexport const mainSizeLarge = css`\n    min-height: 4rem;\n`;\n\nexport const mainStyleRedFilled = css`\n    background-color: #f4333d;\n    border: none;\n\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: #b0262d;\n        }\n    }\n`;\n\nexport const mainStyleWhiteFilled = css`\n    background-color: #ffffff;\n    border: 1px #c8c9cc solid;\n\n    &:hover,\n    &:active {\n        @media (pointer: fine) {\n            background-color: #f5f5f7;\n        }\n    }\n`;\n\n// =============================================================================\n// SVG CONTAINER\n// =============================================================================\nexport const svgContainer = css`\n    height: 1.5rem;\n\n    img {\n        height: 100%;\n    }\n`;\n\nexport const svgContainerSizeLarge = css`\n    height: 2.5rem;\n`;\n"],"names":[],"mappings":"yGAOiB,gCAiBS,gCANA,qCAUK,wCAYE,+BAeR,yCAQS"}

package/cjs/singpass-button/{singpass-button.styles_1miyex3.css → singpass-button.styles_1fj2lru.css}

@@ -1,5 +1,5 @@
 @layer fds{.m18jjb1{padding:var(--fds-spacing-8) var(--fds-spacing-16);-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);border-radius:var(--fds-button-radius);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;min-height:3rem;}
-.m6wtgnj{height:2.5rem;min-height:unset;}
+.m6wtgnj{min-height:2.5rem;padding:calc(var(--fds-spacing-8) - var(--fds-border-width-010)) var(--fds-spacing-16);}
 .mijymjd{min-height:4rem;}
 .m1y6qkg6{background-color:#f4333d;border:none;}@media (pointer: fine){.m1y6qkg6:hover,.m1y6qkg6:active{background-color:#b0262d;}}
 .mmpvnp1{background-color:#ffffff;border:1px #c8c9cc solid;}@media (pointer: fine){.mmpvnp1:hover,.mmpvnp1:active{background-color:#f5f5f7;}}

package/cjs/smart-app-banner/smart-app-banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"smart-app-banner.js","sources":["../../../src/smart-app-banner/smart-app-banner.tsx"],"sourcesContent":["import { CrossIcon } from \"@lifesg/react-icons/cross\";\nimport { StarIcon } from \"@lifesg/react-icons/star\";\nimport { StarFillIcon } from \"@lifesg/react-icons/star-fill\";\nimport { StarHalfIcon } from \"@lifesg/react-icons/star-half\";\nimport clsx from \"clsx\";\nimport React, { useContext, useRef } from \"react\";\n\nimport { Button } from \"../button\";\nimport { ClickableIcon } from \"../shared/clickable-icon\";\nimport { useApplyStyle } from \"../theme\";\nimport { ThemeContext } from \"../theme/theme-provider/context\";\nimport { Typography } from \"../typography\";\nimport { mergeRefs } from \"../util\";\nimport * as styles from \"./smart-app-banner.styles\";\nimport type { SmartAppBannerProps } from \"./types\";\n\nconst APP_ICON =\n    \"https://assets.life.gov.sg/react-design-system/img/app-icon/app-icon.png\";\n\nconst ID = \"smart-app-banner\";\nconst MAX_STARS = 5;\n\nfunction SmartAppBannerComponent(\n    props: SmartAppBannerProps,\n    ref: React.Ref<HTMLDivElement>\n): JSX.Element {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const {\n        className,\n        show,\n        href,\n        content,\n        offset = 0,\n        icon = APP_ICON,\n        animated = false,\n        onDismiss,\n        onClick,\n    } = props;\n\n    const {\n        title,\n        message,\n        buttonLabel,\n        iconAriaLabel,\n        buttonAriaLabel,\n        numberOfStars,\n    } = content;\n\n    const containerRef = useRef<HTMLDivElement>(null);\n    const theme = useContext(ThemeContext);\n    const isDark = theme?.mode === \"dark\";\n\n    useApplyStyle(containerRef, {\n        [styles.tokens.container.top]: `${offset}px`,\n    });\n\n    const ariaLabels = {\n        dismiss: \"Close banner\",\n        icon: iconAriaLabel ?? \"\",\n        cta: buttonAriaLabel ?? buttonLabel,\n    };\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleClick = (\n        e: React.MouseEvent<HTMLDivElement | HTMLButtonElement>\n    ) => {\n        e.stopPropagation();\n        window.open(href, \"_blank\", \"noreferrer\");\n        onClick?.();\n    };\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n\n    const generateStarRating = () => {\n        if (isNaN(numberOfStars) || numberOfStars < 0) {\n            return;\n        }\n\n        const stars = [];\n        const hasHalfStar = numberOfStars - Math.floor(numberOfStars) >= 0.4;\n\n        for (let i = 0; i < Math.floor(numberOfStars); i++) {\n            stars.push(\n                <StarFillIcon\n                    key={`star${i}`}\n                    aria-hidden\n                    className={styles.starIcon}\n                />\n            );\n        }\n        if (hasHalfStar) {\n            stars.push(\n                <StarHalfIcon\n                    key={`halfstar`}\n                    aria-hidden\n                    className={styles.starIcon}\n                />\n            );\n        }\n        if (stars.length < MAX_STARS) {\n            const remaining = 5 - stars.length;\n            for (let i = 0; i < remaining; i++) {\n                stars.push(\n                    <StarIcon\n                        key={`emptystar${i}`}\n                        aria-hidden\n                        className={styles.starIcon}\n                    />\n                );\n            }\n        }\n\n        /* maximum of 5 stars */\n        return (\n            <div\n                className={styles.ratingContainer}\n                role=\"group\"\n                aria-label={`A rating of ${numberOfStars} out of ${MAX_STARS} stars`}\n                data-testid={`${ID}-star-rating`}\n            >\n                {stars.slice(0, MAX_STARS)}\n            </div>\n        );\n    };\n\n    return (\n        <>\n            {show && (\n                <div\n                    ref={mergeRefs(containerRef, ref)}\n                    data-testid={ID}\n                    className={clsx(\n                        styles.smartAppBannerContainer,\n                        isDark\n                            ? styles.smartAppBannerContainerDark\n                            : styles.smartAppBannerContainerLight,\n                        animated && styles.smartAppBannerContainerAnimated,\n                        className\n                    )}\n                >\n                    <div\n                        className={styles.proceedContainer}\n                        onClick={handleClick}\n                        id={`${ID}-proceed`}\n                        data-testid={`${ID}-proceed-container`}\n                    >\n                        <img\n                            className={styles.bannerIcon}\n                            src={icon}\n                            alt={ariaLabels.icon}\n                        />\n                        <div className={styles.textContainer}>\n                            <Typography.BodySM className={styles.title}>\n                                {title}\n                            </Typography.BodySM>\n                            <Typography.BodyXS className={styles.description}>\n                                {message}\n                            </Typography.BodyXS>\n                            {generateStarRating()}\n                        </div>\n                        <div className={styles.buttonContainer}>\n                            <Button\n                                className={styles.button}\n                                type=\"button\"\n                                onClick={handleClick}\n                                aria-label={ariaLabels.cta}\n                                sizeType=\"small\"\n                            >\n                                {buttonLabel}\n                            </Button>\n                        </div>\n                    </div>\n                    <div\n                        className={styles.dismissContainer}\n                        onClick={onDismiss}\n                        id={`${ID}-dismiss`}\n                        data-testid={`${ID}-dismiss-container`}\n                    >\n                        <ClickableIcon\n                            className={styles.dismissButton}\n                            aria-label={ariaLabels.dismiss}\n                        >\n                            <CrossIcon className={styles.cross} />\n                        </ClickableIcon>\n                    </div>\n                </div>\n            )}\n        </>\n    );\n}\n\n/**\n * A fixed top banner that promotes a mobile app and links to its store listing.\n *\n * Use `SmartAppBanner` to invite users to install or open the native app.\n */\nexport const SmartAppBanner = React.forwardRef(SmartAppBannerComponent);\n"],"names":["APP_ICON","ID","SmartAppBanner","React","forwardRef","props","ref","className","show","href","content","offset","icon","animated","onDismiss","onClick","title","message","buttonLabel","iconAriaLabel","buttonAriaLabel","numberOfStars","containerRef","useRef","theme","useContext","ThemeContext","isDark","mode","useApplyStyle","styles.tokens","container","top","ariaLabels","dismiss","cta","handleClick","e","stopPropagation","window","open","_jsx","_Fragment","children","_jsxs","mergeRefs","clsx","styles.smartAppBannerContainer","styles.smartAppBannerContainerDark","styles.smartAppBannerContainerLight","styles.smartAppBannerContainerAnimated","styles.proceedContainer","id","styles.bannerIcon","src","alt","styles.textContainer","Typography","BodySM","styles.title","BodyXS","styles.description","isNaN","stars","hasHalfStar","Math","floor","i","push","StarFillIcon","styles.starIcon","StarHalfIcon","length","remaining","StarIcon","styles.ratingContainer","role","slice","generateStarRating","styles.buttonContainer","Button","styles.button","type","sizeType","styles.dismissContainer","ClickableIcon","styles.dismissButton","CrossIcon","styles.cross"],"mappings":"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"}
+{"version":3,"file":"smart-app-banner.js","sources":["../../../src/smart-app-banner/smart-app-banner.tsx"],"sourcesContent":["import { CrossIcon } from \"@lifesg/react-icons/cross\";\nimport { StarIcon } from \"@lifesg/react-icons/star\";\nimport { StarFillIcon } from \"@lifesg/react-icons/star-fill\";\nimport { StarHalfIcon } from \"@lifesg/react-icons/star-half\";\nimport clsx from \"clsx\";\nimport React, { useContext, useRef } from \"react\";\n\nimport { Button } from \"../button\";\nimport { ClickableIcon } from \"../shared/clickable-icon\";\nimport { useApplyStyle } from \"../theme\";\nimport { ThemeContext } from \"../theme/theme-provider/context\";\nimport { Typography } from \"../typography\";\nimport { mergeRefs } from \"../util\";\nimport * as styles from \"./smart-app-banner.styles\";\nimport type { SmartAppBannerProps } from \"./types\";\n\nconst APP_ICON =\n    \"https://assets.life.gov.sg/react-design-system/img/app-icon/app-icon.png\";\n\nconst ID = \"smart-app-banner\";\nconst MAX_STARS = 5;\n\nfunction SmartAppBannerComponent(\n    props: SmartAppBannerProps,\n    ref: React.Ref<HTMLDivElement>\n): JSX.Element {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const {\n        className,\n        show,\n        href,\n        content,\n        offset = 0,\n        icon = APP_ICON,\n        animated = false,\n        onDismiss,\n        onClick,\n    } = props;\n\n    const {\n        title,\n        message,\n        buttonLabel,\n        iconAriaLabel,\n        buttonAriaLabel,\n        numberOfStars,\n    } = content;\n\n    const containerRef = useRef<HTMLDivElement>(null);\n    const theme = useContext(ThemeContext);\n    const isDark = theme?.mode === \"dark\";\n\n    useApplyStyle(containerRef, {\n        [styles.tokens.container.top]: `${offset}px`,\n    });\n\n    const ariaLabels = {\n        dismiss: \"Close banner\",\n        icon: iconAriaLabel ?? \"\",\n        cta: buttonAriaLabel ?? buttonLabel,\n    };\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleClick = (\n        e: React.MouseEvent<HTMLDivElement | HTMLButtonElement>\n    ) => {\n        e.stopPropagation();\n        window.open(href, \"_blank\", \"noreferrer\");\n        onClick?.();\n    };\n\n    // =============================================================================\n    // RENDER FUNCTION\n    // =============================================================================\n\n    const generateStarRating = () => {\n        if (isNaN(numberOfStars) || numberOfStars < 0) {\n            return;\n        }\n\n        const stars = [];\n        const hasHalfStar = numberOfStars - Math.floor(numberOfStars) >= 0.4;\n\n        for (let i = 0; i < Math.floor(numberOfStars); i++) {\n            stars.push(\n                <StarFillIcon\n                    key={`star${i}`}\n                    aria-hidden\n                    className={styles.starIcon}\n                />\n            );\n        }\n        if (hasHalfStar) {\n            stars.push(\n                <StarHalfIcon\n                    key={`halfstar`}\n                    aria-hidden\n                    className={styles.starIcon}\n                />\n            );\n        }\n        if (stars.length < MAX_STARS) {\n            const remaining = 5 - stars.length;\n            for (let i = 0; i < remaining; i++) {\n                stars.push(\n                    <StarIcon\n                        key={`emptystar${i}`}\n                        aria-hidden\n                        className={styles.starIcon}\n                    />\n                );\n            }\n        }\n\n        /* maximum of 5 stars */\n        return (\n            <div\n                className={styles.ratingContainer}\n                role=\"group\"\n                aria-label={`A rating of ${numberOfStars} out of ${MAX_STARS} stars`}\n                data-testid={`${ID}-star-rating`}\n            >\n                {stars.slice(0, MAX_STARS)}\n            </div>\n        );\n    };\n\n    return (\n        <>\n            {show && (\n                <div\n                    ref={mergeRefs(containerRef, ref)}\n                    data-testid={ID}\n                    className={clsx(\n                        styles.smartAppBannerContainer,\n                        isDark\n                            ? styles.smartAppBannerContainerDark\n                            : styles.smartAppBannerContainerLight,\n                        animated && styles.smartAppBannerContainerAnimated,\n                        className\n                    )}\n                >\n                    <div\n                        className={styles.proceedContainer}\n                        onClick={handleClick}\n                        id={`${ID}-proceed`}\n                        data-testid={`${ID}-proceed-container`}\n                    >\n                        <img\n                            className={styles.bannerIcon}\n                            src={icon}\n                            alt={ariaLabels.icon}\n                        />\n                        <div className={styles.textContainer}>\n                            <Typography.BodySM className={styles.title}>\n                                {title}\n                            </Typography.BodySM>\n                            <Typography.BodyXS className={styles.description}>\n                                {message}\n                            </Typography.BodyXS>\n                            {generateStarRating()}\n                        </div>\n                        <div className={styles.buttonContainer}>\n                            <Button\n                                className={styles.button}\n                                type=\"button\"\n                                onClick={handleClick}\n                                aria-label={ariaLabels.cta}\n                                sizeType=\"small\"\n                            >\n                                {buttonLabel}\n                            </Button>\n                        </div>\n                    </div>\n                    <div\n                        className={styles.dismissContainer}\n                        onClick={onDismiss}\n                        id={`${ID}-dismiss`}\n                        data-testid={`${ID}-dismiss-container`}\n                    >\n                        <ClickableIcon\n                            className={styles.dismissButton}\n                            aria-label={ariaLabels.dismiss}\n                        >\n                            <CrossIcon className={styles.cross} />\n                        </ClickableIcon>\n                    </div>\n                </div>\n            )}\n        </>\n    );\n}\n\n// @catalog\n/**\n * A fixed top banner that promotes a mobile app and links to its store listing.\n *\n * Use `SmartAppBanner` to invite users to install or open the native app.\n */\nexport const SmartAppBanner = React.forwardRef(SmartAppBannerComponent);\n"],"names":["APP_ICON","ID","SmartAppBanner","React","forwardRef","props","ref","className","show","href","content","offset","icon","animated","onDismiss","onClick","title","message","buttonLabel","iconAriaLabel","buttonAriaLabel","numberOfStars","containerRef","useRef","theme","useContext","ThemeContext","isDark","mode","useApplyStyle","styles.tokens","container","top","ariaLabels","dismiss","cta","handleClick","e","stopPropagation","window","open","_jsx","_Fragment","children","_jsxs","mergeRefs","clsx","styles.smartAppBannerContainer","styles.smartAppBannerContainerDark","styles.smartAppBannerContainerLight","styles.smartAppBannerContainerAnimated","styles.proceedContainer","id","styles.bannerIcon","src","alt","styles.textContainer","Typography","BodySM","styles.title","BodyXS","styles.description","isNaN","stars","hasHalfStar","Math","floor","i","push","StarFillIcon","styles.starIcon","StarHalfIcon","length","remaining","StarIcon","styles.ratingContainer","role","slice","generateStarRating","styles.buttonContainer","Button","styles.button","type","sizeType","styles.dismissContainer","ClickableIcon","styles.dismissButton","CrossIcon","styles.cross"],"mappings":"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"}

package/cjs/smart-app-banner/smart-app-banner.styles.js

@@ -1,2 +1,2 @@
-"use strict";require("./smart-app-banner.styles_15u6yv4.css");exports.bannerIcon="bece00m",exports.button="b1rqz1xr",exports.buttonContainer="b1ti1r81",exports.cross="cp9l7rn",exports.description="dp7x5g3",exports.dismissButton="d1cy2w47",exports.dismissContainer="dmwiwc",exports.proceedContainer="pdjtkx9",exports.ratingContainer="r1gggq6r",exports.smartAppBannerContainer="s4qb553",exports.smartAppBannerContainerAnimated="s9k7xr8",exports.smartAppBannerContainerDark="s1gji45a",exports.smartAppBannerContainerLight="s1yw94wd",exports.starIcon="sda01s1",exports.textContainer="t7s9qr2",exports.title="tmo9z7m",exports.tokens={container:{top:"--fds-internal-smartAppBanner-container-top"}};
+"use strict";require("./smart-app-banner.styles_r6yjq9.css");exports.bannerIcon="bece00m",exports.button="b1rqz1xr",exports.buttonContainer="b1ti1r81",exports.cross="cp9l7rn",exports.description="dp7x5g3",exports.dismissButton="d1cy2w47",exports.dismissContainer="dmwiwc",exports.proceedContainer="pdjtkx9",exports.ratingContainer="r1gggq6r",exports.smartAppBannerContainer="s4qb553",exports.smartAppBannerContainerAnimated="s9k7xr8",exports.smartAppBannerContainerDark="s1gji45a",exports.smartAppBannerContainerLight="s1yw94wd",exports.starIcon="sda01s1",exports.textContainer="t7s9qr2",exports.title="tmo9z7m",exports.tokens={container:{top:"--fds-internal-smartAppBanner-container-top"}};
 //# sourceMappingURL=smart-app-banner.styles.js.map

package/cjs/smart-app-banner/smart-app-banner.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"smart-app-banner.styles.js","sources":["../../../src/smart-app-banner/smart-app-banner.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, MediaQuery, Radius, Shadow } from \"../theme\";\n\nexport const tokens = {\n    container: {\n        top: \"--fds-internal-smartAppBanner-container-top\",\n    },\n};\n\nexport const smartAppBannerContainer = css`\n    display: flex;\n    flex-direction: row-reverse;\n    align-items: stretch;\n    position: fixed;\n    margin: 0.5rem 1.25rem;\n    ${tokens.container.top}: initial;\n    top: var(${tokens.container.top});\n    left: 0;\n    width: calc(100% - 2.5rem);\n    min-height: 5.5rem;\n    z-index: 9001;\n    background: ${Colour.bg};\n    border-radius: ${Radius.md};\n`;\n\nexport const smartAppBannerContainerLight = css`\n    box-shadow: ${Shadow[\"md-subtle\"]};\n`;\n\nexport const smartAppBannerContainerDark = css`\n    border: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\nexport const smartAppBannerContainerAnimated = css`\n    @keyframes smart-app-banner-slide-down {\n        from {\n            opacity: 0;\n            transform: translateY(-20%);\n        }\n        to {\n            opacity: 1;\n            transform: translateY(0);\n        }\n    }\n    animation: smart-app-banner-slide-down 0.3s;\n`;\n\nexport const dismissContainer = css`\n    display: flex;\n    align-items: center;\n    padding: 0.5rem 0.25rem 0.5rem 1rem;\n`;\n\nexport const dismissButton = css`\n    padding: 0;\n`;\n\nexport const cross = css`\n    color: ${Colour.icon};\n    height: 1.25rem;\n    width: 1.25rem;\n`;\n\nexport const proceedContainer = css`\n    flex: 1;\n    display: flex;\n    align-items: center;\n    padding: 0.5rem 1rem 0.5rem 0.25rem;\n    cursor: pointer;\n`;\n\nexport const textContainer = css`\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    align-items: left;\n    margin: 0.5rem;\n    ${MediaQuery.MaxWidth.xs} {\n        margin: 0 0.5rem;\n    }\n`;\n\nexport const bannerIcon = css`\n    width: 2.65rem;\n    height: auto;\n    align-self: center;\n`;\n\nexport const buttonContainer = css`\n    max-width: 30%;\n`;\n\nexport const button = css`\n    padding: 0.5rem;\n    height: auto;\n    & > span {\n        overflow-wrap: anywhere;\n        ${Font[\"body-xs-semibold\"]}\n    }\n`;\n\nexport const title = css`\n    font-weight: ${Font.Spec[\"weight-bold\"]};\n    overflow-wrap: anywhere;\n    ${MediaQuery.MaxWidth.xs} {\n        ${Font[\"body-xs-bold\"]}\n    }\n`;\n\nexport const description = css`\n    overflow-wrap: anywhere;\n`;\n\nexport const ratingContainer = css`\n    margin-top: 0.25rem;\n    display: flex;\n    align-items: center;\n`;\n\nexport const starIcon = css`\n    height: 2rem;\n    width: 2rem;\n    padding-right: 0.25rem;\n    color: #ffc107;\n`;\n"],"names":["container","top"],"mappings":"iHAmFuB,yBAUJ,mCAJS,yBA/BV,8BAoDM,gCAxDE,oCANG,kCAgBA,kCAkDD,2CAxGQ,kDAwBQ,8CAJJ,gDAJC,4BA8FpB,gCAhDK,wBA8BR,yBAlGI,CAClBA,UAAW,CACPC,IAAK"}
+{"version":3,"file":"smart-app-banner.styles.js","sources":["../../../src/smart-app-banner/smart-app-banner.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, MediaQuery, Radius, Shadow } from \"../theme\";\n\nexport const tokens = {\n    container: {\n        top: \"--fds-internal-smartAppBanner-container-top\",\n    },\n};\n\nexport const smartAppBannerContainer = css`\n    display: flex;\n    flex-direction: row-reverse;\n    align-items: stretch;\n    position: fixed;\n    margin: 0.5rem 1.25rem;\n    ${tokens.container.top}: initial;\n    top: var(${tokens.container.top});\n    left: 0;\n    width: calc(100% - 2.5rem);\n    min-height: 5.5rem;\n    z-index: 9001;\n    background: ${Colour.bg};\n    border-radius: ${Radius.md};\n`;\n\nexport const smartAppBannerContainerLight = css`\n    box-shadow: ${Shadow[\"md-subtle\"]};\n`;\n\nexport const smartAppBannerContainerDark = css`\n    border: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\nexport const smartAppBannerContainerAnimated = css`\n    @keyframes smart-app-banner-slide-down {\n        from {\n            opacity: 0;\n            transform: translateY(-20%);\n        }\n        to {\n            opacity: 1;\n            transform: translateY(0);\n        }\n    }\n    animation: smart-app-banner-slide-down 0.3s;\n`;\n\nexport const dismissContainer = css`\n    display: flex;\n    align-items: center;\n    padding: 0.5rem 0.25rem 0.5rem 1rem;\n`;\n\nexport const dismissButton = css`\n    padding: 0;\n`;\n\nexport const cross = css`\n    color: ${Colour.icon};\n    height: 1.25rem;\n    width: 1.25rem;\n`;\n\nexport const proceedContainer = css`\n    flex: 1;\n    display: flex;\n    align-items: center;\n    padding: 0.5rem 1rem 0.5rem 0.25rem;\n    cursor: pointer;\n`;\n\nexport const textContainer = css`\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    align-items: left;\n    margin: 0.5rem;\n    ${MediaQuery.MaxWidth.xs} {\n        margin: 0 0.5rem;\n    }\n`;\n\nexport const bannerIcon = css`\n    width: 2.65rem;\n    height: auto;\n    align-self: center;\n`;\n\nexport const buttonContainer = css`\n    max-width: 30%;\n`;\n\nexport const button = css`\n    padding: 0.5rem;\n    & > span {\n        overflow-wrap: anywhere;\n        ${Font[\"body-xs-semibold\"]}\n    }\n`;\n\nexport const title = css`\n    font-weight: ${Font.Spec[\"weight-bold\"]};\n    overflow-wrap: anywhere;\n    ${MediaQuery.MaxWidth.xs} {\n        ${Font[\"body-xs-bold\"]}\n    }\n`;\n\nexport const description = css`\n    overflow-wrap: anywhere;\n`;\n\nexport const ratingContainer = css`\n    margin-top: 0.25rem;\n    display: flex;\n    align-items: center;\n`;\n\nexport const starIcon = css`\n    height: 2rem;\n    width: 2rem;\n    padding-right: 0.25rem;\n    color: #ffc107;\n`;\n"],"names":["container","top"],"mappings":"gHAmFuB,yBAUJ,mCAJS,yBA/BV,8BAmDM,gCAvDE,oCANG,kCAgBA,kCAiDD,2CAvGQ,kDAwBQ,8CAJJ,gDAJC,4BA6FpB,gCA/CK,wBA6BR,yBAjGI,CAClBA,UAAW,CACPC,IAAK"}

package/{smart-app-banner/smart-app-banner.styles_15u6yv4.css → cjs/smart-app-banner/smart-app-banner.styles_r6yjq9.css}

@@ -9,7 +9,7 @@
 .t7s9qr2{-webkit-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:left;-webkit-box-align:left;-ms-flex-align:left;align-items:left;margin:0.5rem;}:where(body.fds-breakpoint-xs-max) .t7s9qr2{margin:0 0.5rem;}
 .bece00m{width:2.65rem;height:auto;-webkit-align-self:center;-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center;}
 .b1ti1r81{max-width:30%;}
-.b1rqz1xr{padding:0.5rem;height:auto;}.b1rqz1xr>span{overflow-wrap:anywhere;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-xs);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-xs);letter-spacing:var(--fds-font-body-ls-xs);}
+.b1rqz1xr{padding:0.5rem;}.b1rqz1xr>span{overflow-wrap:anywhere;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-xs);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-xs);letter-spacing:var(--fds-font-body-ls-xs);}
 .tmo9z7m{font-weight:var(--fds-font-weight-bold);overflow-wrap:anywhere;}:where(body.fds-breakpoint-xs-max) .tmo9z7m{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-xs);font-weight:var(--fds-font-weight-bold);line-height:var(--fds-font-body-lh-xs);letter-spacing:var(--fds-font-body-ls-xs);}
 .dp7x5g3{overflow-wrap:anywhere;}
 .r1gggq6r{margin-top:0.25rem;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;}

package/cjs/tab/tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.js","sources":["../../../src/tab/tab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type { ReactElement } from \"react\";\nimport { Children, cloneElement, useEffect, useMemo, useState } from \"react\";\n\nimport * as styles from \"./tab.styles\";\nimport type { TabLinkProps } from \"./tab-context\";\nimport { TabContext } from \"./tab-context\";\nimport { TabItem } from \"./tab-item\";\nimport { TabLinkChain } from \"./tab-link-chain\";\nimport type { TabItemProps, TabProps } from \"./types\";\n\n// =============================================================================\n// COMPONENT\n// =============================================================================\nconst TabBase = ({\n    children,\n    currentActive: currentActiveIndex,\n    initialActive = 0,\n    onTabClick,\n    \"data-testid\": testId,\n    className,\n    fullWidthIndicatorLine,\n    fadeColor,\n    ...otherProps\n}: TabProps) => {\n    // =========================================================================\n    // CONST, STATE, REFS\n    // =========================================================================\n    const [currentActive, setCurrentActive] = useState<number>(\n        currentActiveIndex || initialActive\n    );\n\n    const tabLinks = useMemo(() => {\n        const validChildren = Children.toArray(children).filter(\n            Boolean\n        ) as ReactElement<TabItemProps>[];\n\n        return validChildren.map((child) => {\n            return {\n                title: child.props.title,\n                width: child.props.width,\n                titleAddon: child.props.titleAddon,\n            };\n        }) as TabLinkProps[];\n    }, [children]);\n\n    const tabContextValue = useMemo(\n        () => ({\n            tabLinks,\n            currentActiveIndex: currentActive,\n            setCurrentActiveIndex: setCurrentActive,\n        }),\n        [currentActive, tabLinks]\n    );\n\n    // =========================================================================\n    // Effects\n    // =========================================================================\n    useEffect(() => {\n        if (typeof currentActiveIndex === \"number\") {\n            setCurrentActive(currentActiveIndex);\n        }\n    }, [currentActiveIndex]);\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    const renderChildren = () => {\n        const validChildren = Children.toArray(children).filter(Boolean);\n\n        return validChildren.map((child, index) => {\n            const element = child as ReactElement<TabItemProps>;\n\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            return cloneElement(child as ReactElement<any>, {\n                key: element.key ?? element.props.title,\n                index,\n            });\n        });\n    };\n\n    return (\n        <div\n            data-testid={testId}\n            className={clsx(styles.wrapper, className)}\n            {...otherProps}\n        >\n            <TabContext.Provider value={tabContextValue}>\n                <TabLinkChain\n                    controlledMode={typeof currentActiveIndex === \"number\"}\n                    onTabClick={onTabClick}\n                    data-testid={`${testId}-tabs`}\n                    fullWidthIndicatorLine={fullWidthIndicatorLine}\n                    fadeColor={fadeColor}\n                />\n                {renderChildren()}\n            </TabContext.Provider>\n        </div>\n    );\n};\n\nTabBase.displayName = \"Tab\";\n\n// =============================================================================\n// EXPORTS\n// =============================================================================\n/**\n * A tabbed-panel layout that switches visible content by selecting a tab link.\n *\n * Use `Tab` to organise content into labelled panels where only one panel is\n * visible at a time. Compose with `Tab.Item` to define each panel.\n */\nexport const Tab = Object.assign(TabBase, {\n    /** Renders an individual content panel within a `Tab`. */\n    Item: TabItem,\n});\n"],"names":["TabBase","_a","children","currentActive","currentActiveIndex","initialActive","onTabClick","testId","className","fullWidthIndicatorLine","fadeColor","otherProps","__rest","setCurrentActive","useState","tabLinks","useMemo","Children","toArray","filter","Boolean","map","child","title","props","width","titleAddon","tabContextValue","setCurrentActiveIndex","useEffect","_jsx","Object","assign","clsx","styles.wrapper","_jsxs","TabContext","Provider","value","TabLinkChain","controlledMode","index","element","cloneElement","key","displayName","Tab","Item","TabItem"],"mappings":"kUAcA,MAAMA,EAAWC,QAAAC,SACbA,EACAC,cAAeC,EAAkBC,cACjCA,EAAgB,EAACC,WACjBA,EACA,cAAeC,EAAMC,UACrBA,EAASC,uBACTA,EAAsBC,UACtBA,GAAST,EACNU,EAAUC,EAAAA,OAAAX,EATA,CAAA,WAAA,gBAAA,gBAAA,aAAA,cAAA,YAAA,yBAAA,cAcb,MAAOE,EAAeU,GAAoBC,EAAAA,SACtCV,GAAsBC,GAGpBU,EAAWC,EAAAA,SAAQ,IACCC,EAAAA,SAASC,QAAQhB,GAAUiB,OAC7CC,SAGiBC,KAAKC,IACf,CACHC,MAAOD,EAAME,MAAMD,MACnBE,MAAOH,EAAME,MAAMC,MACnBC,WAAYJ,EAAME,MAAME,gBAGjC,CAACxB,IAEEyB,EAAkBX,EAAAA,SACpB,KAAA,CACID,WACAX,mBAAoBD,EACpByB,sBAAuBf,KAE3B,CAACV,EAAeY,IAMpBc,EAAAA,WAAU,KAC4B,iBAAvBzB,GACPS,EAAiBT,EACrB,GACD,CAACA,IAmBJ,OACI0B,EAAAA,IAAA,MAAAC,OAAAC,OAAA,CAAA,cACiBzB,EACbC,UAAWyB,EAAAA,QAAKC,EAAAA,QAAgB1B,IAC5BG,EAAU,CAAAT,SAEdiC,EAAAA,KAACC,EAAAA,WAAWC,SAAQ,CAACC,MAAOX,EAAezB,SAAA,CACvC4B,EAAAA,IAACS,EAAAA,aAAY,CACTC,eAA8C,iBAAvBpC,EACvBE,WAAYA,EAAU,cACT,GAAGC,SAChBE,uBAAwBA,EACxBC,UAAWA,IAzBDO,EAAAA,SAASC,QAAQhB,GAAUiB,OAAOC,SAEnCC,KAAI,CAACC,EAAOmB,WAC7B,MAAMC,EAAUpB,EAGhB,OAAOqB,EAAAA,aAAarB,EAA4B,CAC5CsB,YAAK3C,EAAAyC,EAAQE,mBAAOF,EAAQlB,MAAMD,MAClCkB,SACF,SAoBA,EAIdzC,EAAQ6C,YAAc,YAWTC,EAAMf,OAAOC,OAAOhC,EAAS,CAEtC+C,KAAMC,EAAAA"}
+{"version":3,"file":"tab.js","sources":["../../../src/tab/tab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type { ReactElement } from \"react\";\nimport { Children, cloneElement, useEffect, useMemo, useState } from \"react\";\n\nimport * as styles from \"./tab.styles\";\nimport type { TabLinkProps } from \"./tab-context\";\nimport { TabContext } from \"./tab-context\";\nimport { TabItem } from \"./tab-item\";\nimport { TabLinkChain } from \"./tab-link-chain\";\nimport type { TabItemProps, TabProps } from \"./types\";\n\n// =============================================================================\n// COMPONENT\n// =============================================================================\nconst TabBase = ({\n    children,\n    currentActive: currentActiveIndex,\n    initialActive = 0,\n    onTabClick,\n    \"data-testid\": testId,\n    className,\n    fullWidthIndicatorLine,\n    fadeColor,\n    ...otherProps\n}: TabProps) => {\n    // =========================================================================\n    // CONST, STATE, REFS\n    // =========================================================================\n    const [currentActive, setCurrentActive] = useState<number>(\n        currentActiveIndex || initialActive\n    );\n\n    const tabLinks = useMemo(() => {\n        const validChildren = Children.toArray(children).filter(\n            Boolean\n        ) as ReactElement<TabItemProps>[];\n\n        return validChildren.map((child) => {\n            return {\n                title: child.props.title,\n                width: child.props.width,\n                titleAddon: child.props.titleAddon,\n            };\n        }) as TabLinkProps[];\n    }, [children]);\n\n    const tabContextValue = useMemo(\n        () => ({\n            tabLinks,\n            currentActiveIndex: currentActive,\n            setCurrentActiveIndex: setCurrentActive,\n        }),\n        [currentActive, tabLinks]\n    );\n\n    // =========================================================================\n    // Effects\n    // =========================================================================\n    useEffect(() => {\n        if (typeof currentActiveIndex === \"number\") {\n            setCurrentActive(currentActiveIndex);\n        }\n    }, [currentActiveIndex]);\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    const renderChildren = () => {\n        const validChildren = Children.toArray(children).filter(Boolean);\n\n        return validChildren.map((child, index) => {\n            const element = child as ReactElement<TabItemProps>;\n\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            return cloneElement(child as ReactElement<any>, {\n                key: element.key ?? element.props.title,\n                index,\n            });\n        });\n    };\n\n    return (\n        <div\n            data-testid={testId}\n            className={clsx(styles.wrapper, className)}\n            {...otherProps}\n        >\n            <TabContext.Provider value={tabContextValue}>\n                <TabLinkChain\n                    controlledMode={typeof currentActiveIndex === \"number\"}\n                    onTabClick={onTabClick}\n                    data-testid={`${testId}-tabs`}\n                    fullWidthIndicatorLine={fullWidthIndicatorLine}\n                    fadeColor={fadeColor}\n                />\n                {renderChildren()}\n            </TabContext.Provider>\n        </div>\n    );\n};\n\nTabBase.displayName = \"Tab\";\n\n// =============================================================================\n// EXPORTS\n// =============================================================================\n// @catalog\n/**\n * A tabbed-panel layout that switches visible content by selecting a tab link.\n *\n * Use `Tab` to organise content into labelled panels where only one panel is\n * visible at a time. Compose with `Tab.Item` to define each panel.\n */\nexport const Tab = Object.assign(TabBase, {\n    /** Renders an individual content panel within a `Tab`. */\n    Item: TabItem,\n});\n"],"names":["TabBase","_a","children","currentActive","currentActiveIndex","initialActive","onTabClick","testId","className","fullWidthIndicatorLine","fadeColor","otherProps","__rest","setCurrentActive","useState","tabLinks","useMemo","Children","toArray","filter","Boolean","map","child","title","props","width","titleAddon","tabContextValue","setCurrentActiveIndex","useEffect","_jsx","Object","assign","clsx","styles.wrapper","_jsxs","TabContext","Provider","value","TabLinkChain","controlledMode","index","element","cloneElement","key","displayName","Tab","Item","TabItem"],"mappings":"kUAcA,MAAMA,EAAWC,QAAAC,SACbA,EACAC,cAAeC,EAAkBC,cACjCA,EAAgB,EAACC,WACjBA,EACA,cAAeC,EAAMC,UACrBA,EAASC,uBACTA,EAAsBC,UACtBA,GAAST,EACNU,EAAUC,EAAAA,OAAAX,EATA,CAAA,WAAA,gBAAA,gBAAA,aAAA,cAAA,YAAA,yBAAA,cAcb,MAAOE,EAAeU,GAAoBC,EAAAA,SACtCV,GAAsBC,GAGpBU,EAAWC,EAAAA,SAAQ,IACCC,EAAAA,SAASC,QAAQhB,GAAUiB,OAC7CC,SAGiBC,KAAKC,IACf,CACHC,MAAOD,EAAME,MAAMD,MACnBE,MAAOH,EAAME,MAAMC,MACnBC,WAAYJ,EAAME,MAAME,gBAGjC,CAACxB,IAEEyB,EAAkBX,EAAAA,SACpB,KAAA,CACID,WACAX,mBAAoBD,EACpByB,sBAAuBf,KAE3B,CAACV,EAAeY,IAMpBc,EAAAA,WAAU,KAC4B,iBAAvBzB,GACPS,EAAiBT,EACrB,GACD,CAACA,IAmBJ,OACI0B,EAAAA,IAAA,MAAAC,OAAAC,OAAA,CAAA,cACiBzB,EACbC,UAAWyB,EAAAA,QAAKC,EAAAA,QAAgB1B,IAC5BG,EAAU,CAAAT,SAEdiC,EAAAA,KAACC,EAAAA,WAAWC,SAAQ,CAACC,MAAOX,EAAezB,SAAA,CACvC4B,EAAAA,IAACS,EAAAA,aAAY,CACTC,eAA8C,iBAAvBpC,EACvBE,WAAYA,EAAU,cACT,GAAGC,SAChBE,uBAAwBA,EACxBC,UAAWA,IAzBDO,EAAAA,SAASC,QAAQhB,GAAUiB,OAAOC,SAEnCC,KAAI,CAACC,EAAOmB,WAC7B,MAAMC,EAAUpB,EAGhB,OAAOqB,EAAAA,aAAarB,EAA4B,CAC5CsB,YAAK3C,EAAAyC,EAAQE,mBAAOF,EAAQlB,MAAMD,MAClCkB,SACF,SAoBA,EAIdzC,EAAQ6C,YAAc,YAYTC,EAAMf,OAAOC,OAAOhC,EAAS,CAEtC+C,KAAMC,EAAAA"}

package/cjs/table/table.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.js","sources":["../../../src/table/table.tsx"],"sourcesContent":["import clsx from \"clsx\";\n\nimport * as styles from \"./table.styles\";\n\nconst Head = ({\n    children,\n    ...props\n}: React.HTMLAttributes<HTMLTableSectionElement>) => (\n    <thead {...props}>{children}</thead>\n);\nHead.displayName = \"Table.Head\";\n\nconst Body = ({\n    children,\n    className,\n    ...props\n}: React.HTMLAttributes<HTMLTableSectionElement>) => (\n    <tbody className={clsx(styles.tableBody, className)} {...props}>\n        {children}\n    </tbody>\n);\nBody.displayName = \"Table.Body\";\n\nconst Row = ({\n    children,\n    className,\n    ...props\n}: React.HTMLAttributes<HTMLTableRowElement>) => (\n    <tr className={clsx(styles.bodyRow, className)} {...props}>\n        {children}\n    </tr>\n);\nRow.displayName = \"Table.Row\";\n\nconst Cell = ({\n    children,\n    className,\n    ...props\n}: React.TdHTMLAttributes<HTMLTableCellElement>) => (\n    <td className={clsx(styles.bodyCell, className)} {...props}>\n        {children}\n    </td>\n);\nCell.displayName = \"Table.Cell\";\n\nconst Header = ({\n    children,\n    className,\n    ...props\n}: React.ThHTMLAttributes<HTMLTableCellElement>) => (\n    <th className={clsx(styles.headerCell, className)} {...props}>\n        {children}\n    </th>\n);\nHeader.displayName = \"Table.HeaderCell\";\n\nconst Container = ({\n    children,\n    className,\n    ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n    <div\n        className={clsx(styles.tableWrapper, className)}\n        data-testid=\"table-wrapper\"\n        {...props}\n    >\n        {children}\n    </div>\n);\nContainer.displayName = \"Table.Container\";\n\nconst TableEl = ({\n    children,\n    className,\n    ...props\n}: React.TableHTMLAttributes<HTMLTableElement>) => (\n    <table className={clsx(styles.tableComponent, className)} {...props}>\n        {children}\n    </table>\n);\nTableEl.displayName = \"Table.Table\";\n\n/**\n * A styled HTML table with a scrollable container wrapper.\n *\n * Use `Table` when displaying structured tabular data. The default export\n * wraps content in `Table.Container` and `Table.Table` automatically. For\n * full layout control, compose the sub-components directly:\n * - `Table.Container` — scrollable wrapper div\n * - `Table.Table` — the bare `<table>` element\n * - `Table.Head` — the `<thead>` section\n * - `Table.Body` — the `<tbody>` section\n * - `Table.Row` — a `<tr>` row within the body\n * - `Table.Cell` — a `<td>` data cell\n * - `Table.HeaderCell` — a `<th>` column header cell\n */\nexport const Table = Object.assign(\n    ({ children, ...props }: React.TableHTMLAttributes<HTMLTableElement>) => (\n        <Container>\n            <TableEl {...props}>{children}</TableEl>\n        </Container>\n    ),\n    {\n        /** Scrollable wrapper div that contains a `Table.Table`. */\n        Container,\n        /** The bare `<table>` element. Use directly when you need to place the table inside a custom container. */\n        Table: TableEl,\n        /** Renders the `<thead>` section of the table. */\n        Head,\n        /** Renders the `<tbody>` section of the table. */\n        Body,\n        /** Renders a `<tr>` row within a `Table.Body`. */\n        Row,\n        /** Renders a `<td>` data cell within a `Table.Row`. */\n        Cell,\n        /** Renders a `<th>` header cell within a `Table.Head` row. */\n        HeaderCell: Header,\n    }\n);\n"],"names":["Head","_a","children","props","__rest","_jsx","Object","assign","displayName","Body","className","clsx","styles.tableBody","Row","styles.bodyRow","Cell","styles.bodyCell","Header","styles.headerCell","Container","styles.tableWrapper","TableEl","styles.tableComponent","Table","HeaderCell"],"mappings":"uNAIA,MAAMA,EAAQC,IAAA,IAAAC,SACVA,GAAQD,EACLE,EAAKC,EAAAA,OAAAH,EAFE,cAGuC,OACjDI,EAAAA,IAAA,QAAAC,OAAAC,OAAA,GAAWJ,YAAQD,IAAiB,EAExCF,EAAKQ,YAAc,aAEnB,MAAMC,EAAQR,QAAAC,SACVA,EAAQQ,UACRA,GAAST,EACNE,EAAKC,EAAAA,OAAAH,EAHE,0BAIuC,OACjDI,EAAAA,IAAA,QAAAC,OAAAC,OAAA,CAAOG,UAAWC,EAAAA,QAAKC,EAAAA,UAAkBF,IAAgBP,YACpDD,IACG,EAEZO,EAAKD,YAAc,aAEnB,MAAMK,EAAOZ,QAAAC,SACTA,EAAQQ,UACRA,GAAST,EACNE,EAAKC,EAAAA,OAAAH,EAHC,0BAIoC,OAC7CI,EAAAA,IAAA,KAAAC,OAAAC,OAAA,CAAIG,UAAWC,EAAAA,QAAKG,EAAAA,QAAgBJ,IAAgBP,YAC/CD,IACA,EAETW,EAAIL,YAAc,YAElB,MAAMO,EAAQd,QAAAC,SACVA,EAAQQ,UACRA,GAAST,EACNE,EAAKC,EAAAA,OAAAH,EAHE,0BAIsC,OAChDI,EAAAA,IAAA,KAAAC,OAAAC,OAAA,CAAIG,UAAWC,EAAAA,QAAKK,EAAAA,SAAiBN,IAAgBP,YAChDD,IACA,EAETa,EAAKP,YAAc,aAEnB,MAAMS,EAAUhB,QAAAC,SACZA,EAAQQ,UACRA,GAAST,EACNE,EAAKC,EAAAA,OAAAH,EAHI,0BAIoC,OAChDI,EAAAA,IAAA,KAAAC,OAAAC,OAAA,CAAIG,UAAWC,EAAAA,QAAKO,EAAAA,WAAmBR,IAAgBP,YAClDD,IACA,EAETe,EAAOT,YAAc,mBAErB,MAAMW,EAAalB,QAAAC,SACfA,EAAQQ,UACRA,GAAST,EACNE,EAAKC,EAAAA,OAAAH,EAHO,0BAIyB,OACxCI,EAAAA,yBACIK,UAAWC,EAAAA,QAAKS,EAAAA,aAAqBV,GAAU,cACnC,iBACRP,YAEHD,IACC,EAEViB,EAAUX,YAAc,kBAExB,MAAMa,EAAWpB,QAAAC,SACbA,EAAQQ,UACRA,GAAST,EACNE,EAAKC,EAAAA,OAAAH,EAHK,0BAIkC,OAC/CI,EAAAA,IAAA,QAAAC,OAAAC,OAAA,CAAOG,UAAWC,EAAAA,QAAKW,EAAAA,eAAuBZ,IAAgBP,YACzDD,IACG,EAEZmB,EAAQb,YAAc,cAgBf,MAAMe,EAAQjB,OAAOC,QACvBN,IAAA,IAAAC,SAAEA,GAAQD,EAAKE,EAAKC,EAAAA,OAAAH,EAApB,cAAwE,OACrEI,EAAAA,IAACc,EAAS,CAAAjB,SACNG,EAAAA,IAACgB,EAAOf,OAAAC,OAAA,CAAA,EAAKJ,EAAK,CAAAD,SAAGA,MACb,GAEhB,CAEIiB,YAEAI,MAAOF,EAEPrB,OAEAS,OAEAI,MAEAE,OAEAS,WAAYP"}
+{"version":3,"file":"table.js","sources":["../../../src/table/table.tsx"],"sourcesContent":["import clsx from \"clsx\";\n\nimport * as styles from \"./table.styles\";\nimport type {\n    TableBodyProps,\n    TableCellProps,\n    TableContainerProps,\n    TableHeaderProps,\n    TableHeadProps,\n    TableRowProps,\n    TableTableProps,\n} from \"./types\";\n\nconst Head = ({ children, ...props }: TableHeadProps) => (\n    <thead {...props}>{children}</thead>\n);\nHead.displayName = \"Table.Head\";\n\nconst Body = ({ children, className, ...props }: TableBodyProps) => (\n    <tbody className={clsx(styles.tableBody, className)} {...props}>\n        {children}\n    </tbody>\n);\nBody.displayName = \"Table.Body\";\n\nconst Row = ({ children, className, ...props }: TableRowProps) => (\n    <tr className={clsx(styles.bodyRow, className)} {...props}>\n        {children}\n    </tr>\n);\nRow.displayName = \"Table.Row\";\n\nconst Cell = ({ children, className, ...props }: TableCellProps) => (\n    <td className={clsx(styles.bodyCell, className)} {...props}>\n        {children}\n    </td>\n);\nCell.displayName = \"Table.Cell\";\n\nconst Header = ({ children, className, ...props }: TableHeaderProps) => (\n    <th className={clsx(styles.headerCell, className)} {...props}>\n        {children}\n    </th>\n);\nHeader.displayName = \"Table.HeaderCell\";\n\nconst Container = ({ children, className, ...props }: TableContainerProps) => (\n    <div\n        className={clsx(styles.tableWrapper, className)}\n        data-testid=\"table-wrapper\"\n        {...props}\n    >\n        {children}\n    </div>\n);\nContainer.displayName = \"Table.Container\";\n\nconst TableEl = ({ children, className, ...props }: TableTableProps) => (\n    <table className={clsx(styles.tableComponent, className)} {...props}>\n        {children}\n    </table>\n);\nTableEl.displayName = \"Table.Table\";\n\n// @catalog\n/**\n * A styled HTML table with a scrollable container wrapper.\n *\n * Use `Table` when displaying structured tabular data. The default export\n * wraps content in `Table.Container` and `Table.Table` automatically. For\n * full layout control, compose the sub-components directly:\n * - `Table.Container` — scrollable wrapper div\n * - `Table.Table` — the bare `<table>` element\n * - `Table.Head` — the `<thead>` section\n * - `Table.Body` — the `<tbody>` section\n * - `Table.Row` — a `<tr>` row within the body\n * - `Table.Cell` — a `<td>` data cell\n * - `Table.HeaderCell` — a `<th>` column header cell\n */\nexport const Table = Object.assign(\n    ({ children, ...props }: TableTableProps) => (\n        <Container>\n            <TableEl {...props}>{children}</TableEl>\n        </Container>\n    ),\n    {\n        /** Scrollable wrapper div that contains a `Table.Table`. */\n        Container,\n        /** The bare `<table>` element. Use directly when you need to place the table inside a custom container. */\n        Table: TableEl,\n        /** Renders the `<thead>` section of the table. */\n        Head,\n        /** Renders the `<tbody>` section of the table. */\n        Body,\n        /** Renders a `<tr>` row within a `Table.Body`. */\n        Row,\n        /** Renders a `<td>` data cell within a `Table.Row`. */\n        Cell,\n        /** Renders a `<th>` header cell within a `Table.Head` row. */\n        HeaderCell: Header,\n    }\n);\n"],"names":["Head","_a","children","props","__rest","_jsx","Object","assign","displayName","Body","className","clsx","styles.tableBody","Row","styles.bodyRow","Cell","styles.bodyCell","Header","styles.headerCell","Container","styles.tableWrapper","TableEl","styles.tableComponent","Table","HeaderCell"],"mappings":"uNAaA,MAAMA,EAAQC,IAAA,IAAAC,SAAEA,GAAQD,EAAKE,EAAKC,EAAAA,OAAAH,EAApB,cAA2C,OACrDI,EAAAA,IAAA,QAAAC,OAAAC,OAAA,GAAWJ,YAAQD,IAAiB,EAExCF,EAAKQ,YAAc,aAEnB,MAAMC,EAAQR,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAAsD,OAChEI,EAAAA,IAAA,QAAAC,OAAAC,OAAA,CAAOG,UAAWC,EAAAA,QAAKC,EAAAA,UAAkBF,IAAgBP,YACpDD,IACG,EAEZO,EAAKD,YAAc,aAEnB,MAAMK,EAAOZ,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAAqD,OAC9DI,EAAAA,IAAA,KAAAC,OAAAC,OAAA,CAAIG,UAAWC,EAAAA,QAAKG,EAAAA,QAAgBJ,IAAgBP,YAC/CD,IACA,EAETW,EAAIL,YAAc,YAElB,MAAMO,EAAQd,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAAsD,OAChEI,EAAAA,IAAA,KAAAC,OAAAC,OAAA,CAAIG,UAAWC,EAAAA,QAAKK,EAAAA,SAAiBN,IAAgBP,YAChDD,IACA,EAETa,EAAKP,YAAc,aAEnB,MAAMS,EAAUhB,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAAwD,OACpEI,EAAAA,IAAA,KAAAC,OAAAC,OAAA,CAAIG,UAAWC,EAAAA,QAAKO,EAAAA,WAAmBR,IAAgBP,YAClDD,IACA,EAETe,EAAOT,YAAc,mBAErB,MAAMW,EAAalB,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAA2D,OAC1EI,EAAAA,yBACIK,UAAWC,EAAAA,QAAKS,EAAAA,aAAqBV,GAAU,cACnC,iBACRP,YAEHD,IACC,EAEViB,EAAUX,YAAc,kBAExB,MAAMa,EAAWpB,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAAuD,OACpEI,EAAAA,IAAA,QAAAC,OAAAC,OAAA,CAAOG,UAAWC,EAAAA,QAAKW,EAAAA,eAAuBZ,IAAgBP,YACzDD,IACG,EAEZmB,EAAQb,YAAc,cAiBf,MAAMe,EAAQjB,OAAOC,QACvBN,IAAA,IAAAC,SAAEA,GAAQD,EAAKE,EAAKC,EAAAA,OAAAH,EAApB,cAA4C,OACzCI,EAAAA,IAACc,EAAS,CAAAjB,SACNG,EAAAA,IAACgB,EAAOf,OAAAC,OAAA,CAAA,EAAKJ,EAAK,CAAAD,SAAGA,MACb,GAEhB,CAEIiB,YAEAI,MAAOF,EAEPrB,OAEAS,OAEAI,MAEAE,OAEAS,WAAYP"}

package/cjs/tag/tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag.js","sources":["../../../src/tag/tag.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\n\nimport * as styles from \"./tag.style\";\nimport type { TagColorType, TagProps, TagType } from \"./types\";\n\nconst colorClassMap: Record<TagType, Record<TagColorType, string>> = {\n    solid: {\n        grey: styles.wrapperSolidGrey,\n        green: styles.wrapperSolidGreen,\n        yellow: styles.wrapperSolidYellow,\n        red: styles.wrapperSolidRed,\n        blue: styles.wrapperSolidBlue,\n        primary: styles.wrapperSolidPrimary,\n        black: styles.wrapperSolidBlack,\n    },\n    outline: {\n        grey: styles.wrapperOutlineGrey,\n        green: styles.wrapperOutlineGreen,\n        yellow: styles.wrapperOutlineYellow,\n        red: styles.wrapperOutlineRed,\n        blue: styles.wrapperOutlineBlue,\n        primary: styles.wrapperOutlinePrimary,\n        black: styles.wrapperOutlineBlack,\n    },\n};\n\n/**\n * A compact label used to categorise or highlight content.\n *\n * Use `Tag` to display metadata such as status, category, or keyword.\n */\nexport const Tag = ({\n    type,\n    colorType = \"black\",\n    children,\n    interactive = false,\n    icon,\n    iconPosition = \"left\",\n    ...otherProps\n}: TagProps): JSX.Element => {\n    const Element = interactive ? \"button\" : \"div\";\n\n    return (\n        <Element\n            className={clsx(\n                styles.wrapper,\n                colorClassMap[type]?.[colorType],\n                interactive && styles.wrapperInteractive\n            )}\n            {...otherProps}\n        >\n            {iconPosition === \"left\" &&\n                icon &&\n                React.cloneElement(icon, { \"aria-hidden\": true })}\n            <div className={styles.label} role=\"presentation\">\n                {children}\n            </div>\n            {iconPosition === \"right\" &&\n                icon &&\n                React.cloneElement(icon, { \"aria-hidden\": true })}\n        </Element>\n    );\n};\n"],"names":["colorClassMap","solid","grey","styles.wrapperSolidGrey","green","styles.wrapperSolidGreen","yellow","styles.wrapperSolidYellow","red","styles.wrapperSolidRed","blue","styles.wrapperSolidBlue","primary","styles.wrapperSolidPrimary","black","styles.wrapperSolidBlack","outline","styles.wrapperOutlineGrey","styles.wrapperOutlineGreen","styles.wrapperOutlineYellow","styles.wrapperOutlineRed","styles.wrapperOutlineBlue","styles.wrapperOutlinePrimary","styles.wrapperOutlineBlack","_a","type","colorType","children","interactive","icon","iconPosition","otherProps","__rest","Element","_jsxs","Object","assign","className","clsx","styles.wrapper","_b","styles.wrapperInteractive","React","cloneElement","_jsx","styles.label","role"],"mappings":"8OAMA,MAAMA,EAA+D,CACjEC,MAAO,CACHC,KAAMC,EAAAA,iBACNC,MAAOC,EAAAA,kBACPC,OAAQC,EAAAA,mBACRC,IAAKC,EAAAA,gBACLC,KAAMC,EAAAA,iBACNC,QAASC,EAAAA,oBACTC,MAAOC,EAAAA,mBAEXC,QAAS,CACLd,KAAMe,EAAAA,mBACNb,MAAOc,EAAAA,oBACPZ,OAAQa,EAAAA,qBACRX,IAAKY,EAAAA,kBACLV,KAAMW,EAAAA,mBACNT,QAASU,EAAAA,sBACTR,MAAOS,EAAAA,kCASKC,WAAAC,KAChBA,EAAIC,UACJA,EAAY,QAAOC,SACnBA,EAAQC,YACRA,GAAc,EAAKC,KACnBA,EAAIC,aACJA,EAAe,UACZC,EAAUC,EAAAA,OAAAR,EAPG,CAAA,OAAA,YAAA,WAAA,cAAA,OAAA,iBAShB,MAAMS,EAAUL,EAAc,SAAW,MAEzC,OACIM,OAACD,EAAOE,OAAAC,OAAA,CACJC,UAAWC,EAAAA,QACPC,EAAAA,QACmB,QAAnBC,EAAAxC,EAAcyB,UAAK,IAAAe,OAAA,EAAAA,EAAGd,GACtBE,GAAea,uBAEfV,EAAU,CAAAJ,SAAA,CAEI,SAAjBG,GACGD,GACAa,EAAAA,QAAMC,aAAad,EAAM,CAAE,eAAe,IAC9Ce,EAAAA,IAAA,MAAA,CAAKP,UAAWQ,EAAAA,MAAcC,KAAK,eAAcnB,SAC5CA,IAEa,UAAjBG,GACGD,GACAa,EAAAA,QAAMC,aAAad,EAAM,CAAE,eAAe,OACxC"}
+{"version":3,"file":"tag.js","sources":["../../../src/tag/tag.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\n\nimport * as styles from \"./tag.style\";\nimport type { TagColorType, TagProps, TagType } from \"./types\";\n\nconst colorClassMap: Record<TagType, Record<TagColorType, string>> = {\n    solid: {\n        grey: styles.wrapperSolidGrey,\n        green: styles.wrapperSolidGreen,\n        yellow: styles.wrapperSolidYellow,\n        red: styles.wrapperSolidRed,\n        blue: styles.wrapperSolidBlue,\n        primary: styles.wrapperSolidPrimary,\n        black: styles.wrapperSolidBlack,\n    },\n    outline: {\n        grey: styles.wrapperOutlineGrey,\n        green: styles.wrapperOutlineGreen,\n        yellow: styles.wrapperOutlineYellow,\n        red: styles.wrapperOutlineRed,\n        blue: styles.wrapperOutlineBlue,\n        primary: styles.wrapperOutlinePrimary,\n        black: styles.wrapperOutlineBlack,\n    },\n};\n\n// @catalog\n/**\n * A compact label used to categorise or highlight content.\n *\n * Use `Tag` to display metadata such as status, category, or keyword.\n */\nexport const Tag = ({\n    type,\n    colorType = \"black\",\n    children,\n    interactive = false,\n    icon,\n    iconPosition = \"left\",\n    ...otherProps\n}: TagProps): JSX.Element => {\n    const Element = interactive ? \"button\" : \"div\";\n\n    return (\n        <Element\n            className={clsx(\n                styles.wrapper,\n                colorClassMap[type]?.[colorType],\n                interactive && styles.wrapperInteractive\n            )}\n            {...otherProps}\n        >\n            {iconPosition === \"left\" &&\n                icon &&\n                React.cloneElement(icon, { \"aria-hidden\": true })}\n            <div className={styles.label} role=\"presentation\">\n                {children}\n            </div>\n            {iconPosition === \"right\" &&\n                icon &&\n                React.cloneElement(icon, { \"aria-hidden\": true })}\n        </Element>\n    );\n};\n"],"names":["colorClassMap","solid","grey","styles.wrapperSolidGrey","green","styles.wrapperSolidGreen","yellow","styles.wrapperSolidYellow","red","styles.wrapperSolidRed","blue","styles.wrapperSolidBlue","primary","styles.wrapperSolidPrimary","black","styles.wrapperSolidBlack","outline","styles.wrapperOutlineGrey","styles.wrapperOutlineGreen","styles.wrapperOutlineYellow","styles.wrapperOutlineRed","styles.wrapperOutlineBlue","styles.wrapperOutlinePrimary","styles.wrapperOutlineBlack","_a","type","colorType","children","interactive","icon","iconPosition","otherProps","__rest","Element","_jsxs","Object","assign","className","clsx","styles.wrapper","_b","styles.wrapperInteractive","React","cloneElement","_jsx","styles.label","role"],"mappings":"8OAMA,MAAMA,EAA+D,CACjEC,MAAO,CACHC,KAAMC,EAAAA,iBACNC,MAAOC,EAAAA,kBACPC,OAAQC,EAAAA,mBACRC,IAAKC,EAAAA,gBACLC,KAAMC,EAAAA,iBACNC,QAASC,EAAAA,oBACTC,MAAOC,EAAAA,mBAEXC,QAAS,CACLd,KAAMe,EAAAA,mBACNb,MAAOc,EAAAA,oBACPZ,OAAQa,EAAAA,qBACRX,IAAKY,EAAAA,kBACLV,KAAMW,EAAAA,mBACNT,QAASU,EAAAA,sBACTR,MAAOS,EAAAA,kCAUKC,WAAAC,KAChBA,EAAIC,UACJA,EAAY,QAAOC,SACnBA,EAAQC,YACRA,GAAc,EAAKC,KACnBA,EAAIC,aACJA,EAAe,UACZC,EAAUC,EAAAA,OAAAR,EAPG,CAAA,OAAA,YAAA,WAAA,cAAA,OAAA,iBAShB,MAAMS,EAAUL,EAAc,SAAW,MAEzC,OACIM,OAACD,EAAOE,OAAAC,OAAA,CACJC,UAAWC,EAAAA,QACPC,EAAAA,QACmB,QAAnBC,EAAAxC,EAAcyB,UAAK,IAAAe,OAAA,EAAAA,EAAGd,GACtBE,GAAea,uBAEfV,EAAU,CAAAJ,SAAA,CAEI,SAAjBG,GACGD,GACAa,EAAAA,QAAMC,aAAad,EAAM,CAAE,eAAe,IAC9Ce,EAAAA,IAAA,MAAA,CAAKP,UAAWQ,EAAAA,MAAcC,KAAK,eAAcnB,SAC5CA,IAEa,UAAjBG,GACGD,GACAa,EAAAA,QAAMC,aAAad,EAAM,CAAE,eAAe,OACxC"}

package/cjs/text-list/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/text-list/index.ts"],"sourcesContent":["import { OrderedList } from \"./ordered-list\";\nimport { UnorderedList } from \"./unordered-list\";\n\n/**\n * Renders styled ordered and unordered lists for body copy and structured content.\n *\n * Use `TextList` to present sequential or non-sequential items with consistent\n * typography and spacing.\n *\n * Sub-components:\n * - `TextList.Ol` — a numbered list with configurable counter style and direction.\n * - `TextList.Ul` — a bulleted list supporting predefined marker types or a custom icon.\n */\nexport const TextList = {\n    /**\n     * Renders a bulleted list. Supports predefined marker types or\n     * a custom decorative icon.\n     */\n    Ul: UnorderedList,\n    /**\n     * Renders a numbered list with configurable counter display.\n     */\n    Ol: OrderedList,\n};\n\nexport * from \"./types\";\n"],"names":["TextList","Ul","UnorderedList","Ol","OrderedList"],"mappings":"gDAaO,MAAMA,EAAW,CAKpBC,kCAAIC,cAIJC,GAAIC,EAAAA"}
+{"version":3,"file":"index.js","sources":["../../../src/text-list/index.ts"],"sourcesContent":["import { OrderedList } from \"./ordered-list\";\nimport { UnorderedList } from \"./unordered-list\";\n\n// @catalog\n/**\n * Renders styled ordered and unordered lists for body copy and structured content.\n *\n * Use `TextList` to present sequential or non-sequential items with consistent\n * typography and spacing.\n *\n * Sub-components:\n * - `TextList.Ol` — a numbered list with configurable counter style and direction.\n * - `TextList.Ul` — a bulleted list supporting predefined marker types or a custom icon.\n */\nexport const TextList = {\n    /**\n     * Renders a bulleted list. Supports predefined marker types or\n     * a custom decorative icon.\n     */\n    Ul: UnorderedList,\n    /**\n     * Renders a numbered list with configurable counter display.\n     */\n    Ol: OrderedList,\n};\n\nexport * from \"./types\";\n"],"names":["TextList","Ul","UnorderedList","Ol","OrderedList"],"mappings":"gDAcO,MAAMA,EAAW,CAKpBC,kCAAIC,cAIJC,GAAIC,EAAAA"}

package/cjs/theme/theme-provider/hooks.js.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.js","sources":["../../../../src/theme/theme-provider/hooks.tsx"],"sourcesContent":["import type { CSSProperties } from \"react\";\nimport { useContext, useMemo } from \"react\";\n\nimport { getInheritedInlineCssVariables } from \"../utils/css-variable\";\nimport { ThemeContext } from \"./context\";\nimport type { ThemeContextValue } from \"./types\";\n\ntype InheritedThemeScope = {\n    themeProps: {\n        \"data-fds-theme\"?: string;\n        \"data-fds-theme-mode\"?: string;\n    };\n    themeStyle: CSSProperties;\n};\n\n/**\n * Returns the theme context from the nearest `ThemeProvider`.\n *\n * @returns The active `ThemeContextValue`. When called outside a provider,\n * returns defaults: `theme: \"lifesg\"`, `mode: \"light\"`, `themeElement: null`.\n */\nexport const useTheme = (): ThemeContextValue => {\n    const context = useContext(ThemeContext);\n\n    if (!context) {\n        return {\n            theme: \"lifesg\",\n            mode: \"light\",\n            themeElement: null,\n        };\n    }\n\n    return context;\n};\n\n/**\n * Builds `data-fds-theme*` attributes and inline CSS variables for re-stamping\n * the current theme onto a detached DOM element (e.g. a portal or floating\n * overlay).\n *\n * @param enabled When `false`, returns empty objects — useful to conditionally\n * skip the attribute injection.\n * @returns `themeProps` (spread onto the root element) and `themeStyle` (inline\n * CSS variables to apply).\n */\nexport const useInheritedThemeScope = (\n    enabled: boolean\n): InheritedThemeScope => {\n    const themeContext = useContext(ThemeContext);\n\n    return useMemo(() => {\n        if (!enabled) {\n            return {\n                themeProps: {},\n                themeStyle: {},\n            };\n        }\n\n        return {\n            themeProps: {\n                \"data-fds-theme\": themeContext?.theme,\n                \"data-fds-theme-mode\": themeContext?.mode,\n            },\n            themeStyle: getInheritedInlineCssVariables(\n                themeContext?.themeElement ?? null\n            ),\n        };\n    }, [\n        enabled,\n        themeContext?.mode,\n        themeContext?.theme,\n        themeContext?.themeElement,\n    ]);\n};\n"],"names":["enabled","themeContext","useContext","ThemeContext","useMemo","themeProps","theme","mode","themeStyle","getInheritedInlineCssVariables","_a","themeElement","context"],"mappings":"mIA8CIA,IAEA,MAAMC,EAAeC,EAAAA,WAAWC,gBAEhC,OAAOC,EAAAA,SAAQ,WACX,OAAKJ,EAOE,CACHK,WAAY,CACR,iBAAkBJ,aAAY,EAAZA,EAAcK,MAChC,sBAAuBL,aAAY,EAAZA,EAAcM,MAEzCC,WAAYC,EAAAA,+BACkB,QAA1BC,EAAAT,aAAY,EAAZA,EAAcU,oBAAY,IAAAD,EAAAA,EAAI,OAZ3B,CACHL,WAAY,CAAA,EACZG,WAAY,CAAA,EAYnB,GACF,CACCR,EACAC,aAAY,EAAZA,EAAcM,KACdN,aAAY,EAAZA,EAAcK,MACdL,aAAY,EAAZA,EAAcU,cAChB,mBAnDkB,KACpB,MAAMC,EAAUV,EAAAA,WAAWC,gBAE3B,OAAKS,GACM,CACHN,MAAO,SACPC,KAAM,QACNI,aAAc,KAIR"}
+{"version":3,"file":"hooks.js","sources":["../../../../src/theme/theme-provider/hooks.tsx"],"sourcesContent":["import type { CSSProperties } from \"react\";\nimport { useContext, useMemo } from \"react\";\n\nimport { getInheritedInlineCssVariables } from \"../utils/css-variable\";\nimport { ThemeContext } from \"./context\";\nimport type { ThemeContextValue } from \"./types\";\n\ntype InheritedThemeScope = {\n    themeProps: {\n        \"data-fds-theme\"?: string;\n        \"data-fds-theme-mode\"?: string;\n    };\n    themeStyle: CSSProperties;\n};\n\n// @catalog\n/**\n * Returns the theme context from the nearest `ThemeProvider`.\n *\n * @returns The active `ThemeContextValue`. When called outside a provider,\n * returns defaults: `theme: \"lifesg\"`, `mode: \"light\"`, `themeElement: null`.\n */\nexport const useTheme = (): ThemeContextValue => {\n    const context = useContext(ThemeContext);\n\n    if (!context) {\n        return {\n            theme: \"lifesg\",\n            mode: \"light\",\n            themeElement: null,\n        };\n    }\n\n    return context;\n};\n\n// @catalog\n/**\n * Builds `data-fds-theme*` attributes and inline CSS variables for re-stamping\n * the current theme onto a detached DOM element (e.g. a portal or floating\n * overlay).\n *\n * @param enabled When `false`, returns empty objects — useful to conditionally\n * skip the attribute injection.\n * @returns `themeProps` (spread onto the root element) and `themeStyle` (inline\n * CSS variables to apply).\n */\nexport const useInheritedThemeScope = (\n    enabled: boolean\n): InheritedThemeScope => {\n    const themeContext = useContext(ThemeContext);\n\n    return useMemo(() => {\n        if (!enabled) {\n            return {\n                themeProps: {},\n                themeStyle: {},\n            };\n        }\n\n        return {\n            themeProps: {\n                \"data-fds-theme\": themeContext?.theme,\n                \"data-fds-theme-mode\": themeContext?.mode,\n            },\n            themeStyle: getInheritedInlineCssVariables(\n                themeContext?.themeElement ?? null\n            ),\n        };\n    }, [\n        enabled,\n        themeContext?.mode,\n        themeContext?.theme,\n        themeContext?.themeElement,\n    ]);\n};\n"],"names":["enabled","themeContext","useContext","ThemeContext","useMemo","themeProps","theme","mode","themeStyle","getInheritedInlineCssVariables","_a","themeElement","context"],"mappings":"mIAgDIA,IAEA,MAAMC,EAAeC,EAAAA,WAAWC,gBAEhC,OAAOC,EAAAA,SAAQ,WACX,OAAKJ,EAOE,CACHK,WAAY,CACR,iBAAkBJ,aAAY,EAAZA,EAAcK,MAChC,sBAAuBL,aAAY,EAAZA,EAAcM,MAEzCC,WAAYC,EAAAA,+BACkB,QAA1BC,EAAAT,aAAY,EAAZA,EAAcU,oBAAY,IAAAD,EAAAA,EAAI,OAZ3B,CACHL,WAAY,CAAA,EACZG,WAAY,CAAA,EAYnB,GACF,CACCR,EACAC,aAAY,EAAZA,EAAcM,KACdN,aAAY,EAAZA,EAAcK,MACdL,aAAY,EAAZA,EAAcU,cAChB,mBApDkB,KACpB,MAAMC,EAAUV,EAAAA,WAAWC,gBAE3B,OAAKS,GACM,CACHN,MAAO,SACPC,KAAM,QACNI,aAAc,KAIR"}

package/cjs/theme/theme-provider/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/theme/theme-provider/index.tsx"],"sourcesContent":["import type { Ref } from \"react\";\nimport { forwardRef, useEffect, useMemo, useState } from \"react\";\n\nimport { mergeRefs, useIsomorphicLayoutEffect } from \"../../util\";\nimport type { ResolvedThemeMode } from \"../types\";\nimport { setupBreakpointListener } from \"./breakpoint\";\nimport { ThemeContext } from \"./context\";\nimport { listenToSystemColourMode } from \"./system-colour-mode\";\nimport type { ThemeProviderProps } from \"./types\";\n\nconst InnerThemeProvider = (\n    {\n        children,\n        theme = \"lifesg\",\n        mode = \"auto\",\n        className,\n        style,\n    }: ThemeProviderProps,\n    ref: Ref<HTMLDivElement>\n) => {\n    const isModeControlled = mode !== \"auto\";\n\n    const [computedMode, setComputedMode] = useState<ResolvedThemeMode>(\n        isModeControlled ? mode : \"light\"\n    );\n    const [themeElement, setThemeElement] = useState<HTMLDivElement | null>(\n        null\n    );\n\n    // Re-subscribe when the source node or token set changes:\n    // - `themeElement`: scoped breakpoint tokens may live on this element\n    // - `theme` / `themeMode`: breakpoint token values can differ across theme/mode\n    useIsomorphicLayoutEffect(() => {\n        const sourceElement = themeElement ?? document.documentElement;\n        const cleanup = setupBreakpointListener(sourceElement);\n        return cleanup;\n    }, [themeElement, theme, computedMode]);\n\n    useEffect(() => {\n        if (isModeControlled) {\n            setComputedMode(mode);\n            return;\n        }\n\n        return listenToSystemColourMode(setComputedMode);\n    }, [isModeControlled, mode]);\n\n    const contextValue = useMemo(\n        () => ({\n            theme,\n            mode: computedMode,\n            themeElement,\n        }),\n        [theme, computedMode, themeElement]\n    );\n\n    return (\n        <ThemeContext.Provider value={contextValue}>\n            <div\n                ref={mergeRefs(ref, setThemeElement)}\n                data-fds-theme={theme}\n                data-fds-theme-mode={computedMode}\n                className={className}\n                style={style}\n            >\n                {children}\n            </div>\n        </ThemeContext.Provider>\n    );\n};\n\n/**\n * Establishes a themed scope for its subtree.\n *\n * Wrap a section of the tree in `ThemeProvider` to activate a design-token set\n * and colour mode. Components below it read tokens via CSS variables or the\n * `useTheme` hook. Providers can be nested to override a subtree's theme.\n */\nexport const ThemeProvider = forwardRef<HTMLDivElement, ThemeProviderProps>(\n    InnerThemeProvider\n);\n"],"names":["ThemeProvider","forwardRef","children","theme","mode","className","style","ref","isModeControlled","computedMode","setComputedMode","useState","themeElement","setThemeElement","useIsomorphicLayoutEffect","sourceElement","document","documentElement","setupBreakpointListener","useEffect","listenToSystemColourMode","contextValue","useMemo","_jsx","ThemeContext","Provider","value","mergeRefs"],"mappings":"qdAUA,MAoEaA,EAAgBC,EAAAA,YApEF,EAEnBC,WACAC,QAAQ,SACRC,OAAO,OACPC,YACAC,SAEJC,KAEA,MAAMC,EAA4B,SAATJ,GAElBK,EAAcC,GAAmBC,EAAAA,SACpCH,EAAmBJ,EAAO,UAEvBQ,EAAcC,GAAmBF,EAAAA,SACpC,MAMJG,EAAAA,2BAA0B,KACtB,MAAMC,EAAgBH,QAAAA,EAAgBI,SAASC,gBAE/C,OADgBC,EAAAA,wBAAwBH,EAC1B,GACf,CAACH,EAAcT,EAAOM,IAEzBU,EAAAA,WAAU,KACN,IAAIX,EAKJ,OAAOY,EAAAA,yBAAyBV,GAJ5BA,EAAgBN,EAI4B,GACjD,CAACI,EAAkBJ,IAEtB,MAAMiB,EAAeC,EAAAA,SACjB,KAAA,CACInB,QACAC,KAAMK,EACNG,kBAEJ,CAACT,EAAOM,EAAcG,IAG1B,OACIW,MAACC,EAAAA,aAAaC,UAASC,MAAOL,EAAYnB,SACtCqB,EAAAA,WACIhB,IAAKoB,EAAAA,UAAUpB,EAAKM,GAAgB,iBACpBV,EAAK,sBACAM,EACrBJ,UAAWA,EACXC,MAAOA,EAAKJ,SAEXA,KAEe"}
+{"version":3,"file":"index.js","sources":["../../../../src/theme/theme-provider/index.tsx"],"sourcesContent":["import type { Ref } from \"react\";\nimport { forwardRef, useEffect, useMemo, useState } from \"react\";\n\nimport { mergeRefs, useIsomorphicLayoutEffect } from \"../../util\";\nimport type { ResolvedThemeMode } from \"../types\";\nimport { setupBreakpointListener } from \"./breakpoint\";\nimport { ThemeContext } from \"./context\";\nimport { listenToSystemColourMode } from \"./system-colour-mode\";\nimport type { ThemeProviderProps } from \"./types\";\n\nconst InnerThemeProvider = (\n    {\n        children,\n        theme = \"lifesg\",\n        mode = \"auto\",\n        className,\n        style,\n    }: ThemeProviderProps,\n    ref: Ref<HTMLDivElement>\n) => {\n    const isModeControlled = mode !== \"auto\";\n\n    const [computedMode, setComputedMode] = useState<ResolvedThemeMode>(\n        isModeControlled ? mode : \"light\"\n    );\n    const [themeElement, setThemeElement] = useState<HTMLDivElement | null>(\n        null\n    );\n\n    // Re-subscribe when the source node or token set changes:\n    // - `themeElement`: scoped breakpoint tokens may live on this element\n    // - `theme` / `themeMode`: breakpoint token values can differ across theme/mode\n    useIsomorphicLayoutEffect(() => {\n        const sourceElement = themeElement ?? document.documentElement;\n        const cleanup = setupBreakpointListener(sourceElement);\n        return cleanup;\n    }, [themeElement, theme, computedMode]);\n\n    useEffect(() => {\n        if (isModeControlled) {\n            setComputedMode(mode);\n            return;\n        }\n\n        return listenToSystemColourMode(setComputedMode);\n    }, [isModeControlled, mode]);\n\n    const contextValue = useMemo(\n        () => ({\n            theme,\n            mode: computedMode,\n            themeElement,\n        }),\n        [theme, computedMode, themeElement]\n    );\n\n    return (\n        <ThemeContext.Provider value={contextValue}>\n            <div\n                ref={mergeRefs(ref, setThemeElement)}\n                data-fds-theme={theme}\n                data-fds-theme-mode={computedMode}\n                className={className}\n                style={style}\n            >\n                {children}\n            </div>\n        </ThemeContext.Provider>\n    );\n};\n\n// @catalog\n/**\n * Establishes a themed scope for its subtree.\n *\n * Wrap a section of the tree in `ThemeProvider` to activate a design-token set\n * and colour mode. Components below it read tokens via CSS variables or the\n * `useTheme` hook. Providers can be nested to override a subtree's theme.\n */\nexport const ThemeProvider = forwardRef<HTMLDivElement, ThemeProviderProps>(\n    InnerThemeProvider\n);\n"],"names":["ThemeProvider","forwardRef","children","theme","mode","className","style","ref","isModeControlled","computedMode","setComputedMode","useState","themeElement","setThemeElement","useIsomorphicLayoutEffect","sourceElement","document","documentElement","setupBreakpointListener","useEffect","listenToSystemColourMode","contextValue","useMemo","_jsx","ThemeContext","Provider","value","mergeRefs"],"mappings":"qdAUA,MAqEaA,EAAgBC,EAAAA,YArEF,EAEnBC,WACAC,QAAQ,SACRC,OAAO,OACPC,YACAC,SAEJC,KAEA,MAAMC,EAA4B,SAATJ,GAElBK,EAAcC,GAAmBC,EAAAA,SACpCH,EAAmBJ,EAAO,UAEvBQ,EAAcC,GAAmBF,EAAAA,SACpC,MAMJG,EAAAA,2BAA0B,KACtB,MAAMC,EAAgBH,QAAAA,EAAgBI,SAASC,gBAE/C,OADgBC,EAAAA,wBAAwBH,EAC1B,GACf,CAACH,EAAcT,EAAOM,IAEzBU,EAAAA,WAAU,KACN,IAAIX,EAKJ,OAAOY,EAAAA,yBAAyBV,GAJ5BA,EAAgBN,EAI4B,GACjD,CAACI,EAAkBJ,IAEtB,MAAMiB,EAAeC,EAAAA,SACjB,KAAA,CACInB,QACAC,KAAMK,EACNG,kBAEJ,CAACT,EAAOM,EAAcG,IAG1B,OACIW,MAACC,EAAAA,aAAaC,UAASC,MAAOL,EAAYnB,SACtCqB,EAAAA,WACIhB,IAAKoB,EAAAA,UAAUpB,EAAKM,GAAgB,iBACpBV,EAAK,sBACAM,EACrBJ,UAAWA,EACXC,MAAOA,EAAKJ,SAEXA,KAEe"}

package/cjs/theme/tokens/border.js.map

@@ -1 +1 @@
-{"version":3,"file":"border.js","sources":["../../../../src/theme/tokens/border.ts"],"sourcesContent":["/** Border width tokens. */\nexport const BorderThickness = {\n    \"width-005\": \"var(--fds-border-width-005)\",\n    \"width-010\": \"var(--fds-border-width-010)\",\n    \"width-020\": \"var(--fds-border-width-020)\",\n    \"width-040\": \"var(--fds-border-width-040)\",\n} as const;\n\n/** Border style tokens. */\nexport const BorderStyle = {\n    solid: \"var(--fds-border-style-solid)\",\n} as const;\n\n/** Border tokens consisting of border width and border style. */\nexport const Border = {\n    ...BorderThickness,\n    ...BorderStyle,\n} as const;\n"],"names":["BorderThickness","BorderStyle","solid","Border","Object"],"mappings":"aACO,MAAMA,EAAkB,CAC3B,YAAa,8BACb,YAAa,8BACb,YAAa,8BACb,YAAa,+BAIJC,EAAc,CACvBC,MAAO,iCAIEC,EAASC,+BACfJ,GACAC"}
+{"version":3,"file":"border.js","sources":["../../../../src/theme/tokens/border.ts"],"sourcesContent":["/**\n * Border width tokens.\n */\nexport const BorderThickness = {\n    \"width-005\": \"var(--fds-border-width-005)\",\n    \"width-010\": \"var(--fds-border-width-010)\",\n    \"width-020\": \"var(--fds-border-width-020)\",\n    \"width-040\": \"var(--fds-border-width-040)\",\n} as const;\n\n/**\n * Border style tokens.\n */\nexport const BorderStyle = {\n    solid: \"var(--fds-border-style-solid)\",\n} as const;\n\n// @catalog\n/**\n * Border tokens consisting of border width and border style.\n */\nexport const Border = {\n    ...BorderThickness,\n    ...BorderStyle,\n} as const;\n"],"names":["BorderThickness","BorderStyle","solid","Border","Object"],"mappings":"aAGO,MAAMA,EAAkB,CAC3B,YAAa,8BACb,YAAa,8BACb,YAAa,8BACb,YAAa,+BAMJC,EAAc,CACvBC,MAAO,iCAOEC,EAASC,+BACfJ,GACAC"}

package/cjs/theme/tokens/breakpoint.js.map

@@ -1 +1 @@
-{"version":3,"file":"breakpoint.js","sources":["../../../../src/theme/tokens/breakpoint.ts"],"sourcesContent":["/**\n * Responsive breakpoint tokens for each named breakpoint.\n */\nexport const Breakpoint = {\n    \"xxs-min\": \"var(--fds-breakpoint-xxs-min)\",\n    \"xxs-max\": \"var(--fds-breakpoint-xxs-max)\",\n    \"xs-min\": \"var(--fds-breakpoint-xs-min)\",\n    \"xs-max\": \"var(--fds-breakpoint-xs-max)\",\n    \"sm-min\": \"var(--fds-breakpoint-sm-min)\",\n    \"sm-max\": \"var(--fds-breakpoint-sm-max)\",\n    \"md-min\": \"var(--fds-breakpoint-md-min)\",\n    \"md-max\": \"var(--fds-breakpoint-md-max)\",\n    \"lg-min\": \"var(--fds-breakpoint-lg-min)\",\n    \"lg-max\": \"var(--fds-breakpoint-lg-max)\",\n    \"xl-min\": \"var(--fds-breakpoint-xl-min)\",\n    \"xl-max\": \"var(--fds-breakpoint-xl-max)\",\n    \"xxl-min\": \"var(--fds-breakpoint-xxl-min)\",\n\n    \"xxs-column\": \"var(--fds-breakpoint-column-xxs)\",\n    \"xs-column\": \"var(--fds-breakpoint-column-xs)\",\n    \"sm-column\": \"var(--fds-breakpoint-column-sm)\",\n    \"md-column\": \"var(--fds-breakpoint-column-md)\",\n    \"lg-column\": \"var(--fds-breakpoint-column-lg)\",\n    \"xl-column\": \"var(--fds-breakpoint-column-xl)\",\n    \"xxl-column\": \"var(--fds-breakpoint-column-xxl)\",\n\n    \"xxs-gutter\": \"var(--fds-breakpoint-gutter-xxs)\",\n    \"xs-gutter\": \"var(--fds-breakpoint-gutter-xs)\",\n    \"sm-gutter\": \"var(--fds-breakpoint-gutter-sm)\",\n    \"md-gutter\": \"var(--fds-breakpoint-gutter-md)\",\n    \"lg-gutter\": \"var(--fds-breakpoint-gutter-lg)\",\n    \"xl-gutter\": \"var(--fds-breakpoint-gutter-xl)\",\n    \"xxl-gutter\": \"var(--fds-breakpoint-gutter-xxl)\",\n\n    \"xxs-margin\": \"var(--fds-breakpoint-margin-xxs)\",\n    \"xs-margin\": \"var(--fds-breakpoint-margin-xs)\",\n    \"sm-margin\": \"var(--fds-breakpoint-margin-sm)\",\n    \"md-margin\": \"var(--fds-breakpoint-margin-md)\",\n    \"lg-margin\": \"var(--fds-breakpoint-margin-lg)\",\n    \"xl-margin\": \"var(--fds-breakpoint-margin-xl)\",\n    \"xxl-margin\": \"var(--fds-breakpoint-margin-xxl)\",\n} as const;\n"],"names":[],"mappings":"gCAG0B,CACtB,UAAW,gCACX,UAAW,gCACX,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,UAAW,gCAEX,aAAc,mCACd,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,aAAc,mCAEd,aAAc,mCACd,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,aAAc,mCAEd,aAAc,mCACd,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,aAAc"}
+{"version":3,"file":"breakpoint.js","sources":["../../../../src/theme/tokens/breakpoint.ts"],"sourcesContent":["// @catalog\n/**\n * Responsive breakpoint tokens for each named breakpoint.\n */\nexport const Breakpoint = {\n    \"xxs-min\": \"var(--fds-breakpoint-xxs-min)\",\n    \"xxs-max\": \"var(--fds-breakpoint-xxs-max)\",\n    \"xs-min\": \"var(--fds-breakpoint-xs-min)\",\n    \"xs-max\": \"var(--fds-breakpoint-xs-max)\",\n    \"sm-min\": \"var(--fds-breakpoint-sm-min)\",\n    \"sm-max\": \"var(--fds-breakpoint-sm-max)\",\n    \"md-min\": \"var(--fds-breakpoint-md-min)\",\n    \"md-max\": \"var(--fds-breakpoint-md-max)\",\n    \"lg-min\": \"var(--fds-breakpoint-lg-min)\",\n    \"lg-max\": \"var(--fds-breakpoint-lg-max)\",\n    \"xl-min\": \"var(--fds-breakpoint-xl-min)\",\n    \"xl-max\": \"var(--fds-breakpoint-xl-max)\",\n    \"xxl-min\": \"var(--fds-breakpoint-xxl-min)\",\n\n    \"xxs-column\": \"var(--fds-breakpoint-column-xxs)\",\n    \"xs-column\": \"var(--fds-breakpoint-column-xs)\",\n    \"sm-column\": \"var(--fds-breakpoint-column-sm)\",\n    \"md-column\": \"var(--fds-breakpoint-column-md)\",\n    \"lg-column\": \"var(--fds-breakpoint-column-lg)\",\n    \"xl-column\": \"var(--fds-breakpoint-column-xl)\",\n    \"xxl-column\": \"var(--fds-breakpoint-column-xxl)\",\n\n    \"xxs-gutter\": \"var(--fds-breakpoint-gutter-xxs)\",\n    \"xs-gutter\": \"var(--fds-breakpoint-gutter-xs)\",\n    \"sm-gutter\": \"var(--fds-breakpoint-gutter-sm)\",\n    \"md-gutter\": \"var(--fds-breakpoint-gutter-md)\",\n    \"lg-gutter\": \"var(--fds-breakpoint-gutter-lg)\",\n    \"xl-gutter\": \"var(--fds-breakpoint-gutter-xl)\",\n    \"xxl-gutter\": \"var(--fds-breakpoint-gutter-xxl)\",\n\n    \"xxs-margin\": \"var(--fds-breakpoint-margin-xxs)\",\n    \"xs-margin\": \"var(--fds-breakpoint-margin-xs)\",\n    \"sm-margin\": \"var(--fds-breakpoint-margin-sm)\",\n    \"md-margin\": \"var(--fds-breakpoint-margin-md)\",\n    \"lg-margin\": \"var(--fds-breakpoint-margin-lg)\",\n    \"xl-margin\": \"var(--fds-breakpoint-margin-xl)\",\n    \"xxl-margin\": \"var(--fds-breakpoint-margin-xxl)\",\n} as const;\n"],"names":[],"mappings":"gCAI0B,CACtB,UAAW,gCACX,UAAW,gCACX,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,SAAU,+BACV,UAAW,gCAEX,aAAc,mCACd,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,aAAc,mCAEd,aAAc,mCACd,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,aAAc,mCAEd,aAAc,mCACd,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,YAAa,kCACb,aAAc"}

package/cjs/theme/tokens/colour.js.map

@@ -1 +1 @@
-{"version":3,"file":"colour.js","sources":["../../../../src/theme/tokens/colour.ts"],"sourcesContent":["/** Base colour palette */\nexport const PrimitiveColours = {\n    \"brand-10\": \"var(--fds-colour-brand-10)\",\n    \"brand-20\": \"var(--fds-colour-brand-20)\",\n    \"brand-30\": \"var(--fds-colour-brand-30)\",\n    \"brand-40\": \"var(--fds-colour-brand-40)\",\n    \"brand-50\": \"var(--fds-colour-brand-50)\",\n    \"brand-60\": \"var(--fds-colour-brand-60)\",\n    \"brand-70\": \"var(--fds-colour-brand-70)\",\n    \"brand-80\": \"var(--fds-colour-brand-80)\",\n    \"brand-90\": \"var(--fds-colour-brand-90)\",\n    \"brand-95\": \"var(--fds-colour-brand-95)\",\n    \"brand-100\": \"var(--fds-colour-brand-100)\",\n\n    \"primary-10\": \"var(--fds-colour-primary-10)\",\n    \"primary-20\": \"var(--fds-colour-primary-20)\",\n    \"primary-30\": \"var(--fds-colour-primary-30)\",\n    \"primary-40\": \"var(--fds-colour-primary-40)\",\n    \"primary-50\": \"var(--fds-colour-primary-50)\",\n    \"primary-60\": \"var(--fds-colour-primary-60)\",\n    \"primary-70\": \"var(--fds-colour-primary-70)\",\n    \"primary-80\": \"var(--fds-colour-primary-80)\",\n    \"primary-90\": \"var(--fds-colour-primary-90)\",\n    \"primary-95\": \"var(--fds-colour-primary-95)\",\n    \"primary-100\": \"var(--fds-colour-primary-100)\",\n\n    \"secondary-10\": \"var(--fds-colour-secondary-10)\",\n    \"secondary-20\": \"var(--fds-colour-secondary-20)\",\n    \"secondary-30\": \"var(--fds-colour-secondary-30)\",\n    \"secondary-40\": \"var(--fds-colour-secondary-40)\",\n    \"secondary-50\": \"var(--fds-colour-secondary-50)\",\n    \"secondary-60\": \"var(--fds-colour-secondary-60)\",\n    \"secondary-70\": \"var(--fds-colour-secondary-70)\",\n    \"secondary-80\": \"var(--fds-colour-secondary-80)\",\n    \"secondary-90\": \"var(--fds-colour-secondary-90)\",\n    \"secondary-95\": \"var(--fds-colour-secondary-95)\",\n    \"secondary-100\": \"var(--fds-colour-secondary-100)\",\n\n    \"neutral-10\": \"var(--fds-colour-neutral-10)\",\n    \"neutral-20\": \"var(--fds-colour-neutral-20)\",\n    \"neutral-30\": \"var(--fds-colour-neutral-30)\",\n    \"neutral-40\": \"var(--fds-colour-neutral-40)\",\n    \"neutral-50\": \"var(--fds-colour-neutral-50)\",\n    \"neutral-60\": \"var(--fds-colour-neutral-60)\",\n    \"neutral-70\": \"var(--fds-colour-neutral-70)\",\n    \"neutral-80\": \"var(--fds-colour-neutral-80)\",\n    \"neutral-90\": \"var(--fds-colour-neutral-90)\",\n    \"neutral-95\": \"var(--fds-colour-neutral-95)\",\n    \"neutral-100\": \"var(--fds-colour-neutral-100)\",\n\n    \"success-10\": \"var(--fds-colour-success-10)\",\n    \"success-20\": \"var(--fds-colour-success-20)\",\n    \"success-30\": \"var(--fds-colour-success-30)\",\n    \"success-40\": \"var(--fds-colour-success-40)\",\n    \"success-50\": \"var(--fds-colour-success-50)\",\n    \"success-60\": \"var(--fds-colour-success-60)\",\n    \"success-70\": \"var(--fds-colour-success-70)\",\n    \"success-80\": \"var(--fds-colour-success-80)\",\n    \"success-90\": \"var(--fds-colour-success-90)\",\n    \"success-95\": \"var(--fds-colour-success-95)\",\n    \"success-100\": \"var(--fds-colour-success-100)\",\n\n    \"warning-10\": \"var(--fds-colour-warning-10)\",\n    \"warning-20\": \"var(--fds-colour-warning-20)\",\n    \"warning-30\": \"var(--fds-colour-warning-30)\",\n    \"warning-40\": \"var(--fds-colour-warning-40)\",\n    \"warning-50\": \"var(--fds-colour-warning-50)\",\n    \"warning-60\": \"var(--fds-colour-warning-60)\",\n    \"warning-70\": \"var(--fds-colour-warning-70)\",\n    \"warning-80\": \"var(--fds-colour-warning-80)\",\n    \"warning-90\": \"var(--fds-colour-warning-90)\",\n    \"warning-95\": \"var(--fds-colour-warning-95)\",\n    \"warning-100\": \"var(--fds-colour-warning-100)\",\n\n    \"error-10\": \"var(--fds-colour-error-10)\",\n    \"error-20\": \"var(--fds-colour-error-20)\",\n    \"error-30\": \"var(--fds-colour-error-30)\",\n    \"error-40\": \"var(--fds-colour-error-40)\",\n    \"error-50\": \"var(--fds-colour-error-50)\",\n    \"error-60\": \"var(--fds-colour-error-60)\",\n    \"error-70\": \"var(--fds-colour-error-70)\",\n    \"error-80\": \"var(--fds-colour-error-80)\",\n    \"error-90\": \"var(--fds-colour-error-90)\",\n    \"error-95\": \"var(--fds-colour-error-95)\",\n    \"error-100\": \"var(--fds-colour-error-100)\",\n\n    \"info-10\": \"var(--fds-colour-info-10)\",\n    \"info-20\": \"var(--fds-colour-info-20)\",\n    \"info-30\": \"var(--fds-colour-info-30)\",\n    \"info-40\": \"var(--fds-colour-info-40)\",\n    \"info-50\": \"var(--fds-colour-info-50)\",\n    \"info-60\": \"var(--fds-colour-info-60)\",\n    \"info-70\": \"var(--fds-colour-info-70)\",\n    \"info-80\": \"var(--fds-colour-info-80)\",\n    \"info-90\": \"var(--fds-colour-info-90)\",\n    \"info-95\": \"var(--fds-colour-info-95)\",\n    \"info-100\": \"var(--fds-colour-info-100)\",\n\n    white: \"var(--fds-colour-white)\",\n    black: \"var(--fds-colour-black)\",\n    \"primary-inverse\": \"var(--fds-colour-primary-inverse)\",\n} as const;\n\n/** Purpose-driven colour tokens. */\nexport const SemanticColours = {\n    text: \"var(--fds-colour-text)\",\n    \"text-subtle\": \"var(--fds-colour-text-subtle)\",\n    \"text-subtler\": \"var(--fds-colour-text-subtler)\",\n    \"text-subtlest\": \"var(--fds-colour-text-subtlest)\",\n    \"text-primary\": \"var(--fds-colour-text-primary)\",\n    \"text-primary-strong\": \"var(--fds-colour-text-primary-strong)\",\n    \"text-primary-strongest\": \"var(--fds-colour-text-primary-strongest)\",\n    \"text-brand\": \"var(--fds-colour-text-brand)\",\n    \"text-secondary\": \"var(--fds-colour-text-secondary)\",\n    \"text-secondary-subtle\": \"var(--fds-colour-text-secondary-subtle)\",\n    \"text-hover\": \"var(--fds-colour-text-hover)\",\n    \"text-selected\": \"var(--fds-colour-text-selected)\",\n    \"text-selected-hover\": \"var(--fds-colour-text-selected-hover)\",\n    \"text-disabled\": \"var(--fds-colour-text-disabled)\",\n    \"text-disabled-subtle\": \"var(--fds-colour-text-disabled-subtle)\",\n    \"text-disabled-subtlest\": \"var(--fds-colour-text-disabled-subtlest)\",\n    \"text-selected-disabled\": \"var(--fds-colour-text-selected-disabled)\",\n    \"text-success\": \"var(--fds-colour-text-success)\",\n    \"text-warning\": \"var(--fds-colour-text-warning)\",\n    \"text-error\": \"var(--fds-colour-text-error)\",\n    \"text-info\": \"var(--fds-colour-text-info)\",\n    \"text-inverse\": \"var(--fds-colour-text-inverse)\",\n\n    icon: \"var(--fds-colour-icon)\",\n    \"icon-subtle\": \"var(--fds-colour-icon-subtle)\",\n    \"icon-strongest\": \"var(--fds-colour-icon-strongest)\",\n    \"icon-primary\": \"var(--fds-colour-icon-primary)\",\n    \"icon-primary-subtle\": \"var(--fds-colour-icon-primary-subtle)\",\n    \"icon-primary-subtlest\": \"var(--fds-colour-icon-primary-subtlest)\",\n    \"icon-brand\": \"var(--fds-colour-icon-brand)\",\n    \"icon-secondary\": \"var(--fds-colour-icon-secondary)\",\n    \"icon-secondary-subtle\": \"var(--fds-colour-icon-secondary-subtle)\",\n    \"icon-hover\": \"var(--fds-colour-icon-hover)\",\n    \"icon-selected\": \"var(--fds-colour-icon-selected)\",\n    \"icon-selected-hover\": \"var(--fds-colour-icon-selected-hover)\",\n    \"icon-disabled\": \"var(--fds-colour-icon-disabled)\",\n    \"icon-disabled-subtle\": \"var(--fds-colour-icon-disabled-subtle)\",\n    \"icon-selected-disabled\": \"var(--fds-colour-icon-selected-disabled)\",\n    \"icon-success\": \"var(--fds-colour-icon-success)\",\n    \"icon-warning\": \"var(--fds-colour-icon-warning)\",\n    \"icon-error\": \"var(--fds-colour-icon-error)\",\n    \"icon-error-strong\": \"var(--fds-colour-icon-error-strong)\",\n    \"icon-info\": \"var(--fds-colour-icon-info)\",\n    \"icon-inverse\": \"var(--fds-colour-icon-inverse)\",\n    \"icon-primary-inverse\": \"var(--fds-colour-icon-primary-inverse)\",\n\n    border: \"var(--fds-colour-border)\",\n    \"border-strong\": \"var(--fds-colour-border-strong)\",\n    \"border-stronger\": \"var(--fds-colour-border-stronger)\",\n    \"border-primary\": \"var(--fds-colour-border-primary)\",\n    \"border-primary-strong\": \"var(--fds-colour-border-primary-strong)\",\n    \"border-primary-subtle\": \"var(--fds-colour-border-primary-subtle)\",\n    \"border-hover\": \"var(--fds-colour-border-hover)\",\n    \"border-hover-strong\": \"var(--fds-colour-border-hover-strong)\",\n    \"border-selected\": \"var(--fds-colour-border-selected)\",\n    \"border-selected-subtle\": \"var(--fds-colour-border-selected-subtle)\",\n    \"border-selected-subtlest\": \"var(--fds-colour-border-selected-subtlest)\",\n    \"border-selected-hover\": \"var(--fds-colour-border-selected-hover)\",\n    \"border-focus\": \"var(--fds-colour-border-focus)\",\n    \"border-focus-strong\": \"var(--fds-colour-border-focus-strong)\",\n    \"border-disabled\": \"var(--fds-colour-border-disabled)\",\n    \"border-selected-disabled\": \"var(--fds-colour-border-selected-disabled)\",\n    \"border-success\": \"var(--fds-colour-border-success)\",\n    \"border-warning\": \"var(--fds-colour-border-warning)\",\n    \"border-error\": \"var(--fds-colour-border-error)\",\n    \"border-error-focus\": \"var(--fds-colour-border-error-focus)\",\n    \"border-error-focus-strong\": \"var(--fds-colour-border-error-focus-strong)\",\n    \"border-error-strong\": \"var(--fds-colour-border-error-strong)\",\n    \"border-info\": \"var(--fds-colour-border-info)\",\n\n    bg: \"var(--fds-colour-bg)\",\n    \"bg-strong\": \"var(--fds-colour-bg-strong)\",\n    \"bg-stronger\": \"var(--fds-colour-bg-stronger)\",\n    \"bg-strongest\": \"var(--fds-colour-bg-strongest)\",\n    \"bg-hover\": \"var(--fds-colour-bg-hover)\",\n    \"bg-hover-strong\": \"var(--fds-colour-bg-hover-strong)\",\n    \"bg-hover-subtle\": \"var(--fds-colour-bg-hover-subtle)\",\n    \"bg-hover-neutral\": \"var(--fds-colour-bg-hover-neutral)\",\n    \"bg-hover-neutral-strong\": \"var(--fds-colour-bg-hover-neutral-strong)\",\n    \"bg-selected\": \"var(--fds-colour-bg-selected)\",\n    \"bg-selected-hover\": \"var(--fds-colour-bg-selected-hover)\",\n    \"bg-selected-strong\": \"var(--fds-colour-bg-selected-strong)\",\n    \"bg-selected-stronger\": \"var(--fds-colour-bg-selected-stronger)\",\n    \"bg-selected-strongest\": \"var(--fds-colour-bg-selected-strongest)\",\n    \"bg-selected-strongest-hover\":\n        \"var(--fds-colour-bg-selected-strongest-hover)\",\n    \"bg-disabled\": \"var(--fds-colour-bg-disabled)\",\n    \"bg-selected-disabled\": \"var(--fds-colour-bg-selected-disabled)\",\n    \"bg-selected-stronger-disabled\":\n        \"var(--fds-colour-bg-selected-stronger-disabled)\",\n    \"bg-success\": \"var(--fds-colour-bg-success)\",\n    \"bg-success-hover\": \"var(--fds-colour-bg-success-hover)\",\n    \"bg-success-strong\": \"var(--fds-colour-bg-success-strong)\",\n    \"bg-success-strong-hover\": \"var(--fds-colour-bg-success-strong-hover)\",\n    \"bg-warning\": \"var(--fds-colour-bg-warning)\",\n    \"bg-warning-hover\": \"var(--fds-colour-bg-warning-hover)\",\n    \"bg-warning-strong\": \"var(--fds-colour-bg-warning-strong)\",\n    \"bg-warning-strong-hover\": \"var(--fds-colour-bg-warning-strong-hover)\",\n    \"bg-info\": \"var(--fds-colour-bg-info)\",\n    \"bg-info-hover\": \"var(--fds-colour-bg-info-hover)\",\n    \"bg-info-strong\": \"var(--fds-colour-bg-info-strong)\",\n    \"bg-info-strong-hover\": \"var(--fds-colour-bg-info-strong-hover)\",\n    \"bg-error\": \"var(--fds-colour-bg-error)\",\n    \"bg-error-hover\": \"var(--fds-colour-bg-error-hover)\",\n    \"bg-error-strong\": \"var(--fds-colour-bg-error-strong)\",\n    \"bg-error-strong-hover\": \"var(--fds-colour-bg-error-strong-hover)\",\n    \"bg-inverse\": \"var(--fds-colour-bg-inverse)\",\n    \"bg-inverse-subtle\": \"var(--fds-colour-bg-inverse-subtle)\",\n    \"bg-inverse-subtler\": \"var(--fds-colour-bg-inverse-subtler)\",\n    \"bg-inverse-subtlest\": \"var(--fds-colour-bg-inverse-subtlest)\",\n    \"bg-inverse-hover\": \"var(--fds-colour-bg-inverse-hover)\",\n    \"bg-primary\": \"var(--fds-colour-bg-primary)\",\n    \"bg-primary-strong\": \"var(--fds-colour-bg-primary-strong)\",\n    \"bg-primary-subtle\": \"var(--fds-colour-bg-primary-subtle)\",\n    \"bg-primary-subtler\": \"var(--fds-colour-bg-primary-subtler)\",\n    \"bg-primary-subtlest\": \"var(--fds-colour-bg-primary-subtlest)\",\n    \"bg-secondary\": \"var(--fds-colour-bg-secondary)\",\n    \"bg-secondary-subtle\": \"var(--fds-colour-bg-secondary-subtle)\",\n    \"bg-secondary-subtler\": \"var(--fds-colour-bg-secondary-subtler)\",\n    \"bg-secondary-subtlest\": \"var(--fds-colour-bg-secondary-subtlest)\",\n    \"bg-available\": \"var(--fds-colour-bg-available)\",\n    \"bg-primary-hover\": \"var(--fds-colour-bg-primary-hover)\",\n    \"bg-primary-strong-hover\": \"var(--fds-colour-bg-primary-strong-hover)\",\n    \"bg-primary-subtlest-hover\": \"var(--fds-colour-bg-primary-subtlest-hover)\",\n    \"bg-primary-subtlest-selected\":\n        \"var(--fds-colour-bg-primary-subtlest-selected)\",\n\n    \"overlay-strong\": \"var(--fds-colour-overlay-strong)\",\n    \"overlay-subtle\": \"var(--fds-colour-overlay-subtle)\",\n\n    hyperlink: \"var(--fds-colour-hyperlink)\",\n    \"hyperlink-hover\": \"var(--fds-colour-hyperlink-hover)\",\n    \"hyperlink-visited\": \"var(--fds-colour-hyperlink-visited)\",\n    \"hyperlink-inverse\": \"var(--fds-colour-hyperlink-inverse)\",\n\n    \"focus-ring\": \"var(--fds-colour-focus-ring)\",\n    \"focus-ring-inverse\": \"var(--fds-colour-focus-ring-inverse)\",\n} as const;\n\n/** Combined colour token set. */\nexport const Colour = {\n    Primitive: PrimitiveColours,\n    ...SemanticColours,\n} as const;\n"],"names":["PrimitiveColours","white","black","SemanticColours","text","icon","border","bg","hyperlink","Colour","Object","assign","Primitive"],"mappings":"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"}
+{"version":3,"file":"colour.js","sources":["../../../../src/theme/tokens/colour.ts"],"sourcesContent":["/**\n * Base colour palette.\n */\nexport const PrimitiveColours = {\n    \"brand-10\": \"var(--fds-colour-brand-10)\",\n    \"brand-20\": \"var(--fds-colour-brand-20)\",\n    \"brand-30\": \"var(--fds-colour-brand-30)\",\n    \"brand-40\": \"var(--fds-colour-brand-40)\",\n    \"brand-50\": \"var(--fds-colour-brand-50)\",\n    \"brand-60\": \"var(--fds-colour-brand-60)\",\n    \"brand-70\": \"var(--fds-colour-brand-70)\",\n    \"brand-80\": \"var(--fds-colour-brand-80)\",\n    \"brand-90\": \"var(--fds-colour-brand-90)\",\n    \"brand-95\": \"var(--fds-colour-brand-95)\",\n    \"brand-100\": \"var(--fds-colour-brand-100)\",\n\n    \"primary-10\": \"var(--fds-colour-primary-10)\",\n    \"primary-20\": \"var(--fds-colour-primary-20)\",\n    \"primary-30\": \"var(--fds-colour-primary-30)\",\n    \"primary-40\": \"var(--fds-colour-primary-40)\",\n    \"primary-50\": \"var(--fds-colour-primary-50)\",\n    \"primary-60\": \"var(--fds-colour-primary-60)\",\n    \"primary-70\": \"var(--fds-colour-primary-70)\",\n    \"primary-80\": \"var(--fds-colour-primary-80)\",\n    \"primary-90\": \"var(--fds-colour-primary-90)\",\n    \"primary-95\": \"var(--fds-colour-primary-95)\",\n    \"primary-100\": \"var(--fds-colour-primary-100)\",\n\n    \"secondary-10\": \"var(--fds-colour-secondary-10)\",\n    \"secondary-20\": \"var(--fds-colour-secondary-20)\",\n    \"secondary-30\": \"var(--fds-colour-secondary-30)\",\n    \"secondary-40\": \"var(--fds-colour-secondary-40)\",\n    \"secondary-50\": \"var(--fds-colour-secondary-50)\",\n    \"secondary-60\": \"var(--fds-colour-secondary-60)\",\n    \"secondary-70\": \"var(--fds-colour-secondary-70)\",\n    \"secondary-80\": \"var(--fds-colour-secondary-80)\",\n    \"secondary-90\": \"var(--fds-colour-secondary-90)\",\n    \"secondary-95\": \"var(--fds-colour-secondary-95)\",\n    \"secondary-100\": \"var(--fds-colour-secondary-100)\",\n\n    \"neutral-10\": \"var(--fds-colour-neutral-10)\",\n    \"neutral-20\": \"var(--fds-colour-neutral-20)\",\n    \"neutral-30\": \"var(--fds-colour-neutral-30)\",\n    \"neutral-40\": \"var(--fds-colour-neutral-40)\",\n    \"neutral-50\": \"var(--fds-colour-neutral-50)\",\n    \"neutral-60\": \"var(--fds-colour-neutral-60)\",\n    \"neutral-70\": \"var(--fds-colour-neutral-70)\",\n    \"neutral-80\": \"var(--fds-colour-neutral-80)\",\n    \"neutral-90\": \"var(--fds-colour-neutral-90)\",\n    \"neutral-95\": \"var(--fds-colour-neutral-95)\",\n    \"neutral-100\": \"var(--fds-colour-neutral-100)\",\n\n    \"success-10\": \"var(--fds-colour-success-10)\",\n    \"success-20\": \"var(--fds-colour-success-20)\",\n    \"success-30\": \"var(--fds-colour-success-30)\",\n    \"success-40\": \"var(--fds-colour-success-40)\",\n    \"success-50\": \"var(--fds-colour-success-50)\",\n    \"success-60\": \"var(--fds-colour-success-60)\",\n    \"success-70\": \"var(--fds-colour-success-70)\",\n    \"success-80\": \"var(--fds-colour-success-80)\",\n    \"success-90\": \"var(--fds-colour-success-90)\",\n    \"success-95\": \"var(--fds-colour-success-95)\",\n    \"success-100\": \"var(--fds-colour-success-100)\",\n\n    \"warning-10\": \"var(--fds-colour-warning-10)\",\n    \"warning-20\": \"var(--fds-colour-warning-20)\",\n    \"warning-30\": \"var(--fds-colour-warning-30)\",\n    \"warning-40\": \"var(--fds-colour-warning-40)\",\n    \"warning-50\": \"var(--fds-colour-warning-50)\",\n    \"warning-60\": \"var(--fds-colour-warning-60)\",\n    \"warning-70\": \"var(--fds-colour-warning-70)\",\n    \"warning-80\": \"var(--fds-colour-warning-80)\",\n    \"warning-90\": \"var(--fds-colour-warning-90)\",\n    \"warning-95\": \"var(--fds-colour-warning-95)\",\n    \"warning-100\": \"var(--fds-colour-warning-100)\",\n\n    \"error-10\": \"var(--fds-colour-error-10)\",\n    \"error-20\": \"var(--fds-colour-error-20)\",\n    \"error-30\": \"var(--fds-colour-error-30)\",\n    \"error-40\": \"var(--fds-colour-error-40)\",\n    \"error-50\": \"var(--fds-colour-error-50)\",\n    \"error-60\": \"var(--fds-colour-error-60)\",\n    \"error-70\": \"var(--fds-colour-error-70)\",\n    \"error-80\": \"var(--fds-colour-error-80)\",\n    \"error-90\": \"var(--fds-colour-error-90)\",\n    \"error-95\": \"var(--fds-colour-error-95)\",\n    \"error-100\": \"var(--fds-colour-error-100)\",\n\n    \"info-10\": \"var(--fds-colour-info-10)\",\n    \"info-20\": \"var(--fds-colour-info-20)\",\n    \"info-30\": \"var(--fds-colour-info-30)\",\n    \"info-40\": \"var(--fds-colour-info-40)\",\n    \"info-50\": \"var(--fds-colour-info-50)\",\n    \"info-60\": \"var(--fds-colour-info-60)\",\n    \"info-70\": \"var(--fds-colour-info-70)\",\n    \"info-80\": \"var(--fds-colour-info-80)\",\n    \"info-90\": \"var(--fds-colour-info-90)\",\n    \"info-95\": \"var(--fds-colour-info-95)\",\n    \"info-100\": \"var(--fds-colour-info-100)\",\n\n    white: \"var(--fds-colour-white)\",\n    black: \"var(--fds-colour-black)\",\n    \"primary-inverse\": \"var(--fds-colour-primary-inverse)\",\n} as const;\n\n/**\n * Purpose-driven colour tokens.\n */\nexport const SemanticColours = {\n    text: \"var(--fds-colour-text)\",\n    \"text-subtle\": \"var(--fds-colour-text-subtle)\",\n    \"text-subtler\": \"var(--fds-colour-text-subtler)\",\n    \"text-subtlest\": \"var(--fds-colour-text-subtlest)\",\n    \"text-primary\": \"var(--fds-colour-text-primary)\",\n    \"text-primary-strong\": \"var(--fds-colour-text-primary-strong)\",\n    \"text-primary-strongest\": \"var(--fds-colour-text-primary-strongest)\",\n    \"text-brand\": \"var(--fds-colour-text-brand)\",\n    \"text-secondary\": \"var(--fds-colour-text-secondary)\",\n    \"text-secondary-subtle\": \"var(--fds-colour-text-secondary-subtle)\",\n    \"text-hover\": \"var(--fds-colour-text-hover)\",\n    \"text-selected\": \"var(--fds-colour-text-selected)\",\n    \"text-selected-hover\": \"var(--fds-colour-text-selected-hover)\",\n    \"text-disabled\": \"var(--fds-colour-text-disabled)\",\n    \"text-disabled-subtle\": \"var(--fds-colour-text-disabled-subtle)\",\n    \"text-disabled-subtlest\": \"var(--fds-colour-text-disabled-subtlest)\",\n    \"text-selected-disabled\": \"var(--fds-colour-text-selected-disabled)\",\n    \"text-success\": \"var(--fds-colour-text-success)\",\n    \"text-warning\": \"var(--fds-colour-text-warning)\",\n    \"text-error\": \"var(--fds-colour-text-error)\",\n    \"text-info\": \"var(--fds-colour-text-info)\",\n    \"text-inverse\": \"var(--fds-colour-text-inverse)\",\n\n    icon: \"var(--fds-colour-icon)\",\n    \"icon-subtle\": \"var(--fds-colour-icon-subtle)\",\n    \"icon-strongest\": \"var(--fds-colour-icon-strongest)\",\n    \"icon-primary\": \"var(--fds-colour-icon-primary)\",\n    \"icon-primary-subtle\": \"var(--fds-colour-icon-primary-subtle)\",\n    \"icon-primary-subtlest\": \"var(--fds-colour-icon-primary-subtlest)\",\n    \"icon-brand\": \"var(--fds-colour-icon-brand)\",\n    \"icon-secondary\": \"var(--fds-colour-icon-secondary)\",\n    \"icon-secondary-subtle\": \"var(--fds-colour-icon-secondary-subtle)\",\n    \"icon-hover\": \"var(--fds-colour-icon-hover)\",\n    \"icon-selected\": \"var(--fds-colour-icon-selected)\",\n    \"icon-selected-hover\": \"var(--fds-colour-icon-selected-hover)\",\n    \"icon-disabled\": \"var(--fds-colour-icon-disabled)\",\n    \"icon-disabled-subtle\": \"var(--fds-colour-icon-disabled-subtle)\",\n    \"icon-selected-disabled\": \"var(--fds-colour-icon-selected-disabled)\",\n    \"icon-success\": \"var(--fds-colour-icon-success)\",\n    \"icon-warning\": \"var(--fds-colour-icon-warning)\",\n    \"icon-error\": \"var(--fds-colour-icon-error)\",\n    \"icon-error-strong\": \"var(--fds-colour-icon-error-strong)\",\n    \"icon-info\": \"var(--fds-colour-icon-info)\",\n    \"icon-inverse\": \"var(--fds-colour-icon-inverse)\",\n    \"icon-primary-inverse\": \"var(--fds-colour-icon-primary-inverse)\",\n\n    border: \"var(--fds-colour-border)\",\n    \"border-strong\": \"var(--fds-colour-border-strong)\",\n    \"border-stronger\": \"var(--fds-colour-border-stronger)\",\n    \"border-primary\": \"var(--fds-colour-border-primary)\",\n    \"border-primary-strong\": \"var(--fds-colour-border-primary-strong)\",\n    \"border-primary-subtle\": \"var(--fds-colour-border-primary-subtle)\",\n    \"border-hover\": \"var(--fds-colour-border-hover)\",\n    \"border-hover-strong\": \"var(--fds-colour-border-hover-strong)\",\n    \"border-selected\": \"var(--fds-colour-border-selected)\",\n    \"border-selected-subtle\": \"var(--fds-colour-border-selected-subtle)\",\n    \"border-selected-subtlest\": \"var(--fds-colour-border-selected-subtlest)\",\n    \"border-selected-hover\": \"var(--fds-colour-border-selected-hover)\",\n    \"border-focus\": \"var(--fds-colour-border-focus)\",\n    \"border-focus-strong\": \"var(--fds-colour-border-focus-strong)\",\n    \"border-disabled\": \"var(--fds-colour-border-disabled)\",\n    \"border-selected-disabled\": \"var(--fds-colour-border-selected-disabled)\",\n    \"border-success\": \"var(--fds-colour-border-success)\",\n    \"border-warning\": \"var(--fds-colour-border-warning)\",\n    \"border-error\": \"var(--fds-colour-border-error)\",\n    \"border-error-focus\": \"var(--fds-colour-border-error-focus)\",\n    \"border-error-focus-strong\": \"var(--fds-colour-border-error-focus-strong)\",\n    \"border-error-strong\": \"var(--fds-colour-border-error-strong)\",\n    \"border-info\": \"var(--fds-colour-border-info)\",\n\n    bg: \"var(--fds-colour-bg)\",\n    \"bg-strong\": \"var(--fds-colour-bg-strong)\",\n    \"bg-stronger\": \"var(--fds-colour-bg-stronger)\",\n    \"bg-strongest\": \"var(--fds-colour-bg-strongest)\",\n    \"bg-hover\": \"var(--fds-colour-bg-hover)\",\n    \"bg-hover-strong\": \"var(--fds-colour-bg-hover-strong)\",\n    \"bg-hover-subtle\": \"var(--fds-colour-bg-hover-subtle)\",\n    \"bg-hover-neutral\": \"var(--fds-colour-bg-hover-neutral)\",\n    \"bg-hover-neutral-strong\": \"var(--fds-colour-bg-hover-neutral-strong)\",\n    \"bg-selected\": \"var(--fds-colour-bg-selected)\",\n    \"bg-selected-hover\": \"var(--fds-colour-bg-selected-hover)\",\n    \"bg-selected-strong\": \"var(--fds-colour-bg-selected-strong)\",\n    \"bg-selected-stronger\": \"var(--fds-colour-bg-selected-stronger)\",\n    \"bg-selected-strongest\": \"var(--fds-colour-bg-selected-strongest)\",\n    \"bg-selected-strongest-hover\":\n        \"var(--fds-colour-bg-selected-strongest-hover)\",\n    \"bg-disabled\": \"var(--fds-colour-bg-disabled)\",\n    \"bg-selected-disabled\": \"var(--fds-colour-bg-selected-disabled)\",\n    \"bg-selected-stronger-disabled\":\n        \"var(--fds-colour-bg-selected-stronger-disabled)\",\n    \"bg-success\": \"var(--fds-colour-bg-success)\",\n    \"bg-success-hover\": \"var(--fds-colour-bg-success-hover)\",\n    \"bg-success-strong\": \"var(--fds-colour-bg-success-strong)\",\n    \"bg-success-strong-hover\": \"var(--fds-colour-bg-success-strong-hover)\",\n    \"bg-warning\": \"var(--fds-colour-bg-warning)\",\n    \"bg-warning-hover\": \"var(--fds-colour-bg-warning-hover)\",\n    \"bg-warning-strong\": \"var(--fds-colour-bg-warning-strong)\",\n    \"bg-warning-strong-hover\": \"var(--fds-colour-bg-warning-strong-hover)\",\n    \"bg-info\": \"var(--fds-colour-bg-info)\",\n    \"bg-info-hover\": \"var(--fds-colour-bg-info-hover)\",\n    \"bg-info-strong\": \"var(--fds-colour-bg-info-strong)\",\n    \"bg-info-strong-hover\": \"var(--fds-colour-bg-info-strong-hover)\",\n    \"bg-error\": \"var(--fds-colour-bg-error)\",\n    \"bg-error-hover\": \"var(--fds-colour-bg-error-hover)\",\n    \"bg-error-strong\": \"var(--fds-colour-bg-error-strong)\",\n    \"bg-error-strong-hover\": \"var(--fds-colour-bg-error-strong-hover)\",\n    \"bg-inverse\": \"var(--fds-colour-bg-inverse)\",\n    \"bg-inverse-subtle\": \"var(--fds-colour-bg-inverse-subtle)\",\n    \"bg-inverse-subtler\": \"var(--fds-colour-bg-inverse-subtler)\",\n    \"bg-inverse-subtlest\": \"var(--fds-colour-bg-inverse-subtlest)\",\n    \"bg-inverse-hover\": \"var(--fds-colour-bg-inverse-hover)\",\n    \"bg-primary\": \"var(--fds-colour-bg-primary)\",\n    \"bg-primary-strong\": \"var(--fds-colour-bg-primary-strong)\",\n    \"bg-primary-subtle\": \"var(--fds-colour-bg-primary-subtle)\",\n    \"bg-primary-subtler\": \"var(--fds-colour-bg-primary-subtler)\",\n    \"bg-primary-subtlest\": \"var(--fds-colour-bg-primary-subtlest)\",\n    \"bg-secondary\": \"var(--fds-colour-bg-secondary)\",\n    \"bg-secondary-subtle\": \"var(--fds-colour-bg-secondary-subtle)\",\n    \"bg-secondary-subtler\": \"var(--fds-colour-bg-secondary-subtler)\",\n    \"bg-secondary-subtlest\": \"var(--fds-colour-bg-secondary-subtlest)\",\n    \"bg-available\": \"var(--fds-colour-bg-available)\",\n    \"bg-primary-hover\": \"var(--fds-colour-bg-primary-hover)\",\n    \"bg-primary-strong-hover\": \"var(--fds-colour-bg-primary-strong-hover)\",\n    \"bg-primary-subtlest-hover\": \"var(--fds-colour-bg-primary-subtlest-hover)\",\n    \"bg-primary-subtlest-selected\":\n        \"var(--fds-colour-bg-primary-subtlest-selected)\",\n\n    \"overlay-strong\": \"var(--fds-colour-overlay-strong)\",\n    \"overlay-subtle\": \"var(--fds-colour-overlay-subtle)\",\n\n    hyperlink: \"var(--fds-colour-hyperlink)\",\n    \"hyperlink-hover\": \"var(--fds-colour-hyperlink-hover)\",\n    \"hyperlink-visited\": \"var(--fds-colour-hyperlink-visited)\",\n    \"hyperlink-inverse\": \"var(--fds-colour-hyperlink-inverse)\",\n\n    \"focus-ring\": \"var(--fds-colour-focus-ring)\",\n    \"focus-ring-inverse\": \"var(--fds-colour-focus-ring-inverse)\",\n} as const;\n\n// @catalog\n/**\n * Combined colour token set.\n */\nexport const Colour = {\n    Primitive: PrimitiveColours,\n    ...SemanticColours,\n} as const;\n"],"names":["PrimitiveColours","white","black","SemanticColours","text","icon","border","bg","hyperlink","Colour","Object","assign","Primitive"],"mappings":"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"}

package/cjs/theme/tokens/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../../src/theme/tokens/component.ts"],"sourcesContent":["const Button = {\n    radius: \"var(--fds-button-radius)\",\n    \"default-colour-bg\": \"var(--fds-button-default-colour-bg)\",\n    \"default-colour-bg-hover\": \"var(--fds-button-default-colour-bg-hover)\",\n    \"default-colour-text\": \"var(--fds-button-default-colour-text)\",\n    \"secondary-colour-border\": \"var(--fds-button-secondary-colour-border)\",\n    \"secondary-colour-text\": \"var(--fds-button-secondary-colour-text)\",\n    \"light-colour-text\": \"var(--fds-button-light-colour-text)\",\n    \"link-colour-text\": \"var(--fds-button-link-colour-text)\",\n} as const;\n\nconst Animation = {\n    \"loading-dots-spinner-colour\":\n        \"var(--fds-animation-loading-dots-spinner-colour)\",\n} as const;\n\nconst Navbar = {\n    \"full-height\": \"var(--fds-navbar-full-height)\",\n    \"full-logo-height\": \"var(--fds-navbar-full-logo-height)\",\n    \"compressed-height\": \"var(--fds-navbar-compressed-height)\",\n    \"compressed-logo-height\": \"var(--fds-navbar-compressed-logo-height)\",\n    \"mobile-height\": \"var(--fds-navbar-mobile-height)\",\n    \"mobile-logo-height\": \"var(--fds-navbar-mobile-logo-height)\",\n    \"colour-bg\": \"var(--fds-navbar-colour-bg)\",\n    \"colour-icon\": \"var(--fds-navbar-colour-icon)\",\n    \"link-colour-text\": \"var(--fds-navbar-link-colour-text)\",\n    \"link-colour-text-hover\": \"var(--fds-navbar-link-colour-text-hover)\",\n    \"link-colour-text-selected-hover\":\n        \"var(--fds-navbar-link-colour-text-selected-hover)\",\n} as const;\n\nconst Footer = {\n    \"colour-bg\": \"var(--fds-footer-colour-bg)\",\n    \"colour-text\": \"var(--fds-footer-colour-text)\",\n    \"link-colour-text\": \"var(--fds-footer-link-colour-text)\",\n    \"link-colour-text-hover\": \"var(--fds-footer-link-colour-text-hover)\",\n    \"disclaimer-link-colour-text\":\n        \"var(--fds-footer-disclaimer-link-colour-text)\",\n    \"disclaimer-link-colour-text-hover\":\n        \"var(--fds-footer-disclaimer-link-colour-text-hover)\",\n} as const;\n\n/** Component-scoped design tokens grouped by component. */\nexport const ComponentToken = {\n    Animation,\n    Button,\n    Footer,\n    Navbar,\n} as const;\n"],"names":["ComponentToken","Animation","Button","radius","Footer","Navbar"],"mappings":"aAAA,MA2CaA,EAAiB,CAC1BC,UAjCc,CACd,8BACI,oDAgCJC,OA7CW,CACXC,OAAQ,2BACR,oBAAqB,sCACrB,0BAA2B,4CAC3B,sBAAuB,wCACvB,0BAA2B,4CAC3B,wBAAyB,0CACzB,oBAAqB,sCACrB,mBAAoB,sCAsCpBC,OAfW,CACX,YAAa,8BACb,cAAe,gCACf,mBAAoB,qCACpB,yBAA0B,2CAC1B,8BACI,gDACJ,oCACI,uDAQJC,OA/BW,CACX,cAAe,gCACf,mBAAoB,qCACpB,oBAAqB,sCACrB,yBAA0B,2CAC1B,gBAAiB,kCACjB,qBAAsB,uCACtB,YAAa,8BACb,cAAe,gCACf,mBAAoB,qCACpB,yBAA0B,2CAC1B,kCACI"}
+{"version":3,"file":"component.js","sources":["../../../../src/theme/tokens/component.ts"],"sourcesContent":["const Button = {\n    radius: \"var(--fds-button-radius)\",\n    \"default-colour-bg\": \"var(--fds-button-default-colour-bg)\",\n    \"default-colour-bg-hover\": \"var(--fds-button-default-colour-bg-hover)\",\n    \"default-colour-text\": \"var(--fds-button-default-colour-text)\",\n    \"secondary-colour-border\": \"var(--fds-button-secondary-colour-border)\",\n    \"secondary-colour-text\": \"var(--fds-button-secondary-colour-text)\",\n    \"light-colour-text\": \"var(--fds-button-light-colour-text)\",\n    \"link-colour-text\": \"var(--fds-button-link-colour-text)\",\n} as const;\n\nconst Animation = {\n    \"loading-dots-spinner-colour\":\n        \"var(--fds-animation-loading-dots-spinner-colour)\",\n} as const;\n\nconst Navbar = {\n    \"full-height\": \"var(--fds-navbar-full-height)\",\n    \"full-logo-height\": \"var(--fds-navbar-full-logo-height)\",\n    \"compressed-height\": \"var(--fds-navbar-compressed-height)\",\n    \"compressed-logo-height\": \"var(--fds-navbar-compressed-logo-height)\",\n    \"mobile-height\": \"var(--fds-navbar-mobile-height)\",\n    \"mobile-logo-height\": \"var(--fds-navbar-mobile-logo-height)\",\n    \"colour-bg\": \"var(--fds-navbar-colour-bg)\",\n    \"colour-icon\": \"var(--fds-navbar-colour-icon)\",\n    \"link-colour-text\": \"var(--fds-navbar-link-colour-text)\",\n    \"link-colour-text-hover\": \"var(--fds-navbar-link-colour-text-hover)\",\n    \"link-colour-text-selected-hover\":\n        \"var(--fds-navbar-link-colour-text-selected-hover)\",\n} as const;\n\nconst Footer = {\n    \"colour-bg\": \"var(--fds-footer-colour-bg)\",\n    \"colour-text\": \"var(--fds-footer-colour-text)\",\n    \"link-colour-text\": \"var(--fds-footer-link-colour-text)\",\n    \"link-colour-text-hover\": \"var(--fds-footer-link-colour-text-hover)\",\n    \"disclaimer-link-colour-text\":\n        \"var(--fds-footer-disclaimer-link-colour-text)\",\n    \"disclaimer-link-colour-text-hover\":\n        \"var(--fds-footer-disclaimer-link-colour-text-hover)\",\n} as const;\n\n// @catalog\n/**\n * Component-scoped design tokens grouped by component.\n */\nexport const ComponentToken = {\n    Animation,\n    Button,\n    Footer,\n    Navbar,\n} as const;\n"],"names":["ComponentToken","Animation","Button","radius","Footer","Navbar"],"mappings":"aAAA,MA8CaA,EAAiB,CAC1BC,UApCc,CACd,8BACI,oDAmCJC,OAhDW,CACXC,OAAQ,2BACR,oBAAqB,sCACrB,0BAA2B,4CAC3B,sBAAuB,wCACvB,0BAA2B,4CAC3B,wBAAyB,0CACzB,oBAAqB,sCACrB,mBAAoB,sCAyCpBC,OAlBW,CACX,YAAa,8BACb,cAAe,gCACf,mBAAoB,qCACpB,yBAA0B,2CAC1B,8BACI,gDACJ,oCACI,uDAWJC,OAlCW,CACX,cAAe,gCACf,mBAAoB,qCACpB,oBAAqB,sCACrB,yBAA0B,2CAC1B,gBAAiB,kCACjB,qBAAsB,uCACtB,YAAa,8BACb,cAAe,gCACf,mBAAoB,qCACpB,yBAA0B,2CAC1B,kCACI"}