@lifesg/react-design-system 4.0.0-alpha.3 → 4.0.0-alpha.5

package/input-select/input-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-select.js","sources":["../../src/input-select/input-select.tsx"],"sourcesContent":["import type { OpenChangeReason } from \"@floating-ui/react\";\nimport type React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\n\nimport {\n    DropdownList,\n    DropdownListState,\n    ExpandableElement,\n} from \"../shared/dropdown-list\";\nimport { ElementWithDropdown } from \"../shared/dropdown-wrapper\";\nimport {\n    LabelContainer,\n    PlaceholderLabel,\n    ValueLabel,\n} from \"../shared/dropdown-wrapper/dropdown-wrapper\";\nimport { InputBox } from \"../shared/input-wrapper/input-wrapper\";\nimport { useId } from \"../util\";\nimport { StringHelper } from \"../util/string-helper\";\nimport type { InputSelectProps } from \"./types\";\n\nexport const InputSelect = <T, V>({\n    selectedOption,\n    placeholder = \"Select\",\n    options,\n    disabled,\n    error,\n    className,\n    \"data-testid\": testId,\n    id,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    \"aria-invalid\": ariaInvalid,\n    enableSearch = false,\n    searchFunction,\n    searchPlaceholder,\n    valueExtractor,\n    valueToStringFunction,\n    listExtractor,\n    displayValueExtractor,\n    onSelectOption,\n    onShowOptions,\n    onHideOptions,\n    onRetry,\n    optionsLoadState = \"success\",\n    optionTruncationType = \"end\",\n    renderCustomSelectedOption,\n    renderListItem,\n    hideNoResultsDisplay,\n    noResultsDescription,\n    customLabels,\n    renderCustomCallToAction,\n    onBlur,\n    variant = \"default\",\n    readOnly,\n    alignment,\n    dropdownZIndex,\n    dropdownRootNode,\n    dropdownWidth,\n}: InputSelectProps<T, V>): JSX.Element => {\n    // =============================================================================\n    // CONST, STATE\n    // =============================================================================\n    const [selected, setSelected] = useState<T | undefined>(selectedOption);\n    const [showOptions, setShowOptions] = useState<boolean>(false);\n    const [focused, setFocused] = useState<boolean>(false);\n    const internalId = useId();\n\n    const nodeRef = useRef<HTMLDivElement>(null);\n    const selectorRef = useRef<HTMLButtonElement>(null);\n    const labelContainerRef = useRef<HTMLDivElement>(null);\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        setSelected(selectedOption);\n    }, [selectedOption]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleListItemClick = (item: T, extractedValue: V) => {\n        selectorRef.current?.focus();\n        setSelected(item);\n        setShowOptions(false);\n        triggerOptionDisplayCallback(false);\n\n        onSelectOption?.(item, extractedValue);\n    };\n\n    const handleListDismiss = () => {\n        if (showOptions) {\n            setShowOptions(false);\n            triggerOptionDisplayCallback(false);\n        }\n    };\n\n    const handleNodeFocus = () => {\n        if (!focused && !showOptions) {\n            setFocused(true);\n        }\n    };\n\n    const handleNodeBlur = (e: React.FocusEvent) => {\n        if (\n            focused &&\n            !showOptions &&\n            nodeRef.current &&\n            !nodeRef.current.contains(e.relatedTarget as Node)\n        ) {\n            setFocused(false);\n            onBlur?.();\n        }\n    };\n\n    const handleOpen = () => {\n        setShowOptions(true);\n        triggerOptionDisplayCallback(true);\n        setFocused(true);\n    };\n\n    const handleClose = (reason: OpenChangeReason | undefined) => {\n        setShowOptions(false);\n        triggerOptionDisplayCallback(false);\n\n        // click to toggle should not blur the input\n        if (reason !== \"click\") {\n            setFocused(false);\n            onBlur?.();\n        }\n    };\n\n    const handleDismiss = () => {\n        selectorRef.current?.focus();\n        setShowOptions(false);\n        triggerOptionDisplayCallback(false);\n    };\n\n    // =============================================================================\n    // HELPER FUNCTION\n    // =============================================================================\n    const getDisplayValue = (): string => {\n        if (!selected) return \"\";\n\n        if (displayValueExtractor) {\n            return displayValueExtractor(selected);\n        }\n\n        if (valueExtractor) {\n            const value = valueExtractor(selected);\n            return valueToStringFunction\n                ? valueToStringFunction(value)\n                : value?.toString() ?? \"\";\n        }\n\n        return selected.toString();\n    };\n\n    const truncateValue = (value: string) => {\n        if (optionTruncationType === \"middle\") {\n            let widthOfElement = 0;\n            if (labelContainerRef && labelContainerRef.current) {\n                widthOfElement =\n                    labelContainerRef.current.getBoundingClientRect().width;\n            }\n\n            return StringHelper.truncateOneLine(value, widthOfElement, 120, 8);\n        }\n        return value;\n    };\n\n    const triggerOptionDisplayCallback = (show: boolean) => {\n        if (show) {\n            onShowOptions?.();\n        } else {\n            onHideOptions?.();\n        }\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderLabel = () => {\n        if (!selected) {\n            return (\n                <PlaceholderLabel\n                    variant={variant}\n                    truncateType={optionTruncationType}\n                >\n                    {placeholder}\n                </PlaceholderLabel>\n            );\n        } else if (renderCustomSelectedOption) {\n            return renderCustomSelectedOption(selected);\n        } else {\n            return (\n                <ValueLabel\n                    variant={variant}\n                    truncateType={optionTruncationType}\n                >\n                    {truncateValue(getDisplayValue())}\n                </ValueLabel>\n            );\n        }\n    };\n\n    const renderSelectorContent = () => (\n        <LabelContainer ref={labelContainerRef} disabled={disabled}>\n            {renderLabel()}\n        </LabelContainer>\n    );\n\n    const renderElement = () => {\n        return (\n            <InputBox\n                className={className}\n                data-testid={testId}\n                id={id}\n                ref={nodeRef}\n                tabIndex={-1}\n                onFocus={handleNodeFocus}\n                onBlur={handleNodeBlur}\n                focused={focused}\n                disabled={disabled}\n                readOnly={readOnly}\n                error={error}\n            >\n                <ExpandableElement\n                    ref={selectorRef}\n                    disabled={disabled}\n                    expanded={showOptions}\n                    listboxId={internalId}\n                    popupRole=\"listbox\"\n                    readOnly={readOnly}\n                    variant={variant}\n                    aria-labelledby={ariaLabelledBy}\n                    aria-describedby={ariaDescribedBy}\n                    aria-invalid={ariaInvalid}\n                >\n                    {renderSelectorContent()}\n                </ExpandableElement>\n            </InputBox>\n        );\n    };\n\n    const renderDropdown = () => {\n        return (\n            <DropdownList\n                listboxId={internalId}\n                listItems={options}\n                onSelectItem={handleListItemClick}\n                onDismiss={handleListDismiss}\n                valueExtractor={valueExtractor}\n                listExtractor={listExtractor}\n                enableSearch={enableSearch}\n                searchPlaceholder={searchPlaceholder}\n                searchFunction={searchFunction}\n                selectedItems={selected ? [selected] : []}\n                onRetry={onRetry}\n                itemsLoadState={optionsLoadState}\n                itemTruncationType={optionTruncationType}\n                renderListItem={renderListItem}\n                hideNoResultsDisplay={hideNoResultsDisplay}\n                noResultsDescription={noResultsDescription}\n                customLabels={customLabels}\n                renderCustomCallToAction={renderCustomCallToAction}\n                variant={variant}\n                width={dropdownWidth}\n                matchElementWidth\n            />\n        );\n    };\n\n    return (\n        <DropdownListState>\n            <ElementWithDropdown\n                enabled={!readOnly && !disabled}\n                isOpen={showOptions}\n                renderElement={renderElement}\n                renderDropdown={renderDropdown}\n                onOpen={handleOpen}\n                onClose={handleClose}\n                onDismiss={handleDismiss}\n                clickToToggle\n                offset={8}\n                alignment={alignment}\n                fitAvailableHeight\n                customZIndex={dropdownZIndex}\n                rootNode={dropdownRootNode}\n            />\n        </DropdownListState>\n    );\n};\n"],"names":["InputSelect","selectedOption","placeholder","options","disabled","error","className","testId","id","ariaLabelledBy","ariaDescribedBy","ariaInvalid","enableSearch","searchFunction","searchPlaceholder","valueExtractor","valueToStringFunction","listExtractor","displayValueExtractor","onSelectOption","onShowOptions","onHideOptions","onRetry","optionsLoadState","optionTruncationType","renderCustomSelectedOption","renderListItem","hideNoResultsDisplay","noResultsDescription","customLabels","renderCustomCallToAction","onBlur","variant","readOnly","alignment","dropdownZIndex","dropdownRootNode","dropdownWidth","selected","setSelected","useState","showOptions","setShowOptions","focused","setFocused","internalId","useId","nodeRef","useRef","selectorRef","labelContainerRef","useEffect","handleListItemClick","item","extractedValue","_a","current","focus","triggerOptionDisplayCallback","handleListDismiss","handleNodeFocus","handleNodeBlur","e","contains","relatedTarget","getDisplayValue","value","toString","truncateValue","widthOfElement","getBoundingClientRect","width","StringHelper","truncateOneLine","show","_jsx","DropdownListState","children","ElementWithDropdown","enabled","isOpen","renderElement","InputBox","ref","tabIndex","onFocus","ExpandableElement","expanded","listboxId","popupRole","LabelContainer","ValueLabel","truncateType","PlaceholderLabel","renderDropdown","DropdownList","listItems","onSelectItem","onDismiss","selectedItems","itemsLoadState","itemTruncationType","matchElementWidth","onOpen","onClose","reason","clickToToggle","offset","fitAvailableHeight","customZIndex","rootNode"],"mappings":"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"}
+{"version":3,"file":"input-select.js","sources":["../../src/input-select/input-select.tsx"],"sourcesContent":["import type { OpenChangeReason } from \"@floating-ui/react\";\nimport type React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\n\nimport {\n    DropdownList,\n    DropdownListState,\n    ExpandableElement,\n} from \"../shared/dropdown-list\";\nimport { ElementWithDropdown } from \"../shared/dropdown-wrapper\";\nimport {\n    LabelContainer,\n    PlaceholderLabel,\n    ValueLabel,\n} from \"../shared/dropdown-wrapper/dropdown-wrapper\";\nimport { InputBox } from \"../shared/input-wrapper/input-wrapper\";\nimport { useId } from \"../util\";\nimport { StringHelper } from \"../util/string-helper\";\nimport type { InputSelectProps } from \"./types\";\n\nexport const InputSelect = <T, V>({\n    selectedOption,\n    placeholder = \"Select\",\n    options,\n    disabled,\n    error,\n    className,\n    \"data-testid\": testId,\n    id,\n    \"aria-labelledby\": ariaLabelledBy,\n    \"aria-describedby\": ariaDescribedBy,\n    \"aria-invalid\": ariaInvalid,\n    enableSearch = false,\n    searchFunction,\n    searchPlaceholder,\n    valueExtractor,\n    valueToStringFunction,\n    listExtractor,\n    displayValueExtractor,\n    onSelectOption,\n    onShowOptions,\n    onHideOptions,\n    onRetry,\n    optionsLoadState = \"success\",\n    optionTruncationType = \"end\",\n    renderCustomSelectedOption,\n    renderListItem,\n    hideNoResultsDisplay,\n    noResultsDescription,\n    customLabels,\n    renderCustomCallToAction,\n    onBlur,\n    variant = \"default\",\n    readOnly,\n    alignment,\n    dropdownZIndex,\n    dropdownRootNode,\n    dropdownWidth,\n}: InputSelectProps<T, V>): JSX.Element => {\n    // =============================================================================\n    // CONST, STATE\n    // =============================================================================\n    const [selected, setSelected] = useState<T | undefined>(selectedOption);\n    const [showOptions, setShowOptions] = useState<boolean>(false);\n    const [focused, setFocused] = useState<boolean>(false);\n    const internalId = useId();\n\n    const nodeRef = useRef<HTMLDivElement>(null);\n    const selectorRef = useRef<HTMLButtonElement>(null);\n    const labelContainerRef = useRef<HTMLDivElement>(null);\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        setSelected(selectedOption);\n    }, [selectedOption]);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleListItemClick = (item: T, extractedValue: V) => {\n        selectorRef.current?.focus();\n        setSelected(item);\n        setShowOptions(false);\n        triggerOptionDisplayCallback(false);\n\n        onSelectOption?.(item, extractedValue);\n    };\n\n    const handleListDismiss = () => {\n        if (showOptions) {\n            setShowOptions(false);\n            triggerOptionDisplayCallback(false);\n        }\n    };\n\n    const handleNodeFocus = () => {\n        if (!focused && !showOptions) {\n            setFocused(true);\n        }\n    };\n\n    const handleNodeBlur = (e: React.FocusEvent) => {\n        if (\n            focused &&\n            !showOptions &&\n            nodeRef.current &&\n            !nodeRef.current.contains(e.relatedTarget as Node)\n        ) {\n            setFocused(false);\n            onBlur?.();\n        }\n    };\n\n    const handleOpen = () => {\n        setShowOptions(true);\n        triggerOptionDisplayCallback(true);\n        setFocused(true);\n    };\n\n    const handleClose = (reason: OpenChangeReason | undefined) => {\n        setShowOptions(false);\n        triggerOptionDisplayCallback(false);\n\n        // click to toggle should not blur the input\n        if (reason !== \"click\") {\n            setFocused(false);\n            onBlur?.();\n        }\n    };\n\n    const handleDismiss = () => {\n        selectorRef.current?.focus();\n        setShowOptions(false);\n        triggerOptionDisplayCallback(false);\n    };\n\n    // =============================================================================\n    // HELPER FUNCTION\n    // =============================================================================\n    const getDisplayValue = (): string => {\n        if (!selected) return \"\";\n\n        if (displayValueExtractor) {\n            return displayValueExtractor(selected);\n        }\n\n        if (valueExtractor) {\n            const value = valueExtractor(selected);\n            return valueToStringFunction\n                ? valueToStringFunction(value)\n                : value?.toString() ?? \"\";\n        }\n\n        return selected.toString();\n    };\n\n    const truncateValue = (value: string) => {\n        if (optionTruncationType === \"middle\") {\n            let widthOfElement = 0;\n            if (labelContainerRef && labelContainerRef.current) {\n                widthOfElement =\n                    labelContainerRef.current.getBoundingClientRect().width;\n            }\n\n            return StringHelper.truncateOneLine(value, widthOfElement, 120, 8);\n        }\n        return value;\n    };\n\n    const triggerOptionDisplayCallback = (show: boolean) => {\n        if (show) {\n            onShowOptions?.();\n        } else {\n            onHideOptions?.();\n        }\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderLabel = () => {\n        if (!selected) {\n            return (\n                <PlaceholderLabel\n                    variant={variant}\n                    truncateType={optionTruncationType}\n                >\n                    {placeholder}\n                </PlaceholderLabel>\n            );\n        } else if (renderCustomSelectedOption) {\n            return renderCustomSelectedOption(selected);\n        } else {\n            return (\n                <ValueLabel\n                    variant={variant}\n                    truncateType={optionTruncationType}\n                >\n                    {truncateValue(getDisplayValue())}\n                </ValueLabel>\n            );\n        }\n    };\n\n    const renderSelectorContent = () => (\n        <LabelContainer ref={labelContainerRef} disabled={disabled}>\n            {renderLabel()}\n        </LabelContainer>\n    );\n\n    const renderElement = () => {\n        return (\n            <InputBox\n                className={className}\n                data-testid={testId}\n                id={id}\n                ref={nodeRef}\n                tabIndex={-1}\n                onFocus={handleNodeFocus}\n                onBlur={handleNodeBlur}\n                focused={focused}\n                disabled={disabled}\n                readOnly={readOnly}\n                error={error}\n            >\n                <ExpandableElement\n                    ref={selectorRef}\n                    disabled={disabled}\n                    expanded={showOptions}\n                    listboxId={internalId}\n                    popupRole=\"listbox\"\n                    readOnly={readOnly}\n                    variant={variant}\n                    aria-labelledby={ariaLabelledBy}\n                    aria-describedby={ariaDescribedBy}\n                    aria-invalid={ariaInvalid}\n                >\n                    {renderSelectorContent()}\n                </ExpandableElement>\n            </InputBox>\n        );\n    };\n\n    const renderDropdown = () => {\n        return (\n            <DropdownList\n                listboxId={internalId}\n                listItems={options}\n                onSelectItem={handleListItemClick}\n                onDismiss={handleListDismiss}\n                valueExtractor={valueExtractor}\n                listExtractor={listExtractor}\n                enableSearch={enableSearch}\n                searchPlaceholder={searchPlaceholder}\n                searchFunction={searchFunction}\n                selectedItems={selected ? [selected] : []}\n                onRetry={onRetry}\n                itemsLoadState={optionsLoadState}\n                itemTruncationType={optionTruncationType}\n                renderListItem={renderListItem}\n                hideNoResultsDisplay={hideNoResultsDisplay}\n                noResultsDescription={noResultsDescription}\n                customLabels={customLabels}\n                renderCustomCallToAction={renderCustomCallToAction}\n                variant={variant}\n                width={dropdownWidth}\n                matchElementWidth\n            />\n        );\n    };\n\n    return (\n        <DropdownListState>\n            <ElementWithDropdown\n                enabled={!readOnly && !disabled}\n                isOpen={showOptions}\n                renderElement={renderElement}\n                renderDropdown={renderDropdown}\n                onOpen={handleOpen}\n                onClose={handleClose}\n                onDismiss={handleDismiss}\n                clickToToggle\n                offset={8}\n                alignment={alignment}\n                fitAvailableHeight\n                customZIndex={dropdownZIndex}\n                rootNode={dropdownRootNode}\n            />\n        </DropdownListState>\n    );\n};\n"],"names":["InputSelect","selectedOption","placeholder","options","disabled","error","className","testId","id","ariaLabelledBy","ariaDescribedBy","ariaInvalid","enableSearch","searchFunction","searchPlaceholder","valueExtractor","valueToStringFunction","listExtractor","displayValueExtractor","onSelectOption","onShowOptions","onHideOptions","onRetry","optionsLoadState","optionTruncationType","renderCustomSelectedOption","renderListItem","hideNoResultsDisplay","noResultsDescription","customLabels","renderCustomCallToAction","onBlur","variant","readOnly","alignment","dropdownZIndex","dropdownRootNode","dropdownWidth","selected","setSelected","useState","showOptions","setShowOptions","focused","setFocused","internalId","useId","nodeRef","useRef","selectorRef","labelContainerRef","useEffect","handleListItemClick","item","extractedValue","_a","current","focus","triggerOptionDisplayCallback","handleListDismiss","handleNodeFocus","handleNodeBlur","e","contains","relatedTarget","getDisplayValue","value","toString","truncateValue","widthOfElement","getBoundingClientRect","width","StringHelper","truncateOneLine","show","_jsx","DropdownListState","children","ElementWithDropdown","enabled","isOpen","renderElement","InputBox","ref","tabIndex","onFocus","ExpandableElement","expanded","listboxId","popupRole","LabelContainer","ValueLabel","truncateType","PlaceholderLabel","renderDropdown","DropdownList","listItems","onSelectItem","onDismiss","selectedItems","itemsLoadState","itemTruncationType","matchElementWidth","onOpen","onClose","reason","clickToToggle","offset","fitAvailableHeight","customZIndex","rootNode"],"mappings":"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"}

