@lifesg/react-design-system 3.5.0-canary.7 → 4.0.0-alpha.10

package/cjs/tab/tab-link-chain.styles_49got4.css

@@ -0,0 +1,14 @@
+@layer fds{.c16oikpn{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:100%;list-style-type:none;}
+.c2536gp::after{content:"";height:inherit;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;border-bottom:var(--fds-border-width-040) var(--fds-border-style-solid) var(--fds-colour-border);}
+.c1c3wbud{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-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;border-bottom:var(--fds-border-width-040) var(--fds-border-style-solid) var(--fds-colour-border);--fds-internal-tab-chainItem-width:initial;width:var(--fds-internal-tab-chainItem-width, auto);}:where(body.fds-breakpoint-sm-max) .c1c3wbud{-webkit-flex:1;-ms-flex:1;flex:1;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}
+.cdfiwt{border-color:var(--fds-colour-border-primary);}
+.fxd8c9t{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
+.c1gdrjx{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;gap:0.5rem;padding:var(--fds-spacing-16) var(--fds-spacing-16) var(--fds-spacing-20);cursor:pointer;width:100%;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}.c1gdrjx:focus-within{outline:2px solid var(--fds-colour-focus-ring);outline-offset:-2px;border-radius:var(--fds-radius-sm);}
+.cj41vce{-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;}
+.lmiq2g0{position:relative;}
+.l1yi6azs{border:none;background:none;}:where(body.fds-breakpoint-sm-max) .l1yi6azs{max-width:20ch;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
+.d97pn0z{position:absolute;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-subtler);opacity:1;}
+.d1v8j9lw{opacity:0;}
+.s5l4m4t{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-baseline);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-baseline);letter-spacing:var(--fds-font-body-ls-baseline);color:var(--fds-colour-text-primary);opacity:0;outline:none;}:where(body.fds-breakpoint-sm-max) .s5l4m4t{max-width:20ch;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
+.shqgesl{opacity:1;}
+.c1r7bbxk [data-id="left-fade-indicator-button"],.c1r7bbxk [data-id="right-fade-indicator-button"]{margin-bottom:var(--fds-spacing-4);}}

package/cjs/tab/tab-list.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react");require("../util/calendar-helper.js"),require("../util/date-helper.js"),require("../util/date-input-helper.js"),require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var r=require("../util/use-isomorphic-layout-effect.js"),i=require("./tab-context.js"),o=require("./tab-link-chain.js");const a=({children:a,fullWidthIndicatorLine:n,fadeColor:s,"data-testid":l})=>{const{setTabLinks:d,controlledMode:u,onTabClick:c,isContextProvided:p}=t.useContext(i.TabContext),b=t.useMemo((()=>t.Children.toArray(a).filter(Boolean).map((({props:e})=>({title:e.title,width:e.width,titleAddon:e.titleAddon})))),[a]);return r.useIsomorphicLayoutEffect((()=>{d(b)}),[d,b]),t.useEffect((()=>{"production"===process.env.NODE_ENV||p||console.error("Tab.TabList must be rendered inside Tab.Context.")}),[p]),e.jsx(o.TabLinkChain,{controlledMode:u,onTabClick:c,"data-testid":l,fullWidthIndicatorLine:n,fadeColor:s})};a.displayName="Tab.TabList",exports.TabList=a;
+"use strict";var e=require("react/jsx-runtime"),t=require("react");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 r=require("../util/use-isomorphic-layout-effect.js"),i=require("./tab-context.js"),a=require("./tab-link-chain.js");const o=({children:o,fullWidthIndicatorLine:n,fadeColor:s,"data-testid":l})=>{const{setTabLinks:d,controlledMode:u,onTabClick:c,isContextProvided:b}=t.useContext(i.TabContext),h=t.useMemo((()=>t.Children.toArray(o).filter(Boolean).map((({props:e})=>({title:e.title,width:e.width,titleAddon:e.titleAddon})))),[o]);return r.useIsomorphicLayoutEffect((()=>{d(h)}),[d,h]),t.useEffect((()=>{"production"===process.env.NODE_ENV||b||console.error("Tab.TabList must be rendered inside Tab.Context.")}),[b]),e.jsx(a.TabLinkChain,{controlledMode:u,onTabClick:c,"data-testid":l,fullWidthIndicatorLine:n,fadeColor:s})};o.displayName="Tab.TabList",exports.TabList=o;
 //# sourceMappingURL=tab-list.js.map

package/cjs/tab/tab-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab-list.js","sources":["../../../src/tab/tab-list.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { Children, useContext, useEffect, useMemo } from \"react\";\n\nimport { useIsomorphicLayoutEffect } from \"../util\";\nimport type { TabLinkProps } from \"./tab-context\";\nimport { TabContext } from \"./tab-context\";\nimport { TabLinkChain } from \"./tab-link-chain\";\nimport type { TabListItemProps, TabListProps } from \"./types\";\n\nexport const TabList = ({\n    children,\n    fullWidthIndicatorLine,\n    fadeColor,\n    \"data-testid\": testId,\n}: TabListProps) => {\n    // =========================================================================\n    // CONST, STATE, REFS\n    // =========================================================================\n    const { setTabLinks, controlledMode, onTabClick, isContextProvided } =\n        useContext(TabContext);\n\n    const tabLinks = useMemo(() => {\n        return (\n            Children.toArray(children).filter(\n                Boolean\n            ) as ReactElement<TabListItemProps>[]\n        ).map(({ props }) => ({\n            title: props.title,\n            width: props.width,\n            titleAddon: props.titleAddon,\n        })) as TabLinkProps[];\n    }, [children]);\n\n    // =========================================================================\n    // EFFECTS\n    // =========================================================================\n    useIsomorphicLayoutEffect(() => {\n        setTabLinks(tabLinks);\n    }, [setTabLinks, tabLinks]);\n\n    useEffect(() => {\n        if (process.env.NODE_ENV !== \"production\" && !isContextProvided) {\n            console.error(\"Tab.TabList must be rendered inside Tab.Context.\");\n        }\n    }, [isContextProvided]);\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    return (\n        <TabLinkChain\n            controlledMode={controlledMode}\n            onTabClick={onTabClick}\n            data-testid={testId}\n            fullWidthIndicatorLine={fullWidthIndicatorLine}\n            fadeColor={fadeColor}\n        />\n    );\n};\n\nTabList.displayName = \"Tab.TabList\";\n"],"names":["TabList","children","fullWidthIndicatorLine","fadeColor","testId","setTabLinks","controlledMode","onTabClick","isContextProvided","useContext","TabContext","tabLinks","useMemo","Children","toArray","filter","Boolean","map","props","title","width","titleAddon","useIsomorphicLayoutEffect","useEffect","process","env","NODE_ENV","console","error","_jsx","TabLinkChain","displayName"],"mappings":"+ZASO,MAAMA,EAAU,EACnBC,WACAC,yBACAC,YACA,cAAeC,MAKf,MAAMC,YAAEA,EAAWC,eAAEA,EAAcC,WAAEA,EAAUC,kBAAEA,GAC7CC,EAAAA,WAAWC,cAETC,EAAWC,EAAAA,SAAQ,IAEjBC,EAAAA,SAASC,QAAQb,GAAUc,OACvBC,SAENC,KAAI,EAAGC,YAAO,CACZC,MAAOD,EAAMC,MACbC,MAAOF,EAAME,MACbC,WAAYH,EAAMG,gBAEvB,CAACpB,IAkBJ,OAbAqB,EAAAA,2BAA0B,KACtBjB,EAAYM,EAAS,GACtB,CAACN,EAAaM,IAEjBY,EAAAA,WAAU,KACuB,eAAzBC,QAAQC,IAAIC,UAA8BlB,GAC1CmB,QAAQC,MAAM,mDAClB,GACD,CAACpB,IAMAqB,EAAAA,IAACC,EAAAA,aAAY,CACTxB,eAAgBA,EAChBC,WAAYA,gBACCH,EACbF,uBAAwBA,EACxBC,UAAWA,GACb,EAIVH,EAAQ+B,YAAc"}
+{"version":3,"file":"tab-list.js","sources":["../../../src/tab/tab-list.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { Children, useContext, useEffect, useMemo } from \"react\";\n\nimport { useIsomorphicLayoutEffect } from \"../util\";\nimport type { TabLinkProps } from \"./tab-context\";\nimport { TabContext } from \"./tab-context\";\nimport { TabLinkChain } from \"./tab-link-chain\";\nimport type { TabListItemProps, TabListProps } from \"./types\";\n\nexport const TabList = ({\n    children,\n    fullWidthIndicatorLine,\n    fadeColor,\n    \"data-testid\": testId,\n}: TabListProps) => {\n    // =========================================================================\n    // CONST, STATE, REFS\n    // =========================================================================\n    const { setTabLinks, controlledMode, onTabClick, isContextProvided } =\n        useContext(TabContext);\n\n    const tabLinks = useMemo(() => {\n        return (\n            Children.toArray(children).filter(\n                Boolean\n            ) as ReactElement<TabListItemProps>[]\n        ).map(({ props }) => ({\n            title: props.title,\n            width: props.width,\n            titleAddon: props.titleAddon,\n        })) as TabLinkProps[];\n    }, [children]);\n\n    // =========================================================================\n    // EFFECTS\n    // =========================================================================\n    useIsomorphicLayoutEffect(() => {\n        setTabLinks(tabLinks);\n    }, [setTabLinks, tabLinks]);\n\n    useEffect(() => {\n        if (process.env.NODE_ENV !== \"production\" && !isContextProvided) {\n            console.error(\"Tab.TabList must be rendered inside Tab.Context.\");\n        }\n    }, [isContextProvided]);\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    return (\n        <TabLinkChain\n            controlledMode={controlledMode}\n            onTabClick={onTabClick}\n            data-testid={testId}\n            fullWidthIndicatorLine={fullWidthIndicatorLine}\n            fadeColor={fadeColor}\n        />\n    );\n};\n\nTabList.displayName = \"Tab.TabList\";\n"],"names":["TabList","children","fullWidthIndicatorLine","fadeColor","testId","setTabLinks","controlledMode","onTabClick","isContextProvided","useContext","TabContext","tabLinks","useMemo","Children","toArray","filter","Boolean","map","props","title","width","titleAddon","useIsomorphicLayoutEffect","useEffect","process","env","NODE_ENV","console","error","_jsx","TabLinkChain","displayName"],"mappings":"+XASO,MAAMA,EAAU,EACnBC,WACAC,yBACAC,YACA,cAAeC,MAKf,MAAMC,YAAEA,EAAWC,eAAEA,EAAcC,WAAEA,EAAUC,kBAAEA,GAC7CC,EAAAA,WAAWC,cAETC,EAAWC,EAAAA,SAAQ,IAEjBC,EAAAA,SAASC,QAAQb,GAAUc,OACvBC,SAENC,KAAI,EAAGC,YAAO,CACZC,MAAOD,EAAMC,MACbC,MAAOF,EAAME,MACbC,WAAYH,EAAMG,gBAEvB,CAACpB,IAkBJ,OAbAqB,EAAAA,2BAA0B,KACtBjB,EAAYM,EAAS,GACtB,CAACN,EAAaM,IAEjBY,EAAAA,WAAU,KACuB,eAAzBC,QAAQC,IAAIC,UAA8BlB,GAC1CmB,QAAQC,MAAM,mDAClB,GACD,CAACpB,IAMAqB,EAAAA,IAACC,EAAAA,aAAY,CACTxB,eAAgBA,EAChBC,WAAYA,gBACCH,EACbF,uBAAwBA,EACxBC,UAAWA,GACb,EAIVH,EAAQ+B,YAAc"}

