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

package/cjs/language-switcher/dropdown-variant.style.js

@@ -0,0 +1,62 @@
+"use strict";var e=require("styled-components");require("react/jsx-runtime"),require("clsx"),require("react"),require("../theme/theme-provider/index.js"),require("../theme/theme-provider/context.js");var r=require("../theme/tokens/border.js"),o=require("../theme/tokens/colour.js"),s=require("../theme/tokens/font.js");require("../theme/tokens/media-query.js");var i=require("../theme/tokens/radius.js"),t=require("../theme/tokens/spacing.js");require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer"),require("../shared/dropdown-list/dropdown-label.styles_1dwmd8f.css"),require("../shared/dropdown-list/dropdown-list.js"),require("../shared/dropdown-list/dropdown-list-state.js");var d=require("../shared/dropdown-list/expandable-element.js");require("@lifesg/react-icons/caret-right"),require("@lifesg/react-icons/exclamation-circle-fill"),require("@lifesg/react-icons/minus-square-fill"),require("@lifesg/react-icons/square"),require("@lifesg/react-icons/square-tick-fill"),require("@lifesg/react-icons/tick"),require("react-virtuoso"),require("../markup/markup.js"),require("../_virtual/_tslib.js"),require("../shared/component-loading-spinner/component-loading-spinner.styles_15eq02i.css"),require("../shared/dropdown-wrapper/element-with-dropdown.js"),require("../shared/input-wrapper/input-wrapper.js"),require("../shared/dropdown-list/dropdown-list.styles_1qveyb9.css"),require("../shared/dropdown-list/dropdown-search.js"),require("../shared/dropdown-list/nested-dropdown-list.styles_wdhxoe.css"),require("immer"),require("../external/lodash/_getTag.js"),require("../external/lodash/isArguments.js"),require("../external/lodash/_baseGetTag.js"),require("../external/lodash/isBuffer.js"),require("../external/lodash/isTypedArray.js"),require("../external/lodash/_Stack.js"),require("../external/lodash/_SetCache.js"),require("../external/lodash/_equalByTag.js"),require("../shared/dropdown-list/virtuoso-components.js");var a=require("../shared/dropdown-list/expandable-element.styles.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=l(e);const u=n.default(d.ExpandableElement)`
+    min-width: 9rem;
+    width: auto;
+    ${s.Font["body-md-semibold"]}
+    color: ${o.Colour["text-primary"]};
+    height: 2.5rem;
+    padding: 0 ${t.Spacing["spacing-16"]};
+    border-radius: ${i.Radius.sm};
+    border: ${r.Border["width-010"]} ${r.Border.solid} ${o.Colour.border};
+    background: ${o.Colour.bg};
+
+    .${a.iconContainer} {
+        margin-left: auto;
+
+        svg {
+            color: ${o.Colour["text-selected"]};
+        }
+    }
+
+    &:focus-visible {
+        outline: 2px solid ${o.Colour["focus-ring"]};
+        outline-offset: -2px;
+    }
+`,c=e.css`
+    display: flex;
+    align-items: center;
+
+    svg {
+        height: 1rem;
+        width: 1rem;
+    }
+`,p=n.default.span`
+    ${c}
+    color: ${o.Colour["icon-primary"]};
+`,q=n.default.div`
+    border-radius: ${i.Radius.sm};
+    border: ${r.Border["width-010"]} ${r.Border.solid} ${o.Colour.border};
+    background: ${o.Colour.bg};
+    overflow: hidden;
+`,h=n.default.ul`
+    list-style: none;
+    margin: 0;
+    padding: ${t.Spacing["spacing-8"]};
+`,m=n.default.li`
+    align-items: center;
+    ${s.Font["body-md-regular"]}
+    color: ${o.Colour.text};
+
+    &:hover {
+        background: ${o.Colour["bg-hover-subtle"]};
+    }
+
+    ${r=>r.$selected&&e.css`
+            background: transparent;
+            color: ${o.Colour["text-selected"]};
+
+            &:hover {
+                background: ${o.Colour["bg-hover"]};
+            }
+        `}
+`;exports.DropdownItem=m,exports.DropdownList=h,exports.DropdownPanel=q,exports.LanguageIconWrapper=p,exports.StyledExpandableElement=u;
+//# sourceMappingURL=dropdown-variant.style.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown-variant.style.js","sources":["../../../src/language-switcher/dropdown-variant.style.tsx"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { ExpandableElement } from \"../shared/dropdown-list\";\nimport {\n    baseIndicatorStyle,\n    selectedIndicator,\n} from \"../shared/dropdown-list/dropdown-list.styles\";\nimport { iconContainer } from \"../shared/dropdown-list/expandable-element.styles\";\nimport { Border, Colour, Font, Radius, Spacing } from \"../theme\";\n\n// =============================================================================\n// TRIGGER STYLES\n// =============================================================================\nexport const StyledExpandableElement = styled(ExpandableElement)`\n    min-width: 9rem;\n    width: auto;\n    ${Font[\"body-md-semibold\"]}\n    color: ${Colour[\"text-primary\"]};\n    height: 2.5rem;\n    padding: 0 ${Spacing[\"spacing-16\"]};\n    border-radius: ${Radius[\"sm\"]};\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${Colour[\"border\"]};\n    background: ${Colour[\"bg\"]};\n\n    .${iconContainer} {\n        margin-left: auto;\n\n        svg {\n            color: ${Colour[\"text-selected\"]};\n        }\n    }\n\n    &:focus-visible {\n        outline: 2px solid ${Colour[\"focus-ring\"]};\n        outline-offset: -2px;\n    }\n`;\n\nconst IconWrapper = css`\n    display: flex;\n    align-items: center;\n\n    svg {\n        height: 1rem;\n        width: 1rem;\n    }\n`;\n\nexport const LanguageIconWrapper = styled.span`\n    ${IconWrapper}\n    color: ${Colour[\"icon-primary\"]};\n`;\n\n// =============================================================================\n// DROPDOWN STYLES\n// =============================================================================\nexport const DropdownPanel = styled.div`\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 = styled.ul`\n    list-style: none;\n    margin: 0;\n    padding: ${Spacing[\"spacing-8\"]};\n`;\n\nexport { baseIndicatorStyle, selectedIndicator };\n\nexport const DropdownItem = styled.li<{ $selected: boolean }>`\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    ${(props) =>\n        props.$selected &&\n        css`\n            background: transparent;\n            color: ${Colour[\"text-selected\"]};\n\n            &:hover {\n                background: ${Colour[\"bg-hover\"]};\n            }\n        `}\n`;\n"],"names":["StyledExpandableElement","styled","ExpandableElement","Font","Colour","Spacing","Radius","Border","iconContainer","IconWrapper","css","LanguageIconWrapper","span","DropdownPanel","div","DropdownList","ul","DropdownItem","li","props","$selected"],"mappings":"yuEAaaA,EAA0BC,EAAAA,QAAOC,EAAAA,kBAAkB;;;MAG1DC,EAAAA,KAAK;aACEC,EAAAA,OAAO;;iBAEHC,EAAAA,QAAQ;qBACJC,EAAAA,OAAW;cAClBC,EAAAA,OAAO,gBAAgBA,EAAAA,OAAc,SAAKH,SAAe;kBACrDA,EAAAA,OAAW;;OAEtBI;;;;qBAIcJ,EAAAA,OAAO;;;;;6BAKCA,EAAAA,OAAO;;;EAK9BK,EAAcC,EAAAA,GAAG;;;;;;;;EAUVC,EAAsBV,EAAAA,QAAOW,IAAI;MACxCH;aACOL,EAAAA,OAAO;EAMPS,EAAgBZ,EAAAA,QAAOa,GAAG;qBAClBR,EAAAA,OAAW;cAClBC,EAAAA,OAAO,gBAAgBA,EAAAA,OAAc,SAAKH,SAAe;kBACrDA,EAAAA,OAAW;;EAIhBW,EAAed,EAAAA,QAAOe,EAAE;;;eAGtBX,EAAAA,QAAQ;EAKVY,EAAehB,EAAAA,QAAOiB,EAA0B;;MAEvDf,EAAAA,KAAK;aACEC,EAAAA,OAAa;;;sBAGJA,EAAAA,OAAO;;;MAGtBe,GACCA,EAAMC,WACNV,KAAG;;qBAEUN,EAAAA,OAAO;;;8BAGEA,EAAAA,OAAO;;;"}

package/cjs/language-switcher/index.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("./language-switcher.js");exports.LanguageSwitcher=e.LanguageSwitcher;
+//# sourceMappingURL=index.js.map

package/cjs/language-switcher/language-switcher.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("../_virtual/_tslib.js"),a=require("react/jsx-runtime"),t=require("@react-aria/live-announcer"),n=require("./data.js"),r=require("./dropdown-variant.js"),i=require("./link-container-variant.js");exports.LanguageSwitcher=s=>{var{variant:c="dropdown",selectedLanguage:u="en",onSelectLanguage:g,"data-testid":o="language-switcher"}=s,d=e.__rest(s,["variant","selectedLanguage","onSelectLanguage","data-testid"]);const l=e=>{e!==u&&g&&(g(e),t.announce(`${n.LANGUAGE_DISPLAY_MAP[e]} selected`,"polite"))};switch(c){case"dropdown":return a.jsx(r.DropdownVariant,Object.assign({selectedLanguage:u,onSelectLanguage:l,testId:o},d));case"link-container":return a.jsx(i.LinkContainerVariant,Object.assign({selectedLanguage:u,onSelectLanguage:l,testId:o},d))}};
+//# sourceMappingURL=language-switcher.js.map

package/cjs/language-switcher/language-switcher.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"language-switcher.js","sources":["../../../src/language-switcher/language-switcher.tsx"],"sourcesContent":["import { announce } from \"@react-aria/live-announcer\";\n\nimport { LANGUAGE_DISPLAY_MAP } from \"./data\";\nimport { DropdownVariant } from \"./dropdown-variant\";\nimport { LinkContainerVariant } from \"./link-container-variant\";\nimport type { LanguageSwitcherCode, LanguageSwitcherProps } from \"./types\";\n\nexport const LanguageSwitcher = ({\n    variant = \"dropdown\",\n    selectedLanguage = \"en\",\n    onSelectLanguage,\n    \"data-testid\": testId = \"language-switcher\",\n    ...otherProps\n}: LanguageSwitcherProps): JSX.Element => {\n    // =========================================================================\n    // EVENT HANDLERS\n    // =========================================================================\n    const handleSelectLanguage = (code: LanguageSwitcherCode) => {\n        if (code !== selectedLanguage && onSelectLanguage) {\n            onSelectLanguage(code);\n            announce(`${LANGUAGE_DISPLAY_MAP[code]} selected`, \"polite\");\n        }\n    };\n\n    // =========================================================================\n    // RENDER\n    // =========================================================================\n    switch (variant) {\n        case \"dropdown\":\n            return (\n                <DropdownVariant\n                    selectedLanguage={selectedLanguage}\n                    onSelectLanguage={handleSelectLanguage}\n                    testId={testId}\n                    {...otherProps}\n                />\n            );\n        case \"link-container\":\n            return (\n                <LinkContainerVariant\n                    selectedLanguage={selectedLanguage}\n                    onSelectLanguage={handleSelectLanguage}\n                    testId={testId}\n                    {...otherProps}\n                />\n            );\n    }\n};\n"],"names":["_a","variant","selectedLanguage","onSelectLanguage","testId","otherProps","__rest","handleSelectLanguage","code","announce","LANGUAGE_DISPLAY_MAP","_jsx","DropdownVariant","LinkContainerVariant"],"mappings":"uPAOiCA,QAAAC,QAC7BA,EAAU,WAAUC,iBACpBA,EAAmB,KAAIC,iBACvBA,EACA,cAAeC,EAAS,qBAAmBJ,EACxCK,EAAUC,EAAAA,OAAAN,EALgB,iEAU7B,MAAMO,EAAwBC,IACtBA,IAASN,GAAoBC,IAC7BA,EAAiBK,GACjBC,EAAAA,SAAS,GAAGC,EAAAA,qBAAqBF,cAAkB,UACvD,EAMJ,OAAQP,GACJ,IAAK,WACD,OACIU,EAAAA,IAACC,EAAAA,+BACGV,iBAAkBA,EAClBC,iBAAkBI,EAClBH,OAAQA,GACJC,IAGhB,IAAK,iBACD,OACIM,EAAAA,IAACE,EAAAA,oCACGX,iBAAkBA,EAClBC,iBAAkBI,EAClBH,OAAQA,GACJC"}

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