package/input-textarea/textarea-counter.styles.js

@@ -1,2 +1,2 @@
-import"./textarea-counter.styles_adg5h1.css";const t="c1d4l1yp";export{t as counterLabel};
+import"./textarea-counter.styles_1n3wsnv.css";const t="c1d4l1yp";export{t as counterLabel};
 //# sourceMappingURL=textarea-counter.styles.js.map

package/input-textarea/textarea-counter.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea-counter.styles.js","sources":["../../src/input-textarea/textarea-counter.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, Font } from \"../theme\";\n\nexport const counterLabel = css`\n    text-align: right;\n    ${Font[\"body-sm-semibold\"]}\n    color: ${Colour[\"text-subtler\"]};\n`;\n"],"names":["counterLabel"],"mappings":"2EAIO,MAAMA,EAAY"}
+{"version":3,"file":"textarea-counter.styles.js","sources":["../../src/input-textarea/textarea-counter.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, Font } from \"../theme\";\n\nexport const counterLabel = css`\n    text-align: right;\n    ${Font[\"body-sm-semibold\"]}\n    color: ${Colour[\"text-subtler\"]};\n`;\n"],"names":["counterLabel"],"mappings":"4EAIO,MAAMA,EAAY"}

package/input-textarea/textarea-counter.styles_1n3wsnv.css

@@ -0,0 +1 @@
+@layer fds{.c1d4l1yp{text-align:right;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-sm);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-sm);letter-spacing:var(--fds-font-body-ls-sm);color:var(--fds-colour-text-subtler);}}

package/input-textarea/textarea.styles.js

@@ -1,2 +1,2 @@
-import"./textarea.styles_g0zgyq.css";const t="w1xqauhq",e="e10c6rk9",a="e1kovz0t",r="e9uwuyt",s="etmlvbn";export{e as element,r as elementDisabled,s as elementError,a as elementReadOnly,t as wrapper};
+import"./textarea.styles_22z4n3.css";const t="w1xqauhq",e="e10c6rk9",a="e1kovz0t",r="e9uwuyt",s="etmlvbn";export{e as element,r as elementDisabled,s as elementError,a as elementReadOnly,t as wrapper};
 //# sourceMappingURL=textarea.styles.js.map

package/input-textarea/textarea.styles_22z4n3.css

@@ -0,0 +1,5 @@
+@layer fds{.w1xqauhq{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}
+.e10c6rk9{border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-radius:var(--fds-radius-sm);background:var(--fds-colour-bg);outline:none;overflow:auto;display:block;padding:var(--fds-spacing-12) var(--fds-spacing-16);width:100%;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text);}.e10c6rk9:focus,.e10c6rk9:active{outline-offset:-1px;outline:var(--fds-border-width-020) var(--fds-border-style-solid) var(--fds-colour-border-focus);}.e10c6rk9::-webkit-input-placeholder{color:var(--fds-colour-text-subtler);}.e10c6rk9::-webkit-scrollbar{width:14px;}.e10c6rk9::-webkit-scrollbar-track{background:transparent;}.e10c6rk9::-webkit-scrollbar-thumb{background:var(--fds-colour-bg-inverse-subtlest);border:5px solid transparent;border-radius:var(--fds-radius-full);-webkit-background-clip:padding-box;background-clip:padding-box;}.e10c6rk9::-webkit-input-placeholder{color:var(--fds-colour-text-subtler);}.e10c6rk9::-moz-placeholder{color:var(--fds-colour-text-subtler);}.e10c6rk9:-ms-input-placeholder{color:var(--fds-colour-text-subtler);}.e10c6rk9::placeholder{color:var(--fds-colour-text-subtler);}
+.e1kovz0t{border-color:transparent;background:transparent!important;padding:var(--fds-spacing-12) 0;}.e1kovz0t:focus,.e1kovz0t:active{outline-color:var(--fds-colour-border-focus);}
+.e9uwuyt{background:var(--fds-colour-bg-disabled);cursor:not-allowed;}.e9uwuyt:focus,.e9uwuyt:active{outline-color:var(--fds-colour-border-disabled);}
+.etmlvbn{border-color:var(--fds-colour-border-error);}.etmlvbn:focus,.etmlvbn:active{outline-color:var(--fds-colour-border-error-focus);}}

package/language-switcher/dropdown-panel.styles.js

@@ -1,2 +1,2 @@
-import"../shared/dropdown-list/dropdown-list.styles_1kt4zhf.css";import"./dropdown-panel.styles_1z0n7qq.css";const d={width:"--fds-internal-languageSwitcher-dropdown-width"},s="dbl9jc4",t="dogrnw8",o="d4xkcjy",n="ddiq5up";export{o as dropdownItem,n as dropdownItemSelected,t as dropdownList,s as dropdownPanel,d as tokens};
+import"../shared/dropdown-list/dropdown-list.styles_konwm.css";import"./dropdown-panel.styles_1qsjf8d.css";const d={width:"--fds-internal-languageSwitcher-dropdown-width"},s="dbl9jc4",o="dogrnw8",t="d4xkcjy",n="ddiq5up";export{t as dropdownItem,n as dropdownItemSelected,o as dropdownList,s as dropdownPanel,d as tokens};
 //# sourceMappingURL=dropdown-panel.styles.js.map

package/language-switcher/dropdown-panel.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-panel.styles.js","sources":["../../src/language-switcher/dropdown-panel.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, Radius, Spacing } from \"../theme\";\n\nexport const tokens = {\n    width: \"--fds-internal-languageSwitcher-dropdown-width\",\n} as const;\n\nexport const dropdownPanel = css`\n    ${tokens.width}: initial;\n\n    width: var(${tokens.width});\n    border-radius: ${Radius[\"sm\"]};\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${Colour[\"border\"]};\n    background: ${Colour[\"bg\"]};\n    overflow: hidden;\n`;\n\nexport const dropdownList = css`\n    list-style: none;\n    margin: 0;\n    padding: ${Spacing[\"spacing-8\"]};\n`;\n\nexport {\n    baseIndicatorStyle,\n    selectedIndicator,\n} from \"../shared/dropdown-list/dropdown-list.styles\";\n\nexport const dropdownItem = css`\n    align-items: center;\n    ${Font[\"body-md-regular\"]}\n    color: ${Colour[\"text\"]};\n\n    &:hover {\n        background: ${Colour[\"bg-hover-subtle\"]};\n    }\n`;\n\nexport const dropdownItemSelected = css`\n    background: transparent;\n    color: ${Colour[\"text-selected\"]};\n\n    &:hover {\n        background: ${Colour[\"bg-hover\"]};\n    }\n`;\n"],"names":["tokens","width","dropdownPanel","dropdownList","dropdownItem","dropdownItemSelected"],"mappings":"4JAIO,MAAMA,EAAS,CAClBC,MAAO,kDAGEC,EAAa,UAUbC,EAAY,UAWZC,EAAY,UAUZC,EAAoB"}
+{"version":3,"file":"dropdown-panel.styles.js","sources":["../../src/language-switcher/dropdown-panel.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, Radius, Spacing } from \"../theme\";\n\nexport const tokens = {\n    width: \"--fds-internal-languageSwitcher-dropdown-width\",\n} as const;\n\nexport const dropdownPanel = css`\n    ${tokens.width}: initial;\n\n    width: var(${tokens.width});\n    border-radius: ${Radius[\"sm\"]};\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${Colour[\"border\"]};\n    background: ${Colour[\"bg\"]};\n    overflow: hidden;\n`;\n\nexport const dropdownList = css`\n    list-style: none;\n    margin: 0;\n    padding: ${Spacing[\"spacing-8\"]};\n`;\n\nexport {\n    baseIndicatorStyle,\n    selectedIndicator,\n} from \"../shared/dropdown-list/dropdown-list.styles\";\n\nexport const dropdownItem = css`\n    align-items: center;\n    ${Font[\"body-md-regular\"]}\n    color: ${Colour[\"text\"]};\n\n    &:hover {\n        background: ${Colour[\"bg-hover-subtle\"]};\n    }\n`;\n\nexport const dropdownItemSelected = css`\n    background: transparent;\n    color: ${Colour[\"text-selected\"]};\n\n    &:hover {\n        background: ${Colour[\"bg-hover\"]};\n    }\n`;\n"],"names":["tokens","width","dropdownPanel","dropdownList","dropdownItem","dropdownItemSelected"],"mappings":"0JAIO,MAAMA,EAAS,CAClBC,MAAO,kDAGEC,EAAa,UAUbC,EAAY,UAWZC,EAAY,UAUZC,EAAoB"}

package/language-switcher/dropdown-panel.styles_1qsjf8d.css

@@ -0,0 +1,4 @@
+@layer fds{.dbl9jc4{--fds-internal-languageSwitcher-dropdown-width:initial;width:var(--fds-internal-languageSwitcher-dropdown-width);border-radius:var(--fds-radius-sm);border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);background:var(--fds-colour-bg);overflow:hidden;}
+.dogrnw8{list-style:none;margin:0;padding:var(--fds-spacing-8);}
+.d4xkcjy{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);color:var(--fds-colour-text);}.d4xkcjy:hover{background:var(--fds-colour-bg-hover-subtle);}
+.ddiq5up{background:transparent;color:var(--fds-colour-text-selected);}.ddiq5up:hover{background:var(--fds-colour-bg-hover);}}

package/language-switcher/dropdown-variant.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"../_virtual/_tslib.js";import{jsx as r,jsxs as t}from"react/jsx-runtime";import{LanguageIcon as o}from"@lifesg/react-icons/language";import{useState as s,useRef as i,useEffect as a}from"react";import"clsx";import"../theme/theme-provider/index.js";import"../theme/theme-provider/context.js";import"../theme/tokens/border.js";import"../theme/tokens/colour.js";import"../theme/tokens/font.js";import"../theme/tokens/media-query.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{useId as n}from"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import"../theme/utils/use-media-query.js";import"../shared/dropdown-list/dropdown-label.styles_1dwmd8f.css";import"../shared/dropdown-list/dropdown-list.js";import"../shared/dropdown-list/dropdown-list-state.js";import{ExpandableElement as l}from"../shared/dropdown-list/expandable-element.js";import"@lifesg/react-icons/caret-right";import"@lifesg/react-icons/exclamation-circle-fill";import"@lifesg/react-icons/minus-square-fill";import"@lifesg/react-icons/square";import"@lifesg/react-icons/square-tick-fill";import"@lifesg/react-icons/tick";import"react-virtuoso";import"../markup/markup.js";import"../shared/component-loading-spinner/component-loading-spinner.styles_15eq02i.css";import{ElementWithDropdown as d}from"../shared/dropdown-wrapper/element-with-dropdown.js";import"../shared/input-wrapper/input-wrapper.js";import"../shared/dropdown-list/dropdown-list.styles_1kt4zhf.css";import"../shared/dropdown-list/dropdown-search.js";import"../shared/dropdown-list/nested-dropdown-list.styles_wdhxoe.css";import"immer";import"../external/lodash/_getTag.js";import"../external/lodash/isArguments.js";import"../external/lodash/_baseGetTag.js";import"../external/lodash/isBuffer.js";import"../external/lodash/isTypedArray.js";import"../external/lodash/_Stack.js";import"../external/lodash/_SetCache.js";import"../external/lodash/_equalByTag.js";import"../shared/dropdown-list/virtuoso-components.js";import{LANGUAGE_CODES as p,LANGUAGE_DISPLAY_MAP as m,ARIA_LABEL as c}from"./data.js";import{DropdownPanel as u}from"./dropdown-panel.js";import{expandableElement as h,languageIconWrapper as f}from"./dropdown-variant.styles.js";const g=g=>{var{selectedLanguage:j,onSelectLanguage:w,testId:v}=g,x=e(g,["selectedLanguage","onSelectLanguage","testId"]);const[_,b]=s(!1),[k,y]=s(-1),A=i(null),I=i([]),T=`listbox-${n()}`;a((()=>{if(_){const e=p.indexOf(j),r=e>=0?e:0;y(r),setTimeout((()=>{var e;null===(e=I.current[r])||void 0===e||e.focus()}),0)}else y(-1)}),[_,j]);const D=e=>{var r;w(e),b(!1),null===(r=A.current)||void 0===r||r.focus()},q=e=>{var r,t,o,s;switch(e.key){case"ArrowDown":{e.preventDefault();const t=Math.min(k+1,p.length-1);y(t),null===(r=I.current[t])||void 0===r||r.focus();break}case"ArrowUp":{e.preventDefault();const r=Math.max(k-1,0);y(r),null===(t=I.current[r])||void 0===t||t.focus();break}case"Home":e.preventDefault(),y(0),null===(o=I.current[0])||void 0===o||o.focus();break;case"End":{e.preventDefault();const r=p.length-1;y(r),null===(s=I.current[r])||void 0===s||s.focus();break}case"Enter":case" ":e.preventDefault(),k>=0&&D(p[k])}};return r("div",Object.assign({"data-testid":v},x,{children:r(d,{enabled:!0,isOpen:_,renderElement:()=>t(l,{ref:A,className:h,disabled:!1,expanded:_,listboxId:T,popupRole:"listbox",readOnly:!1,"aria-label":`${c}, ${m[j]}`,"data-testid":`${v}--trigger`,children:[r("span",{className:f,"aria-hidden":!0,children:r(o,{})}),m[j]]}),renderDropdown:()=>r(u,{focusedIndex:k,handleItemSelect:D,handleListKeyDown:q,itemRefs:I,listboxId:T,selectedLanguage:j,testId:v}),onOpen:()=>{b(!0)},onClose:()=>{b(!1)},onDismiss:()=>{var e;b(!1),null===(e=A.current)||void 0===e||e.focus()},clickToToggle:!0,offset:8})}))};export{g as DropdownVariant};
+import{__rest as e}from"../_virtual/_tslib.js";import{jsx as r,jsxs as t}from"react/jsx-runtime";import{LanguageIcon as o}from"@lifesg/react-icons/language";import{useState as s,useRef as i,useEffect as n}from"react";import"clsx";import"../theme/theme-provider/index.js";import"../theme/theme-provider/context.js";import"../theme/tokens/border.js";import"../theme/tokens/colour.js";import"../theme/tokens/font.js";import"../theme/tokens/media-query.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{useId as a}from"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import"../theme/utils/use-media-query.js";import"../shared/dropdown-list/dropdown-label.styles_mloii0.css";import"../shared/dropdown-list/dropdown-list.js";import"../shared/dropdown-list/dropdown-list-state.js";import{ExpandableElement as l}from"../shared/dropdown-list/expandable-element.js";import"@lifesg/react-icons/caret-right";import"@lifesg/react-icons/exclamation-circle-fill";import"@lifesg/react-icons/minus-square-fill";import"@lifesg/react-icons/square";import"@lifesg/react-icons/square-tick-fill";import"@lifesg/react-icons/tick";import"react-virtuoso";import"../markup/markup.js";import"../shared/component-loading-spinner/component-loading-spinner.styles_15eq02i.css";import{ElementWithDropdown as d}from"../shared/dropdown-wrapper/element-with-dropdown.js";import"../shared/input-wrapper/input-wrapper.js";import"../shared/dropdown-list/dropdown-list.styles_konwm.css";import"../shared/dropdown-list/dropdown-search.js";import"../shared/dropdown-list/nested-dropdown-list.styles_wdhxoe.css";import"immer";import"../external/lodash/_getTag.js";import"../external/lodash/isArguments.js";import"../external/lodash/_baseGetTag.js";import"../external/lodash/isBuffer.js";import"../external/lodash/isTypedArray.js";import"../external/lodash/_Stack.js";import"../external/lodash/_SetCache.js";import"../external/lodash/_equalByTag.js";import"../shared/dropdown-list/virtuoso-components.js";import{LANGUAGE_CODES as p,LANGUAGE_DISPLAY_MAP as m,ARIA_LABEL as c}from"./data.js";import{DropdownPanel as u}from"./dropdown-panel.js";import{expandableElement as h,languageIconWrapper as f}from"./dropdown-variant.styles.js";const g=g=>{var{selectedLanguage:j,onSelectLanguage:w,testId:v}=g,x=e(g,["selectedLanguage","onSelectLanguage","testId"]);const[_,b]=s(!1),[k,y]=s(-1),A=i(null),I=i([]),T=`listbox-${a()}`;n((()=>{if(_){const e=p.indexOf(j),r=e>=0?e:0;y(r),setTimeout((()=>{var e;null===(e=I.current[r])||void 0===e||e.focus()}),0)}else y(-1)}),[_,j]);const D=e=>{var r;w(e),b(!1),null===(r=A.current)||void 0===r||r.focus()},q=e=>{var r,t,o,s;switch(e.key){case"ArrowDown":{e.preventDefault();const t=Math.min(k+1,p.length-1);y(t),null===(r=I.current[t])||void 0===r||r.focus();break}case"ArrowUp":{e.preventDefault();const r=Math.max(k-1,0);y(r),null===(t=I.current[r])||void 0===t||t.focus();break}case"Home":e.preventDefault(),y(0),null===(o=I.current[0])||void 0===o||o.focus();break;case"End":{e.preventDefault();const r=p.length-1;y(r),null===(s=I.current[r])||void 0===s||s.focus();break}case"Enter":case" ":e.preventDefault(),k>=0&&D(p[k])}};return r("div",Object.assign({"data-testid":v},x,{children:r(d,{enabled:!0,isOpen:_,renderElement:()=>t(l,{ref:A,className:h,disabled:!1,expanded:_,listboxId:T,popupRole:"listbox",readOnly:!1,"aria-label":`${c}, ${m[j]}`,"data-testid":`${v}--trigger`,children:[r("span",{className:f,"aria-hidden":!0,children:r(o,{})}),m[j]]}),renderDropdown:()=>r(u,{focusedIndex:k,handleItemSelect:D,handleListKeyDown:q,itemRefs:I,listboxId:T,selectedLanguage:j,testId:v}),onOpen:()=>{b(!0)},onClose:()=>{b(!1)},onDismiss:()=>{var e;b(!1),null===(e=A.current)||void 0===e||e.focus()},clickToToggle:!0,offset:8})}))};export{g as DropdownVariant};
 //# sourceMappingURL=dropdown-variant.js.map