package/cjs/tab/tab.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react");require("../util/calendar-helper.js"),require("../util/date-helper.js"),require("../util/date-input-helper.js");var i=require("../util/simple-id-generator.js");require("../util/string-helper.js"),require("@react-aria/live-announcer");var a=require("./tab-context.js"),n=require("./tab-context-provider.js"),s=require("./tab-item.js"),l=require("./tab-link-chain.js"),o=require("./tab-list.js"),d=require("./tab-list-item.js"),u=require("./tab-panel.js"),c=require("./tab.style.js");const b=n=>{var{children:s,currentActive:o,initialActive:d=0,onTabClick:u,"data-testid":b,fullWidthIndicatorLine:p,fadeColor:j}=n,h=e.__rest(n,["children","currentActive","initialActive","onTabClick","data-testid","fullWidthIndicatorLine","fadeColor"]);const[m,q]=r.useState(o||d),v=i.useId(),T=r.useMemo((()=>r.Children.toArray(s).filter(Boolean).map((e=>({title:e.props.title,width:e.props.width,titleAddon:e.props.titleAddon})))),[s]),C=r.useMemo((()=>({instanceId:v,tabLinks:T,currentActiveIndex:m,setCurrentActiveIndex:q,setTabLinks:a.noop,controlledMode:"number"==typeof o,onTabClick:u,isContextProvided:!0})),[m,o,v,u,T]);r.useEffect((()=>{"number"==typeof o&&q(o)}),[o]);return t.jsx(c.Wrapper,Object.assign({"data-testid":b},h,{children:t.jsxs(a.TabContext.Provider,{value:C,children:[t.jsx(l.TabLinkChain,{controlledMode:"number"==typeof o,onTabClick:u,"data-testid":`${b}-tabs`,fullWidthIndicatorLine:p,fadeColor:j}),r.Children.toArray(s).filter(Boolean).map(((e,t)=>r.cloneElement(e,{key:t,index:t})))]})}))};b.displayName="Tab";const p=Object.assign(b,{Item:s.TabItem,Context:n.TabContextProvider,TabList:o.TabList,TabListItem:d.TabListItem,Panel:u.TabPanel});exports.Tab=p;
+"use strict";var e=require("../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("clsx"),i=require("react");require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js");var a=require("../util/simple-id-generator.js");require("../util/string-helper.js"),require("@react-aria/live-announcer");var n=require("./tab.styles.js"),s=require("./tab-context.js"),l=require("./tab-context-provider.js"),o=require("./tab-item.js"),d=require("./tab-link-chain.js"),u=require("./tab-list.js"),c=require("./tab-list-item.js"),b=require("./tab-panel.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var j=p(r);const m=r=>{var{children:l,currentActive:o,initialActive:u=0,onTabClick:c,"data-testid":b,className:p,fullWidthIndicatorLine:m,fadeColor:v}=r,f=e.__rest(r,["children","currentActive","initialActive","onTabClick","data-testid","className","fullWidthIndicatorLine","fadeColor"]);const[q,x]=i.useState(o||u),T=a.useId(),h=i.useMemo((()=>i.Children.toArray(l).filter(Boolean).map((e=>({title:e.props.title,width:e.props.width,titleAddon:e.props.titleAddon})))),[l]),C=i.useMemo((()=>({instanceId:T,tabLinks:h,currentActiveIndex:q,setCurrentActiveIndex:x,setTabLinks:s.noop,controlledMode:"number"==typeof o,onTabClick:c,isContextProvided:!0})),[q,o,T,c,h]);i.useEffect((()=>{"number"==typeof o&&x(o)}),[o]);return t.jsx("div",Object.assign({"data-testid":b,className:j.default(n.wrapper,p)},f,{children:t.jsxs(s.TabContext.Provider,{value:C,children:[t.jsx(d.TabLinkChain,{controlledMode:"number"==typeof o,onTabClick:c,"data-testid":`${b}-tabs`,fullWidthIndicatorLine:m,fadeColor:v}),i.Children.toArray(l).filter(Boolean).map(((e,t)=>{var r;const a=e;return i.cloneElement(e,{key:null!==(r=a.key)&&void 0!==r?r:a.props.title,index:t})}))]})}))};m.displayName="Tab";const v=Object.assign(m,{Item:o.TabItem,Context:l.TabContextProvider,TabList:u.TabList,TabListItem:c.TabListItem,Panel:b.TabPanel});exports.Tab=v;
 //# sourceMappingURL=tab.js.map

package/cjs/tab/tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.js","sources":["../../../src/tab/tab.tsx"],"sourcesContent":["import {\n    Children,\n    ReactElement,\n    cloneElement,\n    useEffect,\n    useMemo,\n    useState,\n} from \"react\";\nimport { useId } from \"../util\";\nimport { TabContext, TabLinkProps, noop } from \"./tab-context\";\nimport { TabContextProvider } from \"./tab-context-provider\";\nimport { TabItem } from \"./tab-item\";\nimport { TabLinkChain } from \"./tab-link-chain\";\nimport { TabList } from \"./tab-list\";\nimport { TabListItem } from \"./tab-list-item\";\nimport { TabPanel } from \"./tab-panel\";\nimport { Wrapper } from \"./tab.style\";\nimport { TabItemProps, TabProps } from \"./types\";\n\nconst TabBase = ({\n    children,\n    currentActive: currentActiveIndex,\n    initialActive = 0,\n    onTabClick,\n    \"data-testid\": testId,\n    fullWidthIndicatorLine,\n    fadeColor,\n    ...otherProps\n}: TabProps) => {\n    // =========================================================================\n    // CONST, STATE, REFS\n    // =========================================================================\n    const [currentActive, setCurrentActive] = useState<number>(\n        currentActiveIndex || initialActive\n    );\n\n    const instanceId = useId();\n\n    const tabLinks = useMemo(() => {\n        const validChildren = Children.toArray(children).filter(\n            Boolean\n        ) as ReactElement<TabItemProps>[];\n\n        return validChildren.map((child) => {\n            return {\n                title: child.props.title,\n                width: child.props.width,\n                titleAddon: child.props.titleAddon,\n            };\n        }) as TabLinkProps[];\n    }, [children]);\n\n    const tabContextValue = useMemo(\n        () => ({\n            instanceId,\n            tabLinks,\n            currentActiveIndex: currentActive,\n            setCurrentActiveIndex: setCurrentActive,\n            setTabLinks: noop,\n            controlledMode: typeof currentActiveIndex === \"number\",\n            onTabClick,\n            isContextProvided: true,\n        }),\n        [currentActive, currentActiveIndex, instanceId, onTabClick, tabLinks]\n    );\n\n    // =========================================================================\n    // Effects\n    // =========================================================================\n    useEffect(() => {\n        if (typeof currentActiveIndex === \"number\") {\n            setCurrentActive(currentActiveIndex);\n        }\n    }, [currentActiveIndex]);\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    const renderChildren = () => {\n        const validChildren = Children.toArray(children).filter(Boolean);\n\n        return validChildren.map((child, index) => {\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            return cloneElement(child as ReactElement<any>, {\n                key: index,\n                index,\n            });\n        });\n    };\n\n    return (\n        <Wrapper data-testid={testId} {...otherProps}>\n            <TabContext.Provider value={tabContextValue}>\n                <TabLinkChain\n                    controlledMode={typeof currentActiveIndex === \"number\"}\n                    onTabClick={onTabClick}\n                    data-testid={`${testId}-tabs`}\n                    fullWidthIndicatorLine={fullWidthIndicatorLine}\n                    fadeColor={fadeColor}\n                />\n                {renderChildren()}\n            </TabContext.Provider>\n        </Wrapper>\n    );\n};\n\nTabBase.displayName = \"Tab\";\n\n// =============================================================================\n// EXPORTS\n// =============================================================================\n/**\n * A tabbed-panel layout that switches visible content by selecting a tab link.\n *\n * Use `Tab` to organise content into labelled panels where only one panel is\n * visible at a time. Compose with `Tab.Item` to define each panel.\n *\n * For cases where the tab bar and panels need to be positioned independently,\n * use the standalone composition: `Tab.Context`, `Tab.TabList`,\n * `Tab.TabListItem`, and `Tab.Panel`.\n */\nexport const Tab = Object.assign(TabBase, {\n    /** Renders an individual content panel within a `Tab`. Inactive items are unmounted — inner state is not preserved across tab switches. */\n    Item: TabItem,\n    /** Context provider for the standalone TabList + Panel composition. */\n    Context: TabContextProvider,\n    /** Renders the tab link bar within a `Tab.Context`. */\n    TabList,\n    /** Declares a tab entry inside a `Tab.TabList`. */\n    TabListItem,\n    /** Renders a content panel within a `Tab.Context`. Inactive panels are unmounted — inner state is not preserved across tab switches. */\n    Panel: TabPanel,\n});\n"],"names":["TabBase","_a","children","currentActive","currentActiveIndex","initialActive","onTabClick","testId","fullWidthIndicatorLine","fadeColor","otherProps","__rest","setCurrentActive","useState","instanceId","useId","tabLinks","useMemo","Children","toArray","filter","Boolean","map","child","title","props","width","titleAddon","tabContextValue","setCurrentActiveIndex","setTabLinks","noop","controlledMode","isContextProvided","useEffect","_jsx","Wrapper","Object","assign","_jsxs","TabContext","Provider","value","TabLinkChain","index","cloneElement","key","displayName","Tab","Item","TabItem","Context","TabContextProvider","TabList","TabListItem","Panel","TabPanel"],"mappings":"wkBAmBA,MAAMA,EAAWC,QAAAC,SACbA,EACAC,cAAeC,EAAkBC,cACjCA,EAAgB,EAACC,WACjBA,EACA,cAAeC,EAAMC,uBACrBA,EAAsBC,UACtBA,KACGC,EAAUC,EAAAA,OAAAV,EARA,CAAA,WAAA,gBAAA,gBAAA,aAAA,cAAA,yBAAA,cAab,MAAOE,EAAeS,GAAoBC,EAAAA,SACtCT,GAAsBC,GAGpBS,EAAaC,EAAAA,QAEbC,EAAWC,EAAAA,SAAQ,IACCC,EAAAA,SAASC,QAAQjB,GAAUkB,OAC7CC,SAGiBC,KAAKC,IACf,CACHC,MAAOD,EAAME,MAAMD,MACnBE,MAAOH,EAAME,MAAMC,MACnBC,WAAYJ,EAAME,MAAME,gBAGjC,CAACzB,IAEE0B,EAAkBX,EAAAA,SACpB,KAAA,CACIH,aACAE,WACAZ,mBAAoBD,EACpB0B,sBAAuBjB,EACvBkB,YAAaC,EAAAA,KACbC,eAA8C,iBAAvB5B,EACvBE,aACA2B,mBAAmB,KAEvB,CAAC9B,EAAeC,EAAoBU,EAAYR,EAAYU,IAMhEkB,EAAAA,WAAU,KAC4B,iBAAvB9B,GACPQ,EAAiBR,EACrB,GACD,CAACA,IAiBJ,OACI+B,EAAAA,IAACC,EAAAA,QAAOC,OAAAC,OAAA,CAAA,cAAc/B,GAAYG,EAAU,CAAAR,SACxCqC,OAACC,EAAAA,WAAWC,SAAQ,CAACC,MAAOd,EAAe1B,SAAA,CACvCiC,EAAAA,IAACQ,EAAAA,aAAY,CACTX,eAA8C,iBAAvB5B,EACvBE,WAAYA,gBACC,GAAGC,SAChBC,uBAAwBA,EACxBC,UAAWA,IAnBDS,EAAAA,SAASC,QAAQjB,GAAUkB,OAAOC,SAEnCC,KAAI,CAACC,EAAOqB,IAEtBC,EAAAA,aAAatB,EAA4B,CAC5CuB,IAAKF,EACLA,iBAiBE,EAIlB5C,EAAQ+C,YAAc,YAeTC,EAAMX,OAAOC,OAAOtC,EAAS,CAEtCiD,KAAMC,EAAAA,QAENC,QAASC,EAAAA,2BAETC,EAAAA,oBAEAC,EAAAA,YAEAC,MAAOC,EAAAA"}
+{"version":3,"file":"tab.js","sources":["../../../src/tab/tab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type { ReactElement } from \"react\";\nimport { Children, cloneElement, useEffect, useMemo, useState } from \"react\";\n\nimport { useId } from \"../util\";\nimport * as styles from \"./tab.styles\";\nimport type { TabLinkProps } from \"./tab-context\";\nimport { noop, TabContext } from \"./tab-context\";\nimport { TabContextProvider } from \"./tab-context-provider\";\nimport { TabItem } from \"./tab-item\";\nimport { TabLinkChain } from \"./tab-link-chain\";\nimport { TabList } from \"./tab-list\";\nimport { TabListItem } from \"./tab-list-item\";\nimport { TabPanel } from \"./tab-panel\";\nimport type { TabItemProps, TabProps } from \"./types\";\n\nconst TabBase = ({\n    children,\n    currentActive: currentActiveIndex,\n    initialActive = 0,\n    onTabClick,\n    \"data-testid\": testId,\n    className,\n    fullWidthIndicatorLine,\n    fadeColor,\n    ...otherProps\n}: TabProps) => {\n    // =========================================================================\n    // CONST, STATE, REFS\n    // =========================================================================\n    const [currentActive, setCurrentActive] = useState<number>(\n        currentActiveIndex || initialActive\n    );\n\n    const instanceId = useId();\n\n    const tabLinks = useMemo(() => {\n        const validChildren = Children.toArray(children).filter(\n            Boolean\n        ) as ReactElement<TabItemProps>[];\n\n        return validChildren.map((child) => {\n            return {\n                title: child.props.title,\n                width: child.props.width,\n                titleAddon: child.props.titleAddon,\n            };\n        }) as TabLinkProps[];\n    }, [children]);\n\n    const tabContextValue = useMemo(\n        () => ({\n            instanceId,\n            tabLinks,\n            currentActiveIndex: currentActive,\n            setCurrentActiveIndex: setCurrentActive,\n            setTabLinks: noop,\n            controlledMode: typeof currentActiveIndex === \"number\",\n            onTabClick,\n            isContextProvided: true,\n        }),\n        [currentActive, currentActiveIndex, instanceId, onTabClick, tabLinks]\n    );\n\n    // =========================================================================\n    // Effects\n    // =========================================================================\n    useEffect(() => {\n        if (typeof currentActiveIndex === \"number\") {\n            setCurrentActive(currentActiveIndex);\n        }\n    }, [currentActiveIndex]);\n\n    // =========================================================================\n    // RENDER FUNCTIONS\n    // =========================================================================\n    const renderChildren = () => {\n        const validChildren = Children.toArray(children).filter(Boolean);\n\n        return validChildren.map((child, index) => {\n            const element = child as ReactElement<TabItemProps>;\n\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            return cloneElement(child as ReactElement<any>, {\n                key: element.key ?? element.props.title,\n                index,\n            });\n        });\n    };\n\n    return (\n        <div\n            data-testid={testId}\n            className={clsx(styles.wrapper, className)}\n            {...otherProps}\n        >\n            <TabContext.Provider value={tabContextValue}>\n                <TabLinkChain\n                    controlledMode={typeof currentActiveIndex === \"number\"}\n                    onTabClick={onTabClick}\n                    data-testid={`${testId}-tabs`}\n                    fullWidthIndicatorLine={fullWidthIndicatorLine}\n                    fadeColor={fadeColor}\n                />\n                {renderChildren()}\n            </TabContext.Provider>\n        </div>\n    );\n};\n\nTabBase.displayName = \"Tab\";\n\n// =============================================================================\n// EXPORTS\n// =============================================================================\n// @catalog\n/**\n * A tabbed-panel layout that switches visible content by selecting a tab link.\n *\n * Use `Tab` to organise content into labelled panels where only one panel is\n * visible at a time. Compose with `Tab.Item` to define each panel.\n *\n * For cases where the tab bar and panels need to be positioned independently,\n * use the standalone composition: `Tab.Context`, `Tab.TabList`,\n * `Tab.TabListItem`, and `Tab.Panel`.\n * @keywords navigation, panel, tabbed, tabs\n */\nexport const Tab = Object.assign(TabBase, {\n    /** Renders an individual content panel within a `Tab`. Inactive items are unmounted — inner state is not preserved across tab switches. */\n    Item: TabItem,\n    /** Context provider for the standalone TabList + Panel composition. */\n    Context: TabContextProvider,\n    /** Renders the tab link bar within a `Tab.Context`. */\n    TabList,\n    /** Declares a tab entry inside a `Tab.TabList`. */\n    TabListItem,\n    /** Renders a content panel within a `Tab.Context`. Inactive panels are unmounted — inner state is not preserved across tab switches. */\n    Panel: TabPanel,\n});\n"],"names":["TabBase","_a","children","currentActive","currentActiveIndex","initialActive","onTabClick","testId","className","fullWidthIndicatorLine","fadeColor","otherProps","__rest","setCurrentActive","useState","instanceId","useId","tabLinks","useMemo","Children","toArray","filter","Boolean","map","child","title","props","width","titleAddon","tabContextValue","setCurrentActiveIndex","setTabLinks","noop","controlledMode","isContextProvided","useEffect","_jsx","Object","assign","clsx","styles.wrapper","_jsxs","TabContext","Provider","value","TabLinkChain","index","element","cloneElement","key","displayName","Tab","Item","TabItem","Context","TabContextProvider","TabList","TabListItem","Panel","TabPanel"],"mappings":"8oBAgBA,MAAMA,EAAWC,QAAAC,SACbA,EACAC,cAAeC,EAAkBC,cACjCA,EAAgB,EAACC,WACjBA,EACA,cAAeC,EAAMC,UACrBA,EAASC,uBACTA,EAAsBC,UACtBA,GAAST,EACNU,EAAUC,EAAAA,OAAAX,EATA,CAAA,WAAA,gBAAA,gBAAA,aAAA,cAAA,YAAA,yBAAA,cAcb,MAAOE,EAAeU,GAAoBC,EAAAA,SACtCV,GAAsBC,GAGpBU,EAAaC,EAAAA,QAEbC,EAAWC,EAAAA,SAAQ,IACCC,EAAAA,SAASC,QAAQlB,GAAUmB,OAC7CC,SAGiBC,KAAKC,IACf,CACHC,MAAOD,EAAME,MAAMD,MACnBE,MAAOH,EAAME,MAAMC,MACnBC,WAAYJ,EAAME,MAAME,gBAGjC,CAAC1B,IAEE2B,EAAkBX,EAAAA,SACpB,KAAA,CACIH,aACAE,WACAb,mBAAoBD,EACpB2B,sBAAuBjB,EACvBkB,YAAaC,EAAAA,KACbC,eAA8C,iBAAvB7B,EACvBE,aACA4B,mBAAmB,KAEvB,CAAC/B,EAAeC,EAAoBW,EAAYT,EAAYW,IAMhEkB,EAAAA,WAAU,KAC4B,iBAAvB/B,GACPS,EAAiBT,EACrB,GACD,CAACA,IAmBJ,OACIgC,EAAAA,IAAA,MAAAC,OAAAC,OAAA,CAAA,cACiB/B,EACbC,UAAW+B,EAAAA,QAAKC,EAAAA,QAAgBhC,IAC5BG,EAAU,CAAAT,SAEduC,EAAAA,KAACC,EAAAA,WAAWC,SAAQ,CAACC,MAAOf,EAAe3B,SAAA,CACvCkC,EAAAA,IAACS,EAAAA,aAAY,CACTZ,eAA8C,iBAAvB7B,EACvBE,WAAYA,EAAU,cACT,GAAGC,SAChBE,uBAAwBA,EACxBC,UAAWA,IAzBDS,EAAAA,SAASC,QAAQlB,GAAUmB,OAAOC,SAEnCC,KAAI,CAACC,EAAOsB,WAC7B,MAAMC,EAAUvB,EAGhB,OAAOwB,EAAAA,aAAaxB,EAA4B,CAC5CyB,YAAKhD,EAAA8C,EAAQE,mBAAOF,EAAQrB,MAAMD,MAClCqB,SACF,SAoBA,EAId9C,EAAQkD,YAAc,YAiBTC,EAAMd,OAAOC,OAAOtC,EAAS,CAEtCoD,KAAMC,EAAAA,QAENC,QAASC,EAAAA,2BAETC,EAAAA,oBAEAC,EAAAA,YAEAC,MAAOC,EAAAA"}

package/cjs/tab/tab.styles.js

@@ -0,0 +1,2 @@
+"use strict";require("./tab.styles_1najffw.css");exports.wrapper="wchm9bj";
+//# sourceMappingURL=tab.styles.js.map

package/cjs/tab/tab.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab.styles.js","sources":["../../../src/tab/tab.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nexport const wrapper = css`\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n`;\n"],"names":[],"mappings":"oFAEoB"}

package/cjs/tab/tab.styles_1najffw.css

@@ -0,0 +1 @@
+@layer fds{.wchm9bj{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;width:100%;}}

package/cjs/table/table.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),l=require("./table.styles.js");const a=l=>{var{children:a}=l,s=e.__rest(l,["children"]);return r.jsx("thead",Object.assign({},s,{children:a}))};a.displayName="Table.Head";const s=a=>{var{children:s}=a,n=e.__rest(a,["children"]);return r.jsx(l.TableBody,Object.assign({},n,{children:s}))};s.displayName="Table.Body";const n=a=>{var{children:s}=a,n=e.__rest(a,["children"]);return r.jsx(l.BodyRow,Object.assign({},n,{children:s}))};n.displayName="Table.Row";const i=a=>{var{children:s}=a,n=e.__rest(a,["children"]);return r.jsx(l.BodyCell,Object.assign({},n,{children:s}))};i.displayName="Table.Cell";const t=a=>{var{children:s}=a,n=e.__rest(a,["children"]);return r.jsx(l.HeaderCell,Object.assign({},n,{children:s}))};t.displayName="Table.HeaderCell";const d=Object.assign((a=>{var{children:s}=a,n=e.__rest(a,["children"]);return r.jsx(l.TableWrapper,{children:r.jsx(l.TableComponent,Object.assign({},n,{children:s}))})}),{Container:l.TableWrapper,Table:l.TableComponent,Head:a,Body:s,Row:n,Cell:i,HeaderCell:t});exports.Table=d;
+"use strict";var e=require("../_virtual/_tslib.js"),a=require("react/jsx-runtime"),s=require("clsx"),l=require("./table.styles.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=r(s);const c=s=>{var{children:l}=s,r=e.__rest(s,["children"]);return a.jsx("thead",Object.assign({},r,{children:l}))};c.displayName="Table.Head";const n=s=>{var{children:r,className:c}=s,n=e.__rest(s,["children","className"]);return a.jsx("tbody",Object.assign({className:t.default(l.tableBody,c)},n,{children:r}))};n.displayName="Table.Body";const d=s=>{var{children:r,className:c}=s,n=e.__rest(s,["children","className"]);return a.jsx("tr",Object.assign({className:t.default(l.bodyRow,c)},n,{children:r}))};d.displayName="Table.Row";const i=s=>{var{children:r,className:c}=s,n=e.__rest(s,["children","className"]);return a.jsx("td",Object.assign({className:t.default(l.bodyCell,c)},n,{children:r}))};i.displayName="Table.Cell";const b=s=>{var{children:r,className:c}=s,n=e.__rest(s,["children","className"]);return a.jsx("th",Object.assign({className:t.default(l.headerCell,c)},n,{children:r}))};b.displayName="Table.HeaderCell";const h=s=>{var{children:r,className:c}=s,n=e.__rest(s,["children","className"]);return a.jsx("div",Object.assign({className:t.default(l.tableWrapper,c),"data-testid":"table-wrapper"},n,{children:r}))};h.displayName="Table.Container";const m=s=>{var{children:r,className:c}=s,n=e.__rest(s,["children","className"]);return a.jsx("table",Object.assign({className:t.default(l.tableComponent,c)},n,{children:r}))};m.displayName="Table.Table";const o=Object.assign((s=>{var{children:l}=s,r=e.__rest(s,["children"]);return a.jsx(h,{children:a.jsx(m,Object.assign({},r,{children:l}))})}),{Container:h,Table:m,Head:c,Body:n,Row:d,Cell:i,HeaderCell:b});exports.Table=o;
 //# sourceMappingURL=table.js.map

package/cjs/table/table.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.js","sources":["../../../src/table/table.tsx"],"sourcesContent":["import {\n    BodyCell,\n    BodyRow,\n    HeaderCell,\n    TableBody,\n    TableComponent,\n    TableWrapper,\n} from \"./table.styles\";\n\nconst Head = ({\n    children,\n    ...props\n}: React.HTMLAttributes<HTMLTableSectionElement>) => (\n    <thead {...props}>{children}</thead>\n);\nHead.displayName = \"Table.Head\";\n\nconst Body = ({\n    children,\n    ...props\n}: React.HTMLAttributes<HTMLTableSectionElement>) => (\n    <TableBody {...props}>{children}</TableBody>\n);\nBody.displayName = \"Table.Body\";\n\nconst Row = ({\n    children,\n    ...props\n}: React.HTMLAttributes<HTMLTableRowElement>) => (\n    <BodyRow {...props}>{children}</BodyRow>\n);\nRow.displayName = \"Table.Row\";\n\nconst Cell = ({\n    children,\n    ...props\n}: React.TdHTMLAttributes<HTMLTableCellElement>) => (\n    <BodyCell {...props}>{children}</BodyCell>\n);\nCell.displayName = \"Table.Cell\";\n\nconst Header = ({\n    children,\n    ...props\n}: React.ThHTMLAttributes<HTMLTableCellElement>) => (\n    <HeaderCell {...props}>{children}</HeaderCell>\n);\nHeader.displayName = \"Table.HeaderCell\";\n\nexport const Table = Object.assign(\n    ({ children, ...props }: React.TableHTMLAttributes<HTMLTableElement>) => (\n        <TableWrapper>\n            <TableComponent {...props}>{children}</TableComponent>\n        </TableWrapper>\n    ),\n    {\n        Container: TableWrapper,\n        Table: TableComponent,\n        Head,\n        Body,\n        Row,\n        Cell,\n        HeaderCell: Header,\n    }\n);\n"],"names":["Head","_a","children","props","__rest","_jsx","Object","assign","displayName","Body","TableBody","Row","BodyRow","Cell","BodyCell","Header","HeaderCell","Table","TableWrapper","TableComponent","Container"],"mappings":"kHASA,MAAMA,EAAQC,IAAA,IAAAC,SACVA,GAAQD,EACLE,EAAKC,EAAAA,OAAAH,EAFE,cAGuC,OACjDI,EAAAA,IAAA,QAAAC,OAAAC,OAAA,GAAWJ,YAAQD,IAAiB,EAExCF,EAAKQ,YAAc,aAEnB,MAAMC,EAAQR,IAAA,IAAAC,SACVA,GAAQD,EACLE,EAAKC,EAAAA,OAAAH,EAFE,cAGuC,OACjDI,EAAAA,IAACK,YAASJ,OAAAC,OAAA,GAAKJ,EAAK,CAAAD,SAAGA,IAAqB,EAEhDO,EAAKD,YAAc,aAEnB,MAAMG,EAAOV,IAAA,IAAAC,SACTA,GAAQD,EACLE,EAAKC,EAAAA,OAAAH,EAFC,cAGoC,OAC7CI,EAAAA,IAACO,UAAON,OAAAC,OAAA,GAAKJ,EAAK,CAAAD,SAAGA,IAAmB,EAE5CS,EAAIH,YAAc,YAElB,MAAMK,EAAQZ,IAAA,IAAAC,SACVA,GAAQD,EACLE,EAAKC,EAAAA,OAAAH,EAFE,cAGsC,OAChDI,EAAAA,IAACS,WAAQR,OAAAC,OAAA,GAAKJ,EAAK,CAAAD,SAAGA,IAAoB,EAE9CW,EAAKL,YAAc,aAEnB,MAAMO,EAAUd,IAAA,IAAAC,SACZA,GAAQD,EACLE,EAAKC,EAAAA,OAAAH,EAFI,cAGoC,OAChDI,EAAAA,IAACW,aAAUV,OAAAC,OAAA,GAAKJ,EAAK,CAAAD,SAAGA,IAAsB,EAElDa,EAAOP,YAAc,mBAEd,MAAMS,EAAQX,OAAOC,QACvBN,IAAA,IAAAC,SAAEA,GAAQD,EAAKE,EAAKC,EAAAA,OAAAH,EAApB,cAAwE,OACrEI,EAAAA,IAACa,EAAAA,aAAY,CAAAhB,SACTG,EAAAA,IAACc,EAAAA,eAAcb,OAAAC,OAAA,CAAA,EAAKJ,EAAK,CAAAD,SAAGA,MACjB,GAEnB,CACIkB,UAAWF,EAAAA,aACXD,MAAOE,EAAAA,eACPnB,OACAS,OACAE,MACAE,OACAG,WAAYD"}
+{"version":3,"file":"table.js","sources":["../../../src/table/table.tsx"],"sourcesContent":["import clsx from \"clsx\";\n\nimport * as styles from \"./table.styles\";\nimport type {\n    TableBodyProps,\n    TableCellProps,\n    TableContainerProps,\n    TableHeaderProps,\n    TableHeadProps,\n    TableRowProps,\n    TableTableProps,\n} from \"./types\";\n\nconst Head = ({ children, ...props }: TableHeadProps) => (\n    <thead {...props}>{children}</thead>\n);\nHead.displayName = \"Table.Head\";\n\nconst Body = ({ children, className, ...props }: TableBodyProps) => (\n    <tbody className={clsx(styles.tableBody, className)} {...props}>\n        {children}\n    </tbody>\n);\nBody.displayName = \"Table.Body\";\n\nconst Row = ({ children, className, ...props }: TableRowProps) => (\n    <tr className={clsx(styles.bodyRow, className)} {...props}>\n        {children}\n    </tr>\n);\nRow.displayName = \"Table.Row\";\n\nconst Cell = ({ children, className, ...props }: TableCellProps) => (\n    <td className={clsx(styles.bodyCell, className)} {...props}>\n        {children}\n    </td>\n);\nCell.displayName = \"Table.Cell\";\n\nconst Header = ({ children, className, ...props }: TableHeaderProps) => (\n    <th className={clsx(styles.headerCell, className)} {...props}>\n        {children}\n    </th>\n);\nHeader.displayName = \"Table.HeaderCell\";\n\nconst Container = ({ children, className, ...props }: TableContainerProps) => (\n    <div\n        className={clsx(styles.tableWrapper, className)}\n        data-testid=\"table-wrapper\"\n        {...props}\n    >\n        {children}\n    </div>\n);\nContainer.displayName = \"Table.Container\";\n\nconst TableEl = ({ children, className, ...props }: TableTableProps) => (\n    <table className={clsx(styles.tableComponent, className)} {...props}>\n        {children}\n    </table>\n);\nTableEl.displayName = \"Table.Table\";\n\n// @catalog\n/**\n * A styled HTML table with a scrollable container wrapper.\n *\n * Use `Table` when displaying structured tabular data. The default export\n * wraps content in `Table.Container` and `Table.Table` automatically. For\n * full layout control, compose the sub-components directly:\n * - `Table.Container` — scrollable wrapper div\n * - `Table.Table` — the bare `<table>` element\n * - `Table.Head` — the `<thead>` section\n * - `Table.Body` — the `<tbody>` section\n * - `Table.Row` — a `<tr>` row within the body\n * - `Table.Cell` — a `<td>` data cell\n * - `Table.HeaderCell` — a `<th>` column header cell\n * @keywords data, grid, rows, tabular\n */\nexport const Table = Object.assign(\n    ({ children, ...props }: TableTableProps) => (\n        <Container>\n            <TableEl {...props}>{children}</TableEl>\n        </Container>\n    ),\n    {\n        /** Scrollable wrapper div that contains a `Table.Table`. */\n        Container,\n        /** The bare `<table>` element. Use directly when you need to place the table inside a custom container. */\n        Table: TableEl,\n        /** Renders the `<thead>` section of the table. */\n        Head,\n        /** Renders the `<tbody>` section of the table. */\n        Body,\n        /** Renders a `<tr>` row within a `Table.Body`. */\n        Row,\n        /** Renders a `<td>` data cell within a `Table.Row`. */\n        Cell,\n        /** Renders a `<th>` header cell within a `Table.Head` row. */\n        HeaderCell: Header,\n    }\n);\n"],"names":["Head","_a","children","props","__rest","_jsx","Object","assign","displayName","Body","className","clsx","styles.tableBody","Row","styles.bodyRow","Cell","styles.bodyCell","Header","styles.headerCell","Container","styles.tableWrapper","TableEl","styles.tableComponent","Table","HeaderCell"],"mappings":"uNAaA,MAAMA,EAAQC,IAAA,IAAAC,SAAEA,GAAQD,EAAKE,EAAKC,EAAAA,OAAAH,EAApB,cAA2C,OACrDI,EAAAA,IAAA,QAAAC,OAAAC,OAAA,GAAWJ,YAAQD,IAAiB,EAExCF,EAAKQ,YAAc,aAEnB,MAAMC,EAAQR,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAAsD,OAChEI,EAAAA,IAAA,QAAAC,OAAAC,OAAA,CAAOG,UAAWC,EAAAA,QAAKC,EAAAA,UAAkBF,IAAgBP,YACpDD,IACG,EAEZO,EAAKD,YAAc,aAEnB,MAAMK,EAAOZ,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAAqD,OAC9DI,EAAAA,IAAA,KAAAC,OAAAC,OAAA,CAAIG,UAAWC,EAAAA,QAAKG,EAAAA,QAAgBJ,IAAgBP,YAC/CD,IACA,EAETW,EAAIL,YAAc,YAElB,MAAMO,EAAQd,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAAsD,OAChEI,EAAAA,IAAA,KAAAC,OAAAC,OAAA,CAAIG,UAAWC,EAAAA,QAAKK,EAAAA,SAAiBN,IAAgBP,YAChDD,IACA,EAETa,EAAKP,YAAc,aAEnB,MAAMS,EAAUhB,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAAwD,OACpEI,EAAAA,IAAA,KAAAC,OAAAC,OAAA,CAAIG,UAAWC,EAAAA,QAAKO,EAAAA,WAAmBR,IAAgBP,YAClDD,IACA,EAETe,EAAOT,YAAc,mBAErB,MAAMW,EAAalB,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAA2D,OAC1EI,EAAAA,yBACIK,UAAWC,EAAAA,QAAKS,EAAAA,aAAqBV,GAAU,cACnC,iBACRP,YAEHD,IACC,EAEViB,EAAUX,YAAc,kBAExB,MAAMa,EAAWpB,QAAAC,SAAEA,EAAQQ,UAAEA,GAAST,EAAKE,EAAKC,EAAAA,OAAAH,EAA/B,0BAAuD,OACpEI,EAAAA,IAAA,QAAAC,OAAAC,OAAA,CAAOG,UAAWC,EAAAA,QAAKW,EAAAA,eAAuBZ,IAAgBP,YACzDD,IACG,EAEZmB,EAAQb,YAAc,cAkBf,MAAMe,EAAQjB,OAAOC,QACvBN,IAAA,IAAAC,SAAEA,GAAQD,EAAKE,EAAKC,EAAAA,OAAAH,EAApB,cAA4C,OACzCI,EAAAA,IAACc,EAAS,CAAAjB,SACNG,EAAAA,IAACgB,EAAOf,OAAAC,OAAA,CAAA,EAAKJ,EAAK,CAAAD,SAAGA,MACb,GAEhB,CAEIiB,YAEAI,MAAOF,EAEPrB,OAEAS,OAEAI,MAEAE,OAEAS,WAAYP"}

package/cjs/table/table.styles.js

@@ -1,55 +1,2 @@
-"use strict";var e=require("styled-components"),r=require("../theme/index.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=o(e);const t=r.Colour.border,a=r.Colour.text,i=d.default.div`
-    overflow: auto;
-    border: ${r.Border["width-010"]} ${r.Border.solid} ${t};
-    border-radius: ${r.Radius.md};
-
-    /* Hide scrollbar */
-    scrollbar-width: none; /* Firefox */
-    -ms-overflow-style: none; /* IE 10+ */
-    &::-webkit-scrollbar {
-        display: none; /* Chrome/Safari/Webkit */
-    }
-`;i.displayName="Table.Container";const l=d.default.table`
-    text-align: left;
-    border-collapse: separate;
-    border-spacing: 0;
-    width: 100%;
-`;l.displayName="Table.Table";const n=d.default.tbody`
-    :where(tr:last-child) {
-        td {
-            border-bottom: none;
-        }
-    }
-`,s=d.default.th`
-    padding: ${r.Spacing["spacing-20"]} ${r.Spacing["spacing-16"]};
-    text-align: left;
-    cursor: default;
-    vertical-align: middle;
-    color: ${a};
-    background-color: ${r.Colour["bg-stronger"]};
-    height: 6rem;
-    border-bottom: ${r.Border["width-010"]} ${r.Border.solid} ${t};
-
-    &:where(&:first-child) {
-        padding-left: ${r.Spacing["spacing-24"]};
-    }
-    &:where(&:last-child) {
-        padding-right: ${r.Spacing["spacing-24"]};
-    }
-`,c=d.default.tr`
-    background-color: ${r.Colour.bg};
-    border-top: ${r.Border["width-010"]} ${r.Border.solid} ${t};
-`,p=d.default.td`
-    padding: ${r.Spacing["spacing-20"]} ${r.Spacing["spacing-16"]};
-    vertical-align: middle;
-    color: ${a};
-    border-bottom: ${r.Border["width-010"]} ${r.Border.solid} ${t};
-
-    &:where(&:first-child) {
-        padding-left: ${r.Spacing["spacing-24"]};
-    }
-    &:where(&:last-child) {
-        padding-right: ${r.Spacing["spacing-24"]};
-    }
-`;exports.BodyCell=p,exports.BodyRow=c,exports.HeaderCell=s,exports.TableBody=n,exports.TableComponent=l,exports.TableWrapper=i;
+"use strict";require("./table.styles_1vjx31g.css");exports.bodyCell="b183mjh5",exports.bodyRow="b1gaqki2",exports.headerCell="htqww2s",exports.tableBody="tdex3lc",exports.tableComponent="t110f2kz",exports.tableWrapper="txzjt0s";
 //# sourceMappingURL=table.styles.js.map

package/cjs/table/table.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.styles.js","sources":["../../../src/table/table.styles.tsx"],"sourcesContent":["import styled from \"styled-components\";\nimport { Border, Colour, Radius, Spacing } from \"../theme\";\n\n// =============================================================================\n// STYLES CONSTANTS\n// =============================================================================\nconst borderColor = Colour[\"border\"];\nconst fontColor = Colour[\"text\"];\n\n// =============================================================================\n// STYLES\n// =============================================================================\nexport const TableWrapper = styled.div`\n    overflow: auto;\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${borderColor};\n    border-radius: ${Radius[\"md\"]};\n\n    /* Hide scrollbar */\n    scrollbar-width: none; /* Firefox */\n    -ms-overflow-style: none; /* IE 10+ */\n    &::-webkit-scrollbar {\n        display: none; /* Chrome/Safari/Webkit */\n    }\n`;\n\nTableWrapper.displayName = \"Table.Container\";\n\nexport const TableComponent = styled.table`\n    text-align: left;\n    border-collapse: separate;\n    border-spacing: 0;\n    width: 100%;\n`;\n\nTableComponent.displayName = \"Table.Table\";\n\nexport const TableBody = styled.tbody`\n    :where(tr:last-child) {\n        td {\n            border-bottom: none;\n        }\n    }\n`;\n\nexport const HeaderCell = styled.th`\n    padding: ${Spacing[\"spacing-20\"]} ${Spacing[\"spacing-16\"]};\n    text-align: left;\n    cursor: default;\n    vertical-align: middle;\n    color: ${fontColor};\n    background-color: ${Colour[\"bg-stronger\"]};\n    height: 6rem;\n    border-bottom: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${borderColor};\n\n    &:where(&:first-child) {\n        padding-left: ${Spacing[\"spacing-24\"]};\n    }\n    &:where(&:last-child) {\n        padding-right: ${Spacing[\"spacing-24\"]};\n    }\n`;\n\nexport const BodyRow = styled.tr`\n    background-color: ${Colour[\"bg\"]};\n    border-top: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${borderColor};\n`;\n\nexport const BodyCell = styled.td`\n    padding: ${Spacing[\"spacing-20\"]} ${Spacing[\"spacing-16\"]};\n    vertical-align: middle;\n    color: ${fontColor};\n    border-bottom: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${borderColor};\n\n    &:where(&:first-child) {\n        padding-left: ${Spacing[\"spacing-24\"]};\n    }\n    &:where(&:last-child) {\n        padding-right: ${Spacing[\"spacing-24\"]};\n    }\n`;\n"],"names":["borderColor","Colour","fontColor","TableWrapper","styled","div","Border","Radius","displayName","TableComponent","table","TableBody","tbody","HeaderCell","th","Spacing","BodyRow","tr","BodyCell","td"],"mappings":"kKAMA,MAAMA,EAAcC,EAAAA,OAAe,OAC7BC,EAAYD,EAAAA,OAAa,KAKlBE,EAAeC,EAAAA,QAAOC,GAAG;;cAExBC,EAAAA,OAAO,gBAAgBA,EAAAA,OAAc,SAAKN;qBACnCO,EAAAA,OAAW;;;;;;;;EAUhCJ,EAAaK,YAAc,kBAEpB,MAAMC,EAAiBL,EAAAA,QAAOM,KAAK;;;;;EAO1CD,EAAeD,YAAc,cAEtB,MAAMG,EAAYP,EAAAA,QAAOQ,KAAK;;;;;;EAQxBC,EAAaT,EAAAA,QAAOU,EAAE;eACpBC,EAAAA,QAAQ,iBAAiBA,EAAAA,QAAQ;;;;aAInCb;wBACWD,EAAAA,OAAO;;qBAEVK,EAAAA,OAAO,gBAAgBA,EAAAA,OAAc,SAAKN;;;wBAGvCe,EAAAA,QAAQ;;;yBAGPA,EAAAA,QAAQ;;EAIpBC,EAAUZ,EAAAA,QAAOa,EAAE;wBACRhB,EAAAA,OAAW;kBACjBK,EAAAA,OAAO,gBAAgBA,EAAAA,OAAc,SAAKN;EAG/CkB,EAAWd,EAAAA,QAAOe,EAAE;eAClBJ,EAAAA,QAAQ,iBAAiBA,EAAAA,QAAQ;;aAEnCb;qBACQI,EAAAA,OAAO,gBAAgBA,EAAAA,OAAc,SAAKN;;;wBAGvCe,EAAAA,QAAQ;;;yBAGPA,EAAAA,QAAQ;;"}
+{"version":3,"file":"table.styles.js","sources":["../../../src/table/table.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Radius, Spacing } from \"../theme\";\n\n// =============================================================================\n// STYLES CONSTANTS\n// =============================================================================\nconst borderColor = Colour[\"border\"];\nconst fontColor = Colour[\"text\"];\n\n// =============================================================================\n// STYLES\n// =============================================================================\nexport const tableWrapper = css`\n    overflow: auto;\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${borderColor};\n    border-radius: ${Radius[\"md\"]};\n\n    /* Hide scrollbar */\n    scrollbar-width: none; /* Firefox */\n    -ms-overflow-style: none; /* IE 10+ */\n    &::-webkit-scrollbar {\n        display: none; /* Chrome/Safari/Webkit */\n    }\n`;\n\nexport const tableComponent = css`\n    text-align: left;\n    border-collapse: separate;\n    border-spacing: 0;\n    width: 100%;\n`;\n\nexport const tableBody = css`\n    :where(tr:last-child) {\n        td {\n            border-bottom: none;\n        }\n    }\n`;\n\nexport const headerCell = css`\n    padding: ${Spacing[\"spacing-20\"]} ${Spacing[\"spacing-16\"]};\n    text-align: left;\n    cursor: default;\n    vertical-align: middle;\n    color: ${fontColor};\n    background-color: ${Colour[\"bg-stronger\"]};\n    height: 6rem;\n    border-bottom: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${borderColor};\n\n    &:where(&:first-child) {\n        padding-left: ${Spacing[\"spacing-24\"]};\n    }\n    &:where(&:last-child) {\n        padding-right: ${Spacing[\"spacing-24\"]};\n    }\n`;\n\nexport const bodyRow = css`\n    background-color: ${Colour[\"bg\"]};\n    border-top: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${borderColor};\n`;\n\nexport const bodyCell = css`\n    padding: ${Spacing[\"spacing-20\"]} ${Spacing[\"spacing-16\"]};\n    vertical-align: middle;\n    color: ${fontColor};\n    border-bottom: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${borderColor};\n\n    &:where(&:first-child) {\n        padding-left: ${Spacing[\"spacing-24\"]};\n    }\n    &:where(&:last-child) {\n        padding-right: ${Spacing[\"spacing-24\"]};\n    }\n`;\n"],"names":[],"mappings":"yFAgEqB,2BALD,8BAlBG,4BARD,iCAPK,gCAbF"}

package/cjs/table/table.styles_1vjx31g.css

@@ -0,0 +1,6 @@
+@layer fds{.txzjt0s{overflow:auto;border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-radius:var(--fds-radius-md);scrollbar-width:none;-ms-overflow-style:none;}.txzjt0s::-webkit-scrollbar{display:none;}
+.t110f2kz{text-align:left;border-collapse:separate;border-spacing:0;width:100%;}
+.tdex3lc :where(tr:last-child) td{border-bottom:none;}
+.htqww2s{padding:var(--fds-spacing-20) var(--fds-spacing-16);text-align:left;cursor:default;vertical-align:middle;color:var(--fds-colour-text);background-color:var(--fds-colour-bg-stronger);height:6rem;border-bottom:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}.htqww2s:where(.htqww2s:first-child){padding-left:var(--fds-spacing-24);}.htqww2s:where(.htqww2s:last-child){padding-right:var(--fds-spacing-24);}
+.b1gaqki2{background-color:var(--fds-colour-bg);border-top:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}
+.b183mjh5{padding:var(--fds-spacing-20) var(--fds-spacing-16);vertical-align:middle;color:var(--fds-colour-text);border-bottom:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}.b183mjh5:where(.b183mjh5:first-child){padding-left:var(--fds-spacing-24);}.b183mjh5:where(.b183mjh5:last-child){padding-right:var(--fds-spacing-24);}}

package/cjs/tag/tag.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),t=require("react/jsx-runtime"),r=require("react"),i=require("./tag.style.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=n(r);exports.Tag=r=>{var{type:n,colorType:c="black",children:l,interactive:o=!1,icon:s,iconPosition:u="left"}=r,d=e.__rest(r,["type","colorType","children","interactive","icon","iconPosition"]);return t.jsxs(i.Wrapper,Object.assign({as:o?"button":"div",$type:n,$color:c,$interactive:o},d,{children:["left"===u&&s&&a.default.cloneElement(s,{"aria-hidden":!0}),t.jsx(i.Label,{role:"presentation",children:l}),"right"===u&&s&&a.default.cloneElement(s,{"aria-hidden":!0})]}))};
+"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),l=require("clsx"),i=require("react"),a=require("./tag.style.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=t(l),p=t(i);const o={solid:{grey:a.wrapperSolidGrey,green:a.wrapperSolidGreen,yellow:a.wrapperSolidYellow,red:a.wrapperSolidRed,blue:a.wrapperSolidBlue,primary:a.wrapperSolidPrimary,black:a.wrapperSolidBlack},outline:{grey:a.wrapperOutlineGrey,green:a.wrapperOutlineGreen,yellow:a.wrapperOutlineYellow,red:a.wrapperOutlineRed,blue:a.wrapperOutlineBlue,primary:a.wrapperOutlinePrimary,black:a.wrapperOutlineBlack}};exports.Tag=l=>{var i,{type:t,colorType:c="black",children:u,interactive:d=!1,icon:s,iconPosition:w="left"}=l,y=e.__rest(l,["type","colorType","children","interactive","icon","iconPosition"]);const v=d?"button":"div";return r.jsxs(v,Object.assign({className:n.default(a.wrapper,null===(i=o[t])||void 0===i?void 0:i[c],d&&a.wrapperInteractive)},y,{children:["left"===w&&s&&p.default.cloneElement(s,{"aria-hidden":!0}),r.jsx("div",{className:a.label,role:"presentation",children:u}),"right"===w&&s&&p.default.cloneElement(s,{"aria-hidden":!0})]}))};
 //# sourceMappingURL=tag.js.map

package/cjs/tag/tag.js.map

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

package/cjs/tag/tag.style.js

@@ -1,42 +1,2 @@
-"use strict";var r=require("styled-components"),o=require("../theme/index.js");function e(r){return r&&"object"==typeof r&&"default"in r?r:{default:r}}var t=e(r);const l=t.default.div`
-    border-radius: ${o.Radius.sm};
-    padding: 0.125rem 0.5rem;
-    width: fit-content;
-    max-width: 100%;
-    ${o.Font["body-xs-semibold"]}
-    transition: all 200ms ease;
-    cursor: ${({$interactive:r})=>r?"pointer":"default"};
-    display: flex;
-    align-items: center;
-    gap: 0.25rem;
-
-    svg {
-        flex-shrink: 0;
-    }
-
-    ${e=>{let t,l,s,u;if("solid"===e.$type)switch(s=o.Colour["text-inverse"],e.$color){case"grey":t=o.Colour["bg-inverse-subtler"],u=o.Colour["bg-inverse-hover"];break;case"green":t=o.Colour["bg-success-strong"],u=o.Colour["bg-success-strong-hover"];break;case"yellow":t=o.Colour["bg-warning-strong"],u=o.Colour["bg-warning-strong-hover"];break;case"red":t=o.Colour["bg-error-strong"],u=o.Colour["bg-error-strong-hover"];break;case"blue":t=o.Colour["bg-info-strong"],u=o.Colour["bg-info-strong-hover"];break;case"primary":t=o.Colour["bg-primary"],u=o.Colour["bg-primary-hover"];break;default:t=o.Colour["bg-inverse"],u=o.Colour["bg-inverse-hover"]}else switch(e.$color){case"grey":t=o.Colour["bg-strong"],l=o.Colour["border-strong"],s=o.Colour["text-subtle"],u=o.Colour["bg-hover-neutral-strong"];break;case"green":t=o.Colour["bg-success"],l=o.Colour["border-success"],s=o.Colour["text-success"],u=o.Colour["bg-success-hover"];break;case"yellow":t=o.Colour["bg-warning"],l=o.Colour["border-warning"],s=o.Colour["text-warning"],u=o.Colour["bg-warning-hover"];break;case"red":t=o.Colour["bg-error"],l=o.Colour["border-error"],s=o.Colour["text-error"],u=o.Colour["bg-error-hover"];break;case"blue":t=o.Colour["bg-info"],l=o.Colour["border-info"],s=o.Colour["text-info"],u=o.Colour["bg-info-hover"];break;case"primary":t=o.Colour["bg-primary-subtlest"],l=o.Colour["border-primary"],s=o.Colour["text-primary"],u=o.Colour["bg-hover"];break;default:t=o.Colour.bg,l=o.Colour.border,s=o.Colour.text,u=o.Colour["bg-hover-neutral"]}return r.css`
-            background: ${t};
-            border: ${o.Border["width-010"]} ${o.Border.solid} ${l};
-            color: ${s};
-            @media (hover: hover) {
-                &:hover {
-                    ${e.$interactive&&u&&`background: ${u(e)};`}
-                    ${e.$interactive&&undefined}
-                }
-            }
-        `}}
-
-    ${o.MediaQuery.MaxWidth.lg} {
-        ${({$interactive:e})=>{if(e)return r.css`
-                    ${o.Font["body-md-semibold"]}
-                    padding: calc(0.5rem - 1px) 1rem;
-                `}}
-    }
-`,s=t.default.div`
-    overflow: hidden;
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    -webkit-line-clamp: 2;
-    text-align: left;
-`;exports.Label=s,exports.Wrapper=l;
+"use strict";require("./tag.style_d98c53.css");exports.label="l1sykhdi",exports.wrapper="w6gjrz2",exports.wrapperInteractive="w3k7rkk",exports.wrapperOutlineBlack="w1t1mrk9",exports.wrapperOutlineBlue="w17cj89j",exports.wrapperOutlineGreen="wn4wzi4",exports.wrapperOutlineGrey="wb0avxu",exports.wrapperOutlinePrimary="wutpo14",exports.wrapperOutlineRed="wocomht",exports.wrapperOutlineYellow="wyfwkab",exports.wrapperSolidBlack="wgwk3g6",exports.wrapperSolidBlue="w1oi4bgz",exports.wrapperSolidGreen="wq3qkg6",exports.wrapperSolidGrey="w1bpyu8a",exports.wrapperSolidPrimary="wpja2at",exports.wrapperSolidRed="w1358sxl",exports.wrapperSolidYellow="w12fv5tt";
 //# sourceMappingURL=tag.style.js.map

package/cjs/tag/tag.style.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag.style.js","sources":["../../../src/tag/tag.style.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { TagColorType, TagType } from \"./types\";\nimport { Border, Colour, Font, MediaQuery, Radius } from \"../theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\ninterface StyleProps {\n    $type: TagType;\n    $color: TagColorType;\n    $interactive: boolean;\n}\n\nexport const Wrapper = styled.div<StyleProps>`\n    border-radius: ${Radius[\"sm\"]};\n    padding: 0.125rem 0.5rem;\n    width: fit-content;\n    max-width: 100%;\n    ${Font[\"body-xs-semibold\"]}\n    transition: all 200ms ease;\n    cursor: ${({ $interactive }) => ($interactive ? \"pointer\" : \"default\")};\n    display: flex;\n    align-items: center;\n    gap: 0.25rem;\n\n    svg {\n        flex-shrink: 0;\n    }\n\n    ${(props) => {\n        let backgroundColor: (props: any) => string;\n        let borderColor: ((props: any) => string) | undefined;\n        let color: (props: any) => string;\n        let hoverBackgroundColor: (props: any) => string;\n        let hoverBorderColor: ((props: any) => string) | undefined;\n\n        if (props.$type === \"solid\") {\n            color = Colour[\"text-inverse\"];\n            switch (props.$color) {\n                case \"grey\":\n                    backgroundColor = Colour[\"bg-inverse-subtler\"];\n                    hoverBackgroundColor = Colour[\"bg-inverse-hover\"];\n                    break;\n                case \"green\":\n                    backgroundColor = Colour[\"bg-success-strong\"];\n                    hoverBackgroundColor = Colour[\"bg-success-strong-hover\"];\n                    break;\n                case \"yellow\":\n                    backgroundColor = Colour[\"bg-warning-strong\"];\n                    hoverBackgroundColor = Colour[\"bg-warning-strong-hover\"];\n                    break;\n                case \"red\":\n                    backgroundColor = Colour[\"bg-error-strong\"];\n                    hoverBackgroundColor = Colour[\"bg-error-strong-hover\"];\n                    break;\n                case \"blue\":\n                    backgroundColor = Colour[\"bg-info-strong\"];\n                    hoverBackgroundColor = Colour[\"bg-info-strong-hover\"];\n                    break;\n                case \"primary\":\n                    backgroundColor = Colour[\"bg-primary\"];\n                    hoverBackgroundColor = Colour[\"bg-primary-hover\"];\n                    break;\n                default:\n                    backgroundColor = Colour[\"bg-inverse\"];\n                    hoverBackgroundColor = Colour[\"bg-inverse-hover\"];\n                    break;\n            }\n        } else {\n            switch (props.$color) {\n                case \"grey\":\n                    backgroundColor = Colour[\"bg-strong\"];\n                    borderColor = Colour[\"border-strong\"];\n                    color = Colour[\"text-subtle\"];\n                    hoverBackgroundColor = Colour[\"bg-hover-neutral-strong\"];\n                    break;\n                case \"green\":\n                    backgroundColor = Colour[\"bg-success\"];\n                    borderColor = Colour[\"border-success\"];\n                    color = Colour[\"text-success\"];\n                    hoverBackgroundColor = Colour[\"bg-success-hover\"];\n                    break;\n                case \"yellow\":\n                    backgroundColor = Colour[\"bg-warning\"];\n                    borderColor = Colour[\"border-warning\"];\n                    color = Colour[\"text-warning\"];\n                    hoverBackgroundColor = Colour[\"bg-warning-hover\"];\n                    break;\n                case \"red\":\n                    backgroundColor = Colour[\"bg-error\"];\n                    borderColor = Colour[\"border-error\"];\n                    color = Colour[\"text-error\"];\n                    hoverBackgroundColor = Colour[\"bg-error-hover\"];\n                    break;\n                case \"blue\":\n                    backgroundColor = Colour[\"bg-info\"];\n                    borderColor = Colour[\"border-info\"];\n                    color = Colour[\"text-info\"];\n                    hoverBackgroundColor = Colour[\"bg-info-hover\"];\n                    break;\n                case \"primary\":\n                    backgroundColor = Colour[\"bg-primary-subtlest\"];\n                    borderColor = Colour[\"border-primary\"];\n                    color = Colour[\"text-primary\"];\n                    hoverBackgroundColor = Colour[\"bg-hover\"];\n                    break;\n                default:\n                    backgroundColor = Colour.bg;\n                    borderColor = Colour.border;\n                    color = Colour.text;\n                    hoverBackgroundColor = Colour[\"bg-hover-neutral\"];\n                    break;\n            }\n        }\n        return css`\n            background: ${backgroundColor};\n            border: ${Border[\"width-010\"]} ${Border.solid} ${borderColor};\n            color: ${color};\n            @media (hover: hover) {\n                &:hover {\n                    ${props.$interactive &&\n                    hoverBackgroundColor &&\n                    `background: ${hoverBackgroundColor(props)};`}\n                    ${props.$interactive &&\n                    hoverBorderColor &&\n                    `border-color: ${hoverBorderColor(props)};`}\n                }\n            }\n        `;\n    }}\n\n    ${MediaQuery.MaxWidth.lg} {\n        ${({ $interactive }) => {\n            if ($interactive) {\n                return css`\n                    ${Font[\"body-md-semibold\"]}\n                    padding: calc(0.5rem - 1px) 1rem;\n                `;\n            }\n        }}\n    }\n`;\n\nexport const Label = styled.div`\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 2;\n    text-align: left;\n`;\n"],"names":["Wrapper","styled","div","Radius","Font","$interactive","props","backgroundColor","borderColor","color","hoverBackgroundColor","$type","Colour","$color","bg","border","text","css","Border","solid","hoverBorderColor","MediaQuery","MaxWidth","lg","Label"],"mappings":"kKAaO,MAAMA,EAAUC,EAAAA,QAAOC,GAAe;qBACxBC,EAAAA,OAAW;;;;MAI1BC,EAAAA,KAAK;;cAEG,EAAGC,kBAAoBA,EAAe,UAAY;;;;;;;;;MASzDC,IACC,IAAIC,EACAC,EACAC,EACAC,EAGJ,GAAoB,UAAhBJ,EAAMK,MAEN,OADAF,EAAQG,EAAAA,OAAO,gBACPN,EAAMO,QACV,IAAK,OACDN,EAAkBK,EAAAA,OAAO,sBACzBF,EAAuBE,EAAAA,OAAO,oBAC9B,MACJ,IAAK,QACDL,EAAkBK,EAAAA,OAAO,qBACzBF,EAAuBE,EAAAA,OAAO,2BAC9B,MACJ,IAAK,SACDL,EAAkBK,EAAAA,OAAO,qBACzBF,EAAuBE,EAAAA,OAAO,2BAC9B,MACJ,IAAK,MACDL,EAAkBK,EAAAA,OAAO,mBACzBF,EAAuBE,EAAAA,OAAO,yBAC9B,MACJ,IAAK,OACDL,EAAkBK,EAAAA,OAAO,kBACzBF,EAAuBE,EAAAA,OAAO,wBAC9B,MACJ,IAAK,UACDL,EAAkBK,EAAAA,OAAO,cACzBF,EAAuBE,EAAAA,OAAO,oBAC9B,MACJ,QACIL,EAAkBK,EAAAA,OAAO,cACzBF,EAAuBE,EAAAA,OAAO,yBAItC,OAAQN,EAAMO,QACV,IAAK,OACDN,EAAkBK,EAAAA,OAAO,aACzBJ,EAAcI,EAAAA,OAAO,iBACrBH,EAAQG,EAAAA,OAAO,eACfF,EAAuBE,EAAAA,OAAO,2BAC9B,MACJ,IAAK,QACDL,EAAkBK,EAAAA,OAAO,cACzBJ,EAAcI,EAAAA,OAAO,kBACrBH,EAAQG,EAAAA,OAAO,gBACfF,EAAuBE,EAAAA,OAAO,oBAC9B,MACJ,IAAK,SACDL,EAAkBK,EAAAA,OAAO,cACzBJ,EAAcI,EAAAA,OAAO,kBACrBH,EAAQG,EAAAA,OAAO,gBACfF,EAAuBE,EAAAA,OAAO,oBAC9B,MACJ,IAAK,MACDL,EAAkBK,EAAAA,OAAO,YACzBJ,EAAcI,EAAAA,OAAO,gBACrBH,EAAQG,EAAAA,OAAO,cACfF,EAAuBE,EAAAA,OAAO,kBAC9B,MACJ,IAAK,OACDL,EAAkBK,EAAAA,OAAO,WACzBJ,EAAcI,EAAAA,OAAO,eACrBH,EAAQG,EAAAA,OAAO,aACfF,EAAuBE,EAAAA,OAAO,iBAC9B,MACJ,IAAK,UACDL,EAAkBK,EAAAA,OAAO,uBACzBJ,EAAcI,EAAAA,OAAO,kBACrBH,EAAQG,EAAAA,OAAO,gBACfF,EAAuBE,EAAAA,OAAO,YAC9B,MACJ,QACIL,EAAkBK,EAAAA,OAAOE,GACzBN,EAAcI,EAAAA,OAAOG,OACrBN,EAAQG,EAAAA,OAAOI,KACfN,EAAuBE,EAAAA,OAAO,oBAI1C,OAAOK,KAAG;0BACQV;sBACJW,EAAAA,OAAO,gBAAgBA,EAAAA,OAAOC,SAASX;qBACxCC;;;sBAGCH,EAAMD,cACRK,GACA,eAAeA,EAAqBJ;sBAClCA,EAAMD,cAzFhBe;;;SA8FH;;MAGHC,EAAAA,WAAWC,SAASC;UAChB,EAAGlB,mBACD,GAAIA,EACA,OAAOY,KAAG;sBACJb,EAAAA,KAAK;;iBAGf;;EAKCoB,EAAQvB,EAAAA,QAAOC,GAAG;;;;;;"}
+{"version":3,"file":"tag.style.js","sources":["../../../src/tag/tag.style.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, MediaQuery, Radius } from \"../theme\";\n\n// =============================================================================\n// STYLING\n// =============================================================================\n\nexport const wrapper = css`\n    border-radius: ${Radius[\"sm\"]};\n    padding: 0.125rem 0.5rem;\n    width: fit-content;\n    max-width: 100%;\n    ${Font[\"body-xs-semibold\"]}\n    transition: all 200ms ease;\n    cursor: default;\n    display: flex;\n    align-items: center;\n    gap: 0.25rem;\n    border: ${Border[\"width-010\"]} ${Border.solid} transparent;\n\n    svg {\n        flex-shrink: 0;\n    }\n`;\n\nexport const wrapperInteractive = css`\n    cursor: pointer;\n\n    ${MediaQuery.MaxWidth.lg} {\n        ${Font[\"body-md-semibold\"]}\n        padding: calc(0.5rem - 1px) 1rem;\n    }\n`;\n\nexport const wrapperSolidGrey = css`\n    background: ${Colour[\"bg-inverse-subtler\"]};\n    color: ${Colour[\"text-inverse\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-inverse-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperSolidGreen = css`\n    background: ${Colour[\"bg-success-strong\"]};\n    color: ${Colour[\"text-inverse\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-success-strong-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperSolidYellow = css`\n    background: ${Colour[\"bg-warning-strong\"]};\n    color: ${Colour[\"text-inverse\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-warning-strong-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperSolidRed = css`\n    background: ${Colour[\"bg-error-strong\"]};\n    color: ${Colour[\"text-inverse\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-error-strong-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperSolidBlue = css`\n    background: ${Colour[\"bg-info-strong\"]};\n    color: ${Colour[\"text-inverse\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-info-strong-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperSolidPrimary = css`\n    background: ${Colour[\"bg-primary\"]};\n    color: ${Colour[\"text-inverse\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-primary-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperSolidBlack = css`\n    background: ${Colour[\"bg-inverse\"]};\n    color: ${Colour[\"text-inverse\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-inverse-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperOutlineGrey = css`\n    background: ${Colour[\"bg-strong\"]};\n    border-color: ${Colour[\"border-strong\"]};\n    color: ${Colour[\"text-subtle\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-hover-neutral-strong\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperOutlineGreen = css`\n    background: ${Colour[\"bg-success\"]};\n    border-color: ${Colour[\"border-success\"]};\n    color: ${Colour[\"text-success\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-success-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperOutlineYellow = css`\n    background: ${Colour[\"bg-warning\"]};\n    border-color: ${Colour[\"border-warning\"]};\n    color: ${Colour[\"text-warning\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-warning-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperOutlineRed = css`\n    background: ${Colour[\"bg-error\"]};\n    border-color: ${Colour[\"border-error\"]};\n    color: ${Colour[\"text-error\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-error-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperOutlineBlue = css`\n    background: ${Colour[\"bg-info\"]};\n    border-color: ${Colour[\"border-info\"]};\n    color: ${Colour[\"text-info\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-info-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperOutlinePrimary = css`\n    background: ${Colour[\"bg-primary-subtlest\"]};\n    border-color: ${Colour[\"border-primary\"]};\n    color: ${Colour[\"text-primary\"]};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-hover\"]};\n            }\n        }\n    }\n`;\n\nexport const wrapperOutlineBlack = css`\n    background: ${Colour.bg};\n    border-color: ${Colour.border};\n    color: ${Colour.text};\n\n    &.${wrapperInteractive} {\n        @media (hover: hover) {\n            &:hover {\n                background: ${Colour[\"bg-hover-neutral\"]};\n            }\n        }\n    }\n`;\n\nexport const label = css`\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 2;\n    text-align: left;\n`;\n"],"names":[],"mappings":"gFAgOkB,2BAxNE,qCAkBW,sCAwLC,sCA5BD,uCA1CC,qCAdD,wCAsEG,oCA5BJ,uCAdG,oCAzCH,mCA1BD,qCAvCC,mCAbD,uCAiEG,kCA1BJ,sCAbG"}

package/cjs/tag/tag.style_d98c53.css

@@ -0,0 +1,17 @@
+@layer fds{.w6gjrz2{border-radius:var(--fds-radius-sm);padding:0.125rem 0.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;max-width:100%;font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-xs);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-xs);letter-spacing:var(--fds-font-body-ls-xs);-webkit-transition:all 200ms ease;transition:all 200ms ease;cursor:default;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;gap:0.25rem;border:var(--fds-border-width-010) var(--fds-border-style-solid) transparent;}.w6gjrz2 svg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}
+.w3k7rkk{cursor:pointer;}:where(body.fds-breakpoint-lg-max) .w3k7rkk{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);padding:calc(0.5rem - 1px) 1rem;}
+.w1bpyu8a{background:var(--fds-colour-bg-inverse-subtler);color:var(--fds-colour-text-inverse);}@media (hover: hover){.w1bpyu8a.w3k7rkk:hover{background:var(--fds-colour-bg-inverse-hover);}}
+.wq3qkg6{background:var(--fds-colour-bg-success-strong);color:var(--fds-colour-text-inverse);}@media (hover: hover){.wq3qkg6.w3k7rkk:hover{background:var(--fds-colour-bg-success-strong-hover);}}
+.w12fv5tt{background:var(--fds-colour-bg-warning-strong);color:var(--fds-colour-text-inverse);}@media (hover: hover){.w12fv5tt.w3k7rkk:hover{background:var(--fds-colour-bg-warning-strong-hover);}}
+.w1358sxl{background:var(--fds-colour-bg-error-strong);color:var(--fds-colour-text-inverse);}@media (hover: hover){.w1358sxl.w3k7rkk:hover{background:var(--fds-colour-bg-error-strong-hover);}}
+.w1oi4bgz{background:var(--fds-colour-bg-info-strong);color:var(--fds-colour-text-inverse);}@media (hover: hover){.w1oi4bgz.w3k7rkk:hover{background:var(--fds-colour-bg-info-strong-hover);}}
+.wpja2at{background:var(--fds-colour-bg-primary);color:var(--fds-colour-text-inverse);}@media (hover: hover){.wpja2at.w3k7rkk:hover{background:var(--fds-colour-bg-primary-hover);}}
+.wgwk3g6{background:var(--fds-colour-bg-inverse);color:var(--fds-colour-text-inverse);}@media (hover: hover){.wgwk3g6.w3k7rkk:hover{background:var(--fds-colour-bg-inverse-hover);}}
+.wb0avxu{background:var(--fds-colour-bg-strong);border-color:var(--fds-colour-border-strong);color:var(--fds-colour-text-subtle);}@media (hover: hover){.wb0avxu.w3k7rkk:hover{background:var(--fds-colour-bg-hover-neutral-strong);}}
+.wn4wzi4{background:var(--fds-colour-bg-success);border-color:var(--fds-colour-border-success);color:var(--fds-colour-text-success);}@media (hover: hover){.wn4wzi4.w3k7rkk:hover{background:var(--fds-colour-bg-success-hover);}}
+.wyfwkab{background:var(--fds-colour-bg-warning);border-color:var(--fds-colour-border-warning);color:var(--fds-colour-text-warning);}@media (hover: hover){.wyfwkab.w3k7rkk:hover{background:var(--fds-colour-bg-warning-hover);}}
+.wocomht{background:var(--fds-colour-bg-error);border-color:var(--fds-colour-border-error);color:var(--fds-colour-text-error);}@media (hover: hover){.wocomht.w3k7rkk:hover{background:var(--fds-colour-bg-error-hover);}}
+.w17cj89j{background:var(--fds-colour-bg-info);border-color:var(--fds-colour-border-info);color:var(--fds-colour-text-info);}@media (hover: hover){.w17cj89j.w3k7rkk:hover{background:var(--fds-colour-bg-info-hover);}}
+.wutpo14{background:var(--fds-colour-bg-primary-subtlest);border-color:var(--fds-colour-border-primary);color:var(--fds-colour-text-primary);}@media (hover: hover){.wutpo14.w3k7rkk:hover{background:var(--fds-colour-bg-hover);}}
+.w1t1mrk9{background:var(--fds-colour-bg);border-color:var(--fds-colour-border);color:var(--fds-colour-text);}@media (hover: hover){.w1t1mrk9.w3k7rkk:hover{background:var(--fds-colour-bg-hover-neutral);}}
+.l1sykhdi{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;text-align:left;}}

package/cjs/text-list/index.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("./unordered-list.js"),r=require("./ordered-list.js");const s={Ul:e.UnorderedList,Ol:r.OrderedList};exports.TextList=s;
+"use strict";var e=require("./ordered-list.js");const r={Ul:require("./unordered-list.js").UnorderedList,Ol:e.OrderedList};exports.TextList=r;
 //# sourceMappingURL=index.js.map

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

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

package/cjs/text-list/ordered-list.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),t=require("./text-list.styles.js");const i=i=>{var{size:s,counterType:o,counterSeparator:a,bottomMargin:n,children:c}=i,u=e.__rest(i,["size","counterType","counterSeparator","bottomMargin","children"]);return r.jsx(t.StyledOrderedList,Object.assign({$size:s,$counterType:o,$counterSeparator:a,$bottomMargin:n},u,{children:c}))};i.displayName="TextList.Ol",exports.OrderedList=i;
+"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),t=require("clsx"),s=require("react");require("../theme/theme-provider/index.js"),require("../theme/theme-provider/context.js"),require("../theme/tokens/border.js"),require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var i=require("../theme/utils/use-apply-styles.js");require("../theme/utils/use-media-query.js");var o=require("./text-list.styles.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=u(t);const a=t=>{var{className:u,size:a,counterType:n,counterSeparator:d,reversed:c,start:m,bottomMargin:p,children:q}=t,j=e.__rest(t,["className","size","counterType","counterSeparator","reversed","start","bottomMargin","children"]);const h=s.useRef(null),v=Boolean(m);var y;return i.useApplyStyle(h,{[o.tokens.listBottomMargin]:`${null!=p?p:0}rem`,[o.tokens.orderedListCounterStyle]:null!=n?n:null,[o.tokens.orderedListCounterSeparator]:(y=null!=d?d:")",`"${y.replace(/"/g,'\\"')}"`),[o.tokens.orderedListStartValue]:v?c?m+1:m-1:null}),r.jsx("ol",Object.assign({ref:h,reversed:c,start:m,className:l.default(o.listBase,o.orderedList,a&&o.listSize[a],c&&o.orderedListReversed,v&&o.orderedListCustomStart,u)},j,{children:q}))};a.displayName="TextList.Ol",exports.OrderedList=a;
 //# sourceMappingURL=ordered-list.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ordered-list.js","sources":["../../../src/text-list/ordered-list.tsx"],"sourcesContent":["import { StyledOrderedList } from \"./text-list.styles\";\nimport { OrderedListProps } from \"./types\";\n\nexport const OrderedList = ({\n    size,\n    counterType,\n    counterSeparator,\n    bottomMargin,\n    children,\n    ...otherProps\n}: OrderedListProps) => {\n    return (\n        <StyledOrderedList\n            $size={size}\n            $counterType={counterType}\n            $counterSeparator={counterSeparator}\n            $bottomMargin={bottomMargin}\n            {...otherProps}\n        >\n            {children}\n        </StyledOrderedList>\n    );\n};\n\nOrderedList.displayName = \"TextList.Ol\";\n"],"names":["OrderedList","_a","size","counterType","counterSeparator","bottomMargin","children","otherProps","__rest","_jsx","StyledOrderedList","Object","assign","$size","$counterSeparator","$bottomMargin","displayName"],"mappings":"sHAGO,MAAMA,EAAeC,IAAA,IAAAC,KACxBA,EAAIC,YACJA,EAAWC,iBACXA,EAAgBC,aAChBA,EAAYC,SACZA,GAAQL,EACLM,EAAUC,EAAAA,OAAAP,EANW,qEAQxB,OACIQ,EAAAA,IAACC,EAAAA,kBAAiBC,OAAAC,OAAA,CAAAC,MACPX,eACOC,EAAWW,kBACNV,EAAgBW,cACpBV,GACXE,YAEHD,IACe,EAI5BN,EAAYgB,YAAc"}
+{"version":3,"file":"ordered-list.js","sources":["../../../src/text-list/ordered-list.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useRef } from \"react\";\n\nimport { useApplyStyle } from \"../theme\";\nimport * as styles from \"./text-list.styles\";\nimport type { OrderedListProps } from \"./types\";\n\nconst escapeDoubleQuotes = (value: string) => `\"${value.replace(/\"/g, '\\\\\"')}\"`;\n\nexport const OrderedList = ({\n    className,\n    size,\n    counterType,\n    counterSeparator,\n    reversed,\n    start,\n    bottomMargin,\n    children,\n    ...otherProps\n}: OrderedListProps) => {\n    const listRef = useRef<HTMLOListElement>(null);\n    const hasCustomStart = Boolean(start);\n\n    useApplyStyle(listRef, {\n        [styles.tokens.listBottomMargin]: `${bottomMargin ?? 0}rem`,\n        [styles.tokens.orderedListCounterStyle]: counterType ?? null,\n        [styles.tokens.orderedListCounterSeparator]: escapeDoubleQuotes(\n            counterSeparator ?? \")\"\n        ),\n        [styles.tokens.orderedListStartValue]: hasCustomStart\n            ? reversed\n                ? (start as number) + 1\n                : (start as number) - 1\n            : null,\n    });\n\n    return (\n        <ol\n            ref={listRef}\n            reversed={reversed}\n            start={start}\n            className={clsx(\n                styles.listBase,\n                styles.orderedList,\n                size && styles.listSize[size],\n                reversed && styles.orderedListReversed,\n                hasCustomStart && styles.orderedListCustomStart,\n                className\n            )}\n            {...otherProps}\n        >\n            {children}\n        </ol>\n    );\n};\n\nOrderedList.displayName = \"TextList.Ol\";\n"],"names":["OrderedList","_a","className","size","counterType","counterSeparator","reversed","start","bottomMargin","children","otherProps","__rest","listRef","useRef","hasCustomStart","Boolean","value","useApplyStyle","styles.tokens","listBottomMargin","orderedListCounterStyle","orderedListCounterSeparator","replace","orderedListStartValue","_jsx","Object","assign","ref","clsx","styles.listBase","styles.orderedList","styles.listSize","styles.orderedListReversed","styles.orderedListCustomStart","displayName"],"mappings":"okBAOA,MAEaA,EAAeC,QAAAC,UACxBA,EAASC,KACTA,EAAIC,YACJA,EAAWC,iBACXA,EAAgBC,SAChBA,EAAQC,MACRA,EAAKC,aACLA,EAAYC,SACZA,GAAQR,EACLS,EAAUC,EAAAA,OAAAV,EATW,oGAWxB,MAAMW,EAAUC,EAAAA,OAAyB,MACnCC,EAAiBC,QAAQR,GAdR,IAACS,EA6BxB,OAbAC,EAAAA,cAAcL,EAAS,CACnB,CAACM,SAAcC,kBAAmB,GAAGX,QAAAA,EAAgB,OACrD,CAACU,EAAAA,OAAcE,yBAA0BhB,QAAAA,EAAe,KACxD,CAACc,EAAAA,OAAcG,8BAnBKL,EAoBhBX,QAAAA,EAAoB,IApBc,IAAIW,EAAMM,QAAQ,KAAM,WAsB9D,CAACJ,EAAAA,OAAcK,uBAAwBT,EACjCR,EACKC,EAAmB,EACnBA,EAAmB,EACxB,OAINiB,EAAAA,IAAA,KAAAC,OAAAC,OAAA,CACIC,IAAKf,EACLN,SAAUA,EACVC,MAAOA,EACPL,UAAW0B,EAAAA,QACPC,EAAAA,SACAC,cACA3B,GAAQ4B,EAAAA,SAAgB5B,GACxBG,GAAY0B,EAAAA,oBACZlB,GAAkBmB,EAAAA,uBAClB/B,IAEAQ,EAAU,CAAAD,SAEbA,IACA,EAIbT,EAAYkC,YAAc"}

package/cjs/text-list/text-list.styles.js

@@ -1,63 +1,2 @@
-"use strict";var e=require("styled-components"),t=require("../theme/index.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=s(e);const o=e.css`
-    margin-bottom: ${e=>e.$bottomMargin||0}rem;
-
-    // Counter matters
-    counter-reset: list;
-
-    ${e=>e.$size&&t.Font[`${e.$size}-regular`]}
-    font-weight: ${t.Font.Spec["weight-regular"]};
-    color: ${t.Colour.text};
-
-    // nested lists styling
-    ol,
-    ul {
-        margin-top: 0.5rem;
-        margin-bottom: 0.5rem;
-    }
-`,i=r.default.ol`
-    ${o}
-
-    margin-left: 3em;
-
-    ${t.MediaQuery.MaxWidth.lg} {
-        margin-left: 2.5em;
-    }
-
-    li {
-        position: relative;
-    }
-
-    ${t=>{const{reversed:s}=t,r=t.$counterType||"decimal",o=t.$counterSeparator||")";return e.css`
-            li:before {
-                content: counter(list, ${r}) "${o}";
-                counter-increment: ${s?"list -1":"list"};
-                position: absolute;
-                left: -2em;
-            }
-        `}}
-
-    ${t=>{const{reversed:s,start:r}=t;if(r){const t=s?r+1:r-1;return e.css`
-                counter-reset: list ${t};
-            `}}}
-
-    list-style-position: outside;
-    list-style-type: none;
-
-    ul > li:before {
-        content: "";
-    }
-`,n=r.default.ul`
-    ${o}
-
-    margin-left: ${e=>e.$hasCustomIcon?0:"2.5em"};
-    list-style-type: ${e=>e.$hasCustomIcon?"none":e.$bulletType||"disc"};
-
-    ${t=>t.$hasCustomIcon&&e.css`
-            & > li {
-                display: flex;
-                align-items: flex-start;
-                gap: 0.5em;
-            }
-        `}
-`;exports.StyledOrderedList=i,exports.StyledUnorderedList=n;
+"use strict";require("./text-list.styles_w3fvyt.css");exports.listBase="l1oajjj5",exports.listSize={"heading-xxl":"h1cidf62","heading-xl":"hzza2og","heading-lg":"hvh12um","heading-md":"hmbxm0d","heading-sm":"he1b4ry","heading-xs":"hqe0fod","body-baseline":"bd07pl","body-md":"bsjejt8","body-sm":"b1lkco40","body-xs":"bru5c1n"},exports.orderedList="o1gavxb4",exports.orderedListCustomStart="o14yxjmu",exports.orderedListReversed="o1s96hsr",exports.tokens={listBottomMargin:"--fds-internal-textList-list-bottomMargin",orderedListCounterStyle:"--fds-internal-textList-orderedList-counterStyle",orderedListCounterSeparator:"--fds-internal-textList-orderedList-counterSeparator",orderedListStartValue:"--fds-internal-textList-orderedList-startValue",unorderedListBulletType:"--fds-internal-textList-unorderedList-bulletType"},exports.unorderedList="u1kb1ugb",exports.unorderedListCustomIcon="u1fq31t2";
 //# sourceMappingURL=text-list.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"text-list.styles.js","sources":["../../../src/text-list/text-list.styles.tsx"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { Colour, Font, MediaQuery } from \"../theme\";\nimport { TypographySizeType } from \"../theme/font/types\";\nimport { BulletType, CounterType } from \"./types\";\n\n// =============================================================================\n// STYLE INTERFACE\n// =============================================================================\ninterface ListStyleProps {\n    $bottomMargin: number | undefined;\n    $size: TypographySizeType | undefined;\n}\n\ninterface OrderedListStyleProps extends ListStyleProps {\n    $counterType: CounterType | undefined;\n    $counterSeparator: string | undefined;\n}\n\ninterface UnorderedListStyleProps extends ListStyleProps {\n    $bulletType: BulletType | undefined;\n    $hasCustomIcon: boolean | undefined;\n}\n\n// =============================================================================\n// STYLING\n// =============================================================================\nconst baseStyle = css<ListStyleProps>`\n    margin-bottom: ${(props) => props.$bottomMargin || 0}rem;\n\n    // Counter matters\n    counter-reset: list;\n\n    ${(props) => props.$size && Font[`${props.$size}-regular`]}\n    font-weight: ${Font.Spec[\"weight-regular\"]};\n    color: ${Colour.text};\n\n    // nested lists styling\n    ol,\n    ul {\n        margin-top: 0.5rem;\n        margin-bottom: 0.5rem;\n    }\n`;\n\nexport const StyledOrderedList = styled.ol<OrderedListStyleProps>`\n    ${baseStyle}\n\n    margin-left: 3em;\n\n    ${MediaQuery.MaxWidth.lg} {\n        margin-left: 2.5em;\n    }\n\n    li {\n        position: relative;\n    }\n\n    ${(props) => {\n        const { reversed } = props;\n        const counterType = props.$counterType || \"decimal\";\n        const counterSeparator = props.$counterSeparator || \")\";\n\n        return css`\n            li:before {\n                content: counter(list, ${counterType}) \"${counterSeparator}\";\n                counter-increment: ${reversed ? \"list -1\" : \"list\"};\n                position: absolute;\n                left: -2em;\n            }\n        `;\n    }}\n\n    ${(props) => {\n        const { reversed, start } = props;\n\n        if (start) {\n            const resetValue = reversed ? start + 1 : start - 1;\n            return css`\n                counter-reset: list ${resetValue};\n            `;\n        }\n    }}\n\n    list-style-position: outside;\n    list-style-type: none;\n\n    ul > li:before {\n        content: \"\";\n    }\n`;\n\nexport const StyledUnorderedList = styled.ul<UnorderedListStyleProps>`\n    ${baseStyle}\n\n    margin-left: ${(props) => (props.$hasCustomIcon ? 0 : \"2.5em\")};\n    list-style-type: ${(props) =>\n        props.$hasCustomIcon ? \"none\" : props.$bulletType || \"disc\"};\n\n    ${(props) =>\n        props.$hasCustomIcon &&\n        css`\n            & > li {\n                display: flex;\n                align-items: flex-start;\n                gap: 0.5em;\n            }\n        `}\n`;\n"],"names":["baseStyle","css","props","$bottomMargin","$size","Font","Spec","Colour","text","StyledOrderedList","styled","ol","MediaQuery","MaxWidth","lg","reversed","counterType","$counterType","counterSeparator","$counterSeparator","start","resetValue","StyledUnorderedList","ul","$hasCustomIcon","$bulletType"],"mappings":"kKA0BA,MAAMA,EAAYC,EAAAA,GAAmB;qBACfC,GAAUA,EAAMC,eAAiB;;;;;MAKhDD,GAAUA,EAAME,OAASC,EAAAA,KAAK,GAAGH,EAAME;mBAC3BC,EAAAA,KAAKC,KAAK;aAChBC,EAAAA,OAAOC;;;;;;;;EAUPC,EAAoBC,EAAAA,QAAOC,EAAyB;MAC3DX;;;;MAIAY,EAAAA,WAAWC,SAASC;;;;;;;;MAQnBZ,IACC,MAAMa,SAAEA,GAAab,EACfc,EAAcd,EAAMe,cAAgB,UACpCC,EAAmBhB,EAAMiB,mBAAqB,IAEpD,OAAOlB,KAAG;;yCAEuBe,OAAiBE;qCACrBH,EAAW,UAAY;;;;SAInD;;MAGFb,IACC,MAAMa,SAAEA,EAAQK,MAAEA,GAAUlB,EAE5B,GAAIkB,EAAO,CACP,MAAMC,EAAaN,EAAWK,EAAQ,EAAIA,EAAQ,EAClD,OAAOnB,KAAG;sCACgBoB;aAE9B;;;;;;;;EAWKC,EAAsBZ,EAAAA,QAAOa,EAA2B;MAC/DvB;;mBAEcE,GAAWA,EAAMsB,eAAiB,EAAI;uBAClCtB,GAChBA,EAAMsB,eAAiB,OAAStB,EAAMuB,aAAe;;MAEtDvB,GACCA,EAAMsB,gBACNvB,KAAG;;;;;;;"}
+{"version":3,"file":"text-list.styles.js","sources":["../../../src/text-list/text-list.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, Font, MediaQuery } from \"../theme\";\nimport type { TextListSize } from \"./types\";\n\nexport const tokens = {\n    listBottomMargin: \"--fds-internal-textList-list-bottomMargin\",\n    orderedListCounterStyle: \"--fds-internal-textList-orderedList-counterStyle\",\n    orderedListCounterSeparator:\n        \"--fds-internal-textList-orderedList-counterSeparator\",\n    orderedListStartValue: \"--fds-internal-textList-orderedList-startValue\",\n    unorderedListBulletType: \"--fds-internal-textList-unorderedList-bulletType\",\n};\n\nexport const listBase = css`\n    ${tokens.listBottomMargin}: 0rem;\n    margin-bottom: var(${tokens.listBottomMargin});\n\n    // Counter matters\n    counter-reset: list;\n\n    font-weight: ${Font.Spec[\"weight-regular\"]};\n    color: ${Colour.text};\n\n    // nested lists styling\n    ol,\n    ul {\n        margin-top: 0.5rem;\n        margin-bottom: 0.5rem;\n    }\n`;\n\nexport const listSize: Record<TextListSize, string> = {\n    \"heading-xxl\": css`\n        ${Font[\"heading-xxl-regular\"]}\n    `,\n    \"heading-xl\": css`\n        ${Font[\"heading-xl-regular\"]}\n    `,\n    \"heading-lg\": css`\n        ${Font[\"heading-lg-regular\"]}\n    `,\n    \"heading-md\": css`\n        ${Font[\"heading-md-regular\"]}\n    `,\n    \"heading-sm\": css`\n        ${Font[\"heading-sm-regular\"]}\n    `,\n    \"heading-xs\": css`\n        ${Font[\"heading-xs-regular\"]}\n    `,\n    \"body-baseline\": css`\n        ${Font[\"body-baseline-regular\"]}\n    `,\n    \"body-md\": css`\n        ${Font[\"body-md-regular\"]}\n    `,\n    \"body-sm\": css`\n        ${Font[\"body-sm-regular\"]}\n    `,\n    \"body-xs\": css`\n        ${Font[\"body-xs-regular\"]}\n    `,\n};\n\nexport const orderedList = css`\n    ${tokens.orderedListCounterSeparator}: \")\";\n\n    margin-left: 3em;\n    list-style-position: outside;\n    list-style-type: none;\n\n    ${MediaQuery.MaxWidth.lg} {\n        margin-left: 2.5em;\n    }\n\n    li {\n        position: relative;\n    }\n\n    li:before {\n        counter-increment: list;\n        content: counter(list, var(${tokens.orderedListCounterStyle}, decimal))\n            var(${tokens.orderedListCounterSeparator});\n        position: absolute;\n        left: -2em;\n    }\n\n    ul > li:before {\n        content: \"\";\n    }\n`;\n\nexport const orderedListReversed = css`\n    li:before {\n        counter-increment: list -1;\n    }\n`;\n\nexport const orderedListCustomStart = css`\n    counter-reset: list var(${tokens.orderedListStartValue});\n`;\n\nexport const unorderedList = css`\n    margin-left: 2.5em;\n    list-style-type: var(${tokens.unorderedListBulletType}, disc);\n`;\n\nexport const unorderedListCustomIcon = css`\n    margin-left: 0;\n    list-style-type: none;\n\n    & > li {\n        display: flex;\n        align-items: flex-start;\n        gap: 0.5em;\n    }\n`;\n"],"names":["listBottomMargin","orderedListCounterStyle","orderedListCounterSeparator","orderedListStartValue","unorderedListBulletType"],"mappings":"gGAcqB,4BAkBiC,CAClD,cAAa,WAGb,aAAY,UAGZ,aAAY,UAGZ,aAAY,UAGZ,aAAY,UAGZ,aAAY,UAGZ,gBAAe,SAGf,UAAS,UAGT,UAAS,WAGT,UAAS,+BAKW,0CAkCW,uCANH,0BAxFV,CAClBA,iBAAkB,4CAClBC,wBAAyB,mDACzBC,4BACI,uDACJC,sBAAuB,iDACvBC,wBAAyB,0EA4FH,2CAKU"}

package/cjs/text-list/text-list.styles_w3fvyt.css

@@ -0,0 +1,16 @@
+@layer fds{.l1oajjj5{--fds-internal-textList-list-bottomMargin:0rem;margin-bottom:var(--fds-internal-textList-list-bottomMargin);counter-reset:list;font-weight:var(--fds-font-weight-regular);color:var(--fds-colour-text);}.l1oajjj5 ol,.l1oajjj5 ul{margin-top:0.5rem;margin-bottom:0.5rem;}
+.h1cidf62{font-family:var(--fds-font-family-heading);font-variant:var(--fds-font-variant);font-size:var(--fds-font-heading-size-xxl);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-heading-lh-xxl);letter-spacing:var(--fds-font-heading-ls-xxl);}
+.hzza2og{font-family:var(--fds-font-family-heading);font-variant:var(--fds-font-variant);font-size:var(--fds-font-heading-size-xl);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-heading-lh-xl);letter-spacing:var(--fds-font-heading-ls-xl);}
+.hvh12um{font-family:var(--fds-font-family-heading);font-variant:var(--fds-font-variant);font-size:var(--fds-font-heading-size-lg);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-heading-lh-lg);letter-spacing:var(--fds-font-heading-ls-lg);}
+.hmbxm0d{font-family:var(--fds-font-family-heading);font-variant:var(--fds-font-variant);font-size:var(--fds-font-heading-size-md);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-heading-lh-md);letter-spacing:var(--fds-font-heading-ls-md);}
+.he1b4ry{font-family:var(--fds-font-family-heading);font-variant:var(--fds-font-variant);font-size:var(--fds-font-heading-size-sm);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-heading-lh-sm);letter-spacing:var(--fds-font-heading-ls-sm);}
+.hqe0fod{font-family:var(--fds-font-family-heading);font-variant:var(--fds-font-variant);font-size:var(--fds-font-heading-size-xs);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-heading-lh-xs);letter-spacing:var(--fds-font-heading-ls-xs);}
+.bd07pl{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);}
+.bsjejt8{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);}
+.b1lkco40{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-regular);line-height:var(--fds-font-body-lh-sm);letter-spacing:var(--fds-font-body-ls-sm);}
+.bru5c1n{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-xs);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-xs);letter-spacing:var(--fds-font-body-ls-xs);}
+.o1gavxb4{--fds-internal-textList-orderedList-counterSeparator:")";margin-left:3em;list-style-position:outside;list-style-type:none;}:where(body.fds-breakpoint-lg-max) .o1gavxb4{margin-left:2.5em;}.o1gavxb4 li{position:relative;}.o1gavxb4 li:before{counter-increment:list;content:counter(list, var(--fds-internal-textList-orderedList-counterStyle, decimal)) var(--fds-internal-textList-orderedList-counterSeparator);position:absolute;left:-2em;}.o1gavxb4 ul>li:before{content:"";}
+.o1s96hsr li:before{counter-increment:list -1;}
+.o14yxjmu{counter-reset:list var(--fds-internal-textList-orderedList-startValue);}
+.u1kb1ugb{margin-left:2.5em;list-style-type:var(--fds-internal-textList-unorderedList-bulletType, disc);}
+.u1fq31t2{margin-left:0;list-style-type:none;}.u1fq31t2>li{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;gap:0.5em;}}