@@ -0,0 +1,2 @@
+"use strict";var e=require("../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),a=require("./data.js"),n=require("./link-container-variant.style.js");exports.LinkContainerVariant=i=>{var{selectedLanguage:s,onSelectLanguage:c,testId:l}=i,u=e.__rest(i,["selectedLanguage","onSelectLanguage","testId"]);const o=r.useRef([]);return t.jsx(n.LinkContainerWrapper,Object.assign({"data-testid":l},u,{children:t.jsx(n.LinkList,{role:"group","aria-label":a.ARIA_LABEL,children:a.LANGUAGE_CODES.map(((e,r)=>{const i=e===s;return t.jsx(n.LinkListItem,{children:t.jsx(n.LinkItem,{ref:e=>{o.current[r]=e},type:"button",lang:e,$active:i,"aria-pressed":i,tabIndex:i?0:-1,onClick:()=>c(e),onKeyDown:e=>((e,t)=>{var r;let n=null;switch(e.key){case"ArrowRight":case"ArrowDown":e.preventDefault(),n=Math.min(t+1,a.LANGUAGE_CODES.length-1);break;case"ArrowLeft":case"ArrowUp":e.preventDefault(),n=Math.max(t-1,0);break;case"Enter":case" ":{e.preventDefault();const r=a.LANGUAGE_CODES[t];c(r);break}}null!==n&&(null===(r=o.current[n])||void 0===r||r.focus())})(e,r),"data-testid":`${l}--item-${e}`,children:a.LANGUAGE_DISPLAY_MAP[e]})},e)}))})}))};
+//# sourceMappingURL=link-container-variant.js.map

package/cjs/language-switcher/link-container-variant.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-container-variant.js","sources":["../../../src/language-switcher/link-container-variant.tsx"],"sourcesContent":["import type React from \"react\";\nimport { useRef } from \"react\";\n\nimport { ARIA_LABEL, LANGUAGE_CODES, LANGUAGE_DISPLAY_MAP } from \"./data\";\nimport type { VariantInternalProps } from \"./internal-types\";\nimport {\n    LinkContainerWrapper,\n    LinkItem,\n    LinkList,\n    LinkListItem,\n} from \"./link-container-variant.style\";\n\nexport const LinkContainerVariant = ({\n    selectedLanguage,\n    onSelectLanguage,\n    testId,\n    ...otherProps\n}: VariantInternalProps): JSX.Element => {\n    // =========================================================================\n    // CONST, STATE, REF\n    // =========================================================================\n    const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);\n\n    // =========================================================================\n    // EVENT HANDLERS\n    // =========================================================================\n    const handleKeyDown = (event: React.KeyboardEvent, index: number) => {\n        let nextIndex: number | null = null;\n\n        switch (event.key) {\n            case \"ArrowRight\":\n            case \"ArrowDown\": {\n                event.preventDefault();\n                nextIndex = Math.min(index + 1, LANGUAGE_CODES.length - 1);\n                break;\n            }\n            case \"ArrowLeft\":\n            case \"ArrowUp\": {\n                event.preventDefault();\n                nextIndex = Math.max(index - 1, 0);\n                break;\n            }\n            case \"Enter\":\n            case \" \": {\n                event.preventDefault();\n                const code = LANGUAGE_CODES[index];\n                onSelectLanguage(code);\n                break;\n            }\n        }\n\n        if (nextIndex !== null) {\n            itemRefs.current[nextIndex]?.focus();\n        }\n    };\n\n    // =========================================================================\n    // RENDER\n    // =========================================================================\n    return (\n        <LinkContainerWrapper data-testid={testId} {...otherProps}>\n            <LinkList role=\"group\" aria-label={ARIA_LABEL}>\n                {LANGUAGE_CODES.map((code, index) => {\n                    const isActive = code === selectedLanguage;\n                    return (\n                        <LinkListItem key={code}>\n                            <LinkItem\n                                ref={(el) => {\n                                    itemRefs.current[index] = el;\n                                }}\n                                type=\"button\"\n                                lang={code}\n                                $active={isActive}\n                                aria-pressed={isActive}\n                                tabIndex={isActive ? 0 : -1}\n                                onClick={() => onSelectLanguage(code)}\n                                onKeyDown={(e) => handleKeyDown(e, index)}\n                                data-testid={`${testId}--item-${code}`}\n                            >\n                                {LANGUAGE_DISPLAY_MAP[code]}\n                            </LinkItem>\n                        </LinkListItem>\n                    );\n                })}\n            </LinkList>\n        </LinkContainerWrapper>\n    );\n};\n"],"names":["_a","selectedLanguage","onSelectLanguage","testId","otherProps","__rest","itemRefs","useRef","_jsx","LinkContainerWrapper","Object","assign","children","LinkList","role","ARIA_LABEL","LANGUAGE_CODES","map","code","index","isActive","LinkListItem","LinkItem","ref","el","current","type","lang","$active","tabIndex","onClick","onKeyDown","e","event","nextIndex","key","preventDefault","Math","min","length","max","focus","handleKeyDown","LANGUAGE_DISPLAY_MAP"],"mappings":"yMAYqCA,QAAAC,iBACjCA,EAAgBC,iBAChBA,EAAgBC,OAChBA,KACGC,EAAUC,EAAAA,OAAAL,EAJoB,CAAA,mBAAA,mBAAA,WASjC,MAAMM,EAAWC,EAAAA,OAAqC,IAsCtD,OACIC,EAAAA,IAACC,uBAAoBC,OAAAC,OAAA,CAAA,cAAcR,GAAYC,EAAU,CAAAQ,SACrDJ,EAAAA,IAACK,EAAAA,SAAQ,CAACC,KAAK,QAAO,aAAaC,EAAAA,WAAUH,SACxCI,EAAAA,eAAeC,KAAI,CAACC,EAAMC,KACvB,MAAMC,EAAWF,IAASjB,EAC1B,OACIO,EAAAA,IAACa,EAAAA,aAAY,CAAAT,SACTJ,EAAAA,IAACc,WAAQ,CACLC,IAAMC,IACFlB,EAASmB,QAAQN,GAASK,CAAE,EAEhCE,KAAK,SACLC,KAAMT,EAAIU,QACDR,EAAQ,eACHA,EACdS,SAAUT,EAAW,GAAI,EACzBU,QAAS,IAAM5B,EAAiBgB,GAChCa,UAAYC,GAlDlB,EAACC,EAA4Bd,WAC/C,IAAIe,EAA2B,KAE/B,OAAQD,EAAME,KACV,IAAK,aACL,IAAK,YACDF,EAAMG,iBACNF,EAAYG,KAAKC,IAAInB,EAAQ,EAAGH,EAAAA,eAAeuB,OAAS,GACxD,MAEJ,IAAK,YACL,IAAK,UACDN,EAAMG,iBACNF,EAAYG,KAAKG,IAAIrB,EAAQ,EAAG,GAChC,MAEJ,IAAK,QACL,IAAK,IAAK,CACNc,EAAMG,iBACN,MAAMlB,EAAOF,EAAAA,eAAeG,GAC5BjB,EAAiBgB,GACjB,KACJ,EAGc,OAAdgB,IAC2B,QAA3BlC,EAAAM,EAASmB,QAAQS,UAAU,IAAAlC,GAAAA,EAAEyC,QACjC,EAuB0CC,CAAcV,EAAGb,GAAM,cAC5B,GAAGhB,WAAgBe,aAE/ByB,EAAAA,qBAAqBzB,MAdXA,EAgBJ,QAIR"}

package/cjs/language-switcher/link-container-variant.style.js

@@ -0,0 +1,51 @@
+"use strict";var e=require("styled-components");require("../theme/theme-provider/index.js"),require("react"),require("../theme/theme-provider/context.js");var r=require("../theme/tokens/border.js"),t=require("../theme/tokens/colour.js"),i=require("../theme/tokens/font.js");require("../theme/tokens/media-query.js");var o=require("../theme/tokens/motion.js"),n=require("../theme/tokens/radius.js"),s=require("../theme/tokens/spacing.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var u=a(e);const l=u.default.div`
+    display: inline-flex;
+    padding: ${s.Spacing["spacing-8"]} ${s.Spacing["spacing-16"]};
+    align-items: center;
+    border-radius: ${n.Radius.sm};
+    border: ${r.Border["width-010"]} ${r.Border.solid} ${t.Colour.border};
+    background: ${t.Colour.bg};
+`,d=u.default.ul`
+    display: flex;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    align-items: center;
+    gap: 0 ${s.Spacing["spacing-8"]};
+    flex-wrap: wrap;
+`,c=u.default.li`
+    display: flex;
+    align-items: center;
+`,p=u.default.button`
+    display: flex;
+    padding: 0.25rem 0.5rem;
+    justify-content: center;
+    align-items: center;
+    gap: 0.625rem;
+    border: none;
+    border-radius: ${n.Radius.md};
+    ${i.Font["body-md-semibold"]}
+    color: ${t.Colour["text-subtler"]};
+    text-align: center;
+    transition: color ${o.Motion["duration-150"]} ${o.Motion["ease-default"]};
+
+    ${({$active:r})=>r?e.css`
+                  background: ${t.Colour["bg-primary-subtler"]};
+                  color: ${t.Colour["text-selected"]};
+                  cursor: default;
+              `:e.css`
+                  background: none;
+                  cursor: pointer;
+
+                  &:hover {
+                      color: ${t.Colour["text-hover"]};
+                      text-decoration: underline;
+                  }
+              `}
+
+    &:focus-visible {
+        outline: 2px solid ${t.Colour["focus-ring"]};
+        outline-offset: -2px;
+    }
+`;exports.LinkContainerWrapper=l,exports.LinkItem=p,exports.LinkList=d,exports.LinkListItem=c;
+//# sourceMappingURL=link-container-variant.style.js.map

package/cjs/language-switcher/link-container-variant.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-container-variant.style.js","sources":["../../../src/language-switcher/link-container-variant.style.tsx"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { Border, Colour, Font, Motion, Radius, Spacing } from \"../theme\";\n\n// =============================================================================\n// STYLE INTERFACES\n// =============================================================================\ninterface LinkItemStyleProps {\n    $active?: boolean;\n}\n\n// =============================================================================\n// LINK CONTAINER STYLES\n// =============================================================================\nexport const LinkContainerWrapper = styled.div`\n    display: inline-flex;\n    padding: ${Spacing[\"spacing-8\"]} ${Spacing[\"spacing-16\"]};\n    align-items: center;\n    border-radius: ${Radius[\"sm\"]};\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${Colour[\"border\"]};\n    background: ${Colour[\"bg\"]};\n`;\n\nexport const LinkList = styled.ul`\n    display: flex;\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    align-items: center;\n    gap: 0 ${Spacing[\"spacing-8\"]};\n    flex-wrap: wrap;\n`;\n\nexport const LinkListItem = styled.li`\n    display: flex;\n    align-items: center;\n`;\n\nexport const LinkItem = styled.button<LinkItemStyleProps>`\n    display: flex;\n    padding: 0.25rem 0.5rem;\n    justify-content: center;\n    align-items: center;\n    gap: 0.625rem;\n    border: none;\n    border-radius: ${Radius[\"md\"]};\n    ${Font[\"body-md-semibold\"]}\n    color: ${Colour[\"text-subtler\"]};\n    text-align: center;\n    transition: color ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n\n    ${({ $active }) =>\n        $active\n            ? css`\n                  background: ${Colour[\"bg-primary-subtler\"]};\n                  color: ${Colour[\"text-selected\"]};\n                  cursor: default;\n              `\n            : css`\n                  background: none;\n                  cursor: pointer;\n\n                  &:hover {\n                      color: ${Colour[\"text-hover\"]};\n                      text-decoration: underline;\n                  }\n              `}\n\n    &:focus-visible {\n        outline: 2px solid ${Colour[\"focus-ring\"]};\n        outline-offset: -2px;\n    }\n`;\n"],"names":["LinkContainerWrapper","styled","div","Spacing","Radius","Border","Colour","LinkList","ul","LinkListItem","li","LinkItem","button","Font","Motion","$active","css"],"mappings":"6sBAcO,MAAMA,EAAuBC,EAAAA,QAAOC,GAAG;;eAE/BC,EAAAA,QAAQ,gBAAgBA,EAAAA,QAAQ;;qBAE1BC,EAAAA,OAAW;cAClBC,EAAAA,OAAO,gBAAgBA,EAAAA,OAAc,SAAKC,SAAe;kBACrDA,EAAAA,OAAW;EAGhBC,EAAWN,EAAAA,QAAOO,EAAE;;;;;;aAMpBL,EAAAA,QAAQ;;EAIRM,EAAeR,EAAAA,QAAOS,EAAE;;;EAKxBC,EAAWV,EAAAA,QAAOW,MAA0B;;;;;;;qBAOpCR,EAAAA,OAAW;MAC1BS,EAAAA,KAAK;aACEP,EAAAA,OAAO;;wBAEIQ,EAAAA,OAAO,mBAAmBA,EAAAA,OAAO;;MAEnD,EAAGC,aACDA,EACMC,KAAG;gCACeV,EAAAA,OAAO;2BACZA,EAAAA,OAAO;;gBAGpBU,KAAG;;;;;+BAKcV,EAAAA,OAAO;;;;;;6BAMTA,EAAAA,OAAO;;;"}

package/cjs/layout/col-div.js

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

package/cjs/layout/col-div.js.map

@@ -1 +1 @@
-{"version":3,"file":"col-div.js","sources":["../../../src/layout/col-div.tsx"],"sourcesContent":["import React, { useContext } from \"react\";\nimport { ThemeContext } from \"styled-components\";\n\nimport { V3_BreakpointValues } from \"../v3_theme/breakpoint/theme-helper\";\nimport { StyledDiv } from \"./col-div.style\";\nimport type { ColDivProps } from \"./types\";\n\nconst Component = (\n    props: ColDivProps,\n    ref: React.Ref<HTMLDivElement>\n): JSX.Element => {\n    const theme = useContext(ThemeContext);\n\n    const {\n        xxlCols,\n        xlCols,\n        lgCols,\n        mdCols,\n        smCols,\n        xsCols,\n        xxsCols,\n        ...otherProps\n    } = props;\n\n    const getColSpan = (\n        cols: number | [number, number] | undefined,\n        maxCols: number,\n        label: string\n    ) => {\n        if (!cols) return { start: undefined, span: undefined };\n\n        if (process.env.NODE_ENV === \"development\") {\n            if (typeof cols === \"number\" && cols > maxCols) {\n                console.warn(\n                    `Warning: ${label}Cols exceeds maximum (${maxCols}): ${cols}`\n                );\n            } else if (\n                Array.isArray(cols) &&\n                (cols[0] > maxCols + 1 || cols[1] > maxCols + 1)\n            ) {\n                console.warn(\n                    `Warning: ${label}Cols array exceeds maximum (${maxCols}): [${cols[0]}, ${cols[1]}]`\n                );\n            }\n        }\n\n        if (Array.isArray(cols)) {\n            const [start, end] = cols;\n            if (end === -1) {\n                return { start, span: maxCols - start + 1 };\n            }\n            const span = Math.min(end - start, maxCols);\n            return { start, span };\n        }\n\n        return { start: undefined, span: Math.min(cols, maxCols) };\n    };\n\n    const getStyleProps = () => {\n        const xxlColumnCount = V3_BreakpointValues[\"xxl-column\"]({ theme });\n        const xlColumnCount = V3_BreakpointValues[\"xl-column\"]({ theme });\n        const lgColumnCount = V3_BreakpointValues[\"lg-column\"]({ theme });\n        const mdColumnCount = V3_BreakpointValues[\"md-column\"]({ theme });\n        const smColumnCount = V3_BreakpointValues[\"sm-column\"]({ theme });\n        const xsColumnCount = V3_BreakpointValues[\"xs-column\"]({ theme });\n        const xxsColumnCount = V3_BreakpointValues[\"xxs-column\"]({ theme });\n\n        const xxlStartSpan = getColSpan(\n            xxlCols ||\n                xlCols ||\n                lgCols ||\n                mdCols ||\n                smCols ||\n                xsCols ||\n                xxsCols,\n            xxlColumnCount,\n            \"xxl\"\n        );\n\n        const xlStartSpan = getColSpan(\n            xlCols || lgCols || mdCols || smCols || xsCols || xxsCols,\n            xlColumnCount,\n            \"xl\"\n        );\n\n        const lgStartSpan = getColSpan(\n            lgCols || mdCols || smCols || xsCols || xxsCols,\n            lgColumnCount,\n            \"lg\"\n        );\n\n        const mdStartSpan = getColSpan(\n            mdCols || smCols || xsCols || xxsCols,\n            mdColumnCount,\n            \"md\"\n        );\n\n        const smStartSpan = getColSpan(\n            smCols || xsCols || xxsCols,\n            smColumnCount,\n            \"sm\"\n        );\n\n        const xsStartSpan = getColSpan(xsCols || xxsCols, xsColumnCount, \"xs\");\n\n        const xxsStartSpan = getColSpan(xxsCols, xxsColumnCount, \"xxs\");\n\n        return {\n            $xxlStart: xxlStartSpan.start,\n            $xxlSpan: xxlStartSpan.span,\n            $xlStart: xlStartSpan.start,\n            $xlSpan: xlStartSpan.span,\n            $lgStart: lgStartSpan.start,\n            $lgSpan: lgStartSpan.span,\n            $mdStart: mdStartSpan.start,\n            $mdSpan: mdStartSpan.span,\n            $smStart: smStartSpan.start,\n            $smSpan: smStartSpan.span,\n            $xsStart: xsStartSpan.start,\n            $xsSpan: xsStartSpan.span,\n            $xxsStart: xxsStartSpan.start,\n            $xxsSpan: xxsStartSpan.span,\n        };\n    };\n\n    return <StyledDiv ref={ref} {...getStyleProps()} {...otherProps} />;\n};\n\nexport const ColDiv = React.forwardRef(Component);\n"],"names":["ColDiv","React","forwardRef","props","ref","theme","useContext","ThemeContext","xxlCols","xlCols","lgCols","mdCols","smCols","xsCols","xxsCols","otherProps","getColSpan","cols","maxCols","label","start","undefined","span","process","env","NODE_ENV","console","warn","Array","isArray","end","Math","min","_jsx","StyledDiv","Object","assign","xxlColumnCount","V3_BreakpointValues","xlColumnCount","lgColumnCount","mdColumnCount","smColumnCount","xsColumnCount","xxsColumnCount","xxlStartSpan","xlStartSpan","lgStartSpan","mdStartSpan","smStartSpan","xsStartSpan","xxsStartSpan","$xxlStart","$xxlSpan","$xlStart","$xlSpan","$lgStart","$lgSpan","$mdStart","$mdSpan","$smStart","$smSpan","$xsStart","$xsSpan","$xxsStart","$xxsSpan","getStyleProps"],"mappings":"iSAOA,MAyHaA,OAASC,QAAMC,YAzHV,CACdC,EACAC,KAEA,MAAMC,EAAQC,EAAAA,WAAWC,iBAEnBC,QACFA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,GAEAX,EADGY,WACHZ,EATE,CAAA,UAAA,SAAA,SAAA,SAAA,SAAA,SAAA,YAWAa,EAAa,CACfC,EACAC,EACAC,KAEA,IAAKF,EAAM,MAAO,CAAEG,WAAOC,EAAWC,UAAMD,GAiB5C,GAf6B,gBAAzBE,QAAQC,IAAIC,WACQ,iBAATR,GAAqBA,EAAOC,EACnCQ,QAAQC,KACJ,YAAYR,0BAA8BD,OAAaD,KAG3DW,MAAMC,QAAQZ,KACbA,EAAK,GAAKC,EAAU,GAAKD,EAAK,GAAKC,EAAU,IAE9CQ,QAAQC,KACJ,YAAYR,gCAAoCD,QAAcD,EAAK,OAAOA,EAAK,QAKvFW,MAAMC,QAAQZ,GAAO,CACrB,MAAOG,EAAOU,GAAOb,EACrB,IAAY,IAARa,EACA,MAAO,CAAEV,QAAOE,KAAMJ,EAAUE,EAAQ,GAG5C,MAAO,CAAEA,QAAOE,KADHS,KAAKC,IAAIF,EAAMV,EAAOF,GAEvC,CAEA,MAAO,CAAEE,WAAOC,EAAWC,KAAMS,KAAKC,IAAIf,EAAMC,GAAU,EAsE9D,OAAOe,MAACC,EAAAA,UAASC,OAAAC,OAAA,CAAChC,IAAKA,GAnED,MAClB,MAAMiC,EAAiBC,EAAAA,oBAAoB,cAAc,CAAEjC,UACrDkC,EAAgBD,EAAAA,oBAAoB,aAAa,CAAEjC,UACnDmC,EAAgBF,EAAAA,oBAAoB,aAAa,CAAEjC,UACnDoC,EAAgBH,EAAAA,oBAAoB,aAAa,CAAEjC,UACnDqC,EAAgBJ,EAAAA,oBAAoB,aAAa,CAAEjC,UACnDsC,EAAgBL,EAAAA,oBAAoB,aAAa,CAAEjC,UACnDuC,EAAiBN,EAAAA,oBAAoB,cAAc,CAAEjC,UAErDwC,EAAe7B,EACjBR,GACIC,GACAC,GACAC,GACAC,GACAC,GACAC,EACJuB,EACA,OAGES,EAAc9B,EAChBP,GAAUC,GAAUC,GAAUC,GAAUC,GAAUC,EAClDyB,EACA,MAGEQ,EAAc/B,EAChBN,GAAUC,GAAUC,GAAUC,GAAUC,EACxC0B,EACA,MAGEQ,EAAchC,EAChBL,GAAUC,GAAUC,GAAUC,EAC9B2B,EACA,MAGEQ,EAAcjC,EAChBJ,GAAUC,GAAUC,EACpB4B,EACA,MAGEQ,EAAclC,EAAWH,GAAUC,EAAS6B,EAAe,MAE3DQ,EAAenC,EAAWF,EAAS8B,EAAgB,OAEzD,MAAO,CACHQ,UAAWP,EAAazB,MACxBiC,SAAUR,EAAavB,KACvBgC,SAAUR,EAAY1B,MACtBmC,QAAST,EAAYxB,KACrBkC,SAAUT,EAAY3B,MACtBqC,QAASV,EAAYzB,KACrBoC,SAAUV,EAAY5B,MACtBuC,QAASX,EAAY1B,KACrBsC,SAAUX,EAAY7B,MACtByC,QAASZ,EAAY3B,KACrBwC,SAAUZ,EAAY9B,MACtB2C,QAASb,EAAY5B,KACrB0C,UAAWb,EAAa/B,MACxB6C,SAAUd,EAAa7B,KAC1B,EAG2B4C,GAAqBnD,GAAc"}
+{"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":"s2BAUA,MAAMA,EAAoD,CACtDC,IAAK,CACDC,MAAOC,EAAAA,OAAcC,SACrBC,KAAMF,EAAAA,OAAcG,QACpBC,IAAKJ,EAAAA,OAAcK,QAEvBC,GAAI,CACAP,MAAOC,EAAAA,OAAcO,QACrBL,KAAMF,EAAAA,OAAcQ,OACpBJ,IAAKJ,EAAAA,OAAcS,OAEvBC,GAAI,CACAX,MAAOC,EAAAA,OAAcW,QACrBT,KAAMF,EAAAA,OAAcY,OACpBR,IAAKJ,EAAAA,OAAca,OAEvBC,GAAI,CACAf,MAAOC,EAAAA,OAAce,QACrBb,KAAMF,EAAAA,OAAcgB,OACpBZ,IAAKJ,EAAAA,OAAciB,OAEvBC,GAAI,CACAnB,MAAOC,EAAAA,OAAcmB,QACrBjB,KAAMF,EAAAA,OAAcoB,OACpBhB,IAAKJ,EAAAA,OAAcqB,OAEvBC,GAAI,CACAvB,MAAOC,EAAAA,OAAcuB,QACrBrB,KAAMF,EAAAA,OAAcwB,OACpBpB,IAAKJ,EAAAA,OAAcyB,OAEvBC,IAAK,CACD3B,MAAOC,EAAAA,OAAc2B,SACrBzB,KAAMF,EAAAA,OAAc4B,QACpBxB,IAAKJ,EAAAA,OAAc6B,SAIrBC,EAAeC,YACjB,MAAMC,EAAQC,EAAAA,sBACVF,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,EAkHtCK,EAASC,EAAAA,QAAMC,YA/GV,CACdC,EACAC,KAEA,MAAMC,QACFA,EAAOC,OACPA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,QACNA,EAAOC,UACPA,GAEAT,EADGU,EAAUC,EAAAA,OACbX,EAVE,CAAA,UAAA,SAAA,SAAA,SAAA,SAAA,SAAA,UAAA,cAYAY,EAAUC,EAAAA,OAAuB,MACjCC,EAAYC,EAAAA,UAAUH,EAASX,GAE/Be,EAAa,CACfC,EACAC,KAEA,IAAKD,EAAM,MAAO,CAAEjE,WAAOmE,EAAWhE,UAAMgE,EAAW9D,SAAK8D,GAE5D,GAAIC,MAAMC,QAAQJ,GAAO,CACrB,MAAOjE,EAAOK,GAAO4D,EACrB,IAAY,IAAR5D,EACA,MAAO,CAAEL,QAAOG,UAAMgE,EAAW9D,KAAK,GAE1C,MAAMiE,EAAUvC,EAAYmC,GAC5B,MAAO,CACHlE,QACAG,KAAMoE,KAAKC,IAAInE,EAAML,EAAOsE,GAC5BjE,SAAK8D,EAEb,CAEA,MAAMG,EAAUvC,EAAYmC,GAC5B,MAAO,CACHlE,WAAOmE,EACPhE,KAAMoE,KAAKC,IAAIP,EAAMK,GACrBjE,SAAK8D,EACR,EA2DL,OAJAM,EAAAA,cAAcb,EAAOc,OAAAC,OAAA,CAAA,EApDF,MACf,MAAMC,EAAYZ,EAAWR,EAASqB,EAAAA,WAAW,eAC3CC,EAAWd,EAAWT,GAAUC,EAASqB,EAAAA,WAAW,cACpDE,EAAWf,EACbV,GAAUC,GAAUC,EACpBqB,EAAAA,WAAW,cAETG,EAAWhB,EACbX,GAAUC,GAAUC,GAAUC,EAC9BqB,aAAW,cAETI,EAAWjB,EACbZ,GAAUC,GAAUC,GAAUC,GAAUC,EACxCqB,aAAW,cAETK,EAAWlB,EACbb,GAAUC,GAAUC,GAAUC,GAAUC,GAAUC,EAClDqB,EAAAA,WAAW,cAETM,EAAYnB,EACdd,GACIC,GACAC,GACAC,GACAC,GACAC,GACAC,EACJqB,EAAAA,WAAW,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,EAIXM,KAIHC,EAAAA,yBACI1C,IAAKa,EACLL,UAAWmC,EAAAA,QAAKC,EAAAA,OAAepC,IAC3BC,GACN"}

package/cjs/layout/col-div.styles.js

@@ -0,0 +1,2 @@
+"use strict";require("./col-div.styles_16o6mwx.css");exports.colDiv="c1waj0ro",exports.tokens={xxsStart:"--fds-internal-colDiv-xxs-start",xxsSpan:"--fds-internal-colDiv-xxs-span",xxsEnd:"--fds-internal-colDiv-xxs-end",xsStart:"--fds-internal-colDiv-xs-start",xsSpan:"--fds-internal-colDiv-xs-span",xsEnd:"--fds-internal-colDiv-xs-end",smStart:"--fds-internal-colDiv-sm-start",smSpan:"--fds-internal-colDiv-sm-span",smEnd:"--fds-internal-colDiv-sm-end",mdStart:"--fds-internal-colDiv-md-start",mdSpan:"--fds-internal-colDiv-md-span",mdEnd:"--fds-internal-colDiv-md-end",lgStart:"--fds-internal-colDiv-lg-start",lgSpan:"--fds-internal-colDiv-lg-span",lgEnd:"--fds-internal-colDiv-lg-end",xlStart:"--fds-internal-colDiv-xl-start",xlSpan:"--fds-internal-colDiv-xl-span",xlEnd:"--fds-internal-colDiv-xl-end",xxlStart:"--fds-internal-colDiv-xxl-start",xxlSpan:"--fds-internal-colDiv-xxl-span",xxlEnd:"--fds-internal-colDiv-xxl-end"};
+//# sourceMappingURL=col-div.styles.js.map

package/cjs/layout/col-div.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"col-div.styles.js","sources":["../../../src/layout/col-div.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { MediaQuery } from \"../theme\";\n\nexport const tokens = {\n    xxsStart: \"--fds-internal-colDiv-xxs-start\",\n    xxsSpan: \"--fds-internal-colDiv-xxs-span\",\n    xxsEnd: \"--fds-internal-colDiv-xxs-end\",\n    xsStart: \"--fds-internal-colDiv-xs-start\",\n    xsSpan: \"--fds-internal-colDiv-xs-span\",\n    xsEnd: \"--fds-internal-colDiv-xs-end\",\n    smStart: \"--fds-internal-colDiv-sm-start\",\n    smSpan: \"--fds-internal-colDiv-sm-span\",\n    smEnd: \"--fds-internal-colDiv-sm-end\",\n    mdStart: \"--fds-internal-colDiv-md-start\",\n    mdSpan: \"--fds-internal-colDiv-md-span\",\n    mdEnd: \"--fds-internal-colDiv-md-end\",\n    lgStart: \"--fds-internal-colDiv-lg-start\",\n    lgSpan: \"--fds-internal-colDiv-lg-span\",\n    lgEnd: \"--fds-internal-colDiv-lg-end\",\n    xlStart: \"--fds-internal-colDiv-xl-start\",\n    xlSpan: \"--fds-internal-colDiv-xl-span\",\n    xlEnd: \"--fds-internal-colDiv-xl-end\",\n    xxlStart: \"--fds-internal-colDiv-xxl-start\",\n    xxlSpan: \"--fds-internal-colDiv-xxl-span\",\n    xxlEnd: \"--fds-internal-colDiv-xxl-end\",\n};\n\nexport const colDiv = css`\n    ${Object.values(tokens)\n        .map((token) => `${token}: initial;`)\n        .join(\"\")}\n\n    position: relative;\n\n    grid-column: var(${tokens.xxsStart}, auto) /\n        var(${tokens.xxsEnd}, span var(${tokens.xxsSpan}, 1));\n\n    ${MediaQuery.MinWidth.xs} {\n        grid-column: var(${tokens.xsStart}, auto) /\n            var(${tokens.xsEnd}, span var(${tokens.xsSpan}, 1));\n    }\n    ${MediaQuery.MinWidth.sm} {\n        grid-column: var(${tokens.smStart}, auto) /\n            var(${tokens.smEnd}, span var(${tokens.smSpan}, 1));\n    }\n    ${MediaQuery.MinWidth.md} {\n        grid-column: var(${tokens.mdStart}, auto) /\n            var(${tokens.mdEnd}, span var(${tokens.mdSpan}, 1));\n    }\n    ${MediaQuery.MinWidth.lg} {\n        grid-column: var(${tokens.lgStart}, auto) /\n            var(${tokens.lgEnd}, span var(${tokens.lgSpan}, 1));\n    }\n    ${MediaQuery.MinWidth.xl} {\n        grid-column: var(${tokens.xlStart}, auto) /\n            var(${tokens.xlEnd}, span var(${tokens.xlSpan}, 1));\n    }\n    ${MediaQuery.MinWidth.xxl} {\n        grid-column: var(${tokens.xxlStart}, auto) /\n            var(${tokens.xxlEnd}, span var(${tokens.xxlSpan}, 1));\n    }\n`;\n"],"names":["xxsStart","xxsSpan","xxsEnd","xsStart","xsSpan","xsEnd","smStart","smSpan","smEnd","mdStart","mdSpan","mdEnd","lgStart","lgSpan","lgEnd","xlStart","xlSpan","xlEnd","xxlStart","xxlSpan","xxlEnd"],"mappings":"0FA4BmB,0BAxBG,CAClBA,SAAU,kCACVC,QAAS,iCACTC,OAAQ,gCACRC,QAAS,iCACTC,OAAQ,gCACRC,MAAO,+BACPC,QAAS,iCACTC,OAAQ,gCACRC,MAAO,+BACPC,QAAS,iCACTC,OAAQ,gCACRC,MAAO,+BACPC,QAAS,iCACTC,OAAQ,gCACRC,MAAO,+BACPC,QAAS,iCACTC,OAAQ,gCACRC,MAAO,+BACPC,SAAU,kCACVC,QAAS,iCACTC,OAAQ"}

package/cjs/layout/col-div.styles_16o6mwx.css

@@ -0,0 +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));}

package/cjs/layout/container.js

@@ -1,2 +1,2 @@
-"use strict";var t=require("../_virtual/_tslib.js"),e=require("react/jsx-runtime"),r=require("react"),i=require("./container.styles.js");function s(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}const n=s(r).default.forwardRef(((r,s)=>{const{children:n,"data-testid":a="container",type:c="flex",stretch:d=!1}=r,u=t.__rest(r,["children","data-testid","type","stretch"]);return e.jsx(i.StyledContainer,Object.assign({ref:s,"data-testid":a,$type:c,$stretch:d},u,{children:n}))}));exports.Container=n;
+"use strict";var e=require("../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("clsx"),a=require("react"),n=require("./container.styles.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var s=i(r);const c=i(a).default.forwardRef(((r,a)=>{const{children:i,"data-testid":c="container",type:l="flex",stretch:d=!1,className:o}=r,u=e.__rest(r,["children","data-testid","type","stretch","className"]);return t.jsx("div",Object.assign({ref:a,"data-testid":c,className:s.default(n.container,!d&&n.containerNotStretched,"grid"===l&&n.containerGrid,"flex-column"===l&&n.containerFlexColumn,"flex"===l&&n.containerFlex,o)},u,{children:i}))}));exports.Container=c;
 //# sourceMappingURL=container.js.map

package/cjs/layout/container.js.map

@@ -1 +1 @@
-{"version":3,"file":"container.js","sources":["../../../src/layout/container.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { StyledContainer } from \"./container.styles\";\nimport type { ContainerProps } from \"./types\";\n\nconst Component = (\n    props: ContainerProps,\n    ref: React.Ref<HTMLDivElement>\n): JSX.Element => {\n    const {\n        children,\n        \"data-testid\": testId = \"container\",\n        type = \"flex\",\n        stretch = false,\n        ...otherProps\n    } = props;\n\n    return (\n        <StyledContainer\n            ref={ref}\n            data-testid={testId}\n            $type={type}\n            $stretch={stretch}\n            {...otherProps}\n        >\n            {children}\n        </StyledContainer>\n    );\n};\n\nexport const Container = React.forwardRef(Component);\n"],"names":["Container","React","forwardRef","props","ref","children","testId","type","stretch","otherProps","__rest","_jsx","StyledContainer","$stretch"],"mappings":"iNAKA,MAyBaA,OAAYC,QAAMC,YAzBb,CACdC,EACAC,KAEA,MAAMC,SACFA,EACA,cAAeC,EAAS,YAAWC,KACnCA,EAAO,OAAMC,QACbA,GAAU,GAEVL,EADGM,EAAUC,EAAAA,OACbP,EANE,CAAA,WAAA,cAAA,OAAA,YAQN,OACIQ,EAAAA,IAACC,EAAAA,+BACGR,IAAKA,EAAG,cACKE,QACNC,EAAIM,SACDL,GACNC,YAEHJ,IACa"}
+{"version":3,"file":"container.js","sources":["../../../src/layout/container.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\n\nimport * as styles from \"./container.styles\";\nimport type { ContainerProps } from \"./types\";\n\nconst Component = (\n    props: ContainerProps,\n    ref: React.Ref<HTMLDivElement>\n): JSX.Element => {\n    const {\n        children,\n        \"data-testid\": testId = \"container\",\n        type = \"flex\",\n        stretch = false,\n        className,\n        ...otherProps\n    } = props;\n\n    return (\n        <div\n            ref={ref}\n            data-testid={testId}\n            className={clsx(\n                styles.container,\n                !stretch && styles.containerNotStretched,\n                type === \"grid\" && styles.containerGrid,\n                type === \"flex-column\" && styles.containerFlexColumn,\n                type === \"flex\" && styles.containerFlex,\n                className\n            )}\n            {...otherProps}\n        >\n            {children}\n        </div>\n    );\n};\n\nexport const Container = React.forwardRef(Component);\n"],"names":["Container","React","forwardRef","props","ref","children","testId","type","stretch","className","otherProps","__rest","_jsx","Object","assign","clsx","styles.container","styles.containerNotStretched","styles.containerGrid","styles.containerFlexColumn","styles.containerFlex"],"mappings":"8OAMA,MAgCaA,OAAYC,QAAMC,YAhCb,CACdC,EACAC,KAEA,MAAMC,SACFA,EACA,cAAeC,EAAS,YAAWC,KACnCA,EAAO,OAAMC,QACbA,GAAU,EAAKC,UACfA,GAEAN,EADGO,EAAUC,SACbR,EAPE,CAAA,WAAA,cAAA,OAAA,UAAA,cASN,OACIS,EAAAA,IAAA,MAAAC,OAAAC,OAAA,CACIV,IAAKA,gBACQE,EACbG,UAAWM,EAAAA,QACPC,EAAAA,WACCR,GAAWS,EAAAA,sBACH,SAATV,GAAmBW,EAAAA,cACV,gBAATX,GAA0BY,EAAAA,oBACjB,SAATZ,GAAmBa,EAAAA,cACnBX,IAEAC,EAAU,CAAAL,SAEbA,IACC"}

package/cjs/layout/container.styles.js

@@ -1,100 +1,2 @@
-"use strict";var e=require("styled-components"),a=require("../v3_theme/index.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const i=t(e).default.div`
-    flex-grow: 1;
-    margin: 0 auto;
-    position: relative;
-    width: auto;
-    height: auto;
-
-    padding: 0 ${a.V3_Breakpoint["xxl-margin"]}px;
-
-    ${a.V3_MediaQuery.MaxWidth.xl} {
-        padding: 0 ${a.V3_Breakpoint["xl-margin"]}px;
-    }
-
-    ${a.V3_MediaQuery.MaxWidth.lg} {
-        padding: 0 ${a.V3_Breakpoint["lg-margin"]}px;
-    }
-
-    ${a.V3_MediaQuery.MaxWidth.md} {
-        padding: 0 ${a.V3_Breakpoint["md-margin"]}px;
-    }
-
-    ${a.V3_MediaQuery.MaxWidth.sm} {
-        padding: 0 ${a.V3_Breakpoint["sm-margin"]}px;
-    }
-
-    ${a.V3_MediaQuery.MaxWidth.xs} {
-        padding: 0 ${a.V3_Breakpoint["xs-margin"]}px;
-    }
-
-    ${a.V3_MediaQuery.MaxWidth.xxs} {
-        padding: 0 ${a.V3_Breakpoint["xxs-margin"]}px;
-    }
-
-    ${a=>{if(!a.$stretch)return e.css`
-                max-width: 1440px;
-            `}}
-
-    ${t=>{switch(t.$type){case"grid":return e.css`
-                    column-gap: ${a.V3_Breakpoint["xxl-gutter"]}px;
-                    display: grid;
-                    grid-template-columns: repeat(
-                        ${a.V3_Breakpoint["xxl-column"]},
-                        minmax(0, 1fr)
-                    );
-
-                    ${a.V3_MediaQuery.MaxWidth.xl} {
-                        column-gap: ${a.V3_Breakpoint["xl-gutter"]}px;
-                        grid-template-columns: repeat(
-                            ${a.V3_Breakpoint["xl-column"]},
-                            minmax(0, 1fr)
-                        );
-                    }
-
-                    ${a.V3_MediaQuery.MaxWidth.lg} {
-                        column-gap: ${a.V3_Breakpoint["lg-gutter"]}px;
-                        grid-template-columns: repeat(
-                            ${a.V3_Breakpoint["lg-column"]},
-                            minmax(0, 1fr)
-                        );
-                    }
-
-                    ${a.V3_MediaQuery.MaxWidth.md} {
-                        column-gap: ${a.V3_Breakpoint["md-gutter"]}px;
-                        grid-template-columns: repeat(
-                            ${a.V3_Breakpoint["md-column"]},
-                            minmax(0, 1fr)
-                        );
-                    }
-
-                    ${a.V3_MediaQuery.MaxWidth.sm} {
-                        column-gap: ${a.V3_Breakpoint["sm-gutter"]}px;
-                        grid-template-columns: repeat(
-                            ${a.V3_Breakpoint["sm-column"]},
-                            minmax(0, 1fr)
-                        );
-                    }
-
-                    ${a.V3_MediaQuery.MaxWidth.xs} {
-                        column-gap: ${a.V3_Breakpoint["xs-gutter"]}px;
-                        grid-template-columns: repeat(
-                            ${a.V3_Breakpoint["xs-column"]},
-                            minmax(0, 1fr)
-                        );
-                    }
-
-                    ${a.V3_MediaQuery.MaxWidth.xxs} {
-                        column-gap: ${a.V3_Breakpoint["xxs-gutter"]}px;
-                        grid-template-columns: repeat(
-                            ${a.V3_Breakpoint["xxs-column"]},
-                            minmax(0, 1fr)
-                        );
-                    }
-                `;case"flex-column":return e.css`
-                    display: flex;
-                    flex-direction: column;
-                `;default:return e.css`
-                    display: flex;
-                `}}}
-`;exports.StyledContainer=i;
+"use strict";require("./container.styles_v70ec6.css");exports.container="c1po1qn8",exports.containerFlex="cmvqis9",exports.containerFlexColumn="cyi2nns",exports.containerGrid="ch4a7dv",exports.containerNotStretched="ca13up7";
 //# sourceMappingURL=container.styles.js.map

package/cjs/layout/container.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"container.styles.js","sources":["../../../src/layout/container.styles.tsx"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { V3_Breakpoint, V3_MediaQuery } from \"../v3_theme\";\nimport type { ContainerType } from \"./types\";\n\ninterface StyleProps {\n    $type: ContainerType;\n    $stretch: boolean;\n}\n\nexport const StyledContainer = styled.div<StyleProps>`\n    flex-grow: 1;\n    margin: 0 auto;\n    position: relative;\n    width: auto;\n    height: auto;\n\n    padding: 0 ${V3_Breakpoint[\"xxl-margin\"]}px;\n\n    ${V3_MediaQuery.MaxWidth.xl} {\n        padding: 0 ${V3_Breakpoint[\"xl-margin\"]}px;\n    }\n\n    ${V3_MediaQuery.MaxWidth.lg} {\n        padding: 0 ${V3_Breakpoint[\"lg-margin\"]}px;\n    }\n\n    ${V3_MediaQuery.MaxWidth.md} {\n        padding: 0 ${V3_Breakpoint[\"md-margin\"]}px;\n    }\n\n    ${V3_MediaQuery.MaxWidth.sm} {\n        padding: 0 ${V3_Breakpoint[\"sm-margin\"]}px;\n    }\n\n    ${V3_MediaQuery.MaxWidth.xs} {\n        padding: 0 ${V3_Breakpoint[\"xs-margin\"]}px;\n    }\n\n    ${V3_MediaQuery.MaxWidth.xxs} {\n        padding: 0 ${V3_Breakpoint[\"xxs-margin\"]}px;\n    }\n\n    ${(props) => {\n        if (!props.$stretch) {\n            return css`\n                max-width: 1440px;\n            `;\n        }\n    }}\n\n    ${(props) => {\n        switch (props.$type) {\n            case \"grid\":\n                return css`\n                    column-gap: ${V3_Breakpoint[\"xxl-gutter\"]}px;\n                    display: grid;\n                    grid-template-columns: repeat(\n                        ${V3_Breakpoint[\"xxl-column\"]},\n                        minmax(0, 1fr)\n                    );\n\n                    ${V3_MediaQuery.MaxWidth.xl} {\n                        column-gap: ${V3_Breakpoint[\"xl-gutter\"]}px;\n                        grid-template-columns: repeat(\n                            ${V3_Breakpoint[\"xl-column\"]},\n                            minmax(0, 1fr)\n                        );\n                    }\n\n                    ${V3_MediaQuery.MaxWidth.lg} {\n                        column-gap: ${V3_Breakpoint[\"lg-gutter\"]}px;\n                        grid-template-columns: repeat(\n                            ${V3_Breakpoint[\"lg-column\"]},\n                            minmax(0, 1fr)\n                        );\n                    }\n\n                    ${V3_MediaQuery.MaxWidth.md} {\n                        column-gap: ${V3_Breakpoint[\"md-gutter\"]}px;\n                        grid-template-columns: repeat(\n                            ${V3_Breakpoint[\"md-column\"]},\n                            minmax(0, 1fr)\n                        );\n                    }\n\n                    ${V3_MediaQuery.MaxWidth.sm} {\n                        column-gap: ${V3_Breakpoint[\"sm-gutter\"]}px;\n                        grid-template-columns: repeat(\n                            ${V3_Breakpoint[\"sm-column\"]},\n                            minmax(0, 1fr)\n                        );\n                    }\n\n                    ${V3_MediaQuery.MaxWidth.xs} {\n                        column-gap: ${V3_Breakpoint[\"xs-gutter\"]}px;\n                        grid-template-columns: repeat(\n                            ${V3_Breakpoint[\"xs-column\"]},\n                            minmax(0, 1fr)\n                        );\n                    }\n\n                    ${V3_MediaQuery.MaxWidth.xxs} {\n                        column-gap: ${V3_Breakpoint[\"xxs-gutter\"]}px;\n                        grid-template-columns: repeat(\n                            ${V3_Breakpoint[\"xxs-column\"]},\n                            minmax(0, 1fr)\n                        );\n                    }\n                `;\n\n            case \"flex-column\":\n                return css`\n                    display: flex;\n                    flex-direction: column;\n                `;\n            case \"flex\":\n            default:\n                return css`\n                    display: flex;\n                `;\n        }\n    }}\n`;\n"],"names":["StyledContainer","styled","div","V3_Breakpoint","V3_MediaQuery","MaxWidth","xl","lg","md","sm","xs","xxs","props","$stretch","css","$type"],"mappings":"0JAUO,MAAMA,OAAkBC,QAAOC,GAAe;;;;;;;iBAOpCC,EAAAA,cAAc;;MAEzBC,EAAAA,cAAcC,SAASC;qBACRH,EAAAA,cAAc;;;MAG7BC,EAAAA,cAAcC,SAASE;qBACRJ,EAAAA,cAAc;;;MAG7BC,EAAAA,cAAcC,SAASG;qBACRL,EAAAA,cAAc;;;MAG7BC,EAAAA,cAAcC,SAASI;qBACRN,EAAAA,cAAc;;;MAG7BC,EAAAA,cAAcC,SAASK;qBACRP,EAAAA,cAAc;;;MAG7BC,EAAAA,cAAcC,SAASM;qBACRR,EAAAA,cAAc;;;MAG5BS,IACC,IAAKA,EAAMC,SACP,OAAOC,KAAG;;aAGd;;MAGDF,IACC,OAAQA,EAAMG,OACV,IAAK,OACD,OAAOD,KAAG;kCACQX,EAAAA,cAAc;;;0BAGtBA,EAAAA,cAAc;;;;sBAIlBC,EAAAA,cAAcC,SAASC;sCACPH,EAAAA,cAAc;;8BAEtBA,EAAAA,cAAc;;;;;sBAKtBC,EAAAA,cAAcC,SAASE;sCACPJ,EAAAA,cAAc;;8BAEtBA,EAAAA,cAAc;;;;;sBAKtBC,EAAAA,cAAcC,SAASG;sCACPL,EAAAA,cAAc;;8BAEtBA,EAAAA,cAAc;;;;;sBAKtBC,EAAAA,cAAcC,SAASI;sCACPN,EAAAA,cAAc;;8BAEtBA,EAAAA,cAAc;;;;;sBAKtBC,EAAAA,cAAcC,SAASK;sCACPP,EAAAA,cAAc;;8BAEtBA,EAAAA,cAAc;;;;;sBAKtBC,EAAAA,cAAcC,SAASM;sCACPR,EAAAA,cAAc;;8BAEtBA,EAAAA,cAAc;;;;kBAMhC,IAAK,cACD,OAAOW,KAAG;;;kBAKd,QACI,OAAOA,KAAG;;;"}
+{"version":3,"file":"container.styles.js","sources":["../../../src/layout/container.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { MediaQuery } from \"../theme\";\nimport { Breakpoint } from \"../theme/tokens/breakpoint\";\n\nexport const container = css`\n    flex-grow: 1;\n    margin: 0 auto;\n    position: relative;\n    width: auto;\n    height: auto;\n    padding: 0 ${Breakpoint[\"xxs-margin\"]};\n\n    ${MediaQuery.MinWidth.xs} {\n        padding: 0 ${Breakpoint[\"xs-margin\"]};\n    }\n    ${MediaQuery.MinWidth.sm} {\n        padding: 0 ${Breakpoint[\"sm-margin\"]};\n    }\n    ${MediaQuery.MinWidth.md} {\n        padding: 0 ${Breakpoint[\"md-margin\"]};\n    }\n    ${MediaQuery.MinWidth.lg} {\n        padding: 0 ${Breakpoint[\"lg-margin\"]};\n    }\n    ${MediaQuery.MinWidth.xl} {\n        padding: 0 ${Breakpoint[\"xl-margin\"]};\n    }\n    ${MediaQuery.MinWidth.xxl} {\n        padding: 0 ${Breakpoint[\"xxl-margin\"]};\n    }\n`;\n\nexport const containerNotStretched = css`\n    max-width: 1440px;\n`;\n\nexport const containerGrid = css`\n    column-gap: ${Breakpoint[\"xxs-gutter\"]};\n    display: grid;\n    grid-template-columns: repeat(${Breakpoint[\"xxs-column\"]}, minmax(0, 1fr));\n\n    ${MediaQuery.MinWidth.xs} {\n        column-gap: ${Breakpoint[\"xs-gutter\"]};\n        grid-template-columns: repeat(\n            ${Breakpoint[\"xs-column\"]},\n            minmax(0, 1fr)\n        );\n    }\n    ${MediaQuery.MinWidth.sm} {\n        column-gap: ${Breakpoint[\"sm-gutter\"]};\n        grid-template-columns: repeat(\n            ${Breakpoint[\"sm-column\"]},\n            minmax(0, 1fr)\n        );\n    }\n    ${MediaQuery.MinWidth.md} {\n        column-gap: ${Breakpoint[\"md-gutter\"]};\n        grid-template-columns: repeat(\n            ${Breakpoint[\"md-column\"]},\n            minmax(0, 1fr)\n        );\n    }\n    ${MediaQuery.MinWidth.lg} {\n        column-gap: ${Breakpoint[\"lg-gutter\"]};\n        grid-template-columns: repeat(\n            ${Breakpoint[\"lg-column\"]},\n            minmax(0, 1fr)\n        );\n    }\n    ${MediaQuery.MinWidth.xl} {\n        column-gap: ${Breakpoint[\"xl-gutter\"]};\n        grid-template-columns: repeat(\n            ${Breakpoint[\"xl-column\"]},\n            minmax(0, 1fr)\n        );\n    }\n    ${MediaQuery.MinWidth.xxl} {\n        column-gap: ${Breakpoint[\"xxl-gutter\"]};\n        grid-template-columns: repeat(\n            ${Breakpoint[\"xxl-column\"]},\n            minmax(0, 1fr)\n        );\n    }\n`;\n\nexport const containerFlexColumn = css`\n    display: flex;\n    flex-direction: column;\n`;\n\nexport const containerFlex = css`\n    display: flex;\n`;\n"],"names":[],"mappings":"8FAKsB,iCAsFI,sCALM,gCAjDN,wCAJQ"}

package/cjs/layout/container.styles_v70ec6.css

@@ -0,0 +1,41 @@
+.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),
+            minmax(0, 1fr)
+        );grid-template-columns:repeat(
+            var(--fds-breakpoint-column-xs),
+            minmax(0, 1fr)
+        );}:where(body.fds-breakpoint-sm-min) .ch4a7dv{-webkit-column-gap:var(--fds-breakpoint-gutter-sm);column-gap:var(--fds-breakpoint-gutter-sm);-ms-grid-columns:repeat(
+            var(--fds-breakpoint-column-sm),
+            minmax(0, 1fr)
+        );grid-template-columns:repeat(
+            var(--fds-breakpoint-column-sm),
+            minmax(0, 1fr)
+        );}:where(body.fds-breakpoint-md-min) .ch4a7dv{-webkit-column-gap:var(--fds-breakpoint-gutter-md);column-gap:var(--fds-breakpoint-gutter-md);-ms-grid-columns:repeat(
+            var(--fds-breakpoint-column-md),
+            minmax(0, 1fr)
+        );grid-template-columns:repeat(
+            var(--fds-breakpoint-column-md),
+            minmax(0, 1fr)
+        );}:where(body.fds-breakpoint-lg-min) .ch4a7dv{-webkit-column-gap:var(--fds-breakpoint-gutter-lg);column-gap:var(--fds-breakpoint-gutter-lg);-ms-grid-columns:repeat(
+            var(--fds-breakpoint-column-lg),
+            minmax(0, 1fr)
+        );grid-template-columns:repeat(
+            var(--fds-breakpoint-column-lg),
+            minmax(0, 1fr)
+        );}:where(body.fds-breakpoint-xl-min) .ch4a7dv{-webkit-column-gap:var(--fds-breakpoint-gutter-xl);column-gap:var(--fds-breakpoint-gutter-xl);-ms-grid-columns:repeat(
+            var(--fds-breakpoint-column-xl),
+            minmax(0, 1fr)
+        );grid-template-columns:repeat(
+            var(--fds-breakpoint-column-xl),
+            minmax(0, 1fr)
+        );}:where(body.fds-breakpoint-xxl-min) .ch4a7dv{-webkit-column-gap:var(--fds-breakpoint-gutter-xxl);column-gap:var(--fds-breakpoint-gutter-xxl);-ms-grid-columns:repeat(
+            var(--fds-breakpoint-column-xxl),
+            minmax(0, 1fr)
+        );grid-template-columns:repeat(
+            var(--fds-breakpoint-column-xxl),
+            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;}

package/cjs/layout/section.js

@@ -1,5 +1,2 @@
-"use strict";var t=require("../_virtual/_tslib.js"),e=require("react/jsx-runtime"),r=require("react"),i=require("styled-components");function s(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var a=s(r),c=s(i);const n=a.default.forwardRef(((r,i)=>{const{children:s,"data-testid":a="section",stretch:c=!1}=r,n=t.__rest(r,["children","data-testid","stretch"]);return e.jsx(d,Object.assign({ref:i,"data-testid":a,$stretch:c},n,{children:s}))})),d=c.default.section`
-    display: block;
-    position: relative;
-`;exports.Section=n;
+"use strict";var e=require("../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("clsx"),s=require("react"),c=require("./section.styles.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=i(r);const n=i(s).default.forwardRef(((r,s)=>{const{children:i,"data-testid":n="section",className:d,stretch:u=!1}=r,l=e.__rest(r,["children","data-testid","className","stretch"]);return t.jsx("section",Object.assign({ref:s,"data-testid":n,className:a.default(c.section,d,u&&c.sectionStretched)},l,{children:i}))}));exports.Section=n;
 //# sourceMappingURL=section.js.map

package/cjs/layout/section.js.map

@@ -1 +1 @@
-{"version":3,"file":"section.js","sources":["../../../src/layout/section.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"styled-components\";\n\nimport type { SectionProps } from \"./types\";\n\nconst Component = (\n    props: SectionProps,\n    ref: React.Ref<HTMLDivElement>\n): JSX.Element => {\n    const {\n        children,\n        \"data-testid\": testId = \"section\",\n        stretch = false,\n        ...otherProps\n    } = props;\n\n    return (\n        <StyledSection\n            ref={ref}\n            data-testid={testId}\n            $stretch={stretch}\n            {...otherProps}\n        >\n            {children}\n        </StyledSection>\n    );\n};\n\nexport const Section = React.forwardRef(Component);\n\ninterface StyleProps {\n    $stretch: boolean;\n}\n\nconst StyledSection = styled.section<StyleProps>`\n    display: block;\n    position: relative;\n`;\n"],"names":["Section","React","forwardRef","props","ref","children","testId","stretch","otherProps","_jsx","StyledSection","Object","assign","$stretch","styled","section"],"mappings":"+NAKA,MAuBaA,EAAUC,EAAAA,QAAMC,YAvBX,CACdC,EACAC,KAEA,MAAMC,SACFA,EACA,cAAeC,EAAS,UAASC,QACjCA,GAAU,GAEVJ,EADGK,WACHL,EALE,CAAA,WAAA,cAAA,YAON,OACIM,EAAAA,IAACC,EAAaC,OAAAC,OAAA,CACVR,IAAKA,EAAG,cACKE,EAAMO,SACTN,GACNC,YAEHH,IACW,IAUlBK,EAAgBI,EAAAA,QAAOC,OAAmB;;;"}
+{"version":3,"file":"section.js","sources":["../../../src/layout/section.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\n\nimport * as styles from \"./section.styles\";\nimport type { SectionProps } from \"./types\";\n\nconst Component = (\n    props: SectionProps,\n    ref: React.Ref<HTMLDivElement>\n): JSX.Element => {\n    const {\n        children,\n        \"data-testid\": testId = \"section\",\n        className,\n        stretch = false,\n        ...otherProps\n    } = props;\n\n    return (\n        <section\n            ref={ref}\n            data-testid={testId}\n            className={clsx(\n                styles.section,\n                className,\n                stretch && styles.sectionStretched\n            )}\n            {...otherProps}\n        >\n            {children}\n        </section>\n    );\n};\n\nexport const Section = React.forwardRef(Component);\n"],"names":["Section","React","forwardRef","props","ref","children","testId","className","stretch","otherProps","_jsx","Object","assign","clsx","styles.section","styles.sectionStretched"],"mappings":"4OAMA,MA4BaA,OAAUC,QAAMC,YA5BX,CACdC,EACAC,KAEA,MAAMC,SACFA,EACA,cAAeC,EAAS,UAASC,UACjCA,EAASC,QACTA,GAAU,GAEVL,EADGM,WACHN,EANE,CAAA,WAAA,cAAA,YAAA,YAQN,OACIO,EAAAA,IAAA,UAAAC,OAAAC,OAAA,CACIR,IAAKA,EAAG,cACKE,EACbC,UAAWM,EAAAA,QACPC,UACAP,EACAC,GAAWO,qBAEXN,EAAU,CAAAJ,SAEbA,IACK"}

package/cjs/layout/section.styles.js

@@ -0,0 +1,2 @@
+"use strict";require("./section.styles_hstcaf.css");exports.section="szyy60j",exports.sectionStretched="sp7b31y";
+//# sourceMappingURL=section.styles.js.map

package/cjs/layout/section.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"section.styles.js","sources":["../../../src/layout/section.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nexport const tokens = {\n    stretch: \"--fds-internal-section-stretch\",\n};\n\nexport const section = css`\n    display: block;\n    position: relative;\n`;\n\nexport const sectionStretched = css``;\n"],"names":[],"mappings":"0FAMoB,mCAKS"}

package/cjs/layout/section.styles_hstcaf.css

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

package/cjs/link-list/components/link-list-eager.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),i=require("@react-spring/web"),t=require("react"),s=require("../../external/react-resize-detector/build/index.esm.js"),r=require("../../shared/accessibility/index.js");require("../../util/calendar-helper.js"),require("../../external/dayjs/dayjs.min.js");var n=require("../../util/simple-id-generator.js");require("../../util/string-helper.js");var l=require("../link-list.styles.js"),a=require("./common.js");exports.EagerLinkList=({items:d,maxShown:o,style:u,onItemClick:c,customLabels:m})=>{const[h,g]=t.useState(!o||o>=d.length),j=o?d.slice(o):[],x=s.useResizeDetector(),p=x.ref,[b]=t.useState((()=>n.SimpleIdGenerator.generate())),k=(e,i)=>{i.onClick?(e.preventDefault(),i.onClick(e)):c&&(e.preventDefault(),c(i,e))},q=()=>{g(!h)},w=i.useSpring({height:h?x.height:0});return e.jsxs(e.Fragment,{children:[e.jsx(a.LinkListItems,{"data-testid":"link-list-items-shown",items:o?d.slice(0,o):d,handleItemClick:k,style:u}),j.length>0&&e.jsx(l.Expandable,{id:b,style:w,"data-testid":"minimised-content",inert:r.inertValue(!h),children:e.jsx(l.ExpandableChild,{ref:p,$border:!0,children:e.jsx(a.LinkListItems,{"data-testid":"link-list-items-minimised",style:u,items:j,handleItemClick:k})})}),j.length>0&&e.jsxs(l.ToggleButton,{type:"button",onClick:q,"data-testid":"toggle-button","aria-expanded":h,"aria-controls":b,children:[e.jsx(l.ToggleButtonLabel,{forwardedAs:"span",weight:"semibold","data-testid":"toggle-button-label",children:h?(null==m?void 0:m.viewLess)||"View less":(null==m?void 0:m.viewMore)||"View more"}),h?e.jsx(l.ViewLessIcon,{"aria-hidden":!0}):e.jsx(l.ViewMoreIcon,{"aria-hidden":!0})]})]})};
+"use strict";var e=require("react/jsx-runtime"),i=require("@react-spring/web"),t=require("react"),s=require("../../external/react-resize-detector/build/index.esm.js"),r=require("../../shared/accessibility/index.js");require("../../util/calendar-helper.js"),require("../../external/dayjs/dayjs.min.js");var n=require("../../util/simple-id-generator.js");require("../../util/string-helper.js"),require("@react-aria/live-announcer");var l=require("../link-list.styles.js"),a=require("./common.js");exports.EagerLinkList=({items:d,maxShown:o,style:u,onItemClick:c,customLabels:m})=>{const[h,g]=t.useState(!o||o>=d.length),j=o?d.slice(o):[],x=s.useResizeDetector(),b=x.ref,p=n.useId(),k=(e,i)=>{i.onClick?(e.preventDefault(),i.onClick(e)):c&&(e.preventDefault(),c(i,e))},q=()=>{g(!h)},w=i.useSpring({height:h?x.height:0});return e.jsxs(e.Fragment,{children:[e.jsx(a.LinkListItems,{"data-testid":"link-list-items-shown",items:o?d.slice(0,o):d,handleItemClick:k,style:u}),j.length>0&&e.jsx(l.Expandable,{id:p,style:w,"data-testid":"minimised-content",inert:r.inertValue(!h),children:e.jsx(l.ExpandableChild,{ref:b,$border:!0,children:e.jsx(a.LinkListItems,{"data-testid":"link-list-items-minimised",style:u,items:j,handleItemClick:k})})}),j.length>0&&e.jsxs(l.ToggleButton,{type:"button",onClick:q,"data-testid":"toggle-button","aria-expanded":h,"aria-controls":p,children:[e.jsx(l.ToggleButtonLabel,{forwardedAs:"span",weight:"semibold","data-testid":"toggle-button-label",children:h?(null==m?void 0:m.viewLess)||"View less":(null==m?void 0:m.viewMore)||"View more"}),h?e.jsx(l.ViewLessIcon,{"aria-hidden":!0}):e.jsx(l.ViewMoreIcon,{"aria-hidden":!0})]})]})};
 //# sourceMappingURL=link-list-eager.js.map

package/cjs/link-list/components/link-list-eager.js.map

@@ -1 +1 @@
-{"version":3,"file":"link-list-eager.js","sources":["../../../../src/link-list/components/link-list-eager.tsx"],"sourcesContent":["import { useSpring } from \"@react-spring/web\";\nimport type React from \"react\";\nimport { useState } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport { inertValue } from \"../../shared/accessibility\";\nimport { SimpleIdGenerator } from \"../../util\";\nimport type {\n    BaseProps,\n    LinkListEagerProps,\n    LinkListItemProps,\n} from \"../internal-types\";\nimport {\n    Expandable,\n    ExpandableChild,\n    ToggleButton,\n    ToggleButtonLabel,\n    ViewLessIcon,\n    ViewMoreIcon,\n} from \"../link-list.styles\";\nimport { LinkListItems } from \"./common\";\n\ntype Props<T> = Omit<BaseProps<T>, \"className\" | \"data-testid\"> &\n    Omit<LinkListEagerProps, \"loadMode\">;\nexport const EagerLinkList = <T,>({\n    items,\n    maxShown,\n    style,\n    onItemClick,\n    customLabels,\n}: Props<T>) => {\n    // =============================================================================\n    // CONST, STATE, REFS\n    // =============================================================================\n    const [showMinimised, setShowMinimised] = useState<boolean>(\n        maxShown ? maxShown >= items.length : true\n    );\n\n    const itemsMinimised = maxShown ? items.slice(maxShown) : [];\n\n    const resizeDetector = useResizeDetector();\n    const childRef = resizeDetector.ref;\n\n    const [id] = useState(() => SimpleIdGenerator.generate());\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleListItemClick = (\n        event: React.MouseEvent<HTMLAnchorElement>,\n        item: LinkListItemProps<T>\n    ) => {\n        /**\n         * Individual item's onClick will override\n         * the onItemClick callback\n         */\n        if (item.onClick) {\n            event.preventDefault();\n            item.onClick(event);\n        } else if (onItemClick) {\n            event.preventDefault();\n            onItemClick(item, event);\n        }\n\n        // Do nothing and let default event happen\n    };\n\n    const handleToggleButtonClick = () => {\n        setShowMinimised(!showMinimised);\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderToggle = () => (\n        <ToggleButton\n            type=\"button\"\n            onClick={handleToggleButtonClick}\n            data-testid=\"toggle-button\"\n            aria-expanded={showMinimised}\n            aria-controls={id}\n        >\n            <ToggleButtonLabel\n                forwardedAs=\"span\"\n                weight=\"semibold\"\n                data-testid=\"toggle-button-label\"\n            >\n                {showMinimised\n                    ? customLabels?.viewLess || \"View less\"\n                    : customLabels?.viewMore || \"View more\"}\n            </ToggleButtonLabel>\n            {showMinimised ? (\n                <ViewLessIcon aria-hidden />\n            ) : (\n                <ViewMoreIcon aria-hidden />\n            )}\n        </ToggleButton>\n    );\n\n    // React spring animation configuration\n    const expandableStyles = useSpring({\n        height: showMinimised ? resizeDetector.height : 0,\n    });\n\n    return (\n        <>\n            <LinkListItems\n                data-testid=\"link-list-items-shown\"\n                items={maxShown ? items.slice(0, maxShown) : items}\n                handleItemClick={handleListItemClick}\n                style={style}\n            />\n            {itemsMinimised.length > 0 && (\n                <Expandable\n                    id={id}\n                    style={expandableStyles}\n                    data-testid=\"minimised-content\"\n                    inert={inertValue(!showMinimised)}\n                >\n                    <ExpandableChild ref={childRef} $border>\n                        <LinkListItems\n                            data-testid=\"link-list-items-minimised\"\n                            style={style}\n                            items={itemsMinimised}\n                            handleItemClick={handleListItemClick}\n                        />\n                    </ExpandableChild>\n                </Expandable>\n            )}\n            {itemsMinimised.length > 0 && renderToggle()}\n        </>\n    );\n};\n"],"names":["items","maxShown","style","onItemClick","customLabels","showMinimised","setShowMinimised","useState","length","itemsMinimised","slice","resizeDetector","useResizeDetector","childRef","ref","id","SimpleIdGenerator","generate","handleListItemClick","event","item","onClick","preventDefault","handleToggleButtonClick","expandableStyles","useSpring","height","_jsxs","_jsx","LinkListItems","handleItemClick","Expandable","inert","inertValue","children","ExpandableChild","ToggleButton","type","ToggleButtonLabel","forwardedAs","weight","viewLess","viewMore","ViewLessIcon","ViewMoreIcon"],"mappings":"+dAwB6B,EACzBA,QACAC,WACAC,QACAC,cACAC,mBAKA,MAAOC,EAAeC,GAAoBC,EAAAA,UACtCN,GAAWA,GAAYD,EAAMQ,QAG3BC,EAAiBR,EAAWD,EAAMU,MAAMT,GAAY,GAEpDU,EAAiBC,EAAAA,oBACjBC,EAAWF,EAAeG,KAEzBC,GAAMR,EAAAA,UAAS,IAAMS,EAAAA,kBAAkBC,aAKxCC,EAAsB,CACxBC,EACAC,KAMIA,EAAKC,SACLF,EAAMG,iBACNF,EAAKC,QAAQF,IACNhB,IACPgB,EAAMG,iBACNnB,EAAYiB,EAAMD,GACtB,EAKEI,EAA0B,KAC5BjB,GAAkBD,EAAc,EAgC9BmB,EAAmBC,EAAAA,UAAU,CAC/BC,OAAQrB,EAAgBM,EAAee,OAAS,IAGpD,OACIC,EAAAA,2BACIC,EAAAA,IAACC,EAAAA,6BACe,wBACZ7B,MAAOC,EAAWD,EAAMU,MAAM,EAAGT,GAAYD,EAC7C8B,gBAAiBZ,EACjBhB,MAAOA,IAEVO,EAAeD,OAAS,GACrBoB,EAAAA,IAACG,EAAAA,WAAU,CACPhB,GAAIA,EACJb,MAAOsB,EAAgB,cACX,oBACZQ,MAAOC,EAAAA,YAAY5B,GAAc6B,SAEjCN,EAAAA,IAACO,EAAAA,gBAAe,CAACrB,IAAKD,sBAClBe,EAAAA,IAACC,EAAAA,cAAa,CAAA,cACE,4BACZ3B,MAAOA,EACPF,MAAOS,EACPqB,gBAAiBZ,QAKhCT,EAAeD,OAAS,GAtD7BmB,OAACS,EAAAA,aAAY,CACTC,KAAK,SACLhB,QAASE,EAAuB,cACpB,gBAAe,gBACZlB,kBACAU,EAAEmB,SAAA,CAEjBN,EAAAA,IAACU,EAAAA,mBACGC,YAAY,OACZC,OAAO,WAAU,cACL,+BAEXnC,GACKD,eAAAA,EAAcqC,WAAY,aAC1BrC,aAAY,EAAZA,EAAcsC,WAAY,cAEnCrC,EACGuB,EAAAA,IAACe,eAAY,CAAA,eAAA,IAEbf,MAACgB,EAAAA,aAAY,CAAA,eAAA,SAoClB"}
+{"version":3,"file":"link-list-eager.js","sources":["../../../../src/link-list/components/link-list-eager.tsx"],"sourcesContent":["import { useSpring } from \"@react-spring/web\";\nimport type React from \"react\";\nimport { useState } from \"react\";\nimport { useResizeDetector } from \"react-resize-detector\";\n\nimport { inertValue } from \"../../shared/accessibility\";\nimport { useId } from \"../../util\";\nimport type {\n    BaseProps,\n    LinkListEagerProps,\n    LinkListItemProps,\n} from \"../internal-types\";\nimport {\n    Expandable,\n    ExpandableChild,\n    ToggleButton,\n    ToggleButtonLabel,\n    ViewLessIcon,\n    ViewMoreIcon,\n} from \"../link-list.styles\";\nimport { LinkListItems } from \"./common\";\n\ntype Props<T> = Omit<BaseProps<T>, \"className\" | \"data-testid\"> &\n    Omit<LinkListEagerProps, \"loadMode\">;\nexport const EagerLinkList = <T,>({\n    items,\n    maxShown,\n    style,\n    onItemClick,\n    customLabels,\n}: Props<T>) => {\n    // =============================================================================\n    // CONST, STATE, REFS\n    // =============================================================================\n    const [showMinimised, setShowMinimised] = useState<boolean>(\n        maxShown ? maxShown >= items.length : true\n    );\n\n    const itemsMinimised = maxShown ? items.slice(maxShown) : [];\n\n    const resizeDetector = useResizeDetector();\n    const childRef = resizeDetector.ref;\n\n    const id = useId();\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleListItemClick = (\n        event: React.MouseEvent<HTMLAnchorElement>,\n        item: LinkListItemProps<T>\n    ) => {\n        /**\n         * Individual item's onClick will override\n         * the onItemClick callback\n         */\n        if (item.onClick) {\n            event.preventDefault();\n            item.onClick(event);\n        } else if (onItemClick) {\n            event.preventDefault();\n            onItemClick(item, event);\n        }\n\n        // Do nothing and let default event happen\n    };\n\n    const handleToggleButtonClick = () => {\n        setShowMinimised(!showMinimised);\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderToggle = () => (\n        <ToggleButton\n            type=\"button\"\n            onClick={handleToggleButtonClick}\n            data-testid=\"toggle-button\"\n            aria-expanded={showMinimised}\n            aria-controls={id}\n        >\n            <ToggleButtonLabel\n                forwardedAs=\"span\"\n                weight=\"semibold\"\n                data-testid=\"toggle-button-label\"\n            >\n                {showMinimised\n                    ? customLabels?.viewLess || \"View less\"\n                    : customLabels?.viewMore || \"View more\"}\n            </ToggleButtonLabel>\n            {showMinimised ? (\n                <ViewLessIcon aria-hidden />\n            ) : (\n                <ViewMoreIcon aria-hidden />\n            )}\n        </ToggleButton>\n    );\n\n    // React spring animation configuration\n    const expandableStyles = useSpring({\n        height: showMinimised ? resizeDetector.height : 0,\n    });\n\n    return (\n        <>\n            <LinkListItems\n                data-testid=\"link-list-items-shown\"\n                items={maxShown ? items.slice(0, maxShown) : items}\n                handleItemClick={handleListItemClick}\n                style={style}\n            />\n            {itemsMinimised.length > 0 && (\n                <Expandable\n                    id={id}\n                    style={expandableStyles}\n                    data-testid=\"minimised-content\"\n                    inert={inertValue(!showMinimised)}\n                >\n                    <ExpandableChild ref={childRef} $border>\n                        <LinkListItems\n                            data-testid=\"link-list-items-minimised\"\n                            style={style}\n                            items={itemsMinimised}\n                            handleItemClick={handleListItemClick}\n                        />\n                    </ExpandableChild>\n                </Expandable>\n            )}\n            {itemsMinimised.length > 0 && renderToggle()}\n        </>\n    );\n};\n"],"names":["items","maxShown","style","onItemClick","customLabels","showMinimised","setShowMinimised","useState","length","itemsMinimised","slice","resizeDetector","useResizeDetector","childRef","ref","id","useId","handleListItemClick","event","item","onClick","preventDefault","handleToggleButtonClick","expandableStyles","useSpring","height","_jsxs","_jsx","LinkListItems","handleItemClick","Expandable","inert","inertValue","children","ExpandableChild","ToggleButton","type","ToggleButtonLabel","forwardedAs","weight","viewLess","viewMore","ViewLessIcon","ViewMoreIcon"],"mappings":"qgBAwB6B,EACzBA,QACAC,WACAC,QACAC,cACAC,mBAKA,MAAOC,EAAeC,GAAoBC,EAAAA,UACtCN,GAAWA,GAAYD,EAAMQ,QAG3BC,EAAiBR,EAAWD,EAAMU,MAAMT,GAAY,GAEpDU,EAAiBC,EAAAA,oBACjBC,EAAWF,EAAeG,IAE1BC,EAAKC,EAAAA,QAKLC,EAAsB,CACxBC,EACAC,KAMIA,EAAKC,SACLF,EAAMG,iBACNF,EAAKC,QAAQF,IACNf,IACPe,EAAMG,iBACNlB,EAAYgB,EAAMD,GACtB,EAKEI,EAA0B,KAC5BhB,GAAkBD,EAAc,EAgC9BkB,EAAmBC,EAAAA,UAAU,CAC/BC,OAAQpB,EAAgBM,EAAec,OAAS,IAGpD,OACIC,EAAAA,2BACIC,EAAAA,IAACC,EAAAA,6BACe,wBACZ5B,MAAOC,EAAWD,EAAMU,MAAM,EAAGT,GAAYD,EAC7C6B,gBAAiBZ,EACjBf,MAAOA,IAEVO,EAAeD,OAAS,GACrBmB,EAAAA,IAACG,EAAAA,WAAU,CACPf,GAAIA,EACJb,MAAOqB,EAAgB,cACX,oBACZQ,MAAOC,EAAAA,YAAY3B,GAAc4B,SAEjCN,EAAAA,IAACO,EAAAA,gBAAe,CAACpB,IAAKD,sBAClBc,EAAAA,IAACC,EAAAA,cAAa,CAAA,cACE,4BACZ1B,MAAOA,EACPF,MAAOS,EACPoB,gBAAiBZ,QAKhCR,EAAeD,OAAS,GAtD7BkB,OAACS,EAAAA,aAAY,CACTC,KAAK,SACLhB,QAASE,EAAuB,cACpB,gBAAe,gBACZjB,kBACAU,EAAEkB,SAAA,CAEjBN,EAAAA,IAACU,EAAAA,mBACGC,YAAY,OACZC,OAAO,WAAU,cACL,+BAEXlC,GACKD,eAAAA,EAAcoC,WAAY,aAC1BpC,aAAY,EAAZA,EAAcqC,WAAY,cAEnCpC,EACGsB,EAAAA,IAACe,eAAY,CAAA,eAAA,IAEbf,MAACgB,EAAAA,aAAY,CAAA,eAAA,SAoClB"}