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

package/shared/time-slot/time-slot.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import t from"clsx";import{forwardRef as o,useRef as r}from"react";import"../../theme/theme-provider/index.js";import"../../theme/theme-provider/context.js";import"../../theme/tokens/border.js";import"../../theme/tokens/colour.js";import"../../theme/tokens/font.js";import"../../theme/tokens/media-query.js";import{useApplyStyle as s}from"../../theme/utils/use-apply-styles.js";import"../../theme/utils/use-media-query.js";import"../../util/calendar-helper.js";import"../../external/dayjs/dayjs.min.js";import{mergeRefs as i}from"../../util/merge-refs.js";import"../../util/simple-id-generator.js";import"../../util/string-helper.js";import"@react-aria/live-announcer";import{tokens as l,timeSlot as m}from"./time-slot.styles.js";const a=o((({className:o,"data-testid":a,bgColor:p,bgColor2:n,children:c,clickable:d,hoverBgColor:h,hoverBgColor2:j,nonClickableCursor:u,onClick:C,styleType:b,tabIndex:g},y)=>{const f=r(null);s(f,{[l.slot.bgColor]:p,[l.slot.bgColor2]:n,[l.slot.hoverBgColor]:h,[l.slot.hoverBgColor2]:j,[l.slot.cursor]:u});return e("div",{ref:i(f,y),className:t(m,o),"data-style-type":b,"data-clickable":!!d,"data-hoverable":!!(d&&("stripes"===b?h||j:h)),onClick:C,"data-testid":a,tabIndex:g,children:c})}));export{a as TimeSlot};
+import{jsx as e}from"react/jsx-runtime";import t from"clsx";import{forwardRef as o,useRef as r}from"react";import"../../theme/theme-provider/index.js";import"../../theme/theme-provider/context.js";import"../../theme/tokens/border.js";import"../../theme/tokens/colour.js";import"../../theme/tokens/font.js";import"../../theme/tokens/media-query.js";import{useApplyStyle as s}from"../../theme/utils/use-apply-styles.js";import"../../theme/utils/use-media-query.js";import"../../util/calendar-helper.js";import"../../external/dayjs/dayjs.min.js";import{mergeRefs as l}from"../../util/merge-refs.js";import"../../util/simple-id-generator.js";import"../../util/string-helper.js";import"@react-aria/live-announcer";import{tokens as i,timeSlot as m,timeSlotHalfFillBottom as a,timeSlotHalfFillTop as p}from"./time-slot.styles.js";const n=o((({className:o,"data-testid":n,bgColor:d,bgColor2:c,children:h,clickable:u,fill:j="default",hoverBgColor:b,hoverBgColor2:C,nonClickableCursor:f,onClick:g,styleType:y,tabIndex:k},v)=>{const x=r(null);s(x,{[i.slot.bgColor]:d,[i.slot.bgColor2]:c,[i.slot.hoverBgColor]:b,[i.slot.hoverBgColor2]:C,[i.slot.cursor]:f});return e("div",{ref:l(x,v),className:t(m,{[p]:"top"===j,[a]:"bottom"===j},o),"data-style-type":y,"data-clickable":!!u,"data-hoverable":!!(u&&("stripes"===y?b||C:b)),onClick:g,"data-testid":n,tabIndex:k,children:h})}));export{n as TimeSlot};
 //# sourceMappingURL=time-slot.js.map

package/shared/time-slot/time-slot.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-slot.js","sources":["../../../src/shared/time-slot/time-slot.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef, useRef } from \"react\";\n\nimport { useApplyStyle } from \"../../theme\";\nimport { mergeRefs } from \"../../util\";\nimport * as styles from \"./time-slot.styles\";\nimport type { SlotStyle } from \"./types\";\n\nexport interface TimeSlotProps {\n    \"data-testid\"?: string | undefined;\n    bgColor: string;\n    bgColor2?: string | undefined;\n    children?: ReactNode;\n    className?: string | undefined;\n    clickable?: boolean | undefined;\n    hoverBgColor?: string | undefined;\n    hoverBgColor2?: string | undefined;\n    nonClickableCursor?: \"default\" | \"not-allowed\" | undefined;\n    onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;\n    styleType: SlotStyle;\n    tabIndex?: number | undefined;\n}\n\nconst Component = (\n    {\n        className,\n        \"data-testid\": dataTestId,\n        bgColor,\n        bgColor2,\n        children,\n        clickable,\n        hoverBgColor,\n        hoverBgColor2,\n        nonClickableCursor,\n        onClick,\n        styleType,\n        tabIndex,\n    }: TimeSlotProps,\n    ref: React.Ref<HTMLDivElement>\n) => {\n    const slotRef = useRef<HTMLDivElement>(null);\n\n    useApplyStyle(slotRef, {\n        [styles.tokens.slot.bgColor]: bgColor,\n        [styles.tokens.slot.bgColor2]: bgColor2,\n        [styles.tokens.slot.hoverBgColor]: hoverBgColor,\n        [styles.tokens.slot.hoverBgColor2]: hoverBgColor2,\n        [styles.tokens.slot.cursor]: nonClickableCursor,\n    });\n\n    const isHoverable = () => {\n        if (!clickable) {\n            return false;\n        }\n\n        if (styleType === \"stripes\") {\n            return !!(hoverBgColor || hoverBgColor2);\n        }\n\n        return !!hoverBgColor;\n    };\n\n    return (\n        <div\n            ref={mergeRefs(slotRef, ref)}\n            className={clsx(styles.timeSlot, className)}\n            data-style-type={styleType}\n            data-clickable={!!clickable}\n            data-hoverable={isHoverable()}\n            onClick={onClick}\n            data-testid={dataTestId}\n            tabIndex={tabIndex}\n        >\n            {children}\n        </div>\n    );\n};\n\nexport const TimeSlot = forwardRef(Component);\n"],"names":["TimeSlot","forwardRef","className","dataTestId","bgColor","bgColor2","children","clickable","hoverBgColor","hoverBgColor2","nonClickableCursor","onClick","styleType","tabIndex","ref","slotRef","useRef","useApplyStyle","styles.tokens","slot","cursor","_jsx","mergeRefs","clsx","styles.timeSlot"],"mappings":"kwBAwBA,MAuDaA,EAAWC,GAvDN,EAEVC,YACA,cAAeC,EACfC,UACAC,WACAC,WACAC,YACAC,eACAC,gBACAC,qBACAC,UACAC,YACAC,YAEJC,KAEA,MAAMC,EAAUC,EAAuB,MAEvCC,EAAcF,EAAS,CACnB,CAACG,EAAcC,KAAKf,SAAUA,EAC9B,CAACc,EAAcC,KAAKd,UAAWA,EAC/B,CAACa,EAAcC,KAAKX,cAAeA,EACnC,CAACU,EAAcC,KAAKV,eAAgBA,EACpC,CAACS,EAAcC,KAAKC,QAASV,IAejC,OACIW,SACIP,IAAKQ,EAAUP,EAASD,GACxBZ,UAAWqB,EAAKC,EAAiBtB,GAAU,kBAC1BU,EAAS,mBACRL,EAAS,oBAhB1BA,IAIa,YAAdK,EACUJ,GAAgBC,EAGrBD,IAULG,QAASA,gBACIR,EACbU,SAAUA,WAETP,GACC"}
+{"version":3,"file":"time-slot.js","sources":["../../../src/shared/time-slot/time-slot.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef, useRef } from \"react\";\n\nimport { useApplyStyle } from \"../../theme\";\nimport { mergeRefs } from \"../../util\";\nimport * as styles from \"./time-slot.styles\";\nimport type { SlotStyle } from \"./types\";\n\nexport interface TimeSlotProps {\n    \"data-testid\"?: string | undefined;\n    bgColor: string;\n    bgColor2?: string | undefined;\n    children?: ReactNode;\n    className?: string | undefined;\n    clickable?: boolean | undefined;\n    fill?: \"default\" | \"top\" | \"bottom\" | undefined;\n    hoverBgColor?: string | undefined;\n    hoverBgColor2?: string | undefined;\n    nonClickableCursor?: \"default\" | \"not-allowed\" | undefined;\n    onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;\n    styleType: SlotStyle;\n    tabIndex?: number | undefined;\n}\n\nconst Component = (\n    {\n        className,\n        \"data-testid\": dataTestId,\n        bgColor,\n        bgColor2,\n        children,\n        clickable,\n        fill = \"default\",\n        hoverBgColor,\n        hoverBgColor2,\n        nonClickableCursor,\n        onClick,\n        styleType,\n        tabIndex,\n    }: TimeSlotProps,\n    ref: React.Ref<HTMLDivElement>\n) => {\n    const slotRef = useRef<HTMLDivElement>(null);\n\n    useApplyStyle(slotRef, {\n        [styles.tokens.slot.bgColor]: bgColor,\n        [styles.tokens.slot.bgColor2]: bgColor2,\n        [styles.tokens.slot.hoverBgColor]: hoverBgColor,\n        [styles.tokens.slot.hoverBgColor2]: hoverBgColor2,\n        [styles.tokens.slot.cursor]: nonClickableCursor,\n    });\n\n    const isHoverable = () => {\n        if (!clickable) {\n            return false;\n        }\n\n        if (styleType === \"stripes\") {\n            return !!(hoverBgColor || hoverBgColor2);\n        }\n\n        return !!hoverBgColor;\n    };\n\n    return (\n        <div\n            ref={mergeRefs(slotRef, ref)}\n            className={clsx(\n                styles.timeSlot,\n                {\n                    [styles.timeSlotHalfFillTop]: fill === \"top\",\n                    [styles.timeSlotHalfFillBottom]: fill === \"bottom\",\n                },\n                className\n            )}\n            data-style-type={styleType}\n            data-clickable={!!clickable}\n            data-hoverable={isHoverable()}\n            onClick={onClick}\n            data-testid={dataTestId}\n            tabIndex={tabIndex}\n        >\n            {children}\n        </div>\n    );\n};\n\nexport const TimeSlot = forwardRef(Component);\n"],"names":["TimeSlot","forwardRef","className","dataTestId","bgColor","bgColor2","children","clickable","fill","hoverBgColor","hoverBgColor2","nonClickableCursor","onClick","styleType","tabIndex","ref","slotRef","useRef","useApplyStyle","styles.tokens","slot","cursor","_jsx","mergeRefs","clsx","styles.timeSlot","timeSlotHalfFillTop","styles.timeSlotHalfFillTop","timeSlotHalfFillBottom","styles.timeSlotHalfFillBottom"],"mappings":"uzBAyBA,MA+DaA,EAAWC,GA/DN,EAEVC,YACA,cAAeC,EACfC,UACAC,WACAC,WACAC,YACAC,OAAO,UACPC,eACAC,gBACAC,qBACAC,UACAC,YACAC,YAEJC,KAEA,MAAMC,EAAUC,EAAuB,MAEvCC,EAAcF,EAAS,CACnB,CAACG,EAAcC,KAAKhB,SAAUA,EAC9B,CAACe,EAAcC,KAAKf,UAAWA,EAC/B,CAACc,EAAcC,KAAKX,cAAeA,EACnC,CAACU,EAAcC,KAAKV,eAAgBA,EACpC,CAACS,EAAcC,KAAKC,QAASV,IAejC,OACIW,EAAA,MAAA,CACIP,IAAKQ,EAAUP,EAASD,GACxBb,UAAWsB,EACPC,EACA,CACIC,CAACC,GAAsC,QAATnB,EAC9BoB,CAACC,GAAyC,WAATrB,GAErCN,GACH,kBACgBW,EAAS,mBACRN,EAAS,oBAvB1BA,IAIa,YAAdM,EACUJ,GAAgBC,EAGrBD,IAiBLG,QAASA,EAAO,cACHT,EACbW,SAAUA,EAAQR,SAEjBA,GACC"}