package/language-switcher/dropdown-variant.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-variant.js","sources":["../../src/language-switcher/dropdown-variant.tsx"],"sourcesContent":["import { LanguageIcon } from \"@lifesg/react-icons/language\";\nimport type React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\n\nimport { ExpandableElement } from \"../shared/dropdown-list\";\nimport { ElementWithDropdown } from \"../shared/dropdown-wrapper\";\nimport { useId } from \"../util\";\nimport { ARIA_LABEL, LANGUAGE_CODES, LANGUAGE_DISPLAY_MAP } from \"./data\";\nimport { DropdownPanel } from \"./dropdown-panel\";\nimport * as styles from \"./dropdown-variant.styles\";\nimport type { VariantInternalProps } from \"./internal-types\";\nimport type { LanguageSwitcherCode } from \"./types\";\n\nexport const DropdownVariant = ({\n    selectedLanguage,\n    onSelectLanguage,\n    testId,\n    ...otherProps\n}: VariantInternalProps): JSX.Element => {\n    // =========================================================================\n    // CONST, STATE, REF\n    // =========================================================================\n    const [isOpen, setIsOpen] = useState(false);\n    const [focusedIndex, setFocusedIndex] = useState(-1);\n    const triggerRef = useRef<HTMLButtonElement>(null);\n    const itemRefs = useRef<(HTMLLIElement | null)[]>([]);\n\n    const id = useId();\n    const listboxId = `listbox-${id}`;\n\n    // =========================================================================\n    // EFFECTS\n    // =========================================================================\n    useEffect(() => {\n        if (isOpen) {\n            const selectedIdx = LANGUAGE_CODES.indexOf(selectedLanguage);\n            const idx = selectedIdx >= 0 ? selectedIdx : 0;\n            setFocusedIndex(idx);\n            setTimeout(() => {\n                itemRefs.current[idx]?.focus();\n            }, 0);\n        } else {\n            setFocusedIndex(-1);\n        }\n    }, [isOpen, selectedLanguage]);\n\n    // =========================================================================\n    // EVENT HANDLERS\n    // =========================================================================\n    const handleOpen = () => {\n        setIsOpen(true);\n    };\n\n    const handleClose = () => {\n        setIsOpen(false);\n    };\n\n    const handleDismiss = () => {\n        setIsOpen(false);\n        triggerRef.current?.focus();\n    };\n\n    const handleItemSelect = (code: LanguageSwitcherCode) => {\n        onSelectLanguage(code);\n        setIsOpen(false);\n        triggerRef.current?.focus();\n    };\n\n    const handleListKeyDown = (event: React.KeyboardEvent) => {\n        switch (event.key) {\n            case \"ArrowDown\": {\n                event.preventDefault();\n                const next = Math.min(\n                    focusedIndex + 1,\n                    LANGUAGE_CODES.length - 1\n                );\n                setFocusedIndex(next);\n                itemRefs.current[next]?.focus();\n                break;\n            }\n            case \"ArrowUp\": {\n                event.preventDefault();\n                const prev = Math.max(focusedIndex - 1, 0);\n                setFocusedIndex(prev);\n                itemRefs.current[prev]?.focus();\n                break;\n            }\n            case \"Home\": {\n                event.preventDefault();\n                setFocusedIndex(0);\n                itemRefs.current[0]?.focus();\n                break;\n            }\n            case \"End\": {\n                event.preventDefault();\n                const last = LANGUAGE_CODES.length - 1;\n                setFocusedIndex(last);\n                itemRefs.current[last]?.focus();\n                break;\n            }\n            case \"Enter\":\n            case \" \": {\n                event.preventDefault();\n                if (focusedIndex >= 0) {\n                    handleItemSelect(LANGUAGE_CODES[focusedIndex]);\n                }\n                break;\n            }\n        }\n    };\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    const renderElement = () => (\n        <ExpandableElement\n            ref={triggerRef}\n            className={styles.expandableElement}\n            disabled={false}\n            expanded={isOpen}\n            listboxId={listboxId}\n            popupRole=\"listbox\"\n            readOnly={false}\n            aria-label={`${ARIA_LABEL}, ${LANGUAGE_DISPLAY_MAP[selectedLanguage]}`}\n            data-testid={`${testId}--trigger`}\n        >\n            <span className={styles.languageIconWrapper} aria-hidden>\n                <LanguageIcon />\n            </span>\n            {LANGUAGE_DISPLAY_MAP[selectedLanguage]}\n        </ExpandableElement>\n    );\n\n    const renderDropdown = () => (\n        <DropdownPanel\n            focusedIndex={focusedIndex}\n            handleItemSelect={handleItemSelect}\n            handleListKeyDown={handleListKeyDown}\n            itemRefs={itemRefs}\n            listboxId={listboxId}\n            selectedLanguage={selectedLanguage}\n            testId={testId}\n        />\n    );\n\n    // =========================================================================\n    // RENDER\n    // =========================================================================\n    return (\n        <div data-testid={testId} {...otherProps}>\n            <ElementWithDropdown\n                enabled={true}\n                isOpen={isOpen}\n                renderElement={renderElement}\n                renderDropdown={renderDropdown}\n                onOpen={handleOpen}\n                onClose={handleClose}\n                onDismiss={handleDismiss}\n                clickToToggle\n                offset={8}\n            />\n        </div>\n    );\n};\n"],"names":["DropdownVariant","_a","selectedLanguage","onSelectLanguage","testId","otherProps","__rest","isOpen","setIsOpen","useState","focusedIndex","setFocusedIndex","triggerRef","useRef","itemRefs","listboxId","useId","useEffect","selectedIdx","LANGUAGE_CODES","indexOf","idx","setTimeout","current","focus","handleItemSelect","code","handleListKeyDown","event","key","preventDefault","next","Math","min","length","prev","max","_b","_c","last","_d","_jsx","children","ElementWithDropdown","enabled","renderElement","_jsxs","ExpandableElement","ref","className","styles.expandableElement","disabled","expanded","popupRole","readOnly","ARIA_LABEL","LANGUAGE_DISPLAY_MAP","styles.languageIconWrapper","LanguageIcon","renderDropdown","DropdownPanel","onOpen","onClose","onDismiss","clickToToggle","offset"],"mappings":"gyEAaO,MAAMA,EAAmBC,QAAAC,iBAC5BA,EAAgBC,iBAChBA,EAAgBC,OAChBA,KACGC,EAAUC,EAAAL,EAJe,CAAA,mBAAA,mBAAA,WAS5B,MAAOM,EAAQC,GAAaC,GAAS,IAC9BC,EAAcC,GAAmBF,GAAS,GAC3CG,EAAaC,EAA0B,MACvCC,EAAWD,EAAiC,IAG5CE,EAAY,WADPC,MAMXC,GAAU,KACN,GAAIV,EAAQ,CACR,MAAMW,EAAcC,EAAeC,QAAQlB,GACrCmB,EAAMH,GAAe,EAAIA,EAAc,EAC7CP,EAAgBU,GAChBC,YAAW,WACc,QAArBrB,EAAAa,EAASS,QAAQF,UAAI,IAAApB,GAAAA,EAAEuB,OAAO,GAC/B,EACP,MACIb,GAAgB,EACpB,GACD,CAACJ,EAAQL,IAKZ,MAaMuB,EAAoBC,UACtBvB,EAAiBuB,GACjBlB,GAAU,GACQ,QAAlBP,EAAAW,EAAWW,eAAO,IAAAtB,GAAAA,EAAEuB,OAAO,EAGzBG,EAAqBC,gBACvB,OAAQA,EAAMC,KACV,IAAK,YAAa,CACdD,EAAME,iBACN,MAAMC,EAAOC,KAAKC,IACdvB,EAAe,EACfS,EAAee,OAAS,GAE5BvB,EAAgBoB,GACM,QAAtB9B,EAAAa,EAASS,QAAQQ,UAAK,IAAA9B,GAAAA,EAAEuB,QACxB,KACJ,CACA,IAAK,UAAW,CACZI,EAAME,iBACN,MAAMK,EAAOH,KAAKI,IAAI1B,EAAe,EAAG,GACxCC,EAAgBwB,GACM,QAAtBE,EAAAvB,EAASS,QAAQY,UAAK,IAAAE,GAAAA,EAAEb,QACxB,KACJ,CACA,IAAK,OACDI,EAAME,iBACNnB,EAAgB,GACG,QAAnB2B,EAAAxB,EAASS,QAAQ,UAAE,IAAAe,GAAAA,EAAEd,QACrB,MAEJ,IAAK,MAAO,CACRI,EAAME,iBACN,MAAMS,EAAOpB,EAAee,OAAS,EACrCvB,EAAgB4B,GACM,QAAtBC,EAAA1B,EAASS,QAAQgB,UAAK,IAAAC,GAAAA,EAAEhB,QACxB,KACJ,CACA,IAAK,QACL,IAAK,IACDI,EAAME,iBACFpB,GAAgB,GAChBe,EAAiBN,EAAeT,MA4ChD,OACI+B,qCAAkBrC,GAAYC,EAAU,CAAAqC,SACpCD,EAACE,EAAmB,CAChBC,SAAS,EACTrC,OAAQA,EACRsC,cAvCU,IAClBC,EAACC,EAAiB,CACdC,IAAKpC,EACLqC,UAAWC,EACXC,UAAU,EACVC,SAAU7C,EACVQ,UAAWA,EACXsC,UAAU,UACVC,UAAU,EAAK,aACH,GAAGC,MAAeC,EAAqBtD,KAAmB,cACzD,GAAGE,aAAiBsC,SAAA,CAEjCD,EAAA,OAAA,CAAMQ,UAAWQ,EAA0B,eAAA,EAAAf,SACvCD,EAACiB,EAAY,CAAA,KAEhBF,EAAqBtD,MAyBlByD,eArBW,IACnBlB,EAACmB,EAAa,CACVlD,aAAcA,EACde,iBAAkBA,EAClBE,kBAAmBA,EACnBb,SAAUA,EACVC,UAAWA,EACXb,iBAAkBA,EAClBE,OAAQA,IAcJyD,OA1GO,KACfrD,GAAU,EAAK,EA0GPsD,QAvGQ,KAChBtD,GAAU,EAAM,EAuGRuD,UApGU,WAClBvD,GAAU,GACQ,QAAlBP,EAAAW,EAAWW,eAAO,IAAAtB,GAAAA,EAAEuB,OAAO,EAmGnBwC,eAAa,EACbC,OAAQ,MAEV"}
+{"version":3,"file":"dropdown-variant.js","sources":["../../src/language-switcher/dropdown-variant.tsx"],"sourcesContent":["import { LanguageIcon } from \"@lifesg/react-icons/language\";\nimport type React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\n\nimport { ExpandableElement } from \"../shared/dropdown-list\";\nimport { ElementWithDropdown } from \"../shared/dropdown-wrapper\";\nimport { useId } from \"../util\";\nimport { ARIA_LABEL, LANGUAGE_CODES, LANGUAGE_DISPLAY_MAP } from \"./data\";\nimport { DropdownPanel } from \"./dropdown-panel\";\nimport * as styles from \"./dropdown-variant.styles\";\nimport type { VariantInternalProps } from \"./internal-types\";\nimport type { LanguageSwitcherCode } from \"./types\";\n\nexport const DropdownVariant = ({\n    selectedLanguage,\n    onSelectLanguage,\n    testId,\n    ...otherProps\n}: VariantInternalProps): JSX.Element => {\n    // =========================================================================\n    // CONST, STATE, REF\n    // =========================================================================\n    const [isOpen, setIsOpen] = useState(false);\n    const [focusedIndex, setFocusedIndex] = useState(-1);\n    const triggerRef = useRef<HTMLButtonElement>(null);\n    const itemRefs = useRef<(HTMLLIElement | null)[]>([]);\n\n    const id = useId();\n    const listboxId = `listbox-${id}`;\n\n    // =========================================================================\n    // EFFECTS\n    // =========================================================================\n    useEffect(() => {\n        if (isOpen) {\n            const selectedIdx = LANGUAGE_CODES.indexOf(selectedLanguage);\n            const idx = selectedIdx >= 0 ? selectedIdx : 0;\n            setFocusedIndex(idx);\n            setTimeout(() => {\n                itemRefs.current[idx]?.focus();\n            }, 0);\n        } else {\n            setFocusedIndex(-1);\n        }\n    }, [isOpen, selectedLanguage]);\n\n    // =========================================================================\n    // EVENT HANDLERS\n    // =========================================================================\n    const handleOpen = () => {\n        setIsOpen(true);\n    };\n\n    const handleClose = () => {\n        setIsOpen(false);\n    };\n\n    const handleDismiss = () => {\n        setIsOpen(false);\n        triggerRef.current?.focus();\n    };\n\n    const handleItemSelect = (code: LanguageSwitcherCode) => {\n        onSelectLanguage(code);\n        setIsOpen(false);\n        triggerRef.current?.focus();\n    };\n\n    const handleListKeyDown = (event: React.KeyboardEvent) => {\n        switch (event.key) {\n            case \"ArrowDown\": {\n                event.preventDefault();\n                const next = Math.min(\n                    focusedIndex + 1,\n                    LANGUAGE_CODES.length - 1\n                );\n                setFocusedIndex(next);\n                itemRefs.current[next]?.focus();\n                break;\n            }\n            case \"ArrowUp\": {\n                event.preventDefault();\n                const prev = Math.max(focusedIndex - 1, 0);\n                setFocusedIndex(prev);\n                itemRefs.current[prev]?.focus();\n                break;\n            }\n            case \"Home\": {\n                event.preventDefault();\n                setFocusedIndex(0);\n                itemRefs.current[0]?.focus();\n                break;\n            }\n            case \"End\": {\n                event.preventDefault();\n                const last = LANGUAGE_CODES.length - 1;\n                setFocusedIndex(last);\n                itemRefs.current[last]?.focus();\n                break;\n            }\n            case \"Enter\":\n            case \" \": {\n                event.preventDefault();\n                if (focusedIndex >= 0) {\n                    handleItemSelect(LANGUAGE_CODES[focusedIndex]);\n                }\n                break;\n            }\n        }\n    };\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    const renderElement = () => (\n        <ExpandableElement\n            ref={triggerRef}\n            className={styles.expandableElement}\n            disabled={false}\n            expanded={isOpen}\n            listboxId={listboxId}\n            popupRole=\"listbox\"\n            readOnly={false}\n            aria-label={`${ARIA_LABEL}, ${LANGUAGE_DISPLAY_MAP[selectedLanguage]}`}\n            data-testid={`${testId}--trigger`}\n        >\n            <span className={styles.languageIconWrapper} aria-hidden>\n                <LanguageIcon />\n            </span>\n            {LANGUAGE_DISPLAY_MAP[selectedLanguage]}\n        </ExpandableElement>\n    );\n\n    const renderDropdown = () => (\n        <DropdownPanel\n            focusedIndex={focusedIndex}\n            handleItemSelect={handleItemSelect}\n            handleListKeyDown={handleListKeyDown}\n            itemRefs={itemRefs}\n            listboxId={listboxId}\n            selectedLanguage={selectedLanguage}\n            testId={testId}\n        />\n    );\n\n    // =========================================================================\n    // RENDER\n    // =========================================================================\n    return (\n        <div data-testid={testId} {...otherProps}>\n            <ElementWithDropdown\n                enabled={true}\n                isOpen={isOpen}\n                renderElement={renderElement}\n                renderDropdown={renderDropdown}\n                onOpen={handleOpen}\n                onClose={handleClose}\n                onDismiss={handleDismiss}\n                clickToToggle\n                offset={8}\n            />\n        </div>\n    );\n};\n"],"names":["DropdownVariant","_a","selectedLanguage","onSelectLanguage","testId","otherProps","__rest","isOpen","setIsOpen","useState","focusedIndex","setFocusedIndex","triggerRef","useRef","itemRefs","listboxId","useId","useEffect","selectedIdx","LANGUAGE_CODES","indexOf","idx","setTimeout","current","focus","handleItemSelect","code","handleListKeyDown","event","key","preventDefault","next","Math","min","length","prev","max","_b","_c","last","_d","_jsx","children","ElementWithDropdown","enabled","renderElement","_jsxs","ExpandableElement","ref","className","styles.expandableElement","disabled","expanded","popupRole","readOnly","ARIA_LABEL","LANGUAGE_DISPLAY_MAP","styles.languageIconWrapper","LanguageIcon","renderDropdown","DropdownPanel","onOpen","onClose","onDismiss","clickToToggle","offset"],"mappings":"6xEAaO,MAAMA,EAAmBC,QAAAC,iBAC5BA,EAAgBC,iBAChBA,EAAgBC,OAChBA,KACGC,EAAUC,EAAAL,EAJe,CAAA,mBAAA,mBAAA,WAS5B,MAAOM,EAAQC,GAAaC,GAAS,IAC9BC,EAAcC,GAAmBF,GAAS,GAC3CG,EAAaC,EAA0B,MACvCC,EAAWD,EAAiC,IAG5CE,EAAY,WADPC,MAMXC,GAAU,KACN,GAAIV,EAAQ,CACR,MAAMW,EAAcC,EAAeC,QAAQlB,GACrCmB,EAAMH,GAAe,EAAIA,EAAc,EAC7CP,EAAgBU,GAChBC,YAAW,WACc,QAArBrB,EAAAa,EAASS,QAAQF,UAAI,IAAApB,GAAAA,EAAEuB,OAAO,GAC/B,EACP,MACIb,GAAgB,EACpB,GACD,CAACJ,EAAQL,IAKZ,MAaMuB,EAAoBC,UACtBvB,EAAiBuB,GACjBlB,GAAU,GACQ,QAAlBP,EAAAW,EAAWW,eAAO,IAAAtB,GAAAA,EAAEuB,OAAO,EAGzBG,EAAqBC,gBACvB,OAAQA,EAAMC,KACV,IAAK,YAAa,CACdD,EAAME,iBACN,MAAMC,EAAOC,KAAKC,IACdvB,EAAe,EACfS,EAAee,OAAS,GAE5BvB,EAAgBoB,GACM,QAAtB9B,EAAAa,EAASS,QAAQQ,UAAK,IAAA9B,GAAAA,EAAEuB,QACxB,KACJ,CACA,IAAK,UAAW,CACZI,EAAME,iBACN,MAAMK,EAAOH,KAAKI,IAAI1B,EAAe,EAAG,GACxCC,EAAgBwB,GACM,QAAtBE,EAAAvB,EAASS,QAAQY,UAAK,IAAAE,GAAAA,EAAEb,QACxB,KACJ,CACA,IAAK,OACDI,EAAME,iBACNnB,EAAgB,GACG,QAAnB2B,EAAAxB,EAASS,QAAQ,UAAE,IAAAe,GAAAA,EAAEd,QACrB,MAEJ,IAAK,MAAO,CACRI,EAAME,iBACN,MAAMS,EAAOpB,EAAee,OAAS,EACrCvB,EAAgB4B,GACM,QAAtBC,EAAA1B,EAASS,QAAQgB,UAAK,IAAAC,GAAAA,EAAEhB,QACxB,KACJ,CACA,IAAK,QACL,IAAK,IACDI,EAAME,iBACFpB,GAAgB,GAChBe,EAAiBN,EAAeT,MA4ChD,OACI+B,qCAAkBrC,GAAYC,EAAU,CAAAqC,SACpCD,EAACE,EAAmB,CAChBC,SAAS,EACTrC,OAAQA,EACRsC,cAvCU,IAClBC,EAACC,EAAiB,CACdC,IAAKpC,EACLqC,UAAWC,EACXC,UAAU,EACVC,SAAU7C,EACVQ,UAAWA,EACXsC,UAAU,UACVC,UAAU,EAAK,aACH,GAAGC,MAAeC,EAAqBtD,KAAmB,cACzD,GAAGE,aAAiBsC,SAAA,CAEjCD,EAAA,OAAA,CAAMQ,UAAWQ,EAA0B,eAAA,EAAAf,SACvCD,EAACiB,EAAY,CAAA,KAEhBF,EAAqBtD,MAyBlByD,eArBW,IACnBlB,EAACmB,EAAa,CACVlD,aAAcA,EACde,iBAAkBA,EAClBE,kBAAmBA,EACnBb,SAAUA,EACVC,UAAWA,EACXb,iBAAkBA,EAClBE,OAAQA,IAcJyD,OA1GO,KACfrD,GAAU,EAAK,EA0GPsD,QAvGQ,KAChBtD,GAAU,EAAM,EAuGRuD,UApGU,WAClBvD,GAAU,GACQ,QAAlBP,EAAAW,EAAWW,eAAO,IAAAtB,GAAAA,EAAEuB,OAAO,EAmGnBwC,eAAa,EACbC,OAAQ,MAEV"}

package/language-switcher/dropdown-variant.styles.js

@@ -1,2 +1,2 @@
-import"./dropdown-variant.styles_16c4wc1.css";const e="efqyehf",s="ljv0l5v";export{e as expandableElement,s as languageIconWrapper};
+import"./dropdown-variant.styles_1vrdfky.css";const e="efqyehf",r="ljv0l5v";export{e as expandableElement,r as languageIconWrapper};
 //# sourceMappingURL=dropdown-variant.styles.js.map

package/language-switcher/dropdown-variant.styles_1vrdfky.css

@@ -0,0 +1,2 @@
+@layer fds{.efqyehf{min-width:9rem;width:auto;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);color:var(--fds-colour-text-primary);height:2.5rem;padding:0 var(--fds-spacing-16);border-radius:var(--fds-radius-sm);border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);background:var(--fds-colour-bg);}.efqyehf .i11rk48k{margin-left:auto;}.efqyehf .i11rk48k svg{color:var(--fds-colour-text-selected);}.efqyehf:focus-visible{outline:2px solid var(--fds-colour-focus-ring);outline-offset:-2px;}
+.ljv0l5v{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;color:var(--fds-colour-icon-primary);}.ljv0l5v svg{height:1rem;width:1rem;}}

package/language-switcher/link-container-variant.styles.js

@@ -1,2 +1,2 @@
-import"./link-container-variant.styles_1blx9qm.css";const l="ldxubbp",t="lqgsuoq",e="l3egc8p",r="lrbzpdb",s="l1retz23";export{l as linkContainerWrapper,r as linkItem,s as linkItemActive,t as linkList,e as linkListItem};
+import"./link-container-variant.styles_1iw6zux.css";const l="ldxubbp",t="lqgsuoq",e="l3egc8p",r="lrbzpdb",s="l1retz23";export{l as linkContainerWrapper,r as linkItem,s as linkItemActive,t as linkList,e as linkListItem};
 //# sourceMappingURL=link-container-variant.styles.js.map

package/language-switcher/link-container-variant.styles_1iw6zux.css

@@ -0,0 +1,5 @@
+@layer fds{.ldxubbp{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;padding:var(--fds-spacing-8) var(--fds-spacing-16);-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:var(--fds-radius-sm);border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);background:var(--fds-colour-bg);}
+.lqgsuoq{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;list-style:none;margin:0;padding:0;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0 var(--fds-spacing-8);-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}
+.l3egc8p{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;}
+.lrbzpdb{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:0.25rem 0.5rem;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0.625rem;border:none;border-radius:var(--fds-radius-md);font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);color:var(--fds-colour-text-subtler);text-align:center;-webkit-transition:color var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:color var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);background:none;cursor:pointer;}.lrbzpdb:hover{color:var(--fds-colour-text-hover);-webkit-text-decoration:underline;text-decoration:underline;}.lrbzpdb:focus-visible{outline:2px solid var(--fds-colour-focus-ring);outline-offset:-2px;}
+.l1retz23{background:var(--fds-colour-bg-primary-subtler);color:var(--fds-colour-text-selected);cursor:default;}.l1retz23:hover{color:var(--fds-colour-text-selected);-webkit-text-decoration:none;text-decoration:none;}}

package/layout/col-div.js

@@ -1,2 +1,2 @@
-import{__rest as s}from"../_virtual/_tslib.js";import{jsx as t}from"react/jsx-runtime";import r from"clsx";import e,{useRef as n}from"react";import"../theme/theme-provider/index.js";import{parseCSSVariableValue as o}from"../theme/utils/css-variable.js";import"../theme/theme-provider/context.js";import"../theme/tokens/border.js";import{Breakpoint as l}from"../theme/tokens/breakpoint.js";import"../theme/tokens/colour.js";import"../theme/tokens/font.js";import"../theme/tokens/media-query.js";import{useApplyStyle as m}from"../theme/utils/use-apply-styles.js";import"../theme/utils/use-media-query.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{mergeRefs as a}from"../util/merge-refs.js";import"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{colDiv as i,tokens as x}from"./col-div.styles.js";const p={xxs:{start:x.xxsStart,span:x.xxsSpan,end:x.xxsEnd},xs:{start:x.xsStart,span:x.xsSpan,end:x.xsEnd},sm:{start:x.smStart,span:x.smSpan,end:x.smEnd},md:{start:x.mdStart,span:x.mdSpan,end:x.mdEnd},lg:{start:x.lgStart,span:x.lgSpan,end:x.lgEnd},xl:{start:x.xlStart,span:x.xlSpan,end:x.xlEnd},xxl:{start:x.xxlStart,span:x.xxlSpan,end:x.xxlEnd}},d=s=>{var t,r;const e=o(s,null!==(r=null===(t=globalThis.document)||void 0===t?void 0:t.documentElement)&&void 0!==r?r:null),n=parseInt(e,10);return Number.isNaN(n)?1/0:n},u=e.forwardRef(((e,o)=>{const{xxlCols:x,xlCols:u,lgCols:c,mdCols:f,smCols:j,xsCols:h,xxsCols:v,className:g}=e,S=s(e,["xxlCols","xlCols","lgCols","mdCols","smCols","xsCols","xxsCols","className"]),C=n(null),y=a(C,o),E=(s,t)=>{if(!s)return{start:void 0,span:void 0,end:void 0};if(Array.isArray(s)){const[r,e]=s;if(-1===e)return{start:r,span:void 0,end:-1};const n=d(t);return{start:r,span:Math.min(e-r,n),end:void 0}}const r=d(t);return{start:void 0,span:Math.min(s,r),end:void 0}};return m(C,Object.assign({},(()=>{const s=E(v,l["xxs-column"]),t=E(h||v,l["xs-column"]),r=E(j||h||v,l["sm-column"]),e=E(f||j||h||v,l["md-column"]),n=E(c||f||j||h||v,l["lg-column"]),o=E(u||c||f||j||h||v,l["xl-column"]),m=E(x||u||c||f||j||h||v,l["xxl-column"]),a={};return[{result:s,prefix:"xxs"},{result:t,prefix:"xs"},{result:r,prefix:"sm"},{result:e,prefix:"md"},{result:n,prefix:"lg"},{result:o,prefix:"xl"},{result:m,prefix:"xxl"}].forEach((({result:s,prefix:t})=>{const r=p[t];s.start&&(a[r.start]=String(s.start)),s.span&&(a[r.span]=String(s.span)),s.end&&(a[r.end]=String(s.end))})),a})())),t("div",Object.assign({ref:y,className:r(i,g)},S))}));export{u as ColDiv};
+import{__rest as t}from"../_virtual/_tslib.js";import{jsx as s}from"react/jsx-runtime";import r from"clsx";import e,{useRef as n}from"react";import"../theme/theme-provider/index.js";import{parseCSSVariableValue as o}from"../theme/utils/css-variable.js";import"../theme/theme-provider/context.js";import"../theme/tokens/border.js";import{Breakpoint as l}from"../theme/tokens/breakpoint.js";import"../theme/tokens/colour.js";import"../theme/tokens/font.js";import"../theme/tokens/media-query.js";import{useApplyStyle as m}from"../theme/utils/use-apply-styles.js";import"../theme/utils/use-media-query.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{mergeRefs as a}from"../util/merge-refs.js";import"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{useIsMounted as i}from"../util/use-mount.js";import{colDiv as x,tokens as p}from"./col-div.styles.js";const d={xxs:{start:p.xxsStart,span:p.xxsSpan,end:p.xxsEnd},xs:{start:p.xsStart,span:p.xsSpan,end:p.xsEnd},sm:{start:p.smStart,span:p.smSpan,end:p.smEnd},md:{start:p.mdStart,span:p.mdSpan,end:p.mdEnd},lg:{start:p.lgStart,span:p.lgSpan,end:p.lgEnd},xl:{start:p.xlStart,span:p.xlSpan,end:p.xlEnd},xxl:{start:p.xxlStart,span:p.xxlSpan,end:p.xxlEnd}},u=t=>{var s,r;const e=o(t,null!==(r=null===(s=globalThis.document)||void 0===s?void 0:s.documentElement)&&void 0!==r?r:null),n=parseInt(e,10);return Number.isNaN(n)?1/0:n},c=e.forwardRef(((e,o)=>{const{xxlCols:p,xlCols:c,lgCols:f,mdCols:j,smCols:h,xsCols:v,xxsCols:S,className:g}=e,C=t(e,["xxlCols","xlCols","lgCols","mdCols","smCols","xsCols","xxsCols","className"]),y=i(),E=n(null),b=a(E,o),k=(t,s)=>{if(!t)return{start:void 0,span:void 0,end:void 0};if(Array.isArray(t)){const[r,e]=t;if(-1===e)return{start:r,span:void 0,end:-1};const n=u(s);return{start:r,span:Math.min(e-r,n),end:void 0}}const r=u(s);return{start:void 0,span:Math.min(t,r),end:void 0}};return m(E,y?(()=>{const t=k(S,l["xxs-column"]),s=k(v||S,l["xs-column"]),r=k(h||v||S,l["sm-column"]),e=k(j||h||v||S,l["md-column"]),n=k(f||j||h||v||S,l["lg-column"]),o=k(c||f||j||h||v||S,l["xl-column"]),m=k(p||c||f||j||h||v||S,l["xxl-column"]),a={};return[{result:t,prefix:"xxs"},{result:s,prefix:"xs"},{result:r,prefix:"sm"},{result:e,prefix:"md"},{result:n,prefix:"lg"},{result:o,prefix:"xl"},{result:m,prefix:"xxl"}].forEach((({result:t,prefix:s})=>{const r=d[s];t.start&&(a[r.start]=String(t.start)),t.span&&(a[r.span]=String(t.span)),t.end&&(a[r.end]=String(t.end))})),a})():{}),s("div",Object.assign({ref:b,className:r(x,g)},C))}));export{c as ColDiv};
 //# sourceMappingURL=col-div.js.map

package/layout/col-div.js.map

@@ -1 +1 @@
-{"version":3,"file":"col-div.js","sources":["../../src/layout/col-div.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useRef } from \"react\";\n\nimport { type BreakpointCSSVariableString, useApplyStyle } from \"../theme\";\nimport { Breakpoint } from \"../theme/tokens/breakpoint\";\nimport { parseCSSVariableValue } from \"../theme/utils/css-variable\";\nimport { mergeRefs } from \"../util\";\nimport * as styles from \"./col-div.styles\";\nimport type { ColDivProps } from \"./types\";\n\nconst TOKEN_MAP: Record<string, Record<string, string>> = {\n    xxs: {\n        start: styles.tokens.xxsStart,\n        span: styles.tokens.xxsSpan,\n        end: styles.tokens.xxsEnd,\n    },\n    xs: {\n        start: styles.tokens.xsStart,\n        span: styles.tokens.xsSpan,\n        end: styles.tokens.xsEnd,\n    },\n    sm: {\n        start: styles.tokens.smStart,\n        span: styles.tokens.smSpan,\n        end: styles.tokens.smEnd,\n    },\n    md: {\n        start: styles.tokens.mdStart,\n        span: styles.tokens.mdSpan,\n        end: styles.tokens.mdEnd,\n    },\n    lg: {\n        start: styles.tokens.lgStart,\n        span: styles.tokens.lgSpan,\n        end: styles.tokens.lgEnd,\n    },\n    xl: {\n        start: styles.tokens.xlStart,\n        span: styles.tokens.xlSpan,\n        end: styles.tokens.xlEnd,\n    },\n    xxl: {\n        start: styles.tokens.xxlStart,\n        span: styles.tokens.xxlSpan,\n        end: styles.tokens.xxlEnd,\n    },\n};\n\nconst getColCount = (token: BreakpointCSSVariableString): number => {\n    const value = parseCSSVariableValue(\n        token,\n        globalThis.document?.documentElement ?? null\n    );\n    const parsed = parseInt(value, 10);\n    return Number.isNaN(parsed) ? Infinity : parsed;\n};\n\nconst Component = (\n    props: ColDivProps,\n    ref: React.Ref<HTMLDivElement>\n): JSX.Element => {\n    const {\n        xxlCols,\n        xlCols,\n        lgCols,\n        mdCols,\n        smCols,\n        xsCols,\n        xxsCols,\n        className,\n        ...otherProps\n    } = props;\n\n    const rootRef = useRef<HTMLDivElement>(null);\n    const mergedRef = mergeRefs(rootRef, ref);\n\n    const getColSpan = (\n        cols: number | [number, number] | undefined,\n        colToken: (typeof Breakpoint)[keyof typeof Breakpoint]\n    ) => {\n        if (!cols) return { start: undefined, span: undefined, end: undefined };\n\n        if (Array.isArray(cols)) {\n            const [start, end] = cols;\n            if (end === -1) {\n                return { start, span: undefined, end: -1 };\n            }\n            const maxCols = getColCount(colToken);\n            return {\n                start,\n                span: Math.min(end - start, maxCols),\n                end: undefined,\n            };\n        }\n\n        const maxCols = getColCount(colToken);\n        return {\n            start: undefined,\n            span: Math.min(cols, maxCols),\n            end: undefined,\n        };\n    };\n\n    const getCssVars = () => {\n        const xxsResult = getColSpan(xxsCols, Breakpoint[\"xxs-column\"]);\n        const xsResult = getColSpan(xsCols || xxsCols, Breakpoint[\"xs-column\"]);\n        const smResult = getColSpan(\n            smCols || xsCols || xxsCols,\n            Breakpoint[\"sm-column\"]\n        );\n        const mdResult = getColSpan(\n            mdCols || smCols || xsCols || xxsCols,\n            Breakpoint[\"md-column\"]\n        );\n        const lgResult = getColSpan(\n            lgCols || mdCols || smCols || xsCols || xxsCols,\n            Breakpoint[\"lg-column\"]\n        );\n        const xlResult = getColSpan(\n            xlCols || lgCols || mdCols || smCols || xsCols || xxsCols,\n            Breakpoint[\"xl-column\"]\n        );\n        const xxlResult = getColSpan(\n            xxlCols ||\n                xlCols ||\n                lgCols ||\n                mdCols ||\n                smCols ||\n                xsCols ||\n                xxsCols,\n            Breakpoint[\"xxl-column\"]\n        );\n\n        const cssVars: Record<string, string> = {};\n\n        const results = [\n            { result: xxsResult, prefix: \"xxs\" },\n            { result: xsResult, prefix: \"xs\" },\n            { result: smResult, prefix: \"sm\" },\n            { result: mdResult, prefix: \"md\" },\n            { result: lgResult, prefix: \"lg\" },\n            { result: xlResult, prefix: \"xl\" },\n            { result: xxlResult, prefix: \"xxl\" },\n        ];\n\n        results.forEach(({ result, prefix }) => {\n            const tokens = TOKEN_MAP[prefix];\n            if (result.start) cssVars[tokens.start] = String(result.start);\n            if (result.span) cssVars[tokens.span] = String(result.span);\n            if (result.end) cssVars[tokens.end] = String(result.end);\n        });\n\n        return cssVars;\n    };\n\n    useApplyStyle(rootRef, {\n        ...getCssVars(),\n    });\n\n    return (\n        <div\n            ref={mergedRef}\n            className={clsx(styles.colDiv, className)}\n            {...otherProps}\n        />\n    );\n};\n\nexport const ColDiv = React.forwardRef(Component);\n"],"names":["TOKEN_MAP","xxs","start","styles.tokens","xxsStart","span","xxsSpan","end","xxsEnd","xs","xsStart","xsSpan","xsEnd","sm","smStart","smSpan","smEnd","md","mdStart","mdSpan","mdEnd","lg","lgStart","lgSpan","lgEnd","xl","xlStart","xlSpan","xlEnd","xxl","xxlStart","xxlSpan","xxlEnd","getColCount","token","value","parseCSSVariableValue","_b","_a","globalThis","document","documentElement","parsed","parseInt","Number","isNaN","Infinity","ColDiv","React","forwardRef","props","ref","xxlCols","xlCols","lgCols","mdCols","smCols","xsCols","xxsCols","className","otherProps","__rest","rootRef","useRef","mergedRef","mergeRefs","getColSpan","cols","colToken","undefined","Array","isArray","maxCols","Math","min","useApplyStyle","Object","assign","xxsResult","Breakpoint","xsResult","smResult","mdResult","lgResult","xlResult","xxlResult","cssVars","result","prefix","forEach","tokens","String","getCssVars","_jsx","clsx","styles.colDiv"],"mappings":"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"}
+{"version":3,"file":"col-div.js","sources":["../../src/layout/col-div.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useRef } from \"react\";\n\nimport { type BreakpointCSSVariableString, useApplyStyle } from \"../theme\";\nimport { Breakpoint } from \"../theme/tokens/breakpoint\";\nimport { parseCSSVariableValue } from \"../theme/utils/css-variable\";\nimport { mergeRefs, useIsMounted } from \"../util\";\nimport * as styles from \"./col-div.styles\";\nimport type { ColDivProps } from \"./types\";\n\nconst TOKEN_MAP: Record<string, Record<string, string>> = {\n    xxs: {\n        start: styles.tokens.xxsStart,\n        span: styles.tokens.xxsSpan,\n        end: styles.tokens.xxsEnd,\n    },\n    xs: {\n        start: styles.tokens.xsStart,\n        span: styles.tokens.xsSpan,\n        end: styles.tokens.xsEnd,\n    },\n    sm: {\n        start: styles.tokens.smStart,\n        span: styles.tokens.smSpan,\n        end: styles.tokens.smEnd,\n    },\n    md: {\n        start: styles.tokens.mdStart,\n        span: styles.tokens.mdSpan,\n        end: styles.tokens.mdEnd,\n    },\n    lg: {\n        start: styles.tokens.lgStart,\n        span: styles.tokens.lgSpan,\n        end: styles.tokens.lgEnd,\n    },\n    xl: {\n        start: styles.tokens.xlStart,\n        span: styles.tokens.xlSpan,\n        end: styles.tokens.xlEnd,\n    },\n    xxl: {\n        start: styles.tokens.xxlStart,\n        span: styles.tokens.xxlSpan,\n        end: styles.tokens.xxlEnd,\n    },\n};\n\nconst getColCount = (token: BreakpointCSSVariableString): number => {\n    const value = parseCSSVariableValue(\n        token,\n        globalThis.document?.documentElement ?? null\n    );\n    const parsed = parseInt(value, 10);\n    return Number.isNaN(parsed) ? Infinity : parsed;\n};\n\nconst Component = (\n    props: ColDivProps,\n    ref: React.Ref<HTMLDivElement>\n): JSX.Element => {\n    const {\n        xxlCols,\n        xlCols,\n        lgCols,\n        mdCols,\n        smCols,\n        xsCols,\n        xxsCols,\n        className,\n        ...otherProps\n    } = props;\n\n    const isMounted = useIsMounted();\n    const rootRef = useRef<HTMLDivElement>(null);\n    const mergedRef = mergeRefs(rootRef, ref);\n\n    const getColSpan = (\n        cols: number | [number, number] | undefined,\n        colToken: (typeof Breakpoint)[keyof typeof Breakpoint]\n    ) => {\n        if (!cols) return { start: undefined, span: undefined, end: undefined };\n\n        if (Array.isArray(cols)) {\n            const [start, end] = cols;\n            if (end === -1) {\n                return { start, span: undefined, end: -1 };\n            }\n            const maxCols = getColCount(colToken);\n            return {\n                start,\n                span: Math.min(end - start, maxCols),\n                end: undefined,\n            };\n        }\n\n        const maxCols = getColCount(colToken);\n        return {\n            start: undefined,\n            span: Math.min(cols, maxCols),\n            end: undefined,\n        };\n    };\n\n    const getCssVars = () => {\n        const xxsResult = getColSpan(xxsCols, Breakpoint[\"xxs-column\"]);\n        const xsResult = getColSpan(xsCols || xxsCols, Breakpoint[\"xs-column\"]);\n        const smResult = getColSpan(\n            smCols || xsCols || xxsCols,\n            Breakpoint[\"sm-column\"]\n        );\n        const mdResult = getColSpan(\n            mdCols || smCols || xsCols || xxsCols,\n            Breakpoint[\"md-column\"]\n        );\n        const lgResult = getColSpan(\n            lgCols || mdCols || smCols || xsCols || xxsCols,\n            Breakpoint[\"lg-column\"]\n        );\n        const xlResult = getColSpan(\n            xlCols || lgCols || mdCols || smCols || xsCols || xxsCols,\n            Breakpoint[\"xl-column\"]\n        );\n        const xxlResult = getColSpan(\n            xxlCols ||\n                xlCols ||\n                lgCols ||\n                mdCols ||\n                smCols ||\n                xsCols ||\n                xxsCols,\n            Breakpoint[\"xxl-column\"]\n        );\n\n        const cssVars: Record<string, string> = {};\n\n        const results = [\n            { result: xxsResult, prefix: \"xxs\" },\n            { result: xsResult, prefix: \"xs\" },\n            { result: smResult, prefix: \"sm\" },\n            { result: mdResult, prefix: \"md\" },\n            { result: lgResult, prefix: \"lg\" },\n            { result: xlResult, prefix: \"xl\" },\n            { result: xxlResult, prefix: \"xxl\" },\n        ];\n\n        results.forEach(({ result, prefix }) => {\n            const tokens = TOKEN_MAP[prefix];\n            if (result.start) cssVars[tokens.start] = String(result.start);\n            if (result.span) cssVars[tokens.span] = String(result.span);\n            if (result.end) cssVars[tokens.end] = String(result.end);\n        });\n\n        return cssVars;\n    };\n\n    useApplyStyle(rootRef, isMounted ? getCssVars() : {});\n\n    return (\n        <div\n            ref={mergedRef}\n            className={clsx(styles.colDiv, className)}\n            {...otherProps}\n        />\n    );\n};\n\nexport const ColDiv = React.forwardRef(Component);\n"],"names":["TOKEN_MAP","xxs","start","styles.tokens","xxsStart","span","xxsSpan","end","xxsEnd","xs","xsStart","xsSpan","xsEnd","sm","smStart","smSpan","smEnd","md","mdStart","mdSpan","mdEnd","lg","lgStart","lgSpan","lgEnd","xl","xlStart","xlSpan","xlEnd","xxl","xxlStart","xxlSpan","xxlEnd","getColCount","token","value","parseCSSVariableValue","_b","_a","globalThis","document","documentElement","parsed","parseInt","Number","isNaN","Infinity","ColDiv","React","forwardRef","props","ref","xxlCols","xlCols","lgCols","mdCols","smCols","xsCols","xxsCols","className","otherProps","__rest","isMounted","useIsMounted","rootRef","useRef","mergedRef","mergeRefs","getColSpan","cols","colToken","undefined","Array","isArray","maxCols","Math","min","useApplyStyle","xxsResult","Breakpoint","xsResult","smResult","mdResult","lgResult","xlResult","xxlResult","cssVars","result","prefix","forEach","tokens","String","getCssVars","_jsx","clsx","styles.colDiv"],"mappings":"+6BAUA,MAAMA,EAAoD,CACtDC,IAAK,CACDC,MAAOC,EAAcC,SACrBC,KAAMF,EAAcG,QACpBC,IAAKJ,EAAcK,QAEvBC,GAAI,CACAP,MAAOC,EAAcO,QACrBL,KAAMF,EAAcQ,OACpBJ,IAAKJ,EAAcS,OAEvBC,GAAI,CACAX,MAAOC,EAAcW,QACrBT,KAAMF,EAAcY,OACpBR,IAAKJ,EAAca,OAEvBC,GAAI,CACAf,MAAOC,EAAce,QACrBb,KAAMF,EAAcgB,OACpBZ,IAAKJ,EAAciB,OAEvBC,GAAI,CACAnB,MAAOC,EAAcmB,QACrBjB,KAAMF,EAAcoB,OACpBhB,IAAKJ,EAAcqB,OAEvBC,GAAI,CACAvB,MAAOC,EAAcuB,QACrBrB,KAAMF,EAAcwB,OACpBpB,IAAKJ,EAAcyB,OAEvBC,IAAK,CACD3B,MAAOC,EAAc2B,SACrBzB,KAAMF,EAAc4B,QACpBxB,IAAKJ,EAAc6B,SAIrBC,EAAeC,YACjB,MAAMC,EAAQC,EACVF,EACoC,QAApCG,EAAmB,QAAnBC,EAAAC,WAAWC,gBAAQ,IAAAF,OAAA,EAAAA,EAAEG,uBAAe,IAAAJ,EAAAA,EAAI,MAEtCK,EAASC,SAASR,EAAO,IAC/B,OAAOS,OAAOC,MAAMH,GAAUI,IAAWJ,CAAM,EAiHtCK,EAASC,EAAMC,YA9GV,CACdC,EACAC,KAEA,MAAMC,QACFA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,EAAOC,UACPA,GAEAT,EADGU,EAAUC,EACbX,EAVE,CAAA,UAAA,SAAA,SAAA,SAAA,SAAA,SAAA,UAAA,cAYAY,EAAYC,IACZC,EAAUC,EAAuB,MACjCC,EAAYC,EAAUH,EAASb,GAE/BiB,EAAa,CACfC,EACAC,KAEA,IAAKD,EAAM,MAAO,CAAEnE,WAAOqE,EAAWlE,UAAMkE,EAAWhE,SAAKgE,GAE5D,GAAIC,MAAMC,QAAQJ,GAAO,CACrB,MAAOnE,EAAOK,GAAO8D,EACrB,IAAY,IAAR9D,EACA,MAAO,CAAEL,QAAOG,UAAMkE,EAAWhE,KAAK,GAE1C,MAAMmE,EAAUzC,EAAYqC,GAC5B,MAAO,CACHpE,QACAG,KAAMsE,KAAKC,IAAIrE,EAAML,EAAOwE,GAC5BnE,SAAKgE,EAEb,CAEA,MAAMG,EAAUzC,EAAYqC,GAC5B,MAAO,CACHpE,WAAOqE,EACPlE,KAAMsE,KAAKC,IAAIP,EAAMK,GACrBnE,SAAKgE,EACR,EAyDL,OAFAM,EAAcb,EAASF,EApDJ,MACf,MAAMgB,EAAYV,EAAWV,EAASqB,EAAW,eAC3CC,EAAWZ,EAAWX,GAAUC,EAASqB,EAAW,cACpDE,EAAWb,EACbZ,GAAUC,GAAUC,EACpBqB,EAAW,cAETG,EAAWd,EACbb,GAAUC,GAAUC,GAAUC,EAC9BqB,EAAW,cAETI,EAAWf,EACbd,GAAUC,GAAUC,GAAUC,GAAUC,EACxCqB,EAAW,cAETK,EAAWhB,EACbf,GAAUC,GAAUC,GAAUC,GAAUC,GAAUC,EAClDqB,EAAW,cAETM,EAAYjB,EACdhB,GACIC,GACAC,GACAC,GACAC,GACAC,GACAC,EACJqB,EAAW,eAGTO,EAAkC,CAAA,EAmBxC,MAjBgB,CACZ,CAAEC,OAAQT,EAAWU,OAAQ,OAC7B,CAAED,OAAQP,EAAUQ,OAAQ,MAC5B,CAAED,OAAQN,EAAUO,OAAQ,MAC5B,CAAED,OAAQL,EAAUM,OAAQ,MAC5B,CAAED,OAAQJ,EAAUK,OAAQ,MAC5B,CAAED,OAAQH,EAAUI,OAAQ,MAC5B,CAAED,OAAQF,EAAWG,OAAQ,QAGzBC,SAAQ,EAAGF,SAAQC,aACvB,MAAME,EAAS1F,EAAUwF,GACrBD,EAAOrF,QAAOoF,EAAQI,EAAOxF,OAASyF,OAAOJ,EAAOrF,QACpDqF,EAAOlF,OAAMiF,EAAQI,EAAOrF,MAAQsF,OAAOJ,EAAOlF,OAClDkF,EAAOhF,MAAK+E,EAAQI,EAAOnF,KAAOoF,OAAOJ,EAAOhF,KAAI,IAGrD+E,CAAO,EAGiBM,GAAe,CAAA,GAG9CC,uBACI1C,IAAKe,EACLP,UAAWmC,EAAKC,EAAepC,IAC3BC,GACN"}

package/layout/col-div.styles_16o6mwx.css

@@ -1 +1 @@
-.c1waj0ro{--fds-internal-colDiv-xxs-start:initial;--fds-internal-colDiv-xxs-span:initial;--fds-internal-colDiv-xxs-end:initial;--fds-internal-colDiv-xs-start:initial;--fds-internal-colDiv-xs-span:initial;--fds-internal-colDiv-xs-end:initial;--fds-internal-colDiv-sm-start:initial;--fds-internal-colDiv-sm-span:initial;--fds-internal-colDiv-sm-end:initial;--fds-internal-colDiv-md-start:initial;--fds-internal-colDiv-md-span:initial;--fds-internal-colDiv-md-end:initial;--fds-internal-colDiv-lg-start:initial;--fds-internal-colDiv-lg-span:initial;--fds-internal-colDiv-lg-end:initial;--fds-internal-colDiv-xl-start:initial;--fds-internal-colDiv-xl-span:initial;--fds-internal-colDiv-xl-end:initial;--fds-internal-colDiv-xxl-start:initial;--fds-internal-colDiv-xxl-span:initial;--fds-internal-colDiv-xxl-end:initial;position:relative;grid-column:var(--fds-internal-colDiv-xxs-start, auto)/var(--fds-internal-colDiv-xxs-end, span var(--fds-internal-colDiv-xxs-span, 1));}:where(body.fds-breakpoint-xs-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-xs-start, auto)/var(--fds-internal-colDiv-xs-end, span var(--fds-internal-colDiv-xs-span, 1));}:where(body.fds-breakpoint-sm-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-sm-start, auto)/var(--fds-internal-colDiv-sm-end, span var(--fds-internal-colDiv-sm-span, 1));}:where(body.fds-breakpoint-md-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-md-start, auto)/var(--fds-internal-colDiv-md-end, span var(--fds-internal-colDiv-md-span, 1));}:where(body.fds-breakpoint-lg-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-lg-start, auto)/var(--fds-internal-colDiv-lg-end, span var(--fds-internal-colDiv-lg-span, 1));}:where(body.fds-breakpoint-xl-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-xl-start, auto)/var(--fds-internal-colDiv-xl-end, span var(--fds-internal-colDiv-xl-span, 1));}:where(body.fds-breakpoint-xxl-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-xxl-start, auto)/var(--fds-internal-colDiv-xxl-end, span var(--fds-internal-colDiv-xxl-span, 1));}
+@layer fds{.c1waj0ro{--fds-internal-colDiv-xxs-start:initial;--fds-internal-colDiv-xxs-span:initial;--fds-internal-colDiv-xxs-end:initial;--fds-internal-colDiv-xs-start:initial;--fds-internal-colDiv-xs-span:initial;--fds-internal-colDiv-xs-end:initial;--fds-internal-colDiv-sm-start:initial;--fds-internal-colDiv-sm-span:initial;--fds-internal-colDiv-sm-end:initial;--fds-internal-colDiv-md-start:initial;--fds-internal-colDiv-md-span:initial;--fds-internal-colDiv-md-end:initial;--fds-internal-colDiv-lg-start:initial;--fds-internal-colDiv-lg-span:initial;--fds-internal-colDiv-lg-end:initial;--fds-internal-colDiv-xl-start:initial;--fds-internal-colDiv-xl-span:initial;--fds-internal-colDiv-xl-end:initial;--fds-internal-colDiv-xxl-start:initial;--fds-internal-colDiv-xxl-span:initial;--fds-internal-colDiv-xxl-end:initial;position:relative;grid-column:var(--fds-internal-colDiv-xxs-start, auto)/var(--fds-internal-colDiv-xxs-end, span var(--fds-internal-colDiv-xxs-span, 1));}:where(body.fds-breakpoint-xs-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-xs-start, auto)/var(--fds-internal-colDiv-xs-end, span var(--fds-internal-colDiv-xs-span, 1));}:where(body.fds-breakpoint-sm-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-sm-start, auto)/var(--fds-internal-colDiv-sm-end, span var(--fds-internal-colDiv-sm-span, 1));}:where(body.fds-breakpoint-md-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-md-start, auto)/var(--fds-internal-colDiv-md-end, span var(--fds-internal-colDiv-md-span, 1));}:where(body.fds-breakpoint-lg-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-lg-start, auto)/var(--fds-internal-colDiv-lg-end, span var(--fds-internal-colDiv-lg-span, 1));}:where(body.fds-breakpoint-xl-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-xl-start, auto)/var(--fds-internal-colDiv-xl-end, span var(--fds-internal-colDiv-xl-span, 1));}:where(body.fds-breakpoint-xxl-min) .c1waj0ro{grid-column:var(--fds-internal-colDiv-xxl-start, auto)/var(--fds-internal-colDiv-xxl-end, span var(--fds-internal-colDiv-xxl-span, 1));}}

package/layout/container.styles_v70ec6.css

@@ -1,4 +1,4 @@
-.c1po1qn8{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;margin:0 auto;position:relative;width:auto;height:auto;padding:0 var(--fds-breakpoint-margin-xxs);}:where(body.fds-breakpoint-xs-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-xs);}:where(body.fds-breakpoint-sm-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-sm);}:where(body.fds-breakpoint-md-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-md);}:where(body.fds-breakpoint-lg-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-lg);}:where(body.fds-breakpoint-xl-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-xl);}:where(body.fds-breakpoint-xxl-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-xxl);}
+@layer fds{.c1po1qn8{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;margin:0 auto;position:relative;width:auto;height:auto;padding:0 var(--fds-breakpoint-margin-xxs);}:where(body.fds-breakpoint-xs-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-xs);}:where(body.fds-breakpoint-sm-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-sm);}:where(body.fds-breakpoint-md-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-md);}:where(body.fds-breakpoint-lg-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-lg);}:where(body.fds-breakpoint-xl-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-xl);}:where(body.fds-breakpoint-xxl-min) .c1po1qn8{padding:0 var(--fds-breakpoint-margin-xxl);}
 .ca13up7{max-width:1440px;}
 .ch4a7dv{-webkit-column-gap:var(--fds-breakpoint-gutter-xxs);column-gap:var(--fds-breakpoint-gutter-xxs);display:-ms-grid;display:grid;-ms-grid-columns:repeat(var(--fds-breakpoint-column-xxs), minmax(0, 1fr));grid-template-columns:repeat(var(--fds-breakpoint-column-xxs), minmax(0, 1fr));}:where(body.fds-breakpoint-xs-min) .ch4a7dv{-webkit-column-gap:var(--fds-breakpoint-gutter-xs);column-gap:var(--fds-breakpoint-gutter-xs);-ms-grid-columns:repeat(
             var(--fds-breakpoint-column-xs),
@@ -38,4 +38,4 @@
             minmax(0, 1fr)
         );}
 .cyi2nns{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}
-.cmvqis9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
+.cmvqis9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}}

package/layout/section.styles_hstcaf.css

@@ -1,2 +1,2 @@
-.szyy60j{display:block;position:relative;}
+@layer fds{.szyy60j{display:block;position:relative;}}
 

package/layout/types.d.ts

@@ -1,5 +1,3 @@
-import type { DefaultTheme } from "styled-components";
-import type { AddOne, Range } from "../util/utility-types";
 interface CommonLayoutProps extends React.HTMLAttributes<HTMLDivElement> {
     children: React.ReactNode;
     "data-testid"?: string | undefined;
@@ -14,20 +12,19 @@ export interface SectionProps extends CommonLayoutProps {
 }
 export interface ContentProps extends ContainerProps {
 }
-export type ColSpan<Max extends number | undefined> = Max extends number ? Range<Max> | [Range<AddOne<Max>>, Range<AddOne<Max>> | -1] | undefined : number | [number, number] | undefined;
-export type BreakpointSpan<Breakpoint extends keyof DefaultTheme["maxColumns"]> = DefaultTheme["maxColumns"] extends Record<Breakpoint, infer Max extends number> ? ColSpan<Max> : number | [number, number] | undefined;
+export type ColSpan = number | [number, number] | undefined;
 export interface ColProps {
     /**
      * Specifies the number of columns to be spanned across for any breakpoint.
      * If an array is specified, the format is [startCol, endCol].
      */
-    xxlCols?: BreakpointSpan<"xxl">;
-    xlCols?: BreakpointSpan<"xl">;
-    lgCols?: BreakpointSpan<"lg">;
-    mdCols?: BreakpointSpan<"md">;
-    smCols?: BreakpointSpan<"sm">;
-    xsCols?: BreakpointSpan<"xs">;
-    xxsCols?: BreakpointSpan<"xxs">;
+    xxlCols?: ColSpan;
+    xlCols?: ColSpan;
+    lgCols?: ColSpan;
+    mdCols?: ColSpan;
+    smCols?: ColSpan;
+    xsCols?: ColSpan;
+    xxsCols?: ColSpan;
 }
 export interface ColDivProps extends React.HTMLAttributes<HTMLDivElement>, ColProps {
     "data-testid"?: string;

package/link-list/link-list.styles.js

@@ -1,2 +1,2 @@
-import"./link-list.styles_1g33nb4.css";const i="cfblyzz",t="iejabo3",s="ixxi28v",l="ia0puf0",e="i191w9a9",c="i1ek9mgx",o="i6tq5i6",p="e1p9oc1w",b="e1hdpk7s",k="tjt90m3",n="t1quebcu",x="t1l68ils",_="t5821wq";export{i as container,p as expandable,b as expandableList,e as itemContainer,c as itemContentContainer,o as itemDescription,t as itemIcon,s as itemTitleDefault,l as itemTitleSmall,x as toggleButton,n as toggleButtonIcon,k as toggleButtonLabel,_ as toggleButtonLoading};
+import"./link-list.styles_m57vks.css";const i="cfblyzz",t="iejabo3",s="ixxi28v",l="ia0puf0",e="i191w9a9",c="i1ek9mgx",k="i6tq5i6",o="e1p9oc1w",p="e1hdpk7s",m="tjt90m3",x="t1quebcu",_="t1l68ils",a="t5821wq";export{i as container,o as expandable,p as expandableList,e as itemContainer,c as itemContentContainer,k as itemDescription,t as itemIcon,s as itemTitleDefault,l as itemTitleSmall,_ as toggleButton,x as toggleButtonIcon,m as toggleButtonLabel,a as toggleButtonLoading};
 //# sourceMappingURL=link-list.styles.js.map

package/link-list/link-list.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"link-list.styles.js","sources":["../../src/link-list/link-list.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour } from \"../theme\";\n\nexport const container = css`\n    border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n    border-bottom: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\n// =============================================================================\n// ITEM STYLES\n// =============================================================================\nexport const itemIcon = css`\n    height: 1.125rem;\n    width: 1.125rem;\n    color: ${Colour[\"icon-primary\"]};\n`;\n\nexport const itemTitleDefault = css`\n    color: ${Colour[\"text-primary\"]};\n    margin-bottom: 0.5rem;\n`;\n\nexport const itemTitleSmall = css`\n    color: ${Colour[\"text-primary\"]};\n`;\n\nexport const itemContainer = css`\n    padding: 1rem 0;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    min-height: 4rem;\n\n    &:not(:last-of-type) {\n        border-bottom: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n    }\n\n    &:hover {\n        .${itemTitleDefault}, .${itemTitleSmall}, .${itemIcon} {\n            color: ${Colour[\"text-hover\"]};\n        }\n    }\n`;\n\nexport const itemContentContainer = css`\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n    margin-right: 1rem;\n`;\n\nexport const itemDescription = css`\n    margin-top: 0.25rem;\n`;\n\n// =============================================================================\n// TOGGLE STYLES\n// =============================================================================\nexport const expandable = css`\n    overflow: hidden;\n`;\n\nexport const expandableList = css`\n    border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\nexport const toggleButtonLabel = css`\n    color: ${Colour[\"text-primary\"]};\n`;\n\nexport const toggleButtonIcon = css`\n    height: 1.125rem;\n    width: 1.125rem;\n    color: ${Colour[\"icon-primary\"]};\n`;\n\nexport const toggleButton = css`\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 100%;\n    padding: 1rem 0;\n    border: none;\n    background: none;\n    cursor: pointer;\n    border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n    gap: 1rem;\n\n    &:hover {\n        .${toggleButtonLabel}, .${toggleButtonIcon} {\n            color: ${Colour[\"text-hover\"]};\n            text-decoration: underline;\n        }\n    }\n`;\n\nexport const toggleButtonLoading = css`\n    cursor: default;\n    flex-direction: row-reverse;\n\n    .${toggleButtonLabel}, .${toggleButtonIcon} {\n        color: ${Colour[\"text-disabled\"]};\n        text-decoration: none;\n    }\n\n    &:hover {\n        .${toggleButtonLabel}, .${toggleButtonIcon} {\n            color: ${Colour[\"text-disabled\"]};\n            text-decoration: none;\n        }\n    }\n`;\n"],"names":["container","itemIcon","itemTitleDefault","itemTitleSmall","itemContainer","itemContentContainer","itemDescription","expandable","expandableList","toggleButtonLabel","toggleButtonIcon","toggleButton","toggleButtonLoading"],"mappings":"gEAIO,MAAMA,EAAS,UAQTC,EAAQ,UAMRC,EAAgB,UAKhBC,EAAc,UAIdC,EAAa,WAkBbC,EAAoB,WAOpBC,EAAe,UAOfC,EAAU,WAIVC,EAAc,WAIdC,EAAiB,UAIjBC,EAAgB,WAMhBC,EAAY,WAoBZC,EAAmB"}
+{"version":3,"file":"link-list.styles.js","sources":["../../src/link-list/link-list.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour } from \"../theme\";\n\nexport const container = css`\n    border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n    border-bottom: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\n// =============================================================================\n// ITEM STYLES\n// =============================================================================\nexport const itemIcon = css`\n    height: 1.375rem;\n    width: 1.375rem;\n    color: ${Colour[\"icon-primary\"]};\n`;\n\nexport const itemTitleDefault = css`\n    color: ${Colour[\"text-primary\"]};\n`;\n\nexport const itemTitleSmall = css`\n    color: ${Colour[\"text-primary\"]};\n`;\n\nexport const itemContainer = css`\n    padding: 1rem 0;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    min-height: 4rem;\n\n    &:not(:last-of-type) {\n        border-bottom: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n    }\n\n    &:hover {\n        .${itemTitleDefault}, .${itemTitleSmall}, .${itemIcon} {\n            color: ${Colour[\"text-hover\"]};\n        }\n    }\n`;\n\nexport const itemContentContainer = css`\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n    margin-right: 1rem;\n`;\n\nexport const itemDescription = css`\n    margin-top: 0.25rem;\n`;\n\n// =============================================================================\n// TOGGLE STYLES\n// =============================================================================\nexport const expandable = css`\n    overflow: hidden;\n`;\n\nexport const expandableList = css`\n    border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\nexport const toggleButtonLabel = css`\n    color: ${Colour[\"text-primary\"]};\n`;\n\nexport const toggleButtonIcon = css`\n    height: 1.125rem;\n    width: 1.125rem;\n    color: ${Colour[\"icon-primary\"]};\n`;\n\nexport const toggleButton = css`\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 100%;\n    padding: 1rem 0;\n    border: none;\n    background: none;\n    cursor: pointer;\n    border-top: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n    gap: 1rem;\n\n    &:hover {\n        .${toggleButtonLabel}, .${toggleButtonIcon} {\n            color: ${Colour[\"text-hover\"]};\n            text-decoration: underline;\n        }\n    }\n`;\n\nexport const toggleButtonLoading = css`\n    cursor: default;\n    flex-direction: row-reverse;\n\n    .${toggleButtonLabel}, .${toggleButtonIcon} {\n        color: ${Colour[\"text-disabled\"]};\n        text-decoration: none;\n    }\n\n    &:hover {\n        .${toggleButtonLabel}, .${toggleButtonIcon} {\n            color: ${Colour[\"text-disabled\"]};\n            text-decoration: none;\n        }\n    }\n`;\n"],"names":["container","itemIcon","itemTitleDefault","itemTitleSmall","itemContainer","itemContentContainer","itemDescription","expandable","expandableList","toggleButtonLabel","toggleButtonIcon","toggleButton","toggleButtonLoading"],"mappings":"+DAIO,MAAMA,EAAS,UAQTC,EAAQ,UAMRC,EAAgB,UAIhBC,EAAc,UAIdC,EAAa,WAkBbC,EAAoB,WAOpBC,EAAe,UAOfC,EAAU,WAIVC,EAAc,WAIdC,EAAiB,UAIjBC,EAAgB,WAMhBC,EAAY,WAoBZC,EAAmB"}

package/{cjs/link-list/link-list.styles_1g33nb4.css → link-list/link-list.styles_m57vks.css}

@@ -1,6 +1,6 @@
-.cfblyzz{border-top:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-bottom:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}
-.iejabo3{height:1.125rem;width:1.125rem;color:var(--fds-colour-icon-primary);}
-.ixxi28v{color:var(--fds-colour-text-primary);margin-bottom:0.5rem;}
+@layer fds{.cfblyzz{border-top:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-bottom:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}
+.iejabo3{height:1.375rem;width:1.375rem;color:var(--fds-colour-icon-primary);}
+.ixxi28v{color:var(--fds-colour-text-primary);}
 .ia0puf0{color:var(--fds-colour-text-primary);}
 .i191w9a9{padding:1rem 0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:4rem;}.i191w9a9:not(:last-of-type){border-bottom:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}.i191w9a9:hover .ixxi28v,.i191w9a9:hover .ia0puf0,.i191w9a9:hover .iejabo3{color:var(--fds-colour-text-hover);}
 .i1ek9mgx{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex:1;-ms-flex:1;flex:1;margin-right:1rem;}
@@ -10,4 +10,4 @@
 .tjt90m3{color:var(--fds-colour-text-primary);}
 .t1quebcu{height:1.125rem;width:1.125rem;color:var(--fds-colour-icon-primary);}
 .t1l68ils{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;padding:1rem 0;border:none;background:none;cursor:pointer;border-top:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);gap:1rem;}.t1l68ils:hover .tjt90m3,.t1l68ils:hover .t1quebcu{color:var(--fds-colour-text-hover);-webkit-text-decoration:underline;text-decoration:underline;}
-.t5821wq{cursor:default;-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;}.t5821wq .tjt90m3,.t5821wq .t1quebcu{color:var(--fds-colour-text-disabled);-webkit-text-decoration:none;text-decoration:none;}.t5821wq:hover .tjt90m3,.t5821wq:hover .t1quebcu{color:var(--fds-colour-text-disabled);-webkit-text-decoration:none;text-decoration:none;}
+.t5821wq{cursor:default;-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;}.t5821wq .tjt90m3,.t5821wq .t1quebcu{color:var(--fds-colour-text-disabled);-webkit-text-decoration:none;text-decoration:none;}.t5821wq:hover .tjt90m3,.t5821wq:hover .t1quebcu{color:var(--fds-colour-text-disabled);-webkit-text-decoration:none;text-decoration:none;}}

package/local-nav/local-nav-dropdown/local-nav-dropdown.styles.js

@@ -1,2 +1,2 @@
-import"./local-nav-dropdown.styles_ftv36t.css";const n={navWrapper:{stickyOffset:"--fds-internal-localNavDropdown-navWrapper-stickyOffset",sideMargin:"--fds-internal-localNavDropdown-navWrapper-sideMargin"},navItemList:{viewportHeight:"--fds-internal-localNavDropdown-navItemList-viewportHeight"}},a="nczumix",r="n1mayi9n",e="n1fsscye",t="n10li8ea",o="n1rgfmu8",i="n122w1r6",s="ny6lx9v",l="n1lmzf88",p="nc4nyiy",v="thuuy8a",c="beqsxqe",d="ns92rya",f="np844yu";export{c as backdrop,o as navItem,l as navItemLabel,p as navItemLabelSelected,s as navItemList,i as navItemSelected,e as navSelect,t as navSelectExpanded,a as navSelectIcon,r as navSelectIconExpanded,d as navWrapper,f as navWrapperStickied,v as tickIcon,n as tokens};
+import"./local-nav-dropdown.styles_uhd4xl.css";const n={navWrapper:{stickyOffset:"--fds-internal-localNavDropdown-navWrapper-stickyOffset",sideMargin:"--fds-internal-localNavDropdown-navWrapper-sideMargin"},navItemList:{viewportHeight:"--fds-internal-localNavDropdown-navItemList-viewportHeight"}},a="nczumix",r="n1mayi9n",e="n1fsscye",o="n10li8ea",i="n1rgfmu8",l="n122w1r6",s="ny6lx9v",t="n1lmzf88",p="nc4nyiy",v="thuuy8a",c="beqsxqe",d="ns92rya",y="np844yu";export{c as backdrop,i as navItem,t as navItemLabel,p as navItemLabelSelected,s as navItemList,l as navItemSelected,e as navSelect,o as navSelectExpanded,a as navSelectIcon,r as navSelectIconExpanded,d as navWrapper,y as navWrapperStickied,v as tickIcon,n as tokens};
 //# sourceMappingURL=local-nav-dropdown.styles.js.map

package/{cjs/local-nav/local-nav-dropdown/local-nav-dropdown.styles_ftv36t.css → local-nav/local-nav-dropdown/local-nav-dropdown.styles_uhd4xl.css}

@@ -1,13 +1,13 @@
-.nczumix{color:var(--fds-colour-icon);-webkit-transition:-webkit-transform var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);transition:transform var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
+@layer fds{.nczumix{color:var(--fds-colour-icon);-webkit-transition:-webkit-transform var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);transition:transform var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
 .n1mayi9n{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}
 .n1fsscye{cursor:pointer;background:var(--fds-colour-bg);padding:var(--fds-spacing-12) var(--fds-spacing-16);overflow:hidden;box-shadow:0 0 var(--fds-border-width-010) var(--fds-border-width-010) var(--fds-colour-border);border-radius:var(--fds-radius-sm);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-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);transition-property:background,border-radius,box-shadow,transform;}.n1fsscye:focus-visible{outline:2px solid var(--fds-colour-focus-ring);outline-offset:2px;border-radius:var(--fds-radius-sm);}
 .n10li8ea{border-bottom-left-radius:var(--fds-radius-none);border-bottom-right-radius:var(--fds-radius-none);}
 .n1rgfmu8{padding:var(--fds-spacing-12) var(--fds-spacing-8) var(--fds-spacing-12) var(--fds-spacing-32);background:var(--fds-colour-bg);position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.n1rgfmu8:focus-visible{outline:2px solid var(--fds-colour-focus-ring);outline-offset:0px;border-radius:var(--fds-radius-sm);}
 .n122w1r6{padding:var(--fds-spacing-12) var(--fds-spacing-8) var(--fds-spacing-12) 0;background:var(--fds-colour-bg-primary-subtlest);}
 .ny6lx9v{--fds-internal-localNavDropdown-navItemList-viewportHeight:initial;-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);transform-origin:top;list-style-type:none;padding:0 var(--fds-spacing-8);margin:0;background:var(--fds-colour-bg);cursor:pointer;box-shadow:0 0 var(--fds-border-width-010) var(--fds-border-width-010) var(--fds-colour-border);border-bottom-right-radius:var(--fds-radius-sm);border-bottom-left-radius:var(--fds-radius-sm);overflow-y:auto;max-height:var(--fds-internal-localNavDropdown-navItemList-viewportHeight);}
-.n1lmzf88{font-family:var(--fds-font-family);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text);}
+.n1lmzf88{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text);}
 .nc4nyiy{color:var(--fds-colour-text-selected);}
 .thuuy8a{color:var(--fds-colour-icon-selected);margin:0 var(--fds-spacing-8);}
 .beqsxqe{position:fixed;top:0;right:0;left:0;bottom:0;background-color:var(--fds-colour-overlay-strong);z-index:-1;}
 .ns92rya{--fds-internal-localNavDropdown-navWrapper-stickyOffset:initial;--fds-internal-localNavDropdown-navWrapper-sideMargin:initial;display:block;position:-webkit-sticky;position:sticky;top:var(--fds-internal-localNavDropdown-navWrapper-stickyOffset);width:100%;z-index:10;}
-.np844yu .n1fsscye{margin:0 calc(var(--fds-internal-localNavDropdown-navWrapper-sideMargin, 0px) * -1);padding:var(--fds-spacing-12) var(--fds-spacing-16);border-radius:var(--fds-radius-none);}.np844yu .ny6lx9v{margin-left:calc(var(--fds-internal-localNavDropdown-navWrapper-sideMargin, 0px) * -1);margin-right:calc(var(--fds-internal-localNavDropdown-navWrapper-sideMargin, 0px) * -1);border-bottom-left-radius:var(--fds-radius-sm);border-bottom-right-radius:var(--fds-radius-sm);}
+.np844yu .n1fsscye{margin:0 calc(var(--fds-internal-localNavDropdown-navWrapper-sideMargin, 0px) * -1);padding:var(--fds-spacing-12) var(--fds-spacing-16);border-radius:var(--fds-radius-none);}.np844yu .ny6lx9v{margin-left:calc(var(--fds-internal-localNavDropdown-navWrapper-sideMargin, 0px) * -1);margin-right:calc(var(--fds-internal-localNavDropdown-navWrapper-sideMargin, 0px) * -1);border-bottom-left-radius:var(--fds-radius-sm);border-bottom-right-radius:var(--fds-radius-sm);}}

package/local-nav/local-nav-menu/local-nav-menu.styles_pq19dh.css

@@ -1,5 +1,5 @@
-.nflnesd{list-style-type:none;padding:0;margin-top:0;}
+@layer fds{.nflnesd{list-style-type:none;padding:0;margin-top:0;}
 .tun9y1j{margin:0;}
 .n1ocymwf{display:block;position:relative;margin:0;padding:0;cursor:pointer;}.n1ocymwf::before{content:"";position:absolute;left:0;width:4px;height:100%;top:0;background-color:var(--fds-colour-bg-primary-subtler);-webkit-transition:all 250ms linear;transition:all 250ms linear;}.n1ocymwf:hover,.n1ocymwf:focus-within{background-color:var(--fds-colour-bg-hover-subtle);}
 .naf0oif::before{background-color:var(--fds-colour-bg-primary);}
-.n8uzvfa{display:block;padding:var(--fds-spacing-16);padding-left:var(--fds-spacing-20);}.n8uzvfa:focus-visible{outline:2px solid var(--fds-colour-focus-ring);outline-offset:2px;border-radius:var(--fds-radius-sm);}
+.n8uzvfa{display:block;padding:var(--fds-spacing-16);padding-left:var(--fds-spacing-20);}.n8uzvfa:focus-visible{outline:2px solid var(--fds-colour-focus-ring);outline-offset:2px;border-radius:var(--fds-radius-sm);}}

package/markup/markup.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"../_virtual/_tslib.js";import{jsx as t}from"react/jsx-runtime";import r from"clsx";import{forwardRef as s,useRef as o,useMemo as i}from"react";import"../theme/theme-provider/index.js";import"../theme/theme-provider/context.js";import"../theme/tokens/border.js";import"../theme/tokens/colour.js";import"../theme/tokens/font.js";import"../theme/tokens/media-query.js";import{generateFontProperties as m}from"../theme/utils/font.js";import{useApplyStyle as l}from"../theme/utils/use-apply-styles.js";import"../theme/utils/use-media-query.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{mergeRefs as a}from"../util/merge-refs.js";import"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{baseMarkup as p,sizedMarkup as n}from"./markup.style.js";import{createMarkupFontStyles as u}from"./markup.utils.js";const j=s(((s,j)=>{const{baseTextColor:c,baseTextSize:f,inline:h,className:d}=s,x=e(s,["baseTextColor","baseTextSize","inline","className"]),b=o(null),y=i((()=>a(b,j)),[j]),g=i((()=>{if(f)return m(f,"regular")}),[f]),k=i((()=>Object.assign({color:c||null},u(g))),[c,g]);l(b,k);const v=r(p,f&&n,d);return t(h?"span":"div",Object.assign({ref:y,className:v},x))}));export{j as Markup};
+import{__rest as e}from"../_virtual/_tslib.js";import{jsx as t}from"react/jsx-runtime";import r from"clsx";import{forwardRef as s,useRef as o,useMemo as i}from"react";import"../theme/theme-provider/index.js";import"../theme/theme-provider/context.js";import"../theme/tokens/border.js";import"../theme/tokens/colour.js";import"../theme/tokens/font.js";import"../theme/tokens/media-query.js";import{useApplyStyle as m}from"../theme/utils/use-apply-styles.js";import"../theme/utils/use-media-query.js";import{generateFontProperties as l}from"../theme/utils/font.js";import"../util/calendar-helper.js";import"../external/dayjs/dayjs.min.js";import{mergeRefs as a}from"../util/merge-refs.js";import"../util/simple-id-generator.js";import"../util/string-helper.js";import"@react-aria/live-announcer";import{baseMarkup as n,sizedMarkup as p}from"./markup.style.js";const j=s(((s,j)=>{const{baseTextColor:u,baseTextSize:c,inline:f,className:h}=s,d=e(s,["baseTextColor","baseTextSize","inline","className"]),x=o(null),b=i((()=>a(x,j)),[j]),y=i((()=>{if(c)return l(c,"regular")}),[c]),g=i((()=>Object.assign({color:u||null},y)),[u,y]);m(x,g);const k=r(n,c&&p,h);return t(f?"span":"div",Object.assign({ref:b,className:k},d))}));export{j as Markup};
 //# sourceMappingURL=markup.js.map

package/markup/markup.js.map

@@ -1 +1 @@
-{"version":3,"file":"markup.js","sources":["../../src/markup/markup.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type React from \"react\";\nimport { forwardRef, useMemo, useRef } from \"react\";\n\nimport { generateFontProperties, useApplyStyle } from \"../theme\";\nimport { mergeRefs } from \"../util\";\nimport * as styles from \"./markup.style\";\nimport { createMarkupFontStyles } from \"./markup.utils\";\nimport type { MarkupProps } from \"./types\";\n\nconst Component = (props: MarkupProps, ref: React.Ref<HTMLDivElement>) => {\n    // =========================================================================\n    // CONST, STATE, REF\n    // =========================================================================\n    const { baseTextColor, baseTextSize, inline, className, ...otherProps } =\n        props;\n\n    const containerRef = useRef<HTMLDivElement | HTMLSpanElement>(null);\n    const mergedRef = useMemo(() => mergeRefs(containerRef, ref), [ref]);\n\n    const fontDeclarations = useMemo(() => {\n        if (!baseTextSize) {\n            return undefined;\n        }\n\n        return generateFontProperties(baseTextSize, \"regular\");\n    }, [baseTextSize]);\n\n    const appliedStyles = useMemo(\n        () => ({\n            color: baseTextColor || null,\n            ...createMarkupFontStyles(fontDeclarations),\n        }),\n        [baseTextColor, fontDeclarations]\n    );\n\n    useApplyStyle(containerRef, appliedStyles);\n\n    const mergedClassName = clsx(\n        styles.baseMarkup,\n        baseTextSize && styles.sizedMarkup,\n        className\n    );\n\n    const ElementTag = inline ? \"span\" : \"div\";\n\n    return (\n        <ElementTag\n            ref={mergedRef as React.Ref<HTMLDivElement & HTMLSpanElement>}\n            className={mergedClassName}\n            {...otherProps}\n        />\n    );\n};\n\nexport const Markup = forwardRef(Component);\n"],"names":["Markup","forwardRef","props","ref","baseTextColor","baseTextSize","inline","className","otherProps","__rest","containerRef","useRef","mergedRef","useMemo","mergeRefs","fontDeclarations","generateFontProperties","appliedStyles","Object","assign","color","createMarkupFontStyles","useApplyStyle","mergedClassName","clsx","styles.baseMarkup","styles.sizedMarkup","_jsx"],"mappings":"q5BAUA,MA6CaA,EAASC,GA7CJ,CAACC,EAAoBC,KAInC,MAAMC,cAAEA,EAAaC,aAAEA,EAAYC,OAAEA,EAAMC,UAAEA,GACzCL,EADuDM,EAAUC,EACjEP,EADE,CAAA,gBAAA,eAAA,SAAA,cAGAQ,EAAeC,EAAyC,MACxDC,EAAYC,GAAQ,IAAMC,EAAUJ,EAAcP,IAAM,CAACA,IAEzDY,EAAmBF,GAAQ,KAC7B,GAAKR,EAIL,OAAOW,EAAuBX,EAAc,UAAU,GACvD,CAACA,IAEEY,EAAgBJ,GAClB,IAAMK,OAAAC,OAAA,CACFC,MAAOhB,GAAiB,MACrBiB,EAAuBN,KAE9B,CAACX,EAAeW,IAGpBO,EAAcZ,EAAcO,GAE5B,MAAMM,EAAkBC,EACpBC,EACApB,GAAgBqB,EAChBnB,GAKJ,OACIoB,EAHerB,EAAS,OAAS,MAGtBY,OAAAC,OAAA,CACPhB,IAAKS,EACLL,UAAWgB,GACPf,GACN"}
+{"version":3,"file":"markup.js","sources":["../../src/markup/markup.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type React from \"react\";\nimport { forwardRef, useMemo, useRef } from \"react\";\n\nimport { useApplyStyle } from \"../theme\";\nimport { generateFontProperties } from \"../theme/utils\";\nimport { mergeRefs } from \"../util\";\nimport * as styles from \"./markup.style\";\nimport type { MarkupProps } from \"./types\";\n\nconst Component = (props: MarkupProps, ref: React.Ref<HTMLDivElement>) => {\n    // =========================================================================\n    // CONST, STATE, REF\n    // =========================================================================\n    const { baseTextColor, baseTextSize, inline, className, ...otherProps } =\n        props;\n\n    const containerRef = useRef<HTMLDivElement | HTMLSpanElement>(null);\n    const mergedRef = useMemo(() => mergeRefs(containerRef, ref), [ref]);\n\n    const fontDeclarations = useMemo(() => {\n        if (!baseTextSize) {\n            return undefined;\n        }\n\n        return generateFontProperties(baseTextSize, \"regular\");\n    }, [baseTextSize]);\n\n    const appliedStyles = useMemo(\n        () => ({\n            color: baseTextColor || null,\n            ...fontDeclarations,\n        }),\n        [baseTextColor, fontDeclarations]\n    );\n\n    useApplyStyle(containerRef, appliedStyles);\n\n    const mergedClassName = clsx(\n        styles.baseMarkup,\n        baseTextSize && styles.sizedMarkup,\n        className\n    );\n\n    const ElementTag = inline ? \"span\" : \"div\";\n\n    return (\n        <ElementTag\n            ref={mergedRef as React.Ref<HTMLDivElement & HTMLSpanElement>}\n            className={mergedClassName}\n            {...otherProps}\n        />\n    );\n};\n\nexport const Markup = forwardRef(Component);\n"],"names":["Markup","forwardRef","props","ref","baseTextColor","baseTextSize","inline","className","otherProps","__rest","containerRef","useRef","mergedRef","useMemo","mergeRefs","fontDeclarations","generateFontProperties","appliedStyles","Object","assign","color","useApplyStyle","mergedClassName","clsx","styles.baseMarkup","styles.sizedMarkup","_jsx"],"mappings":"01BAUA,MA6CaA,EAASC,GA7CJ,CAACC,EAAoBC,KAInC,MAAMC,cAAEA,EAAaC,aAAEA,EAAYC,OAAEA,EAAMC,UAAEA,GACzCL,EADuDM,EAAUC,EACjEP,EADE,CAAA,gBAAA,eAAA,SAAA,cAGAQ,EAAeC,EAAyC,MACxDC,EAAYC,GAAQ,IAAMC,EAAUJ,EAAcP,IAAM,CAACA,IAEzDY,EAAmBF,GAAQ,KAC7B,GAAKR,EAIL,OAAOW,EAAuBX,EAAc,UAAU,GACvD,CAACA,IAEEY,EAAgBJ,GAClB,IAAMK,OAAAC,OAAA,CACFC,MAAOhB,GAAiB,MACrBW,IAEP,CAACX,EAAeW,IAGpBM,EAAcX,EAAcO,GAE5B,MAAMK,EAAkBC,EACpBC,EACAnB,GAAgBoB,EAChBlB,GAKJ,OACImB,EAHepB,EAAS,OAAS,MAGtBY,OAAAC,OAAA,CACPhB,IAAKS,EACLL,UAAWe,GACPd,GACN"}

package/markup/markup.style.js

@@ -1,2 +1,2 @@
-import"./markup.style_1iu40x9.css";const t={rootFontFamily:"--fds-internal-markup-root-fontFamily",rootFontVariant:"--fds-internal-markup-root-fontVariant",rootFontSize:"--fds-internal-markup-root-fontSize",rootFontWeight:"--fds-internal-markup-root-fontWeight",rootLineHeight:"--fds-internal-markup-root-lineHeight",rootLetterSpacing:"--fds-internal-markup-root-letterSpacing"},o="b2c8sfe",r="stfuo83";export{o as baseMarkup,r as sizedMarkup,t as tokens};
+import"./markup.style_1iu40x9.css";const s="b2c8sfe",t="stfuo83";export{s as baseMarkup,t as sizedMarkup};
 //# sourceMappingURL=markup.style.js.map

package/markup/markup.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"markup.style.js","sources":["../../src/markup/markup.style.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour } from \"../theme/tokens/colour\";\nimport { Font } from \"../theme/tokens/font\";\n\nexport const tokens = {\n    rootFontFamily: \"--fds-internal-markup-root-fontFamily\",\n    rootFontVariant: \"--fds-internal-markup-root-fontVariant\",\n    rootFontSize: \"--fds-internal-markup-root-fontSize\",\n    rootFontWeight: \"--fds-internal-markup-root-fontWeight\",\n    rootLineHeight: \"--fds-internal-markup-root-lineHeight\",\n    rootLetterSpacing: \"--fds-internal-markup-root-letterSpacing\",\n} as const;\n\nexport const baseMarkup = css`\n    strong {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n    }\n\n    p {\n        margin: 0;\n    }\n\n    a {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n        color: ${Colour.hyperlink};\n        text-decoration: underline;\n\n        svg {\n            color: ${Colour[\"icon-primary\"]};\n            height: 1lh;\n            width: 1em;\n            margin-left: 0.4rem;\n            vertical-align: middle;\n        }\n\n        &:hover,\n        &:active,\n        &:visited,\n        &:focus {\n            color: ${Colour[\"hyperlink-hover\"]};\n\n            svg {\n                color: ${Colour[\"icon-hover\"]};\n            }\n        }\n    }\n\n    ul,\n    ol {\n        margin: 0;\n        padding: 0;\n        margin-left: 2.5rem;\n    }\n\n    ol {\n        list-style: decimal;\n    }\n\n    ul {\n        list-style: disc;\n    }\n`;\n\nexport const sizedMarkup = css`\n    font-family: var(${tokens.rootFontFamily}, inherit);\n    font-variant: var(${tokens.rootFontVariant}, inherit);\n    font-size: var(${tokens.rootFontSize}, inherit);\n    font-weight: var(${tokens.rootFontWeight}, inherit);\n    line-height: var(${tokens.rootLineHeight}, inherit);\n    letter-spacing: var(${tokens.rootLetterSpacing}, inherit);\n`;\n"],"names":["tokens","rootFontFamily","rootFontVariant","rootFontSize","rootFontWeight","rootLineHeight","rootLetterSpacing","baseMarkup","sizedMarkup"],"mappings":"yDAKO,MAAMA,EAAS,CAClBC,eAAgB,wCAChBC,gBAAiB,yCACjBC,aAAc,sCACdC,eAAgB,wCAChBC,eAAgB,wCAChBC,kBAAmB,4CAGVC,EAAU,UAkDVC,EAAW"}
+{"version":3,"file":"markup.style.js","sources":["../../src/markup/markup.style.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour } from \"../theme/tokens/colour\";\nimport { Font } from \"../theme/tokens/font\";\n\nexport const tokens = {\n    rootFontFamily: \"--fds-internal-markup-root-fontFamily\",\n    rootFontVariant: \"--fds-internal-markup-root-fontVariant\",\n    rootFontSize: \"--fds-internal-markup-root-fontSize\",\n    rootFontWeight: \"--fds-internal-markup-root-fontWeight\",\n    rootLineHeight: \"--fds-internal-markup-root-lineHeight\",\n    rootLetterSpacing: \"--fds-internal-markup-root-letterSpacing\",\n} as const;\n\nexport const baseMarkup = css`\n    strong {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n    }\n\n    p {\n        margin: 0;\n    }\n\n    a {\n        font-weight: ${Font.Spec[\"weight-semibold\"]};\n        color: ${Colour.hyperlink};\n        text-decoration: underline;\n\n        svg {\n            color: ${Colour[\"icon-primary\"]};\n            height: 1lh;\n            width: 1em;\n            margin-left: 0.4rem;\n            vertical-align: middle;\n        }\n\n        &:hover,\n        &:active,\n        &:visited,\n        &:focus {\n            color: ${Colour[\"hyperlink-hover\"]};\n\n            svg {\n                color: ${Colour[\"icon-hover\"]};\n            }\n        }\n    }\n\n    ul,\n    ol {\n        margin: 0;\n        padding: 0;\n        margin-left: 2.5rem;\n    }\n\n    ol {\n        list-style: decimal;\n    }\n\n    ul {\n        list-style: disc;\n    }\n`;\n\nexport const sizedMarkup = css`\n    font-family: var(${tokens.rootFontFamily}, inherit);\n    font-variant: var(${tokens.rootFontVariant}, inherit);\n    font-size: var(${tokens.rootFontSize}, inherit);\n    font-weight: var(${tokens.rootFontWeight}, inherit);\n    line-height: var(${tokens.rootLineHeight}, inherit);\n    letter-spacing: var(${tokens.rootLetterSpacing}, inherit);\n`;\n"],"names":["baseMarkup","sizedMarkup"],"mappings":"yDAcO,MAAMA,EAAU,UAkDVC,EAAW"}

package/markup/markup.style_1iu40x9.css

@@ -1,2 +1,2 @@
-.b2c8sfe strong{font-weight:var(--fds-font-weight-semibold);}.b2c8sfe p{margin:0;}.b2c8sfe a{font-weight:var(--fds-font-weight-semibold);color:var(--fds-colour-hyperlink);-webkit-text-decoration:underline;text-decoration:underline;}.b2c8sfe a svg{color:var(--fds-colour-icon-primary);height:1lh;width:1em;margin-left:0.4rem;vertical-align:middle;}.b2c8sfe a:hover,.b2c8sfe a:active,.b2c8sfe a:visited,.b2c8sfe a:focus{color:var(--fds-colour-hyperlink-hover);}.b2c8sfe a:hover svg,.b2c8sfe a:active svg,.b2c8sfe a:visited svg,.b2c8sfe a:focus svg{color:var(--fds-colour-icon-hover);}.b2c8sfe ul,.b2c8sfe ol{margin:0;padding:0;margin-left:2.5rem;}.b2c8sfe ol{list-style:decimal;}.b2c8sfe ul{list-style:disc;}
-.stfuo83{font-family:var(--fds-internal-markup-root-fontFamily, inherit);font-variant:var(--fds-internal-markup-root-fontVariant, inherit);font-size:var(--fds-internal-markup-root-fontSize, inherit);font-weight:var(--fds-internal-markup-root-fontWeight, inherit);line-height:var(--fds-internal-markup-root-lineHeight, inherit);letter-spacing:var(--fds-internal-markup-root-letterSpacing, inherit);}
+@layer fds{.b2c8sfe strong{font-weight:var(--fds-font-weight-semibold);}.b2c8sfe p{margin:0;}.b2c8sfe a{font-weight:var(--fds-font-weight-semibold);color:var(--fds-colour-hyperlink);-webkit-text-decoration:underline;text-decoration:underline;}.b2c8sfe a svg{color:var(--fds-colour-icon-primary);height:1lh;width:1em;margin-left:0.4rem;vertical-align:middle;}.b2c8sfe a:hover,.b2c8sfe a:active,.b2c8sfe a:visited,.b2c8sfe a:focus{color:var(--fds-colour-hyperlink-hover);}.b2c8sfe a:hover svg,.b2c8sfe a:active svg,.b2c8sfe a:visited svg,.b2c8sfe a:focus svg{color:var(--fds-colour-icon-hover);}.b2c8sfe ul,.b2c8sfe ol{margin:0;padding:0;margin-left:2.5rem;}.b2c8sfe ol{list-style:decimal;}.b2c8sfe ul{list-style:disc;}
+.stfuo83{font-family:var(--fds-internal-markup-root-fontFamily, inherit);font-variant:var(--fds-internal-markup-root-fontVariant, inherit);font-size:var(--fds-internal-markup-root-fontSize, inherit);font-weight:var(--fds-internal-markup-root-fontWeight, inherit);line-height:var(--fds-internal-markup-root-lineHeight, inherit);letter-spacing:var(--fds-internal-markup-root-letterSpacing, inherit);}}

package/markup/types.d.ts

@@ -1,8 +1,9 @@
 import type { ColourCSSVariableString, FontSize } from "../theme";
 type CustomCssString = string & {};
+type MarkupTextSize = Exclude<FontSize, "form-label" | "form-description">;
 export interface MarkupProps extends React.HTMLAttributes<HTMLDivElement> {
     /** The default font size. If not specified, inherited from the parent */
-    baseTextSize?: FontSize | undefined;
+    baseTextSize?: MarkupTextSize | undefined;
     /** The default font color. If not specified, inherited from the parent */
     baseTextColor?: ColourCSSVariableString | CustomCssString | undefined;
     /**

package/masked-input/masked-input.styles.js

@@ -1,2 +1,2 @@
-import"./masked-input.styles_4i1qsy.css";const i={iconContainer:{inactiveColor:"--fds-internal-maskedInput-iconContainer-inactiveColor",activeColor:"--fds-internal-maskedInput-iconContainer-activeColor"}},e="ilvnzaw",n="ij8rwek",t="i1q5e8sd",o="lsb4klr",r="l1o6dphh",s="s1lksd2c",a="t12y77bq",c="eimq00u",l="e1roice1",d="e1tg5b5m",m="c1jw7yzb",p="r1svptpi",k="r1dgmaf",C="r1mk0cgh";export{m as clickableErrorWrapper,l as errorIcon,d as errorLabel,c as errorTextContainer,n as iconContainer,t as iconContainerDisabled,e as inputGroupWrapper,r as loadingLabel,o as loadingWrapper,p as readOnlyClickable,C as readOnlyIconContainer,k as readOnlyValueText,s as spinner,i as tokens,a as tryAgainLabel};
+import"./masked-input.styles_1cm388a.css";const i={iconContainer:{inactiveColor:"--fds-internal-maskedInput-iconContainer-inactiveColor",activeColor:"--fds-internal-maskedInput-iconContainer-activeColor"}},e="ilvnzaw",n="ij8rwek",t="i1q5e8sd",o="lsb4klr",r="l1o6dphh",a="s1lksd2c",s="t12y77bq",c="eimq00u",l="e1roice1",d="e1tg5b5m",m="c1jw7yzb",p="r1svptpi",k="r1dgmaf",C="r1mk0cgh";export{m as clickableErrorWrapper,l as errorIcon,d as errorLabel,c as errorTextContainer,n as iconContainer,t as iconContainerDisabled,e as inputGroupWrapper,r as loadingLabel,o as loadingWrapper,p as readOnlyClickable,C as readOnlyIconContainer,k as readOnlyValueText,a as spinner,i as tokens,s as tryAgainLabel};
 //# sourceMappingURL=masked-input.styles.js.map