package/shared/time-slot/time-slot.styles.d.ts

@@ -8,3 +8,5 @@ export declare const tokens: {
     };
 };
 export declare const timeSlot: import("@linaria/core").LinariaClassName;
+export declare const timeSlotHalfFillTop: import("@linaria/core").LinariaClassName;
+export declare const timeSlotHalfFillBottom: import("@linaria/core").LinariaClassName;

package/shared/time-slot/time-slot.styles.js

@@ -1,2 +1,2 @@
-import"./time-slot.styles_1r9na3f.css";const o={slot:{bgColor:"--fds-internal-timeSlot-slot-bgColor",bgColor2:"--fds-internal-timeSlot-slot-bgColor2",hoverBgColor:"--fds-internal-timeSlot-slot-hoverBgColor",hoverBgColor2:"--fds-internal-timeSlot-slot-hoverBgColor2",cursor:"--fds-internal-timeSlot-slot-cursor"}},t="tsti7hb";export{t as timeSlot,o as tokens};
+import"./time-slot.styles_18s0to7.css";const o={slot:{bgColor:"--fds-internal-timeSlot-slot-bgColor",bgColor2:"--fds-internal-timeSlot-slot-bgColor2",hoverBgColor:"--fds-internal-timeSlot-slot-hoverBgColor",hoverBgColor2:"--fds-internal-timeSlot-slot-hoverBgColor2",cursor:"--fds-internal-timeSlot-slot-cursor"}},t="tsti7hb",l="tmgdrss",r="t31kbad";export{t as timeSlot,r as timeSlotHalfFillBottom,l as timeSlotHalfFillTop,o as tokens};
 //# sourceMappingURL=time-slot.styles.js.map

package/shared/time-slot/time-slot.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-slot.styles.js","sources":["../../../src/shared/time-slot/time-slot.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour } from \"../../theme\";\n\nexport const tokens = {\n    slot: {\n        bgColor: \"--fds-internal-timeSlot-slot-bgColor\",\n        bgColor2: \"--fds-internal-timeSlot-slot-bgColor2\",\n        hoverBgColor: \"--fds-internal-timeSlot-slot-hoverBgColor\",\n        hoverBgColor2: \"--fds-internal-timeSlot-slot-hoverBgColor2\",\n        cursor: \"--fds-internal-timeSlot-slot-cursor\",\n    },\n};\n\nexport const timeSlot = css`\n    ${tokens.slot.bgColor}: ${Colour[\"bg-stronger\"]};\n    ${tokens.slot.bgColor2}: ${Colour[\"bg-strongest\"]};\n    ${tokens.slot.hoverBgColor}: ${Colour[\"bg-stronger\"]};\n    ${tokens.slot.hoverBgColor2}: ${Colour[\"bg-strongest\"]};\n\n    cursor: var(${tokens.slot.cursor}, default);\n\n    &[data-clickable=\"true\"] {\n        cursor: pointer;\n    }\n\n    &[data-style-type=\"default\"] {\n        background-color: var(${tokens.slot.bgColor});\n    }\n\n    &[data-style-type=\"default\"][data-hoverable=\"true\"] {\n        &:hover {\n            background-color: var(${tokens.slot.hoverBgColor});\n        }\n    }\n\n    &[data-style-type=\"stripes\"] {\n        background: repeating-linear-gradient(\n            135deg,\n            var(${tokens.slot.bgColor2}) 0px,\n            var(${tokens.slot.bgColor2}) 6px,\n            var(${tokens.slot.bgColor}) 6px,\n            var(${tokens.slot.bgColor}) 12px\n        );\n    }\n\n    &[data-style-type=\"stripes\"][data-hoverable=\"true\"] {\n        &:hover {\n            background: repeating-linear-gradient(\n                135deg,\n                var(${tokens.slot.hoverBgColor2}, var(${tokens.slot.bgColor2}))\n                    0px,\n                var(${tokens.slot.hoverBgColor2}, var(${tokens.slot.bgColor2}))\n                    6px,\n                var(${tokens.slot.hoverBgColor}, var(${tokens.slot.bgColor}))\n                    6px,\n                var(${tokens.slot.hoverBgColor}, var(${tokens.slot.bgColor}))\n                    12px\n            );\n        }\n    }\n`;\n"],"names":["tokens","slot","bgColor","bgColor2","hoverBgColor","hoverBgColor2","cursor","timeSlot"],"mappings":"uEAIO,MAAMA,EAAS,CAClBC,KAAM,CACFC,QAAS,uCACTC,SAAU,wCACVC,aAAc,4CACdC,cAAe,6CACfC,OAAQ,wCAIHC,EAAQ"}
+{"version":3,"file":"time-slot.styles.js","sources":["../../../src/shared/time-slot/time-slot.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour } from \"../../theme\";\n\nexport const tokens = {\n    slot: {\n        bgColor: \"--fds-internal-timeSlot-slot-bgColor\",\n        bgColor2: \"--fds-internal-timeSlot-slot-bgColor2\",\n        hoverBgColor: \"--fds-internal-timeSlot-slot-hoverBgColor\",\n        hoverBgColor2: \"--fds-internal-timeSlot-slot-hoverBgColor2\",\n        cursor: \"--fds-internal-timeSlot-slot-cursor\",\n    },\n};\n\nconst stripesGradient = `repeating-linear-gradient(\n    135deg,\n    var(${tokens.slot.bgColor2}) 0px,\n    var(${tokens.slot.bgColor2}) 6px,\n    var(${tokens.slot.bgColor}) 6px,\n    var(${tokens.slot.bgColor}) 12px\n)`;\n\nexport const timeSlot = css`\n    ${tokens.slot.bgColor}: ${Colour[\"bg-stronger\"]};\n    ${tokens.slot.bgColor2}: ${Colour[\"bg-strongest\"]};\n    ${tokens.slot.hoverBgColor}: ${Colour[\"bg-stronger\"]};\n    ${tokens.slot.hoverBgColor2}: ${Colour[\"bg-strongest\"]};\n\n    cursor: var(${tokens.slot.cursor}, default);\n\n    &[data-clickable=\"true\"] {\n        cursor: pointer;\n    }\n\n    &[data-style-type=\"default\"] {\n        background-color: var(${tokens.slot.bgColor});\n    }\n\n    &[data-style-type=\"default\"][data-hoverable=\"true\"] {\n        &:hover {\n            background-color: var(${tokens.slot.hoverBgColor});\n        }\n    }\n\n    &[data-style-type=\"stripes\"] {\n        background: ${stripesGradient};\n    }\n\n    &[data-style-type=\"stripes\"][data-hoverable=\"true\"] {\n        &:hover {\n            background: repeating-linear-gradient(\n                135deg,\n                var(${tokens.slot.hoverBgColor2}, var(${tokens.slot.bgColor2}))\n                    0px,\n                var(${tokens.slot.hoverBgColor2}, var(${tokens.slot.bgColor2}))\n                    6px,\n                var(${tokens.slot.hoverBgColor}, var(${tokens.slot.bgColor}))\n                    6px,\n                var(${tokens.slot.hoverBgColor}, var(${tokens.slot.bgColor}))\n                    12px\n            );\n        }\n    }\n`;\n\nexport const timeSlotHalfFillTop = css`\n    &[data-style-type=\"default\"] {\n        background: linear-gradient(\n            to top,\n            var(${tokens.slot.bgColor}) 50%,\n            ${Colour[\"bg-strongest\"]} 50%\n        );\n    }\n\n    &[data-style-type=\"stripes\"] {\n        background: linear-gradient(\n                to top,\n                transparent 50%,\n                ${Colour[\"bg-strongest\"]} 50%\n            ),\n            ${stripesGradient};\n    }\n`;\n\nexport const timeSlotHalfFillBottom = css`\n    &[data-style-type=\"default\"] {\n        background: linear-gradient(\n            to bottom,\n            var(${tokens.slot.bgColor}) 50%,\n            ${Colour[\"bg-strongest\"]} 50%\n        );\n    }\n\n    &[data-style-type=\"stripes\"] {\n        background: linear-gradient(\n                to bottom,\n                transparent 50%,\n                ${Colour[\"bg-strongest\"]} 50%\n            ),\n            ${stripesGradient};\n    }\n`;\n"],"names":["tokens","slot","bgColor","bgColor2","hoverBgColor","hoverBgColor2","cursor","timeSlot","timeSlotHalfFillTop","timeSlotHalfFillBottom"],"mappings":"uEAIO,MAAMA,EAAS,CAClBC,KAAM,CACFC,QAAS,uCACTC,SAAU,wCACVC,aAAc,4CACdC,cAAe,6CACfC,OAAQ,wCAYHC,EAAQ,UA2CRC,EAAmB,UAmBnBC,EAAsB"}

package/shared/time-slot/time-slot.styles_18s0to7.css

@@ -0,0 +1,29 @@
+.tsti7hb{--fds-internal-timeSlot-slot-bgColor:var(--fds-colour-bg-stronger);--fds-internal-timeSlot-slot-bgColor2:var(--fds-colour-bg-strongest);--fds-internal-timeSlot-slot-hoverBgColor:var(--fds-colour-bg-stronger);--fds-internal-timeSlot-slot-hoverBgColor2:var(--fds-colour-bg-strongest);cursor:var(--fds-internal-timeSlot-slot-cursor, default);}.tsti7hb[data-clickable="true"]{cursor:pointer;}.tsti7hb[data-style-type="default"]{background-color:var(--fds-internal-timeSlot-slot-bgColor);}.tsti7hb[data-style-type="default"][data-hoverable="true"]:hover{background-color:var(--fds-internal-timeSlot-slot-hoverBgColor);}.tsti7hb[data-style-type="stripes"]{background:repeating-linear-gradient(     135deg,     var(--fds-internal-timeSlot-slot-bgColor2) 0px,     var(--fds-internal-timeSlot-slot-bgColor2) 6px,     var(--fds-internal-timeSlot-slot-bgColor) 6px,     var(--fds-internal-timeSlot-slot-bgColor) 12px );}.tsti7hb[data-style-type="stripes"][data-hoverable="true"]:hover{background:repeating-linear-gradient(
+                135deg,
+                var(--fds-internal-timeSlot-slot-hoverBgColor2, var(--fds-internal-timeSlot-slot-bgColor2))
+                    0px,
+                var(--fds-internal-timeSlot-slot-hoverBgColor2, var(--fds-internal-timeSlot-slot-bgColor2))
+                    6px,
+                var(--fds-internal-timeSlot-slot-hoverBgColor, var(--fds-internal-timeSlot-slot-bgColor))
+                    6px,
+                var(--fds-internal-timeSlot-slot-hoverBgColor, var(--fds-internal-timeSlot-slot-bgColor))
+                    12px
+            );}
+.tmgdrss[data-style-type="default"]{background:linear-gradient(
+            to top,
+            var(--fds-internal-timeSlot-slot-bgColor) 50%,
+            var(--fds-colour-bg-strongest) 50%
+        );}.tmgdrss[data-style-type="stripes"]{background:linear-gradient(
+                to top,
+                transparent 50%,
+                var(--fds-colour-bg-strongest) 50%
+            ),repeating-linear-gradient(     135deg,     var(--fds-internal-timeSlot-slot-bgColor2) 0px,     var(--fds-internal-timeSlot-slot-bgColor2) 6px,     var(--fds-internal-timeSlot-slot-bgColor) 6px,     var(--fds-internal-timeSlot-slot-bgColor) 12px );}
+.t31kbad[data-style-type="default"]{background:linear-gradient(
+            to bottom,
+            var(--fds-internal-timeSlot-slot-bgColor) 50%,
+            var(--fds-colour-bg-strongest) 50%
+        );}.t31kbad[data-style-type="stripes"]{background:linear-gradient(
+                to bottom,
+                transparent 50%,
+                var(--fds-colour-bg-strongest) 50%
+            ),repeating-linear-gradient(     135deg,     var(--fds-internal-timeSlot-slot-bgColor2) 0px,     var(--fds-internal-timeSlot-slot-bgColor2) 6px,     var(--fds-internal-timeSlot-slot-bgColor) 6px,     var(--fds-internal-timeSlot-slot-bgColor) 12px );}

package/sidenav/sidenav-drawer-item.styles.js

@@ -1,2 +1,2 @@
-import"./sidenav-drawer-item.styles_yp8cga.css";const e="l1011b8q",t="lmu4z67",c="dlg5ewg",s="c1ey6q8x",d="cpftd7o",a="ttch7cq";export{s as chevronIcon,d as chevronIconExpanded,c as drawerSubitemContainer,e as linkButton,t as linkButtonNoChildren,a as textElement};
+import"./sidenav-drawer-item.styles_1ljnyx2.css";const e="l1011b8q",t="lmu4z67",s="dlg5ewg",c="c1ey6q8x",d="cpftd7o",l="ttch7cq";export{c as chevronIcon,d as chevronIconExpanded,s as drawerSubitemContainer,e as linkButton,t as linkButtonNoChildren,l as textElement};
 //# sourceMappingURL=sidenav-drawer-item.styles.js.map

package/sidenav/sidenav-drawer-item.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidenav-drawer-item.styles.js","sources":["../../src/sidenav/sidenav-drawer-item.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { lineClampCss } from \"../shared/styles\";\nimport { Colour, Font, Motion, Radius } from \"../theme\";\n\n//=============================================================================\n// STYLING\n//=============================================================================\nexport const linkButton = css`\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 1rem;\n\n    width: 100%;\n    padding: 0.75rem 1rem;\n    border-radius: ${Radius[\"md\"]};\n\n    ${Font[\"body-md-semibold\"]}\n    color: ${Colour[\"text\"]};\n\n    &:hover,\n    &:focus {\n        background: ${Colour[\"bg-hover-strong\"]};\n    }\n`;\n\nexport const linkButtonNoChildren = css`\n    &:hover,\n    &:focus {\n        background: ${Colour[\"bg-hover\"]};\n        color: ${Colour[\"text-hover\"]};\n    }\n`;\n\nexport const drawerSubitemContainer = css`\n    margin: 0.125rem 0 0.125rem 0.5rem;\n    overflow: hidden;\n`;\n\nexport const chevronIcon = css`\n    flex-shrink: 0;\n    color: ${Colour[\"icon\"]};\n    transform: rotate(180deg);\n    transition: transform ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n`;\n\nexport const chevronIconExpanded = css`\n    transform: rotate(0deg);\n`;\n\nexport const textElement = css`\n    ${lineClampCss(2)}\n    text-align: left;\n`;\n"],"names":["linkButton","linkButtonNoChildren","drawerSubitemContainer","chevronIcon","chevronIconExpanded","textElement"],"mappings":"uEAQO,MAAMA,EAAU,WAmBVC,EAAoB,UAQpBC,EAAsB,UAKtBC,EAAW,WAOXC,EAAmB,UAInBC,EAAW"}
+{"version":3,"file":"sidenav-drawer-item.styles.js","sources":["../../src/sidenav/sidenav-drawer-item.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { lineClampCss } from \"../shared/styles\";\nimport { Colour, Font, Motion, Radius } from \"../theme\";\n\n//=============================================================================\n// STYLING\n//=============================================================================\nexport const linkButton = css`\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 1rem;\n\n    width: 100%;\n    padding: 0.75rem 1rem;\n    border-radius: ${Radius[\"md\"]};\n\n    ${Font[\"body-md-semibold\"]}\n    color: ${Colour[\"text\"]};\n\n    &:hover,\n    &:focus {\n        background: ${Colour[\"bg-hover-strong\"]};\n    }\n`;\n\nexport const linkButtonNoChildren = css`\n    &:hover,\n    &:focus {\n        background: ${Colour[\"bg-hover\"]};\n        color: ${Colour[\"text-hover\"]};\n    }\n`;\n\nexport const drawerSubitemContainer = css`\n    margin: 0.125rem 0 0.125rem 0.5rem;\n    overflow: hidden;\n`;\n\nexport const chevronIcon = css`\n    flex-shrink: 0;\n    color: ${Colour[\"icon\"]};\n    transform: rotate(180deg);\n    transition: transform ${Motion[\"duration-150\"]} ${Motion[\"ease-default\"]};\n`;\n\nexport const chevronIconExpanded = css`\n    transform: rotate(0deg);\n`;\n\nexport const textElement = css`\n    ${lineClampCss(2)}\n    text-align: left;\n`;\n"],"names":["linkButton","linkButtonNoChildren","drawerSubitemContainer","chevronIcon","chevronIconExpanded","textElement"],"mappings":"wEAQO,MAAMA,EAAU,WAmBVC,EAAoB,UAQpBC,EAAsB,UAKtBC,EAAW,WAOXC,EAAmB,UAInBC,EAAW"}

package/sidenav/{sidenav-drawer-item.styles_yp8cga.css → sidenav-drawer-item.styles_1ljnyx2.css}

@@ -1,4 +1,4 @@
-.l1011b8q{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;gap:1rem;width:100%;padding:0.75rem 1rem;border-radius:var(--fds-radius-md);font-family:var(--fds-font-family);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);color:var(--fds-colour-text);}.l1011b8q:hover,.l1011b8q:focus{background:var(--fds-colour-bg-hover-strong);}
+.l1011b8q{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;gap:1rem;width:100%;padding:0.75rem 1rem;border-radius:var(--fds-radius-md);font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-semibold);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);color:var(--fds-colour-text);}.l1011b8q:hover,.l1011b8q:focus{background:var(--fds-colour-bg-hover-strong);}
 .lmu4z67:hover,.lmu4z67:focus{background:var(--fds-colour-bg-hover);color:var(--fds-colour-text-hover);}
 .dlg5ewg{margin:0.125rem 0 0.125rem 0.5rem;overflow:hidden;}
 .c1ey6q8x{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;color:var(--fds-colour-icon);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:-webkit-transform var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:transform var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);}

package/sidenav/sidenav-drawer-subitem.styles.js

@@ -1,2 +1,2 @@
-import"./sidenav-drawer-subitem.styles_1ylzfn5.css";const s="l1ge7as9";export{s as linkButton};
+import"./sidenav-drawer-subitem.styles_2y58kf.css";const s="l1ge7as9";export{s as linkButton};
 //# sourceMappingURL=sidenav-drawer-subitem.styles.js.map

package/sidenav/sidenav-drawer-subitem.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidenav-drawer-subitem.styles.js","sources":["../../src/sidenav/sidenav-drawer-subitem.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { lineClampCss } from \"../shared/styles\";\nimport { Colour, Font, Radius } from \"../theme\";\n\n//=============================================================================\n// STYLING\n//=============================================================================\nexport const linkButton = css`\n    width: 100%;\n    padding: 0.75rem 1rem;\n    border-radius: ${Radius[\"md\"]};\n\n    ${Font[\"body-md-regular\"]}\n    color: ${Colour[\"text\"]};\n    ${lineClampCss(2)}\n    text-align: left;\n\n    &:hover,\n    &:focus {\n        background-color: ${Colour[\"bg-hover\"]};\n        color: ${Colour[\"text-hover\"]};\n    }\n`;\n"],"names":["linkButton"],"mappings":"2EAQO,MAAMA,EAAU"}
+{"version":3,"file":"sidenav-drawer-subitem.styles.js","sources":["../../src/sidenav/sidenav-drawer-subitem.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { lineClampCss } from \"../shared/styles\";\nimport { Colour, Font, Radius } from \"../theme\";\n\n//=============================================================================\n// STYLING\n//=============================================================================\nexport const linkButton = css`\n    width: 100%;\n    padding: 0.75rem 1rem;\n    border-radius: ${Radius[\"md\"]};\n\n    ${Font[\"body-md-regular\"]}\n    color: ${Colour[\"text\"]};\n    ${lineClampCss(2)}\n    text-align: left;\n\n    &:hover,\n    &:focus {\n        background-color: ${Colour[\"bg-hover\"]};\n        color: ${Colour[\"text-hover\"]};\n    }\n`;\n"],"names":["linkButton"],"mappings":"0EAQO,MAAMA,EAAU"}

package/sidenav/sidenav-drawer-subitem.styles_2y58kf.css

@@ -0,0 +1 @@
+.l1ge7as9{width:100%;padding:0.75rem 1rem;border-radius:var(--fds-radius-md);font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);color:var(--fds-colour-text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-align:left;}.l1ge7as9:hover,.l1ge7as9:focus{background-color:var(--fds-colour-bg-hover);color:var(--fds-colour-text-hover);}

package/sidenav/sidenav-item.styles.js

@@ -1,2 +1,2 @@
-import"./sidenav-item.styles_1eew8px.css";const s="cfxt5d9",e="i1rznncx",d="tegzrsi",t="d5cbs2m",c="d1g4locu",i="d1ao5fhb",n="d1m7u3sj";export{s as container,t as defaultButton,c as defaultButtonHighlight,i as desktopDrawer,n as desktopDrawerShowShadow,e as iconContainer,d as titleText};
+import"./sidenav-item.styles_lqw3kh.css";const s="cfxt5d9",d="i1rznncx",t="tegzrsi",c="d5cbs2m",e="d1g4locu",i="d1ao5fhb",n="d1m7u3sj";export{s as container,c as defaultButton,e as defaultButtonHighlight,i as desktopDrawer,n as desktopDrawerShowShadow,d as iconContainer,t as titleText};
 //# sourceMappingURL=sidenav-item.styles.js.map

package/sidenav/sidenav-item.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidenav-item.styles.js","sources":["../../src/sidenav/sidenav-item.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { lineClampCss } from \"../shared/styles\";\nimport { Border, Colour, Font, Motion, Radius, Shadow } from \"../theme\";\n\n//=============================================================================\n// STYLING\n//=============================================================================\nexport const container = css`\n    width: 100%;\n`;\n\nexport const iconContainer = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    padding: 0.25rem 1rem;\n    border-radius: ${Radius[\"md\"]};\n    color: ${Colour[\"icon-primary\"]};\n    transition: ${Motion[\"duration-250\"]} ${Motion[\"ease-default\"]};\n\n    svg {\n        height: 1.25rem;\n        width: 1.25rem;\n    }\n`;\n\nexport const titleText = css`\n    ${lineClampCss(2)}\n    margin-top: 0.25rem;\n    transition: ${Motion[\"duration-250\"]} ${Motion[\"ease-default\"]};\n`;\n\nexport const defaultButton = css`\n    width: 100%;\n    margin-top: 1rem;\n    cursor: pointer;\n\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n\n    &:hover,\n    &:focus {\n        .${iconContainer} {\n            background-color: ${Colour[\"bg-hover\"]};\n        }\n\n        .${titleText} {\n            ${Font[\"body-xs-semibold\"]}\n            color: ${Colour[\"text-hover\"]};\n        }\n    }\n`;\n\nexport const defaultButtonHighlight = css`\n    .${iconContainer} {\n        background-color: ${Colour[\"bg-hover\"]};\n    }\n\n    .${titleText} {\n        ${Font[\"body-xs-semibold\"]}\n        color: ${Colour[\"text-selected\"]};\n    }\n`;\n\nexport const desktopDrawer = css`\n    list-style: none;\n    display: flex;\n    flex-direction: column;\n    overflow: auto;\n    width: 15rem;\n    height: 100%;\n    padding: 1rem 0.5rem;\n    background-color: ${Colour[\"bg-primary-subtlest\"]};\n    border-top-right-radius: ${Radius[\"md\"]};\n    border-bottom-right-radius: ${Radius[\"md\"]};\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${Colour[\"border\"]};\n`;\n\nexport const desktopDrawerShowShadow = css`\n    box-shadow: ${Shadow[\"xs-subtle\"]};\n    clip-path: inset(0 -6px 0 0);\n`;\n"],"names":["container","iconContainer","titleText","defaultButton","defaultButtonHighlight","desktopDrawer","desktopDrawerShowShadow"],"mappings":"iEAQO,MAAMA,EAAS,UAITC,EAAa,WAgBbC,EAAS,UAMTC,EAAa,UAuBbC,EAAsB,WAWtBC,EAAa,WAcbC,EAAuB"}
+{"version":3,"file":"sidenav-item.styles.js","sources":["../../src/sidenav/sidenav-item.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { lineClampCss } from \"../shared/styles\";\nimport { Border, Colour, Font, Motion, Radius, Shadow } from \"../theme\";\n\n//=============================================================================\n// STYLING\n//=============================================================================\nexport const container = css`\n    width: 100%;\n`;\n\nexport const iconContainer = css`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n\n    padding: 0.25rem 1rem;\n    border-radius: ${Radius[\"md\"]};\n    color: ${Colour[\"icon-primary\"]};\n    transition: ${Motion[\"duration-250\"]} ${Motion[\"ease-default\"]};\n\n    svg {\n        height: 1.25rem;\n        width: 1.25rem;\n    }\n`;\n\nexport const titleText = css`\n    ${lineClampCss(2)}\n    margin-top: 0.25rem;\n    transition: ${Motion[\"duration-250\"]} ${Motion[\"ease-default\"]};\n`;\n\nexport const defaultButton = css`\n    width: 100%;\n    margin-top: 1rem;\n    cursor: pointer;\n\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    align-items: center;\n\n    &:hover,\n    &:focus {\n        .${iconContainer} {\n            background-color: ${Colour[\"bg-hover\"]};\n        }\n\n        .${titleText} {\n            ${Font[\"body-xs-semibold\"]}\n            color: ${Colour[\"text-hover\"]};\n        }\n    }\n`;\n\nexport const defaultButtonHighlight = css`\n    .${iconContainer} {\n        background-color: ${Colour[\"bg-hover\"]};\n    }\n\n    .${titleText} {\n        ${Font[\"body-xs-semibold\"]}\n        color: ${Colour[\"text-selected\"]};\n    }\n`;\n\nexport const desktopDrawer = css`\n    list-style: none;\n    display: flex;\n    flex-direction: column;\n    overflow: auto;\n    width: 15rem;\n    height: 100%;\n    padding: 1rem 0.5rem;\n    background-color: ${Colour[\"bg-primary-subtlest\"]};\n    border-top-right-radius: ${Radius[\"md\"]};\n    border-bottom-right-radius: ${Radius[\"md\"]};\n    border: ${Border[\"width-010\"]} ${Border[\"solid\"]} ${Colour[\"border\"]};\n`;\n\nexport const desktopDrawerShowShadow = css`\n    box-shadow: ${Shadow[\"xs-subtle\"]};\n    clip-path: inset(0 -6px 0 0);\n`;\n"],"names":["container","iconContainer","titleText","defaultButton","defaultButtonHighlight","desktopDrawer","desktopDrawerShowShadow"],"mappings":"gEAQO,MAAMA,EAAS,UAITC,EAAa,WAgBbC,EAAS,UAMTC,EAAa,UAuBbC,EAAsB,WAWtBC,EAAa,WAcbC,EAAuB"}

package/sidenav/{sidenav-item.styles_1eew8px.css → sidenav-item.styles_lqw3kh.css}

@@ -1,7 +1,7 @@
 .cfxt5d9{width:100%;}
 .i1rznncx{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;padding:0.25rem 1rem;border-radius:var(--fds-radius-md);color:var(--fds-colour-icon-primary);-webkit-transition:var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);transition:var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);}.i1rznncx svg{height:1.25rem;width:1.25rem;}
 .tegzrsi{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:0.25rem;-webkit-transition:var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);transition:var(--fds-motion-duration-250) var(--fds-motion-timing-ease-default);}
-.d5cbs2m{width:100%;margin-top:1rem;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.d5cbs2m:hover .i1rznncx,.d5cbs2m:focus .i1rznncx{background-color:var(--fds-colour-bg-hover);}.d5cbs2m:hover .tegzrsi,.d5cbs2m:focus .tegzrsi{font-family:var(--fds-font-family);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);color:var(--fds-colour-text-hover);}
-.d1g4locu .i1rznncx{background-color:var(--fds-colour-bg-hover);}.d1g4locu .tegzrsi{font-family:var(--fds-font-family);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);color:var(--fds-colour-text-selected);}
+.d5cbs2m{width:100%;margin-top:1rem;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.d5cbs2m:hover .i1rznncx,.d5cbs2m:focus .i1rznncx{background-color:var(--fds-colour-bg-hover);}.d5cbs2m:hover .tegzrsi,.d5cbs2m:focus .tegzrsi{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);color:var(--fds-colour-text-hover);}
+.d1g4locu .i1rznncx{background-color:var(--fds-colour-bg-hover);}.d1g4locu .tegzrsi{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);color:var(--fds-colour-text-selected);}
 .d1ao5fhb{list-style:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;overflow:auto;width:15rem;height:100%;padding:1rem 0.5rem;background-color:var(--fds-colour-bg-primary-subtlest);border-top-right-radius:var(--fds-radius-md);border-bottom-right-radius:var(--fds-radius-md);border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}
 .d1m7u3sj{box-shadow:var(--fds-shadow-xs-subtle);-webkit-clip-path:inset(0 -6px 0 0);clip-path:inset(0 -6px 0 0);}

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

@@ -1,2 +1,2 @@
-import"./smart-app-banner.styles_m5dtgh.css";const r={container:{top:"--fds-internal-smartAppBanner-container-top"}},t="s4qb553",s="s1yw94wd",n="s1gji45a",a="s9k7xr8",p="dmwiwc",e="d1cy2w47",m="cp9l7rn",c="pdjtkx9",d="t7s9qr2",o="bece00m",i="b1ti1r81",b="b1rqz1xr",g="tmo9z7m",w="dp7x5g3",x="r1gggq6r",q="sda01s1";export{o as bannerIcon,b as button,i as buttonContainer,m as cross,w as description,e as dismissButton,p as dismissContainer,c as proceedContainer,x as ratingContainer,t as smartAppBannerContainer,a as smartAppBannerContainerAnimated,n as smartAppBannerContainerDark,s as smartAppBannerContainerLight,q as starIcon,d as textContainer,g as title,r as tokens};
+import"./smart-app-banner.styles_15u6yv4.css";const r={container:{top:"--fds-internal-smartAppBanner-container-top"}},s="s4qb553",t="s1yw94wd",n="s1gji45a",a="s9k7xr8",p="dmwiwc",e="d1cy2w47",c="cp9l7rn",m="pdjtkx9",o="t7s9qr2",d="bece00m",i="b1ti1r81",b="b1rqz1xr",g="tmo9z7m",w="dp7x5g3",x="r1gggq6r",q="sda01s1";export{d as bannerIcon,b as button,i as buttonContainer,c as cross,w as description,e as dismissButton,p as dismissContainer,m as proceedContainer,x as ratingContainer,s as smartAppBannerContainer,a as smartAppBannerContainerAnimated,n as smartAppBannerContainerDark,t as smartAppBannerContainerLight,q as starIcon,o as textContainer,g as title,r as tokens};
 //# sourceMappingURL=smart-app-banner.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"smart-app-banner.styles.js","sources":["../../src/smart-app-banner/smart-app-banner.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, MediaQuery, Radius, Shadow } from \"../theme\";\n\nexport const tokens = {\n    container: {\n        top: \"--fds-internal-smartAppBanner-container-top\",\n    },\n};\n\nexport const smartAppBannerContainer = css`\n    display: flex;\n    flex-direction: row-reverse;\n    align-items: stretch;\n    position: fixed;\n    margin: 0.5rem 1.25rem;\n    ${tokens.container.top}: initial;\n    top: var(${tokens.container.top});\n    left: 0;\n    width: calc(100% - 2.5rem);\n    min-height: 5.5rem;\n    z-index: 9001;\n    background: ${Colour.bg};\n    border-radius: ${Radius.md};\n`;\n\nexport const smartAppBannerContainerLight = css`\n    box-shadow: ${Shadow[\"md-subtle\"]};\n`;\n\nexport const smartAppBannerContainerDark = css`\n    border: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\nexport const smartAppBannerContainerAnimated = css`\n    @keyframes smart-app-banner-slide-down {\n        from {\n            opacity: 0;\n            transform: translateY(-20%);\n        }\n        to {\n            opacity: 1;\n            transform: translateY(0);\n        }\n    }\n    animation: smart-app-banner-slide-down 0.3s;\n`;\n\nexport const dismissContainer = css`\n    display: flex;\n    align-items: center;\n    padding: 0.5rem 0.25rem 0.5rem 1rem;\n`;\n\nexport const dismissButton = css`\n    padding: 0;\n`;\n\nexport const cross = css`\n    color: ${Colour.icon};\n    height: 1.25rem;\n    width: 1.25rem;\n`;\n\nexport const proceedContainer = css`\n    flex: 1;\n    display: flex;\n    align-items: center;\n    padding: 0.5rem 1rem 0.5rem 0.25rem;\n    cursor: pointer;\n`;\n\nexport const textContainer = css`\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    align-items: left;\n    margin: 0.5rem;\n    ${MediaQuery.MaxWidth.xs} {\n        margin: 0 0.5rem;\n    }\n`;\n\nexport const bannerIcon = css`\n    width: 2.65rem;\n    height: auto;\n    align-self: center;\n`;\n\nexport const buttonContainer = css`\n    max-width: 30%;\n`;\n\nexport const button = css`\n    padding: 0.5rem;\n    height: auto;\n    & > span {\n        overflow-wrap: anywhere;\n        ${Font[\"body-xs-semibold\"]}\n    }\n`;\n\nexport const title = css`\n    font-weight: ${Font.Spec[\"weight-bold\"]};\n    overflow-wrap: anywhere;\n    ${MediaQuery.MaxWidth.xs} {\n        ${Font[\"body-xs-bold\"]}\n    }\n`;\n\nexport const description = css`\n    overflow-wrap: anywhere;\n`;\n\nexport const ratingContainer = css`\n    margin-top: 0.25rem;\n    display: flex;\n    align-items: center;\n`;\n\nexport const starIcon = css`\n    height: 2rem;\n    width: 2rem;\n    padding-right: 0.25rem;\n    color: #ffc107;\n`;\n"],"names":["tokens","container","top","smartAppBannerContainer","smartAppBannerContainerLight","smartAppBannerContainerDark","smartAppBannerContainerAnimated","dismissContainer","dismissButton","cross","proceedContainer","textContainer","bannerIcon","buttonContainer","button","title","description","ratingContainer","starIcon"],"mappings":"6EAIO,MAAMA,EAAS,CAClBC,UAAW,CACPC,IAAK,gDAIAC,EAAuB,UAgBvBC,EAA4B,WAI5BC,EAA2B,WAI3BC,EAA+B,UAc/BC,EAAgB,SAMhBC,EAAa,WAIbC,EAAK,UAMLC,EAAgB,UAQhBC,EAAa,UAWbC,EAAU,UAMVC,EAAe,WAIfC,EAAM,WASNC,EAAK,UAQLC,EAAW,UAIXC,EAAe,WAMfC,EAAQ"}
+{"version":3,"file":"smart-app-banner.styles.js","sources":["../../src/smart-app-banner/smart-app-banner.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Border, Colour, Font, MediaQuery, Radius, Shadow } from \"../theme\";\n\nexport const tokens = {\n    container: {\n        top: \"--fds-internal-smartAppBanner-container-top\",\n    },\n};\n\nexport const smartAppBannerContainer = css`\n    display: flex;\n    flex-direction: row-reverse;\n    align-items: stretch;\n    position: fixed;\n    margin: 0.5rem 1.25rem;\n    ${tokens.container.top}: initial;\n    top: var(${tokens.container.top});\n    left: 0;\n    width: calc(100% - 2.5rem);\n    min-height: 5.5rem;\n    z-index: 9001;\n    background: ${Colour.bg};\n    border-radius: ${Radius.md};\n`;\n\nexport const smartAppBannerContainerLight = css`\n    box-shadow: ${Shadow[\"md-subtle\"]};\n`;\n\nexport const smartAppBannerContainerDark = css`\n    border: ${Border[\"width-010\"]} ${Border.solid} ${Colour.border};\n`;\n\nexport const smartAppBannerContainerAnimated = css`\n    @keyframes smart-app-banner-slide-down {\n        from {\n            opacity: 0;\n            transform: translateY(-20%);\n        }\n        to {\n            opacity: 1;\n            transform: translateY(0);\n        }\n    }\n    animation: smart-app-banner-slide-down 0.3s;\n`;\n\nexport const dismissContainer = css`\n    display: flex;\n    align-items: center;\n    padding: 0.5rem 0.25rem 0.5rem 1rem;\n`;\n\nexport const dismissButton = css`\n    padding: 0;\n`;\n\nexport const cross = css`\n    color: ${Colour.icon};\n    height: 1.25rem;\n    width: 1.25rem;\n`;\n\nexport const proceedContainer = css`\n    flex: 1;\n    display: flex;\n    align-items: center;\n    padding: 0.5rem 1rem 0.5rem 0.25rem;\n    cursor: pointer;\n`;\n\nexport const textContainer = css`\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    align-items: left;\n    margin: 0.5rem;\n    ${MediaQuery.MaxWidth.xs} {\n        margin: 0 0.5rem;\n    }\n`;\n\nexport const bannerIcon = css`\n    width: 2.65rem;\n    height: auto;\n    align-self: center;\n`;\n\nexport const buttonContainer = css`\n    max-width: 30%;\n`;\n\nexport const button = css`\n    padding: 0.5rem;\n    height: auto;\n    & > span {\n        overflow-wrap: anywhere;\n        ${Font[\"body-xs-semibold\"]}\n    }\n`;\n\nexport const title = css`\n    font-weight: ${Font.Spec[\"weight-bold\"]};\n    overflow-wrap: anywhere;\n    ${MediaQuery.MaxWidth.xs} {\n        ${Font[\"body-xs-bold\"]}\n    }\n`;\n\nexport const description = css`\n    overflow-wrap: anywhere;\n`;\n\nexport const ratingContainer = css`\n    margin-top: 0.25rem;\n    display: flex;\n    align-items: center;\n`;\n\nexport const starIcon = css`\n    height: 2rem;\n    width: 2rem;\n    padding-right: 0.25rem;\n    color: #ffc107;\n`;\n"],"names":["tokens","container","top","smartAppBannerContainer","smartAppBannerContainerLight","smartAppBannerContainerDark","smartAppBannerContainerAnimated","dismissContainer","dismissButton","cross","proceedContainer","textContainer","bannerIcon","buttonContainer","button","title","description","ratingContainer","starIcon"],"mappings":"8EAIO,MAAMA,EAAS,CAClBC,UAAW,CACPC,IAAK,gDAIAC,EAAuB,UAgBvBC,EAA4B,WAI5BC,EAA2B,WAI3BC,EAA+B,UAc/BC,EAAgB,SAMhBC,EAAa,WAIbC,EAAK,UAMLC,EAAgB,UAQhBC,EAAa,UAWbC,EAAU,UAMVC,EAAe,WAIfC,EAAM,WASNC,EAAK,UAQLC,EAAW,UAIXC,EAAe,WAMfC,EAAQ"}

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

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

package/tab/tab-link-chain.styles.js

@@ -1,2 +1,2 @@
-import"./tab-link-chain.styles_1nreqrp.css";const c={chainItem:{width:"--fds-internal-tab-chainItem-width"}},t="c16oikpn",i="c2536gp",n="c1c3wbud",s="cdfiwt",d="fxd8c9t",a="c1gdrjx",e="cj41vce",l="lmiq2g0",r="l1yi6azs",b="d97pn0z",h="d1v8j9lw",p="s5l4m4t",m="shqgesl",w="c1r7bbxk";export{t as chain,i as chainFullWidthIndicator,n as chainItem,s as chainItemActive,a as chainLink,e as chainLinkReversed,w as customFadeWrapper,b as deselectedLabel,h as deselectedLabelActive,d as flexRow,r as label,l as labelContainer,p as selectedLabel,m as selectedLabelActive,c as tokens};
+import"./tab-link-chain.styles_49got4.css";const t={chainItem:{width:"--fds-internal-tab-chainItem-width"}},c="c16oikpn",i="c2536gp",s="c1c3wbud",d="cdfiwt",n="fxd8c9t",a="c1gdrjx",l="cj41vce",e="lmiq2g0",b="l1yi6azs",h="d97pn0z",g="d1v8j9lw",m="s5l4m4t",o="shqgesl",p="c1r7bbxk";export{c as chain,i as chainFullWidthIndicator,s as chainItem,d as chainItemActive,a as chainLink,l as chainLinkReversed,p as customFadeWrapper,h as deselectedLabel,g as deselectedLabelActive,n as flexRow,b as label,e as labelContainer,m as selectedLabel,o as selectedLabelActive,t as tokens};
 //# sourceMappingURL=tab-link-chain.styles.js.map

package/tab/tab-link-chain.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab-link-chain.styles.js","sources":["../../src/tab/tab-link-chain.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport {\n    Border,\n    Colour,\n    Font,\n    MediaQuery,\n    Radius,\n    Spacing,\n} from \"../theme/tokens\";\n\nexport const tokens = {\n    chainItem: {\n        width: \"--fds-internal-tab-chainItem-width\",\n    },\n};\n\nexport const chain = css`\n    display: inline-flex;\n    width: 100%;\n    list-style-type: none;\n`;\n\nexport const chainFullWidthIndicator = css`\n    &::after {\n        content: \"\";\n        height: inherit;\n        flex-grow: 1;\n        /* follows the border in ChainItem */\n        border-bottom: ${Border[\"width-040\"]} ${Border.solid} ${Colour.border};\n    }\n`;\n\nexport const chainItem = css`\n    display: flex;\n    justify-content: center;\n    flex-shrink: 0;\n    border-bottom: ${Border[\"width-040\"]} ${Border.solid} ${Colour.border};\n    ${tokens.chainItem.width}: initial;\n    width: var(${tokens.chainItem.width}, auto);\n\n    ${MediaQuery.MaxWidth.sm} {\n        flex: 1;\n        justify-content: center;\n    }\n`;\n\nexport const chainItemActive = css`\n    border-color: ${Colour[\"border-primary\"]};\n`;\n\nexport const flexRow = css`\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n`;\n\nexport const chainLink = css`\n    /* position: relative; */\n    flex-direction: row;\n    gap: 0.5rem;\n    padding: ${Spacing[\"spacing-16\"]} ${Spacing[\"spacing-16\"]}\n        ${Spacing[\"spacing-20\"]};\n    cursor: pointer;\n    width: 100%;\n    justify-content: center;\n\n    &:focus-within {\n        outline: 2px solid ${Colour[\"focus-ring\"]};\n        outline-offset: -2px;\n        border-radius: ${Radius.sm};\n    }\n`;\n\nexport const chainLinkReversed = css`\n    flex-direction: row-reverse;\n`;\n\nexport const labelContainer = css`\n    position: relative;\n`;\n\nexport const label = css`\n    border: none;\n    background: none;\n\n    ${MediaQuery.MaxWidth.sm} {\n        max-width: 20ch;\n        text-overflow: ellipsis;\n        overflow: hidden;\n        white-space: nowrap;\n    }\n`;\n\nexport const deselectedLabel = css`\n    position: absolute;\n    ${Font[\"body-baseline-regular\"]}\n    color: ${Colour[\"text-subtler\"]};\n    opacity: 1;\n`;\n\nexport const deselectedLabelActive = css`\n    opacity: 0;\n`;\n\nexport const selectedLabel = css`\n    ${Font[\"body-baseline-semibold\"]}\n    color: ${Colour[\"text-primary\"]};\n    opacity: 0;\n    outline: none;\n\n    ${MediaQuery.MaxWidth.sm} {\n        max-width: 20ch;\n        text-overflow: ellipsis;\n        overflow: hidden;\n        white-space: nowrap;\n    }\n`;\n\nexport const selectedLabelActive = css`\n    opacity: 1;\n`;\n\nexport const customFadeWrapper = css`\n    [data-id=\"left-fade-indicator-button\"],\n    [data-id=\"right-fade-indicator-button\"] {\n        margin-bottom: ${Spacing[\"spacing-4\"]};\n    }\n`;\n"],"names":["tokens","chainItem","width","chain","chainFullWidthIndicator","chainItemActive","flexRow","chainLink","chainLinkReversed","labelContainer","label","deselectedLabel","deselectedLabelActive","selectedLabel","selectedLabelActive","customFadeWrapper"],"mappings":"+DAWO,MAAMA,EAAS,CAClBC,UAAW,CACPC,MAAO,uCAIFC,EAAK,WAMLC,EAAuB,UAUvBH,EAAS,WAcTI,EAAe,SAIfC,EAAO,UAMPC,EAAS,UAiBTC,EAAiB,UAIjBC,EAAc,UAIdC,EAAK,WAYLC,EAAe,UAOfC,EAAqB,WAIrBC,EAAa,UAcbC,EAAmB,UAInBC,EAAiB"}
+{"version":3,"file":"tab-link-chain.styles.js","sources":["../../src/tab/tab-link-chain.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport {\n    Border,\n    Colour,\n    Font,\n    MediaQuery,\n    Radius,\n    Spacing,\n} from \"../theme/tokens\";\n\nexport const tokens = {\n    chainItem: {\n        width: \"--fds-internal-tab-chainItem-width\",\n    },\n};\n\nexport const chain = css`\n    display: inline-flex;\n    width: 100%;\n    list-style-type: none;\n`;\n\nexport const chainFullWidthIndicator = css`\n    &::after {\n        content: \"\";\n        height: inherit;\n        flex-grow: 1;\n        /* follows the border in ChainItem */\n        border-bottom: ${Border[\"width-040\"]} ${Border.solid} ${Colour.border};\n    }\n`;\n\nexport const chainItem = css`\n    display: flex;\n    justify-content: center;\n    flex-shrink: 0;\n    border-bottom: ${Border[\"width-040\"]} ${Border.solid} ${Colour.border};\n    ${tokens.chainItem.width}: initial;\n    width: var(${tokens.chainItem.width}, auto);\n\n    ${MediaQuery.MaxWidth.sm} {\n        flex: 1;\n        justify-content: center;\n    }\n`;\n\nexport const chainItemActive = css`\n    border-color: ${Colour[\"border-primary\"]};\n`;\n\nexport const flexRow = css`\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n`;\n\nexport const chainLink = css`\n    /* position: relative; */\n    flex-direction: row;\n    gap: 0.5rem;\n    padding: ${Spacing[\"spacing-16\"]} ${Spacing[\"spacing-16\"]}\n        ${Spacing[\"spacing-20\"]};\n    cursor: pointer;\n    width: 100%;\n    justify-content: center;\n\n    &:focus-within {\n        outline: 2px solid ${Colour[\"focus-ring\"]};\n        outline-offset: -2px;\n        border-radius: ${Radius.sm};\n    }\n`;\n\nexport const chainLinkReversed = css`\n    flex-direction: row-reverse;\n`;\n\nexport const labelContainer = css`\n    position: relative;\n`;\n\nexport const label = css`\n    border: none;\n    background: none;\n\n    ${MediaQuery.MaxWidth.sm} {\n        max-width: 20ch;\n        text-overflow: ellipsis;\n        overflow: hidden;\n        white-space: nowrap;\n    }\n`;\n\nexport const deselectedLabel = css`\n    position: absolute;\n    ${Font[\"body-baseline-regular\"]}\n    color: ${Colour[\"text-subtler\"]};\n    opacity: 1;\n`;\n\nexport const deselectedLabelActive = css`\n    opacity: 0;\n`;\n\nexport const selectedLabel = css`\n    ${Font[\"body-baseline-semibold\"]}\n    color: ${Colour[\"text-primary\"]};\n    opacity: 0;\n    outline: none;\n\n    ${MediaQuery.MaxWidth.sm} {\n        max-width: 20ch;\n        text-overflow: ellipsis;\n        overflow: hidden;\n        white-space: nowrap;\n    }\n`;\n\nexport const selectedLabelActive = css`\n    opacity: 1;\n`;\n\nexport const customFadeWrapper = css`\n    [data-id=\"left-fade-indicator-button\"],\n    [data-id=\"right-fade-indicator-button\"] {\n        margin-bottom: ${Spacing[\"spacing-4\"]};\n    }\n`;\n"],"names":["tokens","chainItem","width","chain","chainFullWidthIndicator","chainItemActive","flexRow","chainLink","chainLinkReversed","labelContainer","label","deselectedLabel","deselectedLabelActive","selectedLabel","selectedLabelActive","customFadeWrapper"],"mappings":"8DAWO,MAAMA,EAAS,CAClBC,UAAW,CACPC,MAAO,uCAIFC,EAAK,WAMLC,EAAuB,UAUvBH,EAAS,WAcTI,EAAe,SAIfC,EAAO,UAMPC,EAAS,UAiBTC,EAAiB,UAIjBC,EAAc,UAIdC,EAAK,WAYLC,EAAe,UAOfC,EAAqB,WAIrBC,EAAa,UAcbC,EAAmB,UAInBC,EAAiB"}

package/tab/{tab-link-chain.styles_1nreqrp.css → tab-link-chain.styles_49got4.css}

@@ -7,8 +7,8 @@
 .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);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;}
+.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);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;}
+.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/tag/tag.style.js

@@ -1,2 +1,2 @@
-import"./tag.style_10tn8i.css";const w="w6gjrz2",t="w3k7rkk",k="w1bpyu8a",a="wq3qkg6",g="w12fv5tt",o="w1358sxl",s="w1oi4bgz",i="wpja2at",p="wgwk3g6",r="wb0avxu",b="wn4wzi4",c="wyfwkab",j="wocomht",y="w17cj89j",_="wutpo14",l="w1t1mrk9",m="l1sykhdi";export{m as label,w as wrapper,t as wrapperInteractive,l as wrapperOutlineBlack,y as wrapperOutlineBlue,b as wrapperOutlineGreen,r as wrapperOutlineGrey,_ as wrapperOutlinePrimary,j as wrapperOutlineRed,c as wrapperOutlineYellow,p as wrapperSolidBlack,s as wrapperSolidBlue,a as wrapperSolidGreen,k as wrapperSolidGrey,i as wrapperSolidPrimary,o as wrapperSolidRed,g as wrapperSolidYellow};
+import"./tag.style_d98c53.css";const w="w6gjrz2",t="w3k7rkk",k="w1bpyu8a",a="wq3qkg6",g="w12fv5tt",o="w1358sxl",s="w1oi4bgz",c="wpja2at",p="wgwk3g6",r="wb0avxu",b="wn4wzi4",i="wyfwkab",j="wocomht",y="w17cj89j",_="wutpo14",l="w1t1mrk9",m="l1sykhdi";export{m as label,w as wrapper,t as wrapperInteractive,l as wrapperOutlineBlack,y as wrapperOutlineBlue,b as wrapperOutlineGreen,r as wrapperOutlineGrey,_ as wrapperOutlinePrimary,j as wrapperOutlineRed,i as wrapperOutlineYellow,p as wrapperSolidBlack,s as wrapperSolidBlue,a as wrapperSolidGreen,k as wrapperSolidGrey,c as wrapperSolidPrimary,o as wrapperSolidRed,g as wrapperSolidYellow};
 //# sourceMappingURL=tag.style.js.map

package/tag/{tag.style_10tn8i.css → tag.style_d98c53.css}

@@ -1,5 +1,5 @@
-.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);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);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;}
+.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);}}

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

@@ -1,2 +1,2 @@
-import"./text-list.styles_1gohl3f.css";const t={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"},e="l1oajjj5",r={"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"},d="o1gavxb4",s="o1s96hsr",i="o14yxjmu",o="u1kb1ugb",n="u1fq31t2";export{e as listBase,r as listSize,d as orderedList,i as orderedListCustomStart,s as orderedListReversed,t as tokens,o as unorderedList,n as unorderedListCustomIcon};
+import"./text-list.styles_w3fvyt.css";const t={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"},e="l1oajjj5",r={"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"},d="o1gavxb4",s="o1s96hsr",i="o14yxjmu",o="u1kb1ugb",n="u1fq31t2";export{e as listBase,r as listSize,d as orderedList,i as orderedListCustomStart,s as orderedListReversed,t as tokens,o as unorderedList,n as unorderedListCustomIcon};
 //# sourceMappingURL=text-list.styles.js.map

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

@@ -1 +1 @@
-{"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":["tokens","listBottomMargin","orderedListCounterStyle","orderedListCounterSeparator","orderedListStartValue","unorderedListBulletType","listBase","listSize","orderedList","orderedListReversed","orderedListCustomStart","unorderedList","unorderedListCustomIcon"],"mappings":"gEAKO,MAAMA,EAAS,CAClBC,iBAAkB,4CAClBC,wBAAyB,mDACzBC,4BACI,uDACJC,sBAAuB,iDACvBC,wBAAyB,oDAGhBC,EAAQ,WAkBRC,EAAyC,CAClD,cAAa,WAGb,aAAY,UAGZ,aAAY,UAGZ,aAAY,UAGZ,aAAY,UAGZ,aAAY,UAGZ,gBAAe,SAGf,UAAS,UAGT,UAAS,WAGT,UAAS,WAKAC,EAAW,WA4BXC,EAAmB,WAMnBC,EAAsB,WAItBC,EAAa,WAKbC,EAAuB"}
+{"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":["tokens","listBottomMargin","orderedListCounterStyle","orderedListCounterSeparator","orderedListStartValue","unorderedListBulletType","listBase","listSize","orderedList","orderedListReversed","orderedListCustomStart","unorderedList","unorderedListCustomIcon"],"mappings":"+DAKO,MAAMA,EAAS,CAClBC,iBAAkB,4CAClBC,wBAAyB,mDACzBC,4BACI,uDACJC,sBAAuB,iDACvBC,wBAAyB,oDAGhBC,EAAQ,WAkBRC,EAAyC,CAClD,cAAa,WAGb,aAAY,UAGZ,aAAY,UAGZ,aAAY,UAGZ,aAAY,UAGZ,aAAY,UAGZ,gBAAe,SAGf,UAAS,UAGT,UAAS,WAGT,UAAS,WAKAC,EAAW,WA4BXC,EAAmB,WAMnBC,EAAsB,WAItBC,EAAa,WAKbC,EAAuB"}

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

@@ -0,0 +1,16 @@
+.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;}

package/theme/index.d.ts

@@ -2,4 +2,7 @@ export { ThemeProvider } from "./theme-provider";
 export { useInheritedThemeScope, useTheme } from "./theme-provider/hooks";
 export * from "./tokens";
 export * from "./types";
-export * from "./utils";
+export { formatUnitValue, parsePxOrRemValue } from "./utils/css-variable";
+export { useApplyStyle } from "./utils/use-apply-styles";
+export { useDesignToken } from "./utils/use-design-token";
+export { useMaxWidthMediaQuery, useMediaQuery, useMinWidthMediaQuery, useResolvedBreakpointToken, } from "./utils/use-media-query";

package/theme/index.js

@@ -1,2 +1,2 @@
-export{ThemeProvider}from"./theme-provider/index.js";export{useInheritedThemeScope,useTheme}from"./theme-provider/hooks.js";export{Border,BorderStyle,BorderThickness}from"./tokens/border.js";export{Breakpoint}from"./tokens/breakpoint.js";export{Colour,PrimitiveColours,SemanticColours}from"./tokens/colour.js";export{ComponentToken}from"./tokens/component.js";export{Font,FontSpec}from"./tokens/font.js";export{MediaQuery}from"./tokens/media-query.js";export{Motion}from"./tokens/motion.js";export{Radius}from"./tokens/radius.js";export{Shadow}from"./tokens/shadow.js";export{Spacing}from"./tokens/spacing.js";export{THEME_TYPES}from"./types.js";export{extractFdsCssVariableName,formatUnitValue,getInheritedInlineCssVariables,normalizeCssLengthValue,parseCSSVariableValue,parsePxOrRemValue}from"./utils/css-variable.js";export{generateFont,generateFontProperties}from"./utils/font.js";export{getEffectiveTokenOrCustom,getResolvedValue,getTokenOrDefault,isTokenFromSet,isTokenWithPrefix,toCssValue}from"./utils/token-resolver.js";export{useApplyStyle}from"./utils/use-apply-styles.js";export{useDesignToken,useResolvedTokenValue}from"./utils/use-design-token.js";export{DEFAULT_MOBILE_MAX_WIDTH_BREAKPOINT,useMaxWidthMediaQuery,useMediaQuery,useMinWidthMediaQuery,useResolvedBreakpointToken}from"./utils/use-media-query.js";
+export{ThemeProvider}from"./theme-provider/index.js";export{useInheritedThemeScope,useTheme}from"./theme-provider/hooks.js";export{Border,BorderStyle,BorderThickness}from"./tokens/border.js";export{Breakpoint}from"./tokens/breakpoint.js";export{Colour,PrimitiveColours,SemanticColours}from"./tokens/colour.js";export{ComponentToken}from"./tokens/component.js";export{Font,FontSpec}from"./tokens/font.js";export{MediaQuery}from"./tokens/media-query.js";export{Motion}from"./tokens/motion.js";export{Radius}from"./tokens/radius.js";export{Shadow}from"./tokens/shadow.js";export{Spacing}from"./tokens/spacing.js";export{THEME_TYPES}from"./types.js";export{formatUnitValue,parsePxOrRemValue}from"./utils/css-variable.js";export{useApplyStyle}from"./utils/use-apply-styles.js";export{useDesignToken}from"./utils/use-design-token.js";export{useMaxWidthMediaQuery,useMediaQuery,useMinWidthMediaQuery,useResolvedBreakpointToken}from"./utils/use-media-query.js";
 //# sourceMappingURL=index.js.map

package/theme/styles/a11y-playground.css

@@ -110,7 +110,11 @@
     --fds-colour-text-subtler: var(--fds-colour-neutral-50);
     --fds-colour-text-subtlest: var(--fds-colour-neutral-60);
     --fds-colour-text-primary: var(--fds-colour-primary-50);
+    --fds-colour-text-primary-strong: var(--fds-colour-primary-40);
     --fds-colour-text-primary-strongest: var(--fds-colour-primary-20);
+    --fds-colour-text-brand: var(--fds-colour-brand-50);
+    --fds-colour-text-secondary: var(--fds-colour-secondary-50);
+    --fds-colour-text-secondary-subtle: var(--fds-colour-secondary-60);
     --fds-colour-text-hover: var(--fds-colour-primary-40);
     --fds-colour-text-selected: var(--fds-colour-primary-50);
     --fds-colour-text-selected-hover: var(--fds-colour-primary-40);
@@ -131,6 +135,9 @@
     --fds-colour-icon-primary: var(--fds-colour-primary-50);
     --fds-colour-icon-primary-subtle: var(--fds-colour-primary-60);
     --fds-colour-icon-primary-subtlest: var(--fds-colour-primary-70);
+    --fds-colour-icon-brand: var(--fds-colour-brand-50);
+    --fds-colour-icon-secondary: var(--fds-colour-secondary-50);
+    --fds-colour-icon-secondary-subtle: var(--fds-colour-secondary-60);
     --fds-colour-icon-hover: var(--fds-colour-primary-40);
     --fds-colour-icon-selected: var(--fds-colour-primary-50);
     --fds-colour-icon-selected-hover: var(--fds-colour-primary-40);
@@ -150,6 +157,7 @@
     --fds-colour-border-strong: var(--fds-colour-neutral-70);
     --fds-colour-border-stronger: var(--fds-colour-neutral-50);
     --fds-colour-border-primary: var(--fds-colour-primary-50);
+    --fds-colour-border-primary-strong: var(--fds-colour-primary-40);
     --fds-colour-border-primary-subtle: var(--fds-colour-primary-60);
     --fds-colour-border-hover: var(--fds-colour-primary-90);
     --fds-colour-border-hover-strong: var(--fds-colour-primary-60);
@@ -210,11 +218,17 @@
     --fds-colour-bg-inverse-subtlest: var(--fds-colour-neutral-60);
     --fds-colour-bg-inverse-hover: var(--fds-colour-neutral-40);
     --fds-colour-bg-primary: var(--fds-colour-primary-50);
+    --fds-colour-bg-primary-strong: var(--fds-colour-primary-40);
     --fds-colour-bg-primary-subtle: var(--fds-colour-primary-60);
     --fds-colour-bg-primary-subtler: var(--fds-colour-primary-95);
     --fds-colour-bg-primary-subtlest: var(--fds-colour-primary-100);
+    --fds-colour-bg-secondary: var(--fds-colour-secondary-50);
+    --fds-colour-bg-secondary-subtle: var(--fds-colour-secondary-60);
+    --fds-colour-bg-secondary-subtler: var(--fds-colour-secondary-95);
+    --fds-colour-bg-secondary-subtlest: var(--fds-colour-secondary-100);
     --fds-colour-bg-available: #6DD0A1;
     --fds-colour-bg-primary-hover: var(--fds-colour-primary-40);
+    --fds-colour-bg-primary-strong-hover: var(--fds-colour-primary-30);
     --fds-colour-bg-primary-subtlest-hover: var(--fds-colour-primary-90);
     --fds-colour-bg-primary-subtlest-selected: var(--fds-colour-primary-90);
 
@@ -330,7 +344,8 @@
     --fds-font-weight-regular: 400;
     --fds-font-weight-semibold: 600;
     --fds-font-weight-bold: 700;
-    --fds-font-family: "Atkinson Hyperlegible Next";
+    --fds-font-family-heading: "Atkinson Hyperlegible Next";
+    --fds-font-family-body: "Atkinson Hyperlegible Next";
     --fds-font-body-size-baseline: 1.125rem;
     --fds-font-body-size-md: 1rem;
     --fds-font-body-size-sm: 0.875rem;
@@ -363,7 +378,11 @@ SEMANTIC COLOURS - DARK MODE
     --fds-colour-text-subtler: var(--fds-colour-neutral-60);
     --fds-colour-text-subtlest: var(--fds-colour-neutral-50);
     --fds-colour-text-primary: var(--fds-colour-primary-60);
+    --fds-colour-text-primary-strong: var(--fds-colour-primary-70);
     --fds-colour-text-primary-strongest: var(--fds-colour-primary-90);
+    --fds-colour-text-brand: var(--fds-colour-brand-50);
+    --fds-colour-text-secondary: var(--fds-colour-secondary-60);
+    --fds-colour-text-secondary-subtle: var(--fds-colour-secondary-50);
     --fds-colour-text-hover: var(--fds-colour-primary-70);
     --fds-colour-text-selected: var(--fds-colour-primary-60);
     --fds-colour-text-selected-hover: var(--fds-colour-primary-70);
@@ -384,6 +403,9 @@ SEMANTIC COLOURS - DARK MODE
     --fds-colour-icon-primary: var(--fds-colour-primary-60);
     --fds-colour-icon-primary-subtle: var(--fds-colour-primary-50);
     --fds-colour-icon-primary-subtlest: var(--fds-colour-primary-40);
+    --fds-colour-icon-brand: var(--fds-colour-brand-50);
+    --fds-colour-icon-secondary: var(--fds-colour-secondary-60);
+    --fds-colour-icon-secondary-subtle: var(--fds-colour-secondary-50);
     --fds-colour-icon-hover: var(--fds-colour-primary-70);
     --fds-colour-icon-selected: var(--fds-colour-primary-60);
     --fds-colour-icon-selected-hover: var(--fds-colour-primary-70);
@@ -403,6 +425,7 @@ SEMANTIC COLOURS - DARK MODE
     --fds-colour-border-strong: var(--fds-colour-neutral-40);
     --fds-colour-border-stronger: var(--fds-colour-neutral-60);
     --fds-colour-border-primary: var(--fds-colour-primary-60);
+    --fds-colour-border-primary-strong: var(--fds-colour-primary-70);
     --fds-colour-border-primary-subtle: var(--fds-colour-primary-50);
     --fds-colour-border-hover: var(--fds-colour-primary-20);
     --fds-colour-border-hover-strong: var(--fds-colour-primary-50);
@@ -463,11 +486,17 @@ SEMANTIC COLOURS - DARK MODE
     --fds-colour-bg-inverse-subtlest: var(--fds-colour-neutral-50);
     --fds-colour-bg-inverse-hover: var(--fds-colour-neutral-70);
     --fds-colour-bg-primary: var(--fds-colour-primary-60);
+    --fds-colour-bg-primary-strong: var(--fds-colour-primary-70);
     --fds-colour-bg-primary-subtle: var(--fds-colour-primary-50);
     --fds-colour-bg-primary-subtler: var(--fds-colour-primary-20);
     --fds-colour-bg-primary-subtlest: var(--fds-colour-primary-10);
     --fds-colour-bg-available: #185339;
+    --fds-colour-bg-secondary: var(--fds-colour-secondary-60);
+    --fds-colour-bg-secondary-subtle: var(--fds-colour-secondary-50);
+    --fds-colour-bg-secondary-subtler: var(--fds-colour-secondary-20);
+    --fds-colour-bg-secondary-subtlest: var(--fds-colour-secondary-10);
     --fds-colour-bg-primary-hover: var(--fds-colour-primary-70);
+    --fds-colour-bg-primary-strong-hover: var(--fds-colour-primary-80);
     --fds-colour-bg-primary-subtlest-hover: var(--fds-colour-primary-20);
     --fds-colour-bg-primary-subtlest-selected: var(--fds-colour-primary-20);
 

package/theme/styles/bookingsg.css

@@ -110,7 +110,11 @@
     --fds-colour-text-subtler: var(--fds-colour-neutral-50);
     --fds-colour-text-subtlest: var(--fds-colour-neutral-60);
     --fds-colour-text-primary: var(--fds-colour-primary-50);
+    --fds-colour-text-primary-strong: var(--fds-colour-primary-40);
     --fds-colour-text-primary-strongest: var(--fds-colour-primary-20);
+    --fds-colour-text-brand: var(--fds-colour-brand-50);
+    --fds-colour-text-secondary: var(--fds-colour-secondary-50);
+    --fds-colour-text-secondary-subtle: var(--fds-colour-secondary-60);
     --fds-colour-text-hover: var(--fds-colour-primary-40);
     --fds-colour-text-selected: var(--fds-colour-primary-50);
     --fds-colour-text-selected-hover: var(--fds-colour-primary-40);
@@ -131,6 +135,9 @@
     --fds-colour-icon-primary: var(--fds-colour-primary-50);
     --fds-colour-icon-primary-subtle: var(--fds-colour-primary-60);
     --fds-colour-icon-primary-subtlest: var(--fds-colour-primary-70);
+    --fds-colour-icon-brand: var(--fds-colour-brand-50);
+    --fds-colour-icon-secondary: var(--fds-colour-secondary-50);
+    --fds-colour-icon-secondary-subtle: var(--fds-colour-secondary-60);
     --fds-colour-icon-hover: var(--fds-colour-primary-40);
     --fds-colour-icon-selected: var(--fds-colour-primary-50);
     --fds-colour-icon-selected-hover: var(--fds-colour-primary-40);
@@ -150,6 +157,7 @@
     --fds-colour-border-strong: var(--fds-colour-neutral-70);
     --fds-colour-border-stronger: var(--fds-colour-neutral-50);
     --fds-colour-border-primary: var(--fds-colour-primary-50);
+    --fds-colour-border-primary-strong: var(--fds-colour-primary-40);
     --fds-colour-border-primary-subtle: var(--fds-colour-primary-60);
     --fds-colour-border-hover: var(--fds-colour-primary-90);
     --fds-colour-border-hover-strong: var(--fds-colour-primary-60);
@@ -210,11 +218,17 @@
     --fds-colour-bg-inverse-subtlest: var(--fds-colour-neutral-60);
     --fds-colour-bg-inverse-hover: var(--fds-colour-neutral-40);
     --fds-colour-bg-primary: var(--fds-colour-primary-50);
+    --fds-colour-bg-primary-strong: var(--fds-colour-primary-40);
     --fds-colour-bg-primary-subtle: var(--fds-colour-primary-60);
     --fds-colour-bg-primary-subtler: var(--fds-colour-primary-95);
     --fds-colour-bg-primary-subtlest: var(--fds-colour-primary-100);
+    --fds-colour-bg-secondary: var(--fds-colour-secondary-50);
+    --fds-colour-bg-secondary-subtle: var(--fds-colour-secondary-60);
+    --fds-colour-bg-secondary-subtler: var(--fds-colour-secondary-95);
+    --fds-colour-bg-secondary-subtlest: var(--fds-colour-secondary-100);
     --fds-colour-bg-available: #6DD0A1;
     --fds-colour-bg-primary-hover: var(--fds-colour-primary-40);
+    --fds-colour-bg-primary-strong-hover: var(--fds-colour-primary-30);
     --fds-colour-bg-primary-subtlest-hover: var(--fds-colour-primary-90);
     --fds-colour-bg-primary-subtlest-selected: var(--fds-colour-primary-90);
 
@@ -330,7 +344,8 @@
     --fds-font-weight-regular: 400;
     --fds-font-weight-semibold: 600;
     --fds-font-weight-bold: 700;
-    --fds-font-family: "Plus Jakarta Sans";
+    --fds-font-family-heading: "Plus Jakarta Sans";
+    --fds-font-family-body: "Plus Jakarta Sans";
     --fds-font-body-size-baseline: 1.125rem;
     --fds-font-body-size-md: 1rem;
     --fds-font-body-size-sm: 0.875rem;
@@ -363,7 +378,11 @@ SEMANTIC COLOURS - DARK MODE
     --fds-colour-text-subtler: var(--fds-colour-neutral-60);
     --fds-colour-text-subtlest: var(--fds-colour-neutral-50);
     --fds-colour-text-primary: var(--fds-colour-primary-60);
+    --fds-colour-text-primary-strong: var(--fds-colour-primary-70);
     --fds-colour-text-primary-strongest: var(--fds-colour-primary-90);
+    --fds-colour-text-brand: var(--fds-colour-brand-50);
+    --fds-colour-text-secondary: var(--fds-colour-secondary-60);
+    --fds-colour-text-secondary-subtle: var(--fds-colour-secondary-50);
     --fds-colour-text-hover: var(--fds-colour-primary-70);
     --fds-colour-text-selected: var(--fds-colour-primary-60);
     --fds-colour-text-selected-hover: var(--fds-colour-primary-70);
@@ -384,6 +403,9 @@ SEMANTIC COLOURS - DARK MODE
     --fds-colour-icon-primary: var(--fds-colour-primary-60);
     --fds-colour-icon-primary-subtle: var(--fds-colour-primary-50);
     --fds-colour-icon-primary-subtlest: var(--fds-colour-primary-40);
+    --fds-colour-icon-brand: var(--fds-colour-brand-50);
+    --fds-colour-icon-secondary: var(--fds-colour-secondary-60);
+    --fds-colour-icon-secondary-subtle: var(--fds-colour-secondary-50);
     --fds-colour-icon-hover: var(--fds-colour-primary-70);
     --fds-colour-icon-selected: var(--fds-colour-primary-60);
     --fds-colour-icon-selected-hover: var(--fds-colour-primary-70);
@@ -403,6 +425,7 @@ SEMANTIC COLOURS - DARK MODE
     --fds-colour-border-strong: var(--fds-colour-neutral-40);
     --fds-colour-border-stronger: var(--fds-colour-neutral-60);
     --fds-colour-border-primary: var(--fds-colour-primary-60);
+    --fds-colour-border-primary-strong: var(--fds-colour-primary-70);
     --fds-colour-border-primary-subtle: var(--fds-colour-primary-50);
     --fds-colour-border-hover: var(--fds-colour-primary-20);
     --fds-colour-border-hover-strong: var(--fds-colour-primary-50);
@@ -463,11 +486,17 @@ SEMANTIC COLOURS - DARK MODE
     --fds-colour-bg-inverse-subtlest: var(--fds-colour-neutral-50);
     --fds-colour-bg-inverse-hover: var(--fds-colour-neutral-70);
     --fds-colour-bg-primary: var(--fds-colour-primary-60);
+    --fds-colour-bg-primary-strong: var(--fds-colour-primary-70);
     --fds-colour-bg-primary-subtle: var(--fds-colour-primary-50);
     --fds-colour-bg-primary-subtler: var(--fds-colour-primary-20);
     --fds-colour-bg-primary-subtlest: var(--fds-colour-primary-10);
     --fds-colour-bg-available: #185339;
+    --fds-colour-bg-secondary: var(--fds-colour-secondary-60);
+    --fds-colour-bg-secondary-subtle: var(--fds-colour-secondary-50);
+    --fds-colour-bg-secondary-subtler: var(--fds-colour-secondary-20);
+    --fds-colour-bg-secondary-subtlest: var(--fds-colour-secondary-10);
     --fds-colour-bg-primary-hover: var(--fds-colour-primary-70);
+    --fds-colour-bg-primary-strong-hover: var(--fds-colour-primary-80);
     --fds-colour-bg-primary-subtlest-hover: var(--fds-colour-primary-20);
     --fds-colour-bg-primary-subtlest-selected: var(--fds-colour-primary-20);