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

package/cjs/navbar/menu.styles_gdpqc.css

@@ -1,3 +1,3 @@
-.m1lq4qov{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;margin:0;padding:0;border-left:var(--fds-border-width-040) solid var(--fds-colour-border-selected);}
+@layer fds{.m1lq4qov{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;margin:0;padding:0;border-left:var(--fds-border-width-040) solid var(--fds-colour-border-selected);}
 .m6cy0t7{width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
-.l1t9jy07{width:100%;text-align:left;color:var(--fds-colour-text);margin:0 var(--fds-spacing-8);border:var(--fds-border-style-solid) transparent;border-width:var(--fds-spacing-12) var(--fds-spacing-8);border-radius:var(--fds-radius-md);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-wrap;}.l1t9jy07:hover,.l1t9jy07:active,.l1t9jy07:focus{background-color:var(--fds-colour-bg-hover);color:var(--fds-colour-text);}
+.l1t9jy07{width:100%;text-align:left;color:var(--fds-colour-text);margin:0 var(--fds-spacing-8);border:var(--fds-border-style-solid) transparent;border-width:var(--fds-spacing-12) var(--fds-spacing-8);border-radius:var(--fds-radius-md);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-wrap;}.l1t9jy07:hover,.l1t9jy07:active,.l1t9jy07:focus{background-color:var(--fds-colour-bg-hover);color:var(--fds-colour-text);}}

package/cjs/navbar/navbar-action-buttons.styles_1vpm0nk.css

@@ -1,4 +1,4 @@
-.w62j500{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;list-style:none;margin-left:var(--fds-spacing-64);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}:where(body.fds-breakpoint-lg-max) .w62j500{display:none;}
+@layer fds{.w62j500{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;list-style:none;margin-left:var(--fds-spacing-64);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}:where(body.fds-breakpoint-lg-max) .w62j500{display:none;}
 .m1gsi5dr{display:none;}:where(body.fds-breakpoint-lg-max) .m1gsi5dr{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;list-style:none;margin-left:var(--fds-spacing-64);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}
 .d2uo9g4{display:none;list-style:none;}:where(body.fds-breakpoint-lg-max) .d2uo9g4{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin-top:var(--fds-spacing-40);width:-webkit-max-content;width:-moz-max-content;width:max-content;min-width:22rem;max-width:24rem;}:where(body.fds-breakpoint-sm-max) .d2uo9g4{width:100%;max-width:unset;min-width:unset;}
 .bmx9nfs{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.bmx9nfs:not(:last-of-type){margin-right:var(--fds-spacing-16);}:where(body.fds-breakpoint-lg-max) .bmx9nfs{width:100%;padding:0 0 0 var(--fds-spacing-16);-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}:where(body.fds-breakpoint-lg-max) .bmx9nfs:not(:last-of-type){margin-right:0;margin-bottom:0;}
@@ -7,4 +7,4 @@
 .dvtt0j5{display:none;}:where(body.fds-breakpoint-lg-max) .dvtt0j5{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin-top:var(--fds-spacing-40);}
 .dq81je7{margin-bottom:var(--fds-spacing-8);}
 .d1s552j0{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
-.dbo95jy:not(:last-child){margin-right:var(--fds-spacing-16);}.dbo95jy img{width:auto;height:auto;object-fit:contain;}:where(body.fds-breakpoint-lg-max) .dbo95jy img{max-width:11rem;}:where(body.fds-breakpoint-sm-max) .dbo95jy img{max-width:100%;}
+.dbo95jy:not(:last-child){margin-right:var(--fds-spacing-16);}.dbo95jy img{width:auto;height:auto;object-fit:contain;}:where(body.fds-breakpoint-lg-max) .dbo95jy img{max-width:11rem;}:where(body.fds-breakpoint-sm-max) .dbo95jy img{max-width:100%;}}

package/cjs/navbar/navbar-items.styles_1i3ltot.css

@@ -1,4 +1,4 @@
-.w1ndf2sj{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;list-style:none;position:relative;}:where(body.fds-breakpoint-lg-max) .w1ndf2sj{display:none;}
+@layer fds{.w1ndf2sj{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;list-style:none;position:relative;}:where(body.fds-breakpoint-lg-max) .w1ndf2sj{display:none;}
 .w177nfye{margin-right:auto;}
 .mw9gug8{display:none;list-style:none;}:where(body.fds-breakpoint-lg-max) .mw9gug8{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;overflow:hidden;}
 .l18t6f3m{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;margin:0 1rem;}.l18t6f3m:first-child{margin-left:0;}:where(body.fds-breakpoint-lg-max) .l18t6f3m{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;padding:0.125rem 0;width:100%;margin-left:0rem;}
@@ -16,4 +16,4 @@
 .ej7h5do{padding:0.5rem;-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:-webkit-transform 300ms ease-in-out;transition:transform 300ms ease-in-out;margin:auto 0.25rem auto 0;}
 .e160mxwv{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
 .c1s8ur0k{height:1.25rem;width:1.25rem;color:var(--fds-colour-icon);}.l1o3p4yu:active .c1s8ur0k,.l1o3p4yu:hover .c1s8ur0k,.l1o3p4yu:focus .c1s8ur0k{color:var(--fds-colour-icon-hover);}
-.l1o3p4yu:active .c178e7hk,.l1o3p4yu:hover .c178e7hk,.l1o3p4yu:focus .c178e7hk{color:var(--fds-colour-icon-selected-hover);}
+.l1o3p4yu:active .c178e7hk,.l1o3p4yu:hover .c178e7hk,.l1o3p4yu:focus .c178e7hk{color:var(--fds-colour-icon-selected-hover);}}

package/cjs/navbar/navbar.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),a=require("@lifesg/react-icons/menu"),n=require("clsx"),i=require("react"),t=require("../layout/index.js"),s=require("../masthead/masthead.js"),o=require("../overlay/overlay.js"),l=require("../shared/clickable-icon/clickable-icon.js");require("../theme/theme-provider/index.js");var d=require("../theme/utils/css-variable.js"),u=require("../theme/theme-provider/context.js");require("../theme/tokens/border.js");var c=require("../theme/tokens/breakpoint.js");require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var m=require("../theme/utils/use-media-query.js"),v=require("./brand.js"),p=require("./drawer.js"),h=require("./navbar.styles.js"),b=require("./navbar-action-buttons.js"),k=require("./navbar-helper.js"),j=require("./navbar-items.js"),x=require("./navbar-logo-data.js");function C(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var q=C(n);const y=i.forwardRef(((n,C)=>{var{items:y,className:f,id:B,selectedId:w,compress:N=!1,fixed:g=!0,resources:I,hideNavElements:L=!1,hideNavBranding:R=!1,hideLinkIndicator:_=!1,drawerDismissalExclusions:D=[],actionButtons:E,onItemClick:M,onActionButtonClick:O,onBrandClick:A,masthead:S=!0,layout:F="default",headerLabel:H="Main navigation menu",drawerLabel:T}=n,z=e.__rest(n,["items","className","id","selectedId","compress","fixed","resources","hideNavElements","hideNavBranding","hideLinkIndicator","drawerDismissalExclusions","actionButtons","onItemClick","onActionButtonClick","onBrandClick","masthead","layout","headerLabel","drawerLabel"]);const[W,P]=i.useState(!1),[V,G]=i.useState(!1),J=i.useRef(null),K="stretch"===F,Q=i.useRef(null),U=i.useContext(u.ThemeContext),X=x.getDefaultResourceLogo(null==U?void 0:U.theme),Y=d.parsePxOrRemValue(m.useResolvedBreakpointToken(c.Breakpoint["lg-max"])),Z=(null==I?void 0:I.primary)||X.primary,$=null==I?void 0:I.secondary;i.useImperativeHandle(C,(()=>Object.assign(Q.current,{dismissDrawer:()=>{ee()}})),[W]),i.useEffect((()=>(ae(),window.addEventListener("resize",ae),()=>{window.removeEventListener("resize",ae)})),[]);const ee=()=>{P(!1),setTimeout((()=>{G(!1)}),550)},re=e=>W&&-1===D.indexOf(e),ae=()=>{window.innerWidth<=Y&&W&&ee()},ne=(e,r)=>{A&&A(r),re("brand-click")&&ee()},ie=(e,r)=>{k.NavbarHelper.isNavItemCommon(r)&&r.onClick?r.onClick(e):M&&(e.preventDefault(),M(r)),k.NavbarHelper.isNavItemLink(r)&&!r.subMenu&&re("item-click")&&ee()},te=(e,r)=>{var a;"button"!==r.type&&"download"!==r.type||!(null===(a=r.args)||void 0===a?void 0:a.onClick)?O&&(e.preventDefault(),O(r)):r.args.onClick(e),re("item-click")&&ee()},se=()=>{P(!0),G(!0)},oe=()=>{re("close-button-click")&&ee()},le=()=>{const e=y.mobile||y.desktop;return e&&e.length>0||E&&(e=>{const r=e.mobile||e.desktop;return!!r&&r.length&&r.some((e=>!e.uncollapsible))})(E)?r.jsx(l.ClickableIcon,{ref:J,className:h.mobileMenuButton,"aria-label":W?"Close nav menu":"Open nav menu","aria-expanded":W,"data-testid":"button__mobile-menu",onClick:se,focusHighlight:!1,children:r.jsx(a.MenuIcon,{className:h.mobileMenuIcon})}):null};return r.jsxs("div",{ref:Q,className:q.default(h.wrapper,g?h.wrapperFixed:h.wrapperRelative,"dark"===(null==U?void 0:U.mode)?h.wrapperDark:h.wrapperLight,f),id:B||"navbar-wrapper","data-testid":z["data-testid"]||"navbar-wrapper",children:[S&&r.jsx(s.Masthead,{stretch:K}),r.jsxs(t.Layout.Content,{stretch:K,children:[r.jsxs("nav",{className:q.default(h.nav,N&&h.navCompressed,"dark"===(null==U?void 0:U.mode)&&h.navDark),"aria-label":H,children:[!R&&r.jsxs("div",{className:q.default(h.navBrandContainer,N?h.navBrandContainerCompressed:h.navBrandContainerFull,h.navBrandContainerResponsive),"data-id":"brand-container",children:[Z&&r.jsx(v.Brand,{resources:Z,onClick:ne,"data-id":"brand-primary","data-testid":"main__brand",type:"primary"}),$&&r.jsxs(r.Fragment,{children:[r.jsx("div",{className:q.default(h.navSeparator,N?h.navSeparatorCompressed:h.navSeparatorFull,h.navSeparatorResponsive)}),r.jsx(v.Brand,{resources:$,onClick:ne,"data-id":"brand-secondary","data-testid":"main__brand-secondary",type:"secondary"})]})]}),!L&&r.jsxs("div",{className:q.default(h.navElementsContainer,!R&&h.navElementsContainerWithBranding),children:[r.jsx(j.NavbarItems,{items:y.desktop,onItemClick:ie,selectedId:w,hideNavBranding:R,hideLinkIndicator:_}),r.jsx(b.NavbarActionButtons,{actionButtons:E,onActionButtonClick:te}),le()]})]}),!L&&r.jsx(o.Overlay,{show:V,enableOverlayClick:!0,onOverlayClick:oe,children:r.jsxs(p.Drawer,{show:W,resources:{primary:Z,secondary:$},onClose:oe,onBrandClick:ne,actionButtons:E,hideNavBranding:R,mobileMenuRef:J,drawerLabel:T,children:[r.jsx(j.NavbarItems,{items:y.mobile||y.desktop,onItemClick:ie,selectedId:w,mobile:!0,hideLinkIndicator:_}),r.jsx(b.NavbarActionButtons,{actionButtons:E,onActionButtonClick:te,mobile:!0})]})})]})]})}));exports.Navbar=y;
+"use strict";var e=require("../_virtual/_tslib.js"),r=require("react/jsx-runtime"),a=require("@lifesg/react-icons/menu"),n=require("clsx"),i=require("react"),t=require("../layout/index.js"),s=require("../masthead/masthead.js"),o=require("../overlay/overlay.js"),l=require("../shared/clickable-icon/clickable-icon.js");require("../theme/theme-provider/index.js");var d=require("../theme/utils/css-variable.js"),u=require("../theme/theme-provider/context.js");require("../theme/tokens/border.js");var c=require("../theme/tokens/breakpoint.js");require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js"),require("../util/simple-id-generator.js"),require("../util/string-helper.js"),require("@react-aria/live-announcer");var m=require("../theme/utils/use-media-query.js"),v=require("./brand.js"),p=require("./drawer.js"),h=require("./navbar.styles.js"),b=require("./navbar-action-buttons.js"),k=require("./navbar-helper.js"),j=require("./navbar-items.js"),x=require("./navbar-logo-data.js");function C(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var q=C(n);const y=i.forwardRef(((n,C)=>{var{items:y,className:f,id:B,selectedId:w,compress:N=!1,fixed:g=!0,resources:I,hideNavElements:L=!1,hideNavBranding:R=!1,hideLinkIndicator:_=!1,drawerDismissalExclusions:D=[],actionButtons:E,onItemClick:M,onActionButtonClick:O,onBrandClick:A,masthead:S=!0,layout:F="default",headerLabel:H="Main navigation menu",drawerLabel:T}=n,z=e.__rest(n,["items","className","id","selectedId","compress","fixed","resources","hideNavElements","hideNavBranding","hideLinkIndicator","drawerDismissalExclusions","actionButtons","onItemClick","onActionButtonClick","onBrandClick","masthead","layout","headerLabel","drawerLabel"]);const[W,P]=i.useState(!1),[V,G]=i.useState(!1),J=i.useRef(null),K="stretch"===F,Q=i.useRef(null),U=i.useContext(u.ThemeContext),X=x.getDefaultResourceLogo(null==U?void 0:U.theme),Y=d.parsePxOrRemValue(m.useResolvedBreakpointToken(c.Breakpoint["lg-max"])),Z=(null==I?void 0:I.primary)||X.primary,$=null==I?void 0:I.secondary;i.useImperativeHandle(C,(()=>Object.assign(Q.current,{dismissDrawer:()=>{ee()}})),[W]),i.useEffect((()=>(ae(),window.addEventListener("resize",ae),()=>{window.removeEventListener("resize",ae)})),[]);const ee=()=>{P(!1),setTimeout((()=>{G(!1)}),550)},re=e=>W&&-1===D.indexOf(e),ae=()=>{window.innerWidth<=Y&&W&&ee()},ne=(e,r)=>{A&&A(r),re("brand-click")&&ee()},ie=(e,r)=>{k.NavbarHelper.isNavItemCommon(r)&&r.onClick?r.onClick(e):M&&(e.preventDefault(),M(r)),k.NavbarHelper.isNavItemLink(r)&&!r.subMenu&&re("item-click")&&ee()},te=(e,r)=>{var a;"button"!==r.type&&"download"!==r.type||!(null===(a=r.args)||void 0===a?void 0:a.onClick)?O&&(e.preventDefault(),O(r)):r.args.onClick(e),re("item-click")&&ee()},se=()=>{P(!0),G(!0)},oe=()=>{re("close-button-click")&&ee()},le=()=>{const e=y.mobile||y.desktop;return e&&e.length>0||E&&(e=>{const r=e.mobile||e.desktop;return!!r&&r.length&&r.some((e=>!e.uncollapsible))})(E)?r.jsx(l.ClickableIcon,{ref:J,className:h.mobileMenuButton,"aria-label":W?"Close nav menu":"Open nav menu","aria-expanded":W,"data-testid":"button__mobile-menu",onClick:se,focusHighlight:!0,children:r.jsx(a.MenuIcon,{className:h.mobileMenuIcon})}):null};return r.jsxs("div",{ref:Q,className:q.default(h.wrapper,g?h.wrapperFixed:h.wrapperRelative,"dark"===(null==U?void 0:U.mode)?h.wrapperDark:h.wrapperLight,f),id:B||"navbar-wrapper","data-testid":z["data-testid"]||"navbar-wrapper",children:[S&&r.jsx(s.Masthead,{stretch:K}),r.jsxs(t.Layout.Content,{stretch:K,children:[r.jsxs("nav",{className:q.default(h.nav,N&&h.navCompressed,"dark"===(null==U?void 0:U.mode)&&h.navDark),"aria-label":H,children:[!R&&r.jsxs("div",{className:q.default(h.navBrandContainer,N?h.navBrandContainerCompressed:h.navBrandContainerFull,h.navBrandContainerResponsive),"data-id":"brand-container",children:[Z&&r.jsx(v.Brand,{resources:Z,onClick:ne,"data-id":"brand-primary","data-testid":"main__brand",type:"primary"}),$&&r.jsxs(r.Fragment,{children:[r.jsx("div",{className:q.default(h.navSeparator,N?h.navSeparatorCompressed:h.navSeparatorFull,h.navSeparatorResponsive)}),r.jsx(v.Brand,{resources:$,onClick:ne,"data-id":"brand-secondary","data-testid":"main__brand-secondary",type:"secondary"})]})]}),!L&&r.jsxs("div",{className:q.default(h.navElementsContainer,!R&&h.navElementsContainerWithBranding),children:[r.jsx(j.NavbarItems,{items:y.desktop,onItemClick:ie,selectedId:w,hideNavBranding:R,hideLinkIndicator:_}),r.jsx(b.NavbarActionButtons,{actionButtons:E,onActionButtonClick:te}),le()]})]}),!L&&r.jsx(o.Overlay,{show:V,enableOverlayClick:!0,onOverlayClick:oe,children:r.jsxs(p.Drawer,{show:W,resources:{primary:Z,secondary:$},onClose:oe,onBrandClick:ne,actionButtons:E,hideNavBranding:R,mobileMenuRef:J,drawerLabel:T,children:[r.jsx(j.NavbarItems,{items:y.mobile||y.desktop,onItemClick:ie,selectedId:w,mobile:!0,hideLinkIndicator:_}),r.jsx(b.NavbarActionButtons,{actionButtons:E,onActionButtonClick:te,mobile:!0})]})})]})]})}));exports.Navbar=y;
 //# sourceMappingURL=navbar.js.map

package/cjs/navbar/navbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"navbar.js","sources":["../../../src/navbar/navbar.tsx"],"sourcesContent":["import { MenuIcon } from \"@lifesg/react-icons/menu\";\nimport clsx from \"clsx\";\nimport type React from \"react\";\nimport {\n    forwardRef,\n    useContext,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from \"react\";\n\nimport { Layout } from \"../layout\";\nimport { Masthead } from \"../masthead/masthead\";\nimport { Overlay } from \"../overlay/overlay\";\nimport { ClickableIcon } from \"../shared/clickable-icon\";\nimport {\n    Breakpoint,\n    parsePxOrRemValue,\n    useResolvedBreakpointToken,\n} from \"../theme\";\nimport { ThemeContext } from \"../theme/theme-provider/context\";\nimport { Brand } from \"./brand\";\nimport { Drawer } from \"./drawer\";\nimport * as styles from \"./navbar.styles\";\nimport { NavbarActionButtons } from \"./navbar-action-buttons\";\nimport { NavbarHelper } from \"./navbar-helper\";\nimport { NavbarItems } from \"./navbar-items\";\nimport { getDefaultResourceLogo } from \"./navbar-logo-data\";\nimport type {\n    BrandType,\n    DrawerDismissalMethod,\n    NavbarActionButtonsProps,\n    NavbarButtonProps,\n    NavbarDrawerApi,\n    NavbarDrawerHandle,\n    NavbarProps,\n    NavItemCommonProps,\n    NavItemProps,\n} from \"./types\";\n\nconst Component = <T,>(\n    {\n        items,\n        className,\n        id,\n        selectedId,\n        compress = false,\n        fixed = true,\n        resources,\n        hideNavElements = false,\n        hideNavBranding = false,\n        hideLinkIndicator = false,\n        drawerDismissalExclusions: blockDrawerDismissalMethods = [],\n        actionButtons,\n        onItemClick,\n        onActionButtonClick,\n        onBrandClick,\n        masthead = true,\n        layout = \"default\",\n        headerLabel = \"Main navigation menu\",\n        drawerLabel,\n        ...otherProps\n    }: NavbarProps<T>,\n    ref: React.Ref<NavbarDrawerHandle>\n) => {\n    // =============================================================================\n    // CONST, STATE, REFS\n    // =============================================================================\n    const [showDrawer, setShowDrawer] = useState<boolean>(false);\n    const [showOverlay, setShowOverlay] = useState<boolean>(false);\n    const mobileMenuRef = useRef<HTMLButtonElement>(null);\n    const isStretch = layout === \"stretch\";\n    const elementRef = useRef<HTMLDivElement>(null);\n    const theme = useContext(ThemeContext);\n    const defaultResource = getDefaultResourceLogo(theme?.theme);\n    const tabletWidth = parsePxOrRemValue(\n        useResolvedBreakpointToken(Breakpoint[\"lg-max\"])\n    );\n\n    const primary = resources?.primary || defaultResource.primary;\n    const secondary = resources?.secondary;\n\n    useImperativeHandle(\n        ref,\n        () =>\n            Object.assign<HTMLDivElement, NavbarDrawerApi>(\n                elementRef.current!,\n                {\n                    dismissDrawer: () => {\n                        dismissDrawer();\n                    },\n                }\n            ),\n        [showDrawer]\n    );\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        handleResize();\n        window.addEventListener(\"resize\", handleResize);\n\n        return () => {\n            window.removeEventListener(\"resize\", handleResize);\n        };\n    }, []);\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const dismissDrawer = () => {\n        setShowDrawer(false);\n        setTimeout(() => {\n            setShowOverlay(false);\n        }, 550); // For drawer animation to complete + buffer\n    };\n\n    const shouldDismissDrawer = (dismissalMethod: DrawerDismissalMethod) => {\n        return (\n            showDrawer &&\n            blockDrawerDismissalMethods.indexOf(dismissalMethod) === -1\n        );\n    };\n\n    const hasCollapsibleActionButtons = (\n        actionButtons: NavbarActionButtonsProps\n    ) => {\n        const drawerActionButtons =\n            actionButtons.mobile || actionButtons.desktop;\n        if (drawerActionButtons) {\n            return (\n                drawerActionButtons.length &&\n                drawerActionButtons.some(\n                    (actionButton) => !actionButton.uncollapsible\n                )\n            );\n        }\n\n        return false;\n    };\n\n    // =============================================================================\n    // EVENT HANDLER\n    // =============================================================================\n    const handleResize = () => {\n        if (window.innerWidth <= tabletWidth && showDrawer) {\n            dismissDrawer();\n        }\n    };\n\n    const handleBrandClick = (\n        _event: React.MouseEvent<HTMLAnchorElement>,\n        type: BrandType\n    ) => {\n        if (onBrandClick) {\n            onBrandClick(type);\n        }\n\n        if (shouldDismissDrawer(\"brand-click\")) {\n            dismissDrawer();\n        }\n    };\n\n    const handleNavItemClick = <K extends T>(\n        event: React.MouseEvent<HTMLAnchorElement>,\n        item: NavItemProps<K> | NavItemCommonProps<K>\n    ) => {\n        if (NavbarHelper.isNavItemCommon(item) && item.onClick) {\n            item.onClick(event);\n        } else if (onItemClick) {\n            event.preventDefault();\n            onItemClick(item);\n        }\n\n        if (\n            NavbarHelper.isNavItemLink(item) &&\n            !item.subMenu &&\n            shouldDismissDrawer(\"item-click\")\n        ) {\n            dismissDrawer();\n        }\n    };\n\n    const handleActionButtonClick = (\n        event: React.MouseEvent<HTMLButtonElement> | React.MouseEvent<Element>,\n        actionButton: NavbarButtonProps\n    ) => {\n        if (\n            (actionButton.type === \"button\" ||\n                actionButton.type === \"download\") &&\n            actionButton.args?.onClick\n        ) {\n            actionButton.args.onClick(\n                event as React.MouseEvent<HTMLButtonElement>\n            );\n        } else if (onActionButtonClick) {\n            event.preventDefault();\n            onActionButtonClick(actionButton);\n        }\n\n        if (shouldDismissDrawer(\"item-click\")) {\n            dismissDrawer();\n        }\n    };\n\n    const handleMobileMenuButtonClick = () => {\n        setShowDrawer(true);\n        setShowOverlay(true);\n    };\n\n    const handleDrawerClose = () => {\n        if (shouldDismissDrawer(\"close-button-click\")) {\n            dismissDrawer();\n        }\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n\n    const renderDrawer = () => (\n        <Overlay\n            show={showOverlay}\n            enableOverlayClick\n            onOverlayClick={handleDrawerClose}\n        >\n            <Drawer\n                show={showDrawer}\n                resources={{ primary, secondary }}\n                onClose={handleDrawerClose}\n                onBrandClick={handleBrandClick}\n                actionButtons={actionButtons}\n                hideNavBranding={hideNavBranding}\n                mobileMenuRef={mobileMenuRef}\n                drawerLabel={drawerLabel}\n            >\n                <NavbarItems\n                    items={items.mobile || items.desktop}\n                    onItemClick={handleNavItemClick}\n                    selectedId={selectedId}\n                    mobile\n                    hideLinkIndicator={hideLinkIndicator}\n                />\n                <NavbarActionButtons\n                    actionButtons={actionButtons}\n                    onActionButtonClick={handleActionButtonClick}\n                    mobile\n                />\n            </Drawer>\n        </Overlay>\n    );\n\n    const renderBrand = () => (\n        <div\n            className={clsx(\n                styles.navBrandContainer,\n                compress\n                    ? styles.navBrandContainerCompressed\n                    : styles.navBrandContainerFull,\n                styles.navBrandContainerResponsive\n            )}\n            data-id=\"brand-container\"\n        >\n            {primary && (\n                <Brand\n                    resources={primary}\n                    onClick={handleBrandClick}\n                    data-id=\"brand-primary\"\n                    data-testid=\"main__brand\"\n                    type=\"primary\"\n                />\n            )}\n            {secondary && (\n                <>\n                    <div\n                        className={clsx(\n                            styles.navSeparator,\n                            compress\n                                ? styles.navSeparatorCompressed\n                                : styles.navSeparatorFull,\n                            styles.navSeparatorResponsive\n                        )}\n                    />\n                    <Brand\n                        resources={secondary}\n                        onClick={handleBrandClick}\n                        data-id=\"brand-secondary\"\n                        data-testid=\"main__brand-secondary\"\n                        type=\"secondary\"\n                    />\n                </>\n            )}\n        </div>\n    );\n\n    const renderMobileMenuButton = () => {\n        const drawerItems = items.mobile || items.desktop;\n        if (\n            (drawerItems && drawerItems.length > 0) ||\n            (actionButtons && hasCollapsibleActionButtons(actionButtons))\n        ) {\n            return (\n                <ClickableIcon\n                    ref={mobileMenuRef}\n                    className={styles.mobileMenuButton}\n                    aria-label={showDrawer ? \"Close nav menu\" : \"Open nav menu\"}\n                    aria-expanded={showDrawer}\n                    data-testid=\"button__mobile-menu\"\n                    onClick={handleMobileMenuButtonClick}\n                    focusHighlight={false}\n                >\n                    <MenuIcon className={styles.mobileMenuIcon} />\n                </ClickableIcon>\n            );\n        }\n\n        return null;\n    };\n\n    const renderNavbar = () => {\n        return (\n            <Layout.Content stretch={isStretch}>\n                <nav\n                    className={clsx(\n                        styles.nav,\n                        compress && styles.navCompressed,\n                        theme?.mode === \"dark\" && styles.navDark\n                    )}\n                    aria-label={headerLabel}\n                >\n                    {!hideNavBranding && renderBrand()}\n                    {!hideNavElements && (\n                        <div\n                            className={clsx(\n                                styles.navElementsContainer,\n                                !hideNavBranding &&\n                                    styles.navElementsContainerWithBranding\n                            )}\n                        >\n                            <NavbarItems\n                                items={items.desktop}\n                                onItemClick={handleNavItemClick}\n                                selectedId={selectedId}\n                                hideNavBranding={hideNavBranding}\n                                hideLinkIndicator={hideLinkIndicator}\n                            />\n                            <NavbarActionButtons\n                                actionButtons={actionButtons}\n                                onActionButtonClick={handleActionButtonClick}\n                            />\n                            {renderMobileMenuButton()}\n                        </div>\n                    )}\n                </nav>\n\n                {!hideNavElements && renderDrawer()}\n            </Layout.Content>\n        );\n    };\n\n    return (\n        <div\n            ref={elementRef}\n            className={clsx(\n                styles.wrapper,\n                fixed ? styles.wrapperFixed : styles.wrapperRelative,\n                theme?.mode === \"dark\"\n                    ? styles.wrapperDark\n                    : styles.wrapperLight,\n                className\n            )}\n            id={id || \"navbar-wrapper\"}\n            data-testid={otherProps[\"data-testid\"] || \"navbar-wrapper\"}\n        >\n            {masthead && <Masthead stretch={isStretch} />}\n            {renderNavbar()}\n        </div>\n    );\n};\n\nexport const Navbar = forwardRef(Component);\n"],"names":["Navbar","forwardRef","_a","ref","items","className","id","selectedId","compress","fixed","resources","hideNavElements","hideNavBranding","hideLinkIndicator","drawerDismissalExclusions","blockDrawerDismissalMethods","actionButtons","onItemClick","onActionButtonClick","onBrandClick","masthead","layout","headerLabel","drawerLabel","otherProps","__rest","showDrawer","setShowDrawer","useState","showOverlay","setShowOverlay","mobileMenuRef","useRef","isStretch","elementRef","theme","useContext","ThemeContext","defaultResource","getDefaultResourceLogo","tabletWidth","parsePxOrRemValue","useResolvedBreakpointToken","Breakpoint","primary","secondary","useImperativeHandle","Object","assign","current","dismissDrawer","useEffect","handleResize","window","addEventListener","removeEventListener","setTimeout","shouldDismissDrawer","dismissalMethod","indexOf","innerWidth","handleBrandClick","_event","type","handleNavItemClick","event","item","NavbarHelper","isNavItemCommon","onClick","preventDefault","isNavItemLink","subMenu","handleActionButtonClick","actionButton","args","handleMobileMenuButtonClick","handleDrawerClose","renderMobileMenuButton","drawerItems","mobile","desktop","length","drawerActionButtons","some","uncollapsible","hasCollapsibleActionButtons","_jsx","ClickableIcon","styles.mobileMenuButton","focusHighlight","children","MenuIcon","styles.mobileMenuIcon","_jsxs","clsx","styles.wrapper","styles.wrapperFixed","styles.wrapperRelative","mode","styles.wrapperDark","styles.wrapperLight","Masthead","stretch","Layout","Content","styles.nav","styles.navCompressed","styles.navDark","styles.navBrandContainer","styles.navBrandContainerCompressed","styles.navBrandContainerFull","styles.navBrandContainerResponsive","Brand","_Fragment","styles.navSeparator","styles.navSeparatorCompressed","styles.navSeparatorFull","styles.navSeparatorResponsive","styles.navElementsContainer","styles.navElementsContainerWithBranding","NavbarItems","NavbarActionButtons","Overlay","show","enableOverlayClick","onOverlayClick","Drawer","onClose"],"mappings":"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"}
+{"version":3,"file":"navbar.js","sources":["../../../src/navbar/navbar.tsx"],"sourcesContent":["import { MenuIcon } from \"@lifesg/react-icons/menu\";\nimport clsx from \"clsx\";\nimport type React from \"react\";\nimport {\n    forwardRef,\n    useContext,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    useState,\n} from \"react\";\n\nimport { Layout } from \"../layout\";\nimport { Masthead } from \"../masthead/masthead\";\nimport { Overlay } from \"../overlay/overlay\";\nimport { ClickableIcon } from \"../shared/clickable-icon\";\nimport {\n    Breakpoint,\n    parsePxOrRemValue,\n    useResolvedBreakpointToken,\n} from \"../theme\";\nimport { ThemeContext } from \"../theme/theme-provider/context\";\nimport { Brand } from \"./brand\";\nimport { Drawer } from \"./drawer\";\nimport * as styles from \"./navbar.styles\";\nimport { NavbarActionButtons } from \"./navbar-action-buttons\";\nimport { NavbarHelper } from \"./navbar-helper\";\nimport { NavbarItems } from \"./navbar-items\";\nimport { getDefaultResourceLogo } from \"./navbar-logo-data\";\nimport type {\n    BrandType,\n    DrawerDismissalMethod,\n    NavbarActionButtonsProps,\n    NavbarButtonProps,\n    NavbarDrawerApi,\n    NavbarDrawerHandle,\n    NavbarProps,\n    NavItemCommonProps,\n    NavItemProps,\n} from \"./types\";\n\nconst Component = <T,>(\n    {\n        items,\n        className,\n        id,\n        selectedId,\n        compress = false,\n        fixed = true,\n        resources,\n        hideNavElements = false,\n        hideNavBranding = false,\n        hideLinkIndicator = false,\n        drawerDismissalExclusions: blockDrawerDismissalMethods = [],\n        actionButtons,\n        onItemClick,\n        onActionButtonClick,\n        onBrandClick,\n        masthead = true,\n        layout = \"default\",\n        headerLabel = \"Main navigation menu\",\n        drawerLabel,\n        ...otherProps\n    }: NavbarProps<T>,\n    ref: React.Ref<NavbarDrawerHandle>\n) => {\n    // =============================================================================\n    // CONST, STATE, REFS\n    // =============================================================================\n    const [showDrawer, setShowDrawer] = useState<boolean>(false);\n    const [showOverlay, setShowOverlay] = useState<boolean>(false);\n    const mobileMenuRef = useRef<HTMLButtonElement>(null);\n    const isStretch = layout === \"stretch\";\n    const elementRef = useRef<HTMLDivElement>(null);\n    const theme = useContext(ThemeContext);\n    const defaultResource = getDefaultResourceLogo(theme?.theme);\n    const tabletWidth = parsePxOrRemValue(\n        useResolvedBreakpointToken(Breakpoint[\"lg-max\"])\n    );\n\n    const primary = resources?.primary || defaultResource.primary;\n    const secondary = resources?.secondary;\n\n    useImperativeHandle(\n        ref,\n        () =>\n            Object.assign<HTMLDivElement, NavbarDrawerApi>(\n                elementRef.current!,\n                {\n                    dismissDrawer: () => {\n                        dismissDrawer();\n                    },\n                }\n            ),\n        [showDrawer]\n    );\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        handleResize();\n        window.addEventListener(\"resize\", handleResize);\n\n        return () => {\n            window.removeEventListener(\"resize\", handleResize);\n        };\n    }, []);\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const dismissDrawer = () => {\n        setShowDrawer(false);\n        setTimeout(() => {\n            setShowOverlay(false);\n        }, 550); // For drawer animation to complete + buffer\n    };\n\n    const shouldDismissDrawer = (dismissalMethod: DrawerDismissalMethod) => {\n        return (\n            showDrawer &&\n            blockDrawerDismissalMethods.indexOf(dismissalMethod) === -1\n        );\n    };\n\n    const hasCollapsibleActionButtons = (\n        actionButtons: NavbarActionButtonsProps\n    ) => {\n        const drawerActionButtons =\n            actionButtons.mobile || actionButtons.desktop;\n        if (drawerActionButtons) {\n            return (\n                drawerActionButtons.length &&\n                drawerActionButtons.some(\n                    (actionButton) => !actionButton.uncollapsible\n                )\n            );\n        }\n\n        return false;\n    };\n\n    // =============================================================================\n    // EVENT HANDLER\n    // =============================================================================\n    const handleResize = () => {\n        if (window.innerWidth <= tabletWidth && showDrawer) {\n            dismissDrawer();\n        }\n    };\n\n    const handleBrandClick = (\n        _event: React.MouseEvent<HTMLAnchorElement>,\n        type: BrandType\n    ) => {\n        if (onBrandClick) {\n            onBrandClick(type);\n        }\n\n        if (shouldDismissDrawer(\"brand-click\")) {\n            dismissDrawer();\n        }\n    };\n\n    const handleNavItemClick = <K extends T>(\n        event: React.MouseEvent<HTMLAnchorElement>,\n        item: NavItemProps<K> | NavItemCommonProps<K>\n    ) => {\n        if (NavbarHelper.isNavItemCommon(item) && item.onClick) {\n            item.onClick(event);\n        } else if (onItemClick) {\n            event.preventDefault();\n            onItemClick(item);\n        }\n\n        if (\n            NavbarHelper.isNavItemLink(item) &&\n            !item.subMenu &&\n            shouldDismissDrawer(\"item-click\")\n        ) {\n            dismissDrawer();\n        }\n    };\n\n    const handleActionButtonClick = (\n        event: React.MouseEvent<HTMLButtonElement> | React.MouseEvent<Element>,\n        actionButton: NavbarButtonProps\n    ) => {\n        if (\n            (actionButton.type === \"button\" ||\n                actionButton.type === \"download\") &&\n            actionButton.args?.onClick\n        ) {\n            actionButton.args.onClick(\n                event as React.MouseEvent<HTMLButtonElement>\n            );\n        } else if (onActionButtonClick) {\n            event.preventDefault();\n            onActionButtonClick(actionButton);\n        }\n\n        if (shouldDismissDrawer(\"item-click\")) {\n            dismissDrawer();\n        }\n    };\n\n    const handleMobileMenuButtonClick = () => {\n        setShowDrawer(true);\n        setShowOverlay(true);\n    };\n\n    const handleDrawerClose = () => {\n        if (shouldDismissDrawer(\"close-button-click\")) {\n            dismissDrawer();\n        }\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n\n    const renderDrawer = () => (\n        <Overlay\n            show={showOverlay}\n            enableOverlayClick\n            onOverlayClick={handleDrawerClose}\n        >\n            <Drawer\n                show={showDrawer}\n                resources={{ primary, secondary }}\n                onClose={handleDrawerClose}\n                onBrandClick={handleBrandClick}\n                actionButtons={actionButtons}\n                hideNavBranding={hideNavBranding}\n                mobileMenuRef={mobileMenuRef}\n                drawerLabel={drawerLabel}\n            >\n                <NavbarItems\n                    items={items.mobile || items.desktop}\n                    onItemClick={handleNavItemClick}\n                    selectedId={selectedId}\n                    mobile\n                    hideLinkIndicator={hideLinkIndicator}\n                />\n                <NavbarActionButtons\n                    actionButtons={actionButtons}\n                    onActionButtonClick={handleActionButtonClick}\n                    mobile\n                />\n            </Drawer>\n        </Overlay>\n    );\n\n    const renderBrand = () => (\n        <div\n            className={clsx(\n                styles.navBrandContainer,\n                compress\n                    ? styles.navBrandContainerCompressed\n                    : styles.navBrandContainerFull,\n                styles.navBrandContainerResponsive\n            )}\n            data-id=\"brand-container\"\n        >\n            {primary && (\n                <Brand\n                    resources={primary}\n                    onClick={handleBrandClick}\n                    data-id=\"brand-primary\"\n                    data-testid=\"main__brand\"\n                    type=\"primary\"\n                />\n            )}\n            {secondary && (\n                <>\n                    <div\n                        className={clsx(\n                            styles.navSeparator,\n                            compress\n                                ? styles.navSeparatorCompressed\n                                : styles.navSeparatorFull,\n                            styles.navSeparatorResponsive\n                        )}\n                    />\n                    <Brand\n                        resources={secondary}\n                        onClick={handleBrandClick}\n                        data-id=\"brand-secondary\"\n                        data-testid=\"main__brand-secondary\"\n                        type=\"secondary\"\n                    />\n                </>\n            )}\n        </div>\n    );\n\n    const renderMobileMenuButton = () => {\n        const drawerItems = items.mobile || items.desktop;\n        if (\n            (drawerItems && drawerItems.length > 0) ||\n            (actionButtons && hasCollapsibleActionButtons(actionButtons))\n        ) {\n            return (\n                <ClickableIcon\n                    ref={mobileMenuRef}\n                    className={styles.mobileMenuButton}\n                    aria-label={showDrawer ? \"Close nav menu\" : \"Open nav menu\"}\n                    aria-expanded={showDrawer}\n                    data-testid=\"button__mobile-menu\"\n                    onClick={handleMobileMenuButtonClick}\n                    focusHighlight={true}\n                >\n                    <MenuIcon className={styles.mobileMenuIcon} />\n                </ClickableIcon>\n            );\n        }\n\n        return null;\n    };\n\n    const renderNavbar = () => {\n        return (\n            <Layout.Content stretch={isStretch}>\n                <nav\n                    className={clsx(\n                        styles.nav,\n                        compress && styles.navCompressed,\n                        theme?.mode === \"dark\" && styles.navDark\n                    )}\n                    aria-label={headerLabel}\n                >\n                    {!hideNavBranding && renderBrand()}\n                    {!hideNavElements && (\n                        <div\n                            className={clsx(\n                                styles.navElementsContainer,\n                                !hideNavBranding &&\n                                    styles.navElementsContainerWithBranding\n                            )}\n                        >\n                            <NavbarItems\n                                items={items.desktop}\n                                onItemClick={handleNavItemClick}\n                                selectedId={selectedId}\n                                hideNavBranding={hideNavBranding}\n                                hideLinkIndicator={hideLinkIndicator}\n                            />\n                            <NavbarActionButtons\n                                actionButtons={actionButtons}\n                                onActionButtonClick={handleActionButtonClick}\n                            />\n                            {renderMobileMenuButton()}\n                        </div>\n                    )}\n                </nav>\n\n                {!hideNavElements && renderDrawer()}\n            </Layout.Content>\n        );\n    };\n\n    return (\n        <div\n            ref={elementRef}\n            className={clsx(\n                styles.wrapper,\n                fixed ? styles.wrapperFixed : styles.wrapperRelative,\n                theme?.mode === \"dark\"\n                    ? styles.wrapperDark\n                    : styles.wrapperLight,\n                className\n            )}\n            id={id || \"navbar-wrapper\"}\n            data-testid={otherProps[\"data-testid\"] || \"navbar-wrapper\"}\n        >\n            {masthead && <Masthead stretch={isStretch} />}\n            {renderNavbar()}\n        </div>\n    );\n};\n\nexport const Navbar = forwardRef(Component);\n"],"names":["Navbar","forwardRef","_a","ref","items","className","id","selectedId","compress","fixed","resources","hideNavElements","hideNavBranding","hideLinkIndicator","drawerDismissalExclusions","blockDrawerDismissalMethods","actionButtons","onItemClick","onActionButtonClick","onBrandClick","masthead","layout","headerLabel","drawerLabel","otherProps","__rest","showDrawer","setShowDrawer","useState","showOverlay","setShowOverlay","mobileMenuRef","useRef","isStretch","elementRef","theme","useContext","ThemeContext","defaultResource","getDefaultResourceLogo","tabletWidth","parsePxOrRemValue","useResolvedBreakpointToken","Breakpoint","primary","secondary","useImperativeHandle","Object","assign","current","dismissDrawer","useEffect","handleResize","window","addEventListener","removeEventListener","setTimeout","shouldDismissDrawer","dismissalMethod","indexOf","innerWidth","handleBrandClick","_event","type","handleNavItemClick","event","item","NavbarHelper","isNavItemCommon","onClick","preventDefault","isNavItemLink","subMenu","handleActionButtonClick","actionButton","args","handleMobileMenuButtonClick","handleDrawerClose","renderMobileMenuButton","drawerItems","mobile","desktop","length","drawerActionButtons","some","uncollapsible","hasCollapsibleActionButtons","_jsx","ClickableIcon","styles.mobileMenuButton","focusHighlight","children","MenuIcon","styles.mobileMenuIcon","_jsxs","clsx","styles.wrapper","styles.wrapperFixed","styles.wrapperRelative","mode","styles.wrapperDark","styles.wrapperLight","Masthead","stretch","Layout","Content","styles.nav","styles.navCompressed","styles.navDark","styles.navBrandContainer","styles.navBrandContainerCompressed","styles.navBrandContainerFull","styles.navBrandContainerResponsive","Brand","_Fragment","styles.navSeparator","styles.navSeparatorCompressed","styles.navSeparatorFull","styles.navSeparatorResponsive","styles.navElementsContainer","styles.navElementsContainerWithBranding","NavbarItems","NavbarActionButtons","Overlay","show","enableOverlayClick","onOverlayClick","Drawer","onClose"],"mappings":"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"}

package/cjs/navbar/navbar.styles_koy0c7.css

@@ -1,4 +1,4 @@
-.wkxx447{background-color:var(--fds-navbar-colour-bg);z-index:30;top:0;left:0;right:0;width:100%;}
+@layer fds{.wkxx447{background-color:var(--fds-navbar-colour-bg);z-index:30;top:0;left:0;right:0;width:100%;}
 .w1818o7d{position:-webkit-sticky;position:sticky;}
 .wjuvx4d{position:relative;}
 .w1f5qsn6{border-bottom:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}
@@ -17,4 +17,4 @@
 .n1lsvhqc{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;background-color:var(--fds-colour-border);height:100%;width:2px;}
 .n1yd75go{margin:0 1rem;}
 .ndxbaef{margin:0 1.5rem;}
-:where(body.fds-breakpoint-lg-max) .n3azfgc{margin:0 1rem;}:where(body.fds-breakpoint-sm-max) .n3azfgc{margin:0 0.75rem;}
+:where(body.fds-breakpoint-lg-max) .n3azfgc{margin:0 1rem;}:where(body.fds-breakpoint-sm-max) .n3azfgc{margin:0 0.75rem;}}

package/cjs/notification-banner/notification-banner.styles_uxlysy.css

@@ -1,4 +1,4 @@
-.w17suq18{position:relative;left:0;top:0;width:100%;-webkit-transition:all var(--fds-motion-duration-800) var(--fds-motion-timing-ease-default);transition:all var(--fds-motion-duration-800) var(--fds-motion-timing-ease-default);background:var(--fds-colour-bg-inverse-subtle);border-radius:var(--fds-radius-none);z-index:25;cursor:default;}
+@layer fds{.w17suq18{position:relative;left:0;top:0;width:100%;-webkit-transition:all var(--fds-motion-duration-800) var(--fds-motion-timing-ease-default);transition:all var(--fds-motion-duration-800) var(--fds-motion-timing-ease-default);background:var(--fds-colour-bg-inverse-subtle);border-radius:var(--fds-radius-none);z-index:25;cursor:default;}
 .w1ixs8gf{position:-webkit-sticky;position:sticky;}
 .w1trwg7u{cursor:pointer;}
 .cmwsx4o{-webkit-flex:1;-ms-flex:1;flex:1;-webkit-align-items:flex-start;-webkit-box-align:flex-start;-ms-flex-align:flex-start;align-items:flex-start;padding:var(--fds-spacing-24) 0;}
@@ -9,4 +9,4 @@
 .c12st863{position:relative;color:var(--fds-colour-hyperlink-inverse);}.c12st863 svg{color:var(--fds-colour-icon-primary-inverse);}.c12st863:hover,.c12st863:active,.c12st863:visited,.c12st863:focus{color:var(--fds-colour-hyperlink-inverse);}.c12st863:hover svg,.c12st863:active svg,.c12st863:visited svg,.c12st863:focus svg{color:var(--fds-colour-icon-primary-inverse);}
 .d1hjtr0v{margin-right:calc(var(--fds-spacing-24) * -1);padding-left:var(--fds-spacing-16);height:-webkit-max-content;height:-moz-max-content;height:max-content;}.d1hjtr0v svg{height:1.5rem;width:1.5rem;color:var(--fds-colour-icon-inverse);}
 .azqyi5b{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:var(--fds-spacing-4);-webkit-align-self:flex-start;-ms-flex-item-align:start;align-self:flex-start;margin-top:var(--fds-spacing-8);border:none;background:transparent;color:var(--fds-colour-hyperlink-inverse);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);cursor:pointer;}
-.i6bp33n{height:1.5rem;width:1.5rem;margin:var(--fds-spacing-24) var(--fds-spacing-24) 0 0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}.i6bp33n svg{height:100%;width:100%;color:var(--fds-colour-hyperlink-inverse);}
+.i6bp33n{height:1.5rem;width:1.5rem;margin:var(--fds-spacing-24) var(--fds-spacing-24) 0 0;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}.i6bp33n svg{height:100%;width:100%;color:var(--fds-colour-hyperlink-inverse);}}

package/cjs/otp-input/otp-input.styles_5sbutl.css

@@ -1,5 +1,5 @@
-.w3oye99{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}
+@layer fds{.w3oye99{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}
 .i1f2709h{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-self:center;-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--fds-spacing-8);}
 .i1ile0is input{padding:0;text-align:center;}
 .cvrt5zi{margin:var(--fds-spacing-32) 0;}
-.p1lfz4i{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}
+.p1lfz4i{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}}

package/cjs/otp-verification/contact-input-section.styles_odrjvt.css

@@ -1,4 +1,4 @@
-.c1lwydna{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}
+@layer fds{.c1lwydna{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}
 .c1ndevds{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
 .ce951ub{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;padding:0 var(--fds-spacing-16);border-radius:var(--fds-radius-sm) 0 0 var(--fds-radius-sm);box-shadow:inset 1px 0 0 var(--fds-colour-border),inset 0 1px 0 var(--fds-colour-border),inset 0 -1px 0 var(--fds-colour-border);}.ce951ub:focus-within{box-shadow:inset 2px 0 0 var(--fds-colour-border-focus),inset 0 2px 0 var(--fds-colour-border-focus),inset 0 -2px 0 var(--fds-colour-border-focus);}.ce951ub[data-max-width="true"]{width:100%;}
 .c1q1uu2c{box-shadow:inset 1px 0 0 var(--fds-colour-border-error),inset 0 1px 0 var(--fds-colour-border-error),inset 0 -1px 0 var(--fds-colour-border-error);}.c1q1uu2c:focus-within{box-shadow:inset 2px 0 0 var(--fds-colour-border-error-focus),inset 0 2px 0 var(--fds-colour-border-error-focus),inset 0 -2px 0 var(--fds-colour-border-error-focus);}
@@ -11,4 +11,4 @@
 .ergya1n{padding:0;}
 .pqn3wrd{padding:0 var(--fds-spacing-16);background:transparent;}
 .p9yjg9s input{color:var(--fds-colour-text-disabled);}
-.pg7qgn5{padding:0;}.pg7qgn5 input{margin-left:var(--fds-spacing-12);}
+.pg7qgn5{padding:0;}.pg7qgn5 input{margin-left:var(--fds-spacing-12);}}

package/cjs/otp-verification/otp-verification.styles_dg9bm8.css

@@ -1 +1 @@
-.o1jl65sy{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:var(--fds-spacing-16);}
+@layer fds{.o1jl65sy{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:var(--fds-spacing-16);}}

package/cjs/otp-verification/thumbnail/thumbnail.styles_shqylh.css

@@ -1,3 +1,3 @@
-.tzhqtbi{width:120px;height:120px;}:where(body.fds-breakpoint-sm-max) .tzhqtbi{width:64px;height:64px;}
+@layer fds{.tzhqtbi{width:120px;height:120px;}:where(body.fds-breakpoint-sm-max) .tzhqtbi{width:64px;height:64px;}
 .p19527g1 .background-circle{fill:var(--fds-colour-bg-stronger);}.p19527g1 .primary-path{fill:var(--fds-colour-icon-primary);}.p19527g1 .validation-icon{fill:var(--fds-colour-bg-available);}.p19527g1 .accent-light{fill:var(--fds-colour-bg-selected-stronger);}
-.e1m2pw4s .background-circle{fill:var(--fds-colour-bg-stronger);}.e1m2pw4s .primary-path{fill:var(--fds-colour-icon-primary);}.e1m2pw4s .validation-icon{fill:var(--fds-colour-bg-available);}.e1m2pw4s .accent-light-3{fill:var(--fds-colour-icon-primary-subtle);}.e1m2pw4s .accent-light-4{fill:var(--fds-colour-icon-primary-subtlest);}
+.e1m2pw4s .background-circle{fill:var(--fds-colour-bg-stronger);}.e1m2pw4s .primary-path{fill:var(--fds-colour-icon-primary);}.e1m2pw4s .validation-icon{fill:var(--fds-colour-bg-available);}.e1m2pw4s .accent-light-3{fill:var(--fds-colour-icon-primary-subtle);}.e1m2pw4s .accent-light-4{fill:var(--fds-colour-icon-primary-subtlest);}}

package/cjs/otp-verification/verification-section.styles_x8jj.css

@@ -1,5 +1,5 @@
-.v1j5kvy{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;background-color:var(--fds-colour-bg-strong);padding:var(--fds-spacing-16) var(--fds-spacing-32);gap:var(--fds-spacing-32);}:where(body.fds-breakpoint-sm-max) .v1j5kvy{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;gap:var(--fds-spacing-16);padding:var(--fds-spacing-16);}
+@layer fds{.v1j5kvy{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;background-color:var(--fds-colour-bg-strong);padding:var(--fds-spacing-16) var(--fds-spacing-32);gap:var(--fds-spacing-32);}:where(body.fds-breakpoint-sm-max) .v1j5kvy{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;gap:var(--fds-spacing-16);padding:var(--fds-spacing-16);}
 .s1h7j64h{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:var(--fds-spacing-16);}
 .rl8lhyn{color:var(--fds-colour-text-subtlest);}
 .v1ob0u9j{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--fds-spacing-8);max-width:472px;}
-.v61u1jj{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:83px;}
+.v61u1jj{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:83px;}}

package/cjs/overlay/overlay.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("@floating-ui/react"),r=require("clsx"),o=require("react"),s=require("react-dom");require("../theme/theme-provider/index.js");var n=require("../theme/theme-provider/hooks.js");require("../theme/tokens/border.js"),require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var l=require("../theme/utils/use-apply-styles.js");require("../theme/utils/use-media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js");var a=require("../util/simple-id-generator.js");require("../util/string-helper.js"),require("@react-aria/live-announcer");var i=require("./overlay.styles.js"),u=require("./use-floating-context.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=d(r),m=d(s);const y=({show:r=!1,rootId:s,onOverlayClick:d,children:y,backgroundOpacity:v,backgroundBlur:p=!0,disableTransition:g=!1,enableOverlayClick:f=!1,zIndex:h,id:b,containerRef:j})=>{const[k,q]=o.useState(null),[w,x]=o.useState(),O=a.useId(),L=t.useFloatingNodeId(),S=o.useRef(),C=o.useRef(!1),P=o.useRef(null),T=o.useRef(null),E=b?`lifesg-ds-overlay-root-${b}`:"lifesg-ds-overlay-root",I=null!=h?h:w?99999:99998,{themeProps:F,themeStyle:D}=n.useInheritedThemeScope(r);u.useFloatingParent(I),l.useApplyStyle(P,{[i.tokens.root.zIndex]:I}),o.useEffect((()=>(W(),q(N()),()=>{H(),z().length<1&&(B()&&(V("remove"),J()),Y("remove"))})),[]),o.useEffect((()=>{if(r){const e=A();R(e),$(),B()&&1===z().length&&(G(),V("add"));const t=setTimeout((()=>{Y("add")}),200);return()=>clearTimeout(t)}{H(),B()&&z().length<1&&(V("remove"),J());const e=setTimeout((()=>{z().length<1&&Y("remove")}),200);return()=>clearTimeout(e)}}),[r]),o.useEffect((()=>{if(r)return document.addEventListener("mousedown",K,!0),()=>{document.removeEventListener("mousedown",K,!0)}}),[r]);const R=e=>{S.current=e,x(e)},B=()=>/(iPad|iPhone|iPod)/g.test(navigator.userAgent),N=()=>document&&s?document.getElementById(s):document?document.body:null,A=()=>z().length>0,W=()=>{const e=document.documentElement.clientWidth,t=window.innerWidth-e;document.documentElement.style.setProperty(i.tokens.global.scrollbarWidth,`${t}px`)},Y=e=>{const t=document.body.classList.contains(i.tokens.global.overlayOpenClass);"add"!==e||t?"remove"===e&&t&&document.body.classList.remove(i.tokens.global.overlayOpenClass):document.body.classList.add(i.tokens.global.overlayOpenClass)},z=()=>{const e=document.body.dataset.lifesgDsOverlayOrder;return e?e.split(","):[]},$=()=>{const e=z();document.body.dataset.lifesgDsOverlayOrder=[...e,O].join(",")},H=()=>{const e=z();document.body.dataset.lifesgDsOverlayOrder=e.filter((e=>e!==O)).join(",")},V=e=>{if(!B())return;const t=document.body.classList.contains(i.tokens.global.overlayScrollLockClass);"add"!==e||t?"remove"===e&&t&&document.body.classList.remove(i.tokens.global.overlayScrollLockClass):document.body.classList.add(i.tokens.global.overlayScrollLockClass)},G=()=>{const e=document.body.style,t=e.top?e.top:window.scrollY+"px";document.body.style.setProperty(i.tokens.global.scrollY,t)},J=()=>{if(!B())return;const e=document.body.style.getPropertyValue(i.tokens.global.scrollY);requestAnimationFrame((()=>{window.scrollTo({top:parseFloat(e)})}))},K=e=>{var t;const r=null!==(t=null==j?void 0:j.current)&&void 0!==t?t:T.current,o=T.current;if(!r)return void(C.current=!1);const s=e.target,n=o===s,l=r===s,a=r.contains(s);C.current=!n&&(l||a)},M=e=>{var t;const r=null!==(t=null==j?void 0:j.current)&&void 0!==t?t:T.current,o=T.current;if(!r)return void(C.current=!1);const s=e.target,n=o===s,l=r===s,a=r.contains(s);!n&&(l||a)||C.current||!d||!f||(e.preventDefault(),d()),C.current=!1};return k?m.default.createPortal(e.jsx("div",Object.assign({ref:P,id:E,"data-testid":E,className:c.default(i.root,r&&i.rootShow)},F,{style:D,children:y&&e.jsx(t.FloatingNode,{id:L,children:e.jsx("div",{ref:T,"data-testid":"overlay-wrapper",className:c.default(i.wrapper,r?i.wrapperShow:i.wrapperHide,w&&i.wrapperStacked,p&&i.wrapperBackgroundBlur,g&&i.wrapperDisableTransition),onClick:M,children:y})})})),k):null};exports.Overlay=r=>e.jsx(t.FloatingTree,{children:e.jsx(y,Object.assign({},r))});
+"use strict";var e=require("react/jsx-runtime"),t=require("@floating-ui/react"),r=require("clsx"),o=require("react"),s=require("react-dom");require("../theme/theme-provider/index.js");var n=require("../theme/theme-provider/hooks.js");require("../theme/tokens/border.js"),require("../theme/tokens/colour.js"),require("../theme/tokens/font.js"),require("../theme/tokens/media-query.js");var l=require("../theme/utils/use-apply-styles.js");require("../theme/utils/use-media-query.js"),require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js");var a=require("../util/simple-id-generator.js");require("../util/string-helper.js"),require("@react-aria/live-announcer");var i=require("./overlay.styles.js"),u=require("./use-floating-context.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=d(r),m=d(s);const y=({show:r=!1,rootId:s,onOverlayClick:d,children:y,backgroundBlur:v=!0,disableTransition:p=!1,enableOverlayClick:g=!1,zIndex:f,id:h,containerRef:b})=>{const[j,k]=o.useState(null),[q,w]=o.useState(),x=a.useId(),O=t.useFloatingNodeId(),L=o.useRef(),S=o.useRef(!1),C=o.useRef(null),P=o.useRef(null),T=h?`lifesg-ds-overlay-root-${h}`:"lifesg-ds-overlay-root",E=null!=f?f:q?99999:99998,{themeProps:I,themeStyle:F}=n.useInheritedThemeScope(r);u.useFloatingParent(E),l.useApplyStyle(C,{[i.tokens.root.zIndex]:E}),o.useEffect((()=>(A(),k(B()),()=>{$(),Y().length<1&&(R()&&(H("remove"),G()),W("remove"))})),[]),o.useEffect((()=>{if(r){const e=N();D(e),z(),R()&&1===Y().length&&(V(),H("add"));const t=setTimeout((()=>{W("add")}),200);return()=>clearTimeout(t)}{$(),R()&&Y().length<1&&(H("remove"),G());const e=setTimeout((()=>{Y().length<1&&W("remove")}),200);return()=>clearTimeout(e)}}),[r]),o.useEffect((()=>{if(r)return document.addEventListener("mousedown",J,!0),()=>{document.removeEventListener("mousedown",J,!0)}}),[r]);const D=e=>{L.current=e,w(e)},R=()=>/(iPad|iPhone|iPod)/g.test(navigator.userAgent),B=()=>document&&s?document.getElementById(s):document?document.body:null,N=()=>Y().length>0,A=()=>{const e=document.documentElement.clientWidth,t=window.innerWidth-e;document.documentElement.style.setProperty(i.tokens.global.scrollbarWidth,`${t}px`)},W=e=>{const t=document.body.classList.contains(i.tokens.global.overlayOpenClass);"add"!==e||t?"remove"===e&&t&&document.body.classList.remove(i.tokens.global.overlayOpenClass):document.body.classList.add(i.tokens.global.overlayOpenClass)},Y=()=>{const e=document.body.dataset.lifesgDsOverlayOrder;return e?e.split(","):[]},z=()=>{const e=Y();document.body.dataset.lifesgDsOverlayOrder=[...e,x].join(",")},$=()=>{const e=Y();document.body.dataset.lifesgDsOverlayOrder=e.filter((e=>e!==x)).join(",")},H=e=>{if(!R())return;const t=document.body.classList.contains(i.tokens.global.overlayScrollLockClass);"add"!==e||t?"remove"===e&&t&&document.body.classList.remove(i.tokens.global.overlayScrollLockClass):document.body.classList.add(i.tokens.global.overlayScrollLockClass)},V=()=>{const e=document.body.style,t=e.top?e.top:window.scrollY+"px";document.body.style.setProperty(i.tokens.global.scrollY,t)},G=()=>{if(!R())return;const e=document.body.style.getPropertyValue(i.tokens.global.scrollY);requestAnimationFrame((()=>{window.scrollTo({top:parseFloat(e)})}))},J=e=>{var t;const r=null!==(t=null==b?void 0:b.current)&&void 0!==t?t:P.current,o=P.current;if(!r)return void(S.current=!1);const s=e.target,n=o===s,l=r===s,a=r.contains(s);S.current=!n&&(l||a)},K=e=>{var t;const r=null!==(t=null==b?void 0:b.current)&&void 0!==t?t:P.current,o=P.current;if(!r)return void(S.current=!1);const s=e.target,n=o===s,l=r===s,a=r.contains(s);!n&&(l||a)||S.current||!d||!g||(e.preventDefault(),d()),S.current=!1};return j?m.default.createPortal(e.jsx("div",Object.assign({ref:C,id:T,"data-testid":T,className:c.default(i.root,r&&i.rootShow)},I,{style:F,children:y&&e.jsx(t.FloatingNode,{id:O,children:e.jsx("div",{ref:P,"data-testid":"overlay-wrapper",className:c.default(i.wrapper,r?i.wrapperShow:i.wrapperHide,q&&i.wrapperStacked,v&&i.wrapperBackgroundBlur,p&&i.wrapperDisableTransition),onClick:K,children:y})})})),j):null};exports.Overlay=r=>e.jsx(t.FloatingTree,{children:e.jsx(y,Object.assign({},r))});
 //# sourceMappingURL=overlay.js.map

package/cjs/overlay/overlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"overlay.js","sources":["../../../src/overlay/overlay.tsx"],"sourcesContent":["import {\n    FloatingNode,\n    FloatingTree,\n    useFloatingNodeId,\n} from \"@floating-ui/react\";\nimport clsx from \"clsx\";\nimport type React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\n\nimport { useApplyStyle, useInheritedThemeScope } from \"../theme\";\nimport { useId } from \"../util\";\nimport * as styles from \"./overlay.styles\";\nimport type { OverlayProps } from \"./types\";\nimport { useFloatingParent } from \"./use-floating-context\";\n\nconst OverlayComponent = ({\n    show = false,\n    rootId,\n    onOverlayClick,\n    children,\n    backgroundOpacity: _backgroundOpacity,\n    backgroundBlur = true,\n    disableTransition = false,\n    enableOverlayClick = false,\n    zIndex: customZIndex,\n    id,\n    containerRef,\n}: OverlayProps): JSX.Element | null => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const [rootElement, setRootElement] = useState<HTMLElement | null>(null);\n    const [isStacked, _setIsStacked] = useState<boolean>();\n    const uid = useId();\n    const nodeId = useFloatingNodeId();\n\n    const stacked = useRef<boolean>();\n    // Track where mousedown started to prevent closing drawer during text selection drag\n    const mouseDownInsideModalRef = useRef(false);\n    const rootRef = useRef<HTMLDivElement>(null);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n\n    const overlayRootId = id\n        ? `lifesg-ds-overlay-root-${id}`\n        : \"lifesg-ds-overlay-root\";\n    const zIndex = customZIndex ?? (isStacked ? 99999 : 99998);\n    const { themeProps, themeStyle } = useInheritedThemeScope(show);\n\n    useFloatingParent(zIndex);\n\n    useApplyStyle(rootRef, { [styles.tokens.root.zIndex]: zIndex });\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        initialiseStylesForDocumentBody();\n        setRootElement(getRootElement());\n\n        return () => {\n            removeOverlay();\n\n            if (getOverlayOrder().length < 1) {\n                if (isIOS()) {\n                    applyScrollLockClassForIOS(\"remove\");\n                    scrollToLastScrollPositionForIOS();\n                }\n\n                applyBodyStyleClass(\"remove\");\n            }\n        };\n    }, []);\n\n    useEffect(() => {\n        if (show) {\n            const isStacked = checkIfStacked();\n            setStacked(isStacked);\n\n            addOverlay();\n\n            if (isIOS() && getOverlayOrder().length === 1) {\n                saveScrollPosition();\n                applyScrollLockClassForIOS(\"add\");\n            }\n\n            const timerId = setTimeout(() => {\n                applyBodyStyleClass(\"add\");\n            }, 200); // Allow overlay animations to complete\n\n            return () => clearTimeout(timerId);\n        } else {\n            removeOverlay();\n\n            if (isIOS() && getOverlayOrder().length < 1) {\n                applyScrollLockClassForIOS(\"remove\");\n                scrollToLastScrollPositionForIOS();\n            }\n\n            const timerId = setTimeout(() => {\n                if (getOverlayOrder().length < 1) {\n                    applyBodyStyleClass(\"remove\");\n                }\n            }, 200); // Allow overlay animations to complete\n\n            return () => clearTimeout(timerId);\n        }\n    }, [show]);\n\n    // Track mousedown origin to distinguish clicks from text selection drags\n    useEffect(() => {\n        if (!show) return;\n\n        document.addEventListener(\"mousedown\", handleDocumentMouseDown, true);\n        return () => {\n            document.removeEventListener(\n                \"mousedown\",\n                handleDocumentMouseDown,\n                true\n            );\n        };\n    }, [show]);\n\n    // =============================================================================\n    // REF FUNCTIONS\n    // =============================================================================\n    const setStacked = (data: boolean) => {\n        stacked.current = data;\n        _setIsStacked(data);\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const isIOS = () => /(iPad|iPhone|iPod)/g.test(navigator.userAgent);\n\n    const getRootElement = (): HTMLElement | null => {\n        if (document && rootId) {\n            return document.getElementById(rootId);\n        } else if (document) {\n            // If rootId not specified, we'll use body\n            return document.body;\n        } else {\n            return null;\n        }\n    };\n\n    const checkIfStacked = () => {\n        return getOverlayOrder().length > 0;\n    };\n\n    const initialiseStylesForDocumentBody = () => {\n        const documentWidth = document.documentElement.clientWidth;\n        const windowWidth = window.innerWidth;\n        const scrollBarWidth = windowWidth - documentWidth;\n\n        document.documentElement.style.setProperty(\n            styles.tokens.global.scrollbarWidth,\n            `${scrollBarWidth}px`\n        );\n    };\n\n    /**\n     * This sets the style of <body> to hide the scrollbar\n     */\n    const applyBodyStyleClass = (action: \"add\" | \"remove\") => {\n        const isOverlayStyleClassApplied = document.body.classList.contains(\n            styles.tokens.global.overlayOpenClass\n        );\n\n        if (action === \"add\" && !isOverlayStyleClassApplied) {\n            document.body.classList.add(styles.tokens.global.overlayOpenClass);\n        } else if (action === \"remove\" && isOverlayStyleClassApplied) {\n            document.body.classList.remove(\n                styles.tokens.global.overlayOpenClass\n            );\n        }\n    };\n\n    const getOverlayOrder = () => {\n        const attr = document.body.dataset.lifesgDsOverlayOrder;\n        return attr ? attr.split(\",\") : [];\n    };\n\n    const addOverlay = () => {\n        const order = getOverlayOrder();\n        document.body.dataset.lifesgDsOverlayOrder = [...order, uid].join(\",\");\n    };\n\n    const removeOverlay = () => {\n        const order = getOverlayOrder();\n        document.body.dataset.lifesgDsOverlayOrder = order\n            .filter((o) => o !== uid)\n            .join(\",\");\n    };\n\n    /**\n     * This sets the style of <body> to further prevent scrolling on iOS\n     *\n     * ref: https://stackoverflow.com/a/57455820/3932279\n     * `overflow: hidden` and `overscroll-behavior` is ignored by iOS, this is\n     * an alternative solution\n     *\n     * as a side effect this causes the scroll position to reset, so additional\n     * logic to restore the scroll on close is required\n     */\n    const applyScrollLockClassForIOS = (action: \"add\" | \"remove\") => {\n        if (!isIOS()) {\n            return;\n        }\n\n        const isClassApplied = document.body.classList.contains(\n            styles.tokens.global.overlayScrollLockClass\n        );\n\n        if (action === \"add\" && !isClassApplied) {\n            document.body.classList.add(\n                styles.tokens.global.overlayScrollLockClass\n            );\n        } else if (action === \"remove\" && isClassApplied) {\n            document.body.classList.remove(\n                styles.tokens.global.overlayScrollLockClass\n            );\n        }\n    };\n\n    const saveScrollPosition = () => {\n        const bodyStyle = document.body.style;\n        const scrollY = bodyStyle.top ? bodyStyle.top : window.scrollY + \"px\";\n\n        document.body.style.setProperty(styles.tokens.global.scrollY, scrollY);\n    };\n\n    const scrollToLastScrollPositionForIOS = () => {\n        if (!isIOS()) {\n            return;\n        }\n\n        const scrollY = document.body.style.getPropertyValue(\n            styles.tokens.global.scrollY\n        );\n        requestAnimationFrame(() => {\n            window.scrollTo({\n                top: parseFloat(scrollY),\n            });\n        });\n    };\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleDocumentMouseDown = (e: MouseEvent) => {\n        const container = containerRef?.current ?? wrapperRef.current;\n        const wrapper = wrapperRef.current;\n        if (!container) {\n            mouseDownInsideModalRef.current = false;\n            return;\n        }\n\n        const target = e.target as Node;\n        const clickedOnWrapper = wrapper === target;\n        const clickedOnContainer = container === target;\n        const clickedInsideContainer = container.contains(target);\n\n        // Track if mousedown started inside modal content\n        mouseDownInsideModalRef.current =\n            !clickedOnWrapper && (clickedOnContainer || clickedInsideContainer);\n    };\n\n    const handleWrapperClick = (event: React.MouseEvent<HTMLDivElement>) => {\n        const container = containerRef?.current ?? wrapperRef.current;\n        const wrapper = wrapperRef.current;\n        if (!container) {\n            mouseDownInsideModalRef.current = false;\n            return;\n        }\n\n        const target = event.target as Node;\n        const clickedOnWrapper = wrapper === target;\n        const clickedOnContainer = container === target;\n        const clickedInsideContainer = container.contains(target);\n        const clickedInsideModal = clickedOnContainer || clickedInsideContainer;\n\n        // Only close if both mousedown AND click happened outside modal\n        if (\n            (clickedOnWrapper || !clickedInsideModal) &&\n            !mouseDownInsideModalRef.current &&\n            onOverlayClick &&\n            enableOverlayClick\n        ) {\n            event.preventDefault();\n            onOverlayClick();\n        }\n\n        mouseDownInsideModalRef.current = false;\n    };\n\n    // =============================================================================\n    // RENDER\n    // =============================================================================\n    const renderWrapper = () => (\n        <FloatingNode id={nodeId}>\n            <div\n                ref={wrapperRef}\n                data-testid=\"overlay-wrapper\"\n                className={clsx(\n                    styles.wrapper,\n                    show ? styles.wrapperShow : styles.wrapperHide,\n                    isStacked && styles.wrapperStacked,\n                    backgroundBlur && styles.wrapperBackgroundBlur,\n                    disableTransition && styles.wrapperDisableTransition\n                )}\n                onClick={handleWrapperClick}\n            >\n                {children}\n            </div>\n        </FloatingNode>\n    );\n\n    const renderComponent = () => (\n        <div\n            ref={rootRef}\n            id={overlayRootId}\n            data-testid={overlayRootId}\n            className={clsx(styles.root, show && styles.rootShow)}\n            {...themeProps}\n            style={themeStyle}\n        >\n            {children && renderWrapper()}\n        </div>\n    );\n\n    return rootElement\n        ? ReactDOM.createPortal(renderComponent(), rootElement)\n        : null;\n};\n\nexport const Overlay = (props: OverlayProps) => {\n    return (\n        <FloatingTree>\n            <OverlayComponent {...props} />\n        </FloatingTree>\n    );\n};\n"],"names":["OverlayComponent","show","rootId","onOverlayClick","children","backgroundOpacity","_backgroundOpacity","backgroundBlur","disableTransition","enableOverlayClick","zIndex","customZIndex","id","containerRef","rootElement","setRootElement","useState","isStacked","_setIsStacked","uid","useId","nodeId","useFloatingNodeId","stacked","useRef","mouseDownInsideModalRef","rootRef","wrapperRef","overlayRootId","themeProps","themeStyle","useInheritedThemeScope","useFloatingParent","useApplyStyle","styles.tokens","root","useEffect","initialiseStylesForDocumentBody","getRootElement","removeOverlay","getOverlayOrder","length","isIOS","applyScrollLockClassForIOS","scrollToLastScrollPositionForIOS","applyBodyStyleClass","checkIfStacked","setStacked","addOverlay","saveScrollPosition","timerId","setTimeout","clearTimeout","document","addEventListener","handleDocumentMouseDown","removeEventListener","data","current","test","navigator","userAgent","getElementById","body","documentWidth","documentElement","clientWidth","scrollBarWidth","window","innerWidth","style","setProperty","global","scrollbarWidth","action","isOverlayStyleClassApplied","classList","contains","overlayOpenClass","remove","add","attr","dataset","lifesgDsOverlayOrder","split","order","join","filter","o","isClassApplied","overlayScrollLockClass","bodyStyle","scrollY","top","getPropertyValue","requestAnimationFrame","scrollTo","parseFloat","e","container","_a","wrapper","target","clickedOnWrapper","clickedOnContainer","clickedInsideContainer","handleWrapperClick","event","preventDefault","ReactDOM","createPortal","_jsx","Object","assign","ref","className","clsx","styles.root","styles.rootShow","FloatingNode","styles.wrapper","styles.wrapperShow","styles.wrapperHide","styles.wrapperStacked","styles.wrapperBackgroundBlur","styles.wrapperDisableTransition","onClick","props","FloatingTree"],"mappings":"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"}
+{"version":3,"file":"overlay.js","sources":["../../../src/overlay/overlay.tsx"],"sourcesContent":["import {\n    FloatingNode,\n    FloatingTree,\n    useFloatingNodeId,\n} from \"@floating-ui/react\";\nimport clsx from \"clsx\";\nimport type React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\n\nimport { useApplyStyle, useInheritedThemeScope } from \"../theme\";\nimport { useId } from \"../util\";\nimport * as styles from \"./overlay.styles\";\nimport type { OverlayProps } from \"./types\";\nimport { useFloatingParent } from \"./use-floating-context\";\n\nconst OverlayComponent = ({\n    show = false,\n    rootId,\n    onOverlayClick,\n    children,\n    backgroundBlur = true,\n    disableTransition = false,\n    enableOverlayClick = false,\n    zIndex: customZIndex,\n    id,\n    containerRef,\n}: OverlayProps): JSX.Element | null => {\n    // =============================================================================\n    // CONST, STATE, REF\n    // =============================================================================\n    const [rootElement, setRootElement] = useState<HTMLElement | null>(null);\n    const [isStacked, _setIsStacked] = useState<boolean>();\n    const uid = useId();\n    const nodeId = useFloatingNodeId();\n\n    const stacked = useRef<boolean>();\n    // Track where mousedown started to prevent closing drawer during text selection drag\n    const mouseDownInsideModalRef = useRef(false);\n    const rootRef = useRef<HTMLDivElement>(null);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n\n    const overlayRootId = id\n        ? `lifesg-ds-overlay-root-${id}`\n        : \"lifesg-ds-overlay-root\";\n    const zIndex = customZIndex ?? (isStacked ? 99999 : 99998);\n    const { themeProps, themeStyle } = useInheritedThemeScope(show);\n\n    useFloatingParent(zIndex);\n\n    useApplyStyle(rootRef, { [styles.tokens.root.zIndex]: zIndex });\n\n    // =============================================================================\n    // EFFECTS\n    // =============================================================================\n    useEffect(() => {\n        initialiseStylesForDocumentBody();\n        setRootElement(getRootElement());\n\n        return () => {\n            removeOverlay();\n\n            if (getOverlayOrder().length < 1) {\n                if (isIOS()) {\n                    applyScrollLockClassForIOS(\"remove\");\n                    scrollToLastScrollPositionForIOS();\n                }\n\n                applyBodyStyleClass(\"remove\");\n            }\n        };\n    }, []);\n\n    useEffect(() => {\n        if (show) {\n            const isStacked = checkIfStacked();\n            setStacked(isStacked);\n\n            addOverlay();\n\n            if (isIOS() && getOverlayOrder().length === 1) {\n                saveScrollPosition();\n                applyScrollLockClassForIOS(\"add\");\n            }\n\n            const timerId = setTimeout(() => {\n                applyBodyStyleClass(\"add\");\n            }, 200); // Allow overlay animations to complete\n\n            return () => clearTimeout(timerId);\n        } else {\n            removeOverlay();\n\n            if (isIOS() && getOverlayOrder().length < 1) {\n                applyScrollLockClassForIOS(\"remove\");\n                scrollToLastScrollPositionForIOS();\n            }\n\n            const timerId = setTimeout(() => {\n                if (getOverlayOrder().length < 1) {\n                    applyBodyStyleClass(\"remove\");\n                }\n            }, 200); // Allow overlay animations to complete\n\n            return () => clearTimeout(timerId);\n        }\n    }, [show]);\n\n    // Track mousedown origin to distinguish clicks from text selection drags\n    useEffect(() => {\n        if (!show) return;\n\n        document.addEventListener(\"mousedown\", handleDocumentMouseDown, true);\n        return () => {\n            document.removeEventListener(\n                \"mousedown\",\n                handleDocumentMouseDown,\n                true\n            );\n        };\n    }, [show]);\n\n    // =============================================================================\n    // REF FUNCTIONS\n    // =============================================================================\n    const setStacked = (data: boolean) => {\n        stacked.current = data;\n        _setIsStacked(data);\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const isIOS = () => /(iPad|iPhone|iPod)/g.test(navigator.userAgent);\n\n    const getRootElement = (): HTMLElement | null => {\n        if (document && rootId) {\n            return document.getElementById(rootId);\n        } else if (document) {\n            // If rootId not specified, we'll use body\n            return document.body;\n        } else {\n            return null;\n        }\n    };\n\n    const checkIfStacked = () => {\n        return getOverlayOrder().length > 0;\n    };\n\n    const initialiseStylesForDocumentBody = () => {\n        const documentWidth = document.documentElement.clientWidth;\n        const windowWidth = window.innerWidth;\n        const scrollBarWidth = windowWidth - documentWidth;\n\n        document.documentElement.style.setProperty(\n            styles.tokens.global.scrollbarWidth,\n            `${scrollBarWidth}px`\n        );\n    };\n\n    /**\n     * This sets the style of <body> to hide the scrollbar\n     */\n    const applyBodyStyleClass = (action: \"add\" | \"remove\") => {\n        const isOverlayStyleClassApplied = document.body.classList.contains(\n            styles.tokens.global.overlayOpenClass\n        );\n\n        if (action === \"add\" && !isOverlayStyleClassApplied) {\n            document.body.classList.add(styles.tokens.global.overlayOpenClass);\n        } else if (action === \"remove\" && isOverlayStyleClassApplied) {\n            document.body.classList.remove(\n                styles.tokens.global.overlayOpenClass\n            );\n        }\n    };\n\n    const getOverlayOrder = () => {\n        const attr = document.body.dataset.lifesgDsOverlayOrder;\n        return attr ? attr.split(\",\") : [];\n    };\n\n    const addOverlay = () => {\n        const order = getOverlayOrder();\n        document.body.dataset.lifesgDsOverlayOrder = [...order, uid].join(\",\");\n    };\n\n    const removeOverlay = () => {\n        const order = getOverlayOrder();\n        document.body.dataset.lifesgDsOverlayOrder = order\n            .filter((o) => o !== uid)\n            .join(\",\");\n    };\n\n    /**\n     * This sets the style of <body> to further prevent scrolling on iOS\n     *\n     * ref: https://stackoverflow.com/a/57455820/3932279\n     * `overflow: hidden` and `overscroll-behavior` is ignored by iOS, this is\n     * an alternative solution\n     *\n     * as a side effect this causes the scroll position to reset, so additional\n     * logic to restore the scroll on close is required\n     */\n    const applyScrollLockClassForIOS = (action: \"add\" | \"remove\") => {\n        if (!isIOS()) {\n            return;\n        }\n\n        const isClassApplied = document.body.classList.contains(\n            styles.tokens.global.overlayScrollLockClass\n        );\n\n        if (action === \"add\" && !isClassApplied) {\n            document.body.classList.add(\n                styles.tokens.global.overlayScrollLockClass\n            );\n        } else if (action === \"remove\" && isClassApplied) {\n            document.body.classList.remove(\n                styles.tokens.global.overlayScrollLockClass\n            );\n        }\n    };\n\n    const saveScrollPosition = () => {\n        const bodyStyle = document.body.style;\n        const scrollY = bodyStyle.top ? bodyStyle.top : window.scrollY + \"px\";\n\n        document.body.style.setProperty(styles.tokens.global.scrollY, scrollY);\n    };\n\n    const scrollToLastScrollPositionForIOS = () => {\n        if (!isIOS()) {\n            return;\n        }\n\n        const scrollY = document.body.style.getPropertyValue(\n            styles.tokens.global.scrollY\n        );\n        requestAnimationFrame(() => {\n            window.scrollTo({\n                top: parseFloat(scrollY),\n            });\n        });\n    };\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleDocumentMouseDown = (e: MouseEvent) => {\n        const container = containerRef?.current ?? wrapperRef.current;\n        const wrapper = wrapperRef.current;\n        if (!container) {\n            mouseDownInsideModalRef.current = false;\n            return;\n        }\n\n        const target = e.target as Node;\n        const clickedOnWrapper = wrapper === target;\n        const clickedOnContainer = container === target;\n        const clickedInsideContainer = container.contains(target);\n\n        // Track if mousedown started inside modal content\n        mouseDownInsideModalRef.current =\n            !clickedOnWrapper && (clickedOnContainer || clickedInsideContainer);\n    };\n\n    const handleWrapperClick = (event: React.MouseEvent<HTMLDivElement>) => {\n        const container = containerRef?.current ?? wrapperRef.current;\n        const wrapper = wrapperRef.current;\n        if (!container) {\n            mouseDownInsideModalRef.current = false;\n            return;\n        }\n\n        const target = event.target as Node;\n        const clickedOnWrapper = wrapper === target;\n        const clickedOnContainer = container === target;\n        const clickedInsideContainer = container.contains(target);\n        const clickedInsideModal = clickedOnContainer || clickedInsideContainer;\n\n        // Only close if both mousedown AND click happened outside modal\n        if (\n            (clickedOnWrapper || !clickedInsideModal) &&\n            !mouseDownInsideModalRef.current &&\n            onOverlayClick &&\n            enableOverlayClick\n        ) {\n            event.preventDefault();\n            onOverlayClick();\n        }\n\n        mouseDownInsideModalRef.current = false;\n    };\n\n    // =============================================================================\n    // RENDER\n    // =============================================================================\n    const renderWrapper = () => (\n        <FloatingNode id={nodeId}>\n            <div\n                ref={wrapperRef}\n                data-testid=\"overlay-wrapper\"\n                className={clsx(\n                    styles.wrapper,\n                    show ? styles.wrapperShow : styles.wrapperHide,\n                    isStacked && styles.wrapperStacked,\n                    backgroundBlur && styles.wrapperBackgroundBlur,\n                    disableTransition && styles.wrapperDisableTransition\n                )}\n                onClick={handleWrapperClick}\n            >\n                {children}\n            </div>\n        </FloatingNode>\n    );\n\n    const renderComponent = () => (\n        <div\n            ref={rootRef}\n            id={overlayRootId}\n            data-testid={overlayRootId}\n            className={clsx(styles.root, show && styles.rootShow)}\n            {...themeProps}\n            style={themeStyle}\n        >\n            {children && renderWrapper()}\n        </div>\n    );\n\n    return rootElement\n        ? ReactDOM.createPortal(renderComponent(), rootElement)\n        : null;\n};\n\nexport const Overlay = (props: OverlayProps) => {\n    return (\n        <FloatingTree>\n            <OverlayComponent {...props} />\n        </FloatingTree>\n    );\n};\n"],"names":["OverlayComponent","show","rootId","onOverlayClick","children","backgroundBlur","disableTransition","enableOverlayClick","zIndex","customZIndex","id","containerRef","rootElement","setRootElement","useState","isStacked","_setIsStacked","uid","useId","nodeId","useFloatingNodeId","stacked","useRef","mouseDownInsideModalRef","rootRef","wrapperRef","overlayRootId","themeProps","themeStyle","useInheritedThemeScope","useFloatingParent","useApplyStyle","styles.tokens","root","useEffect","initialiseStylesForDocumentBody","getRootElement","removeOverlay","getOverlayOrder","length","isIOS","applyScrollLockClassForIOS","scrollToLastScrollPositionForIOS","applyBodyStyleClass","checkIfStacked","setStacked","addOverlay","saveScrollPosition","timerId","setTimeout","clearTimeout","document","addEventListener","handleDocumentMouseDown","removeEventListener","data","current","test","navigator","userAgent","getElementById","body","documentWidth","documentElement","clientWidth","scrollBarWidth","window","innerWidth","style","setProperty","global","scrollbarWidth","action","isOverlayStyleClassApplied","classList","contains","overlayOpenClass","remove","add","attr","dataset","lifesgDsOverlayOrder","split","order","join","filter","o","isClassApplied","overlayScrollLockClass","bodyStyle","scrollY","top","getPropertyValue","requestAnimationFrame","scrollTo","parseFloat","e","container","_a","wrapper","target","clickedOnWrapper","clickedOnContainer","clickedInsideContainer","handleWrapperClick","event","preventDefault","ReactDOM","createPortal","_jsx","Object","assign","ref","className","clsx","styles.root","styles.rootShow","FloatingNode","styles.wrapper","styles.wrapperShow","styles.wrapperHide","styles.wrapperStacked","styles.wrapperBackgroundBlur","styles.wrapperDisableTransition","onClick","props","FloatingTree"],"mappings":"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"}

package/cjs/overlay/overlay.styles_12wym18.css

@@ -1,8 +1,8 @@
-.r1042j6c{position:fixed;left:0;top:0;height:0;width:0;visibility:hidden;z-index:var(--fds-internal-overlay-root-zIndex);}.lifesg-ds-overlay-open {padding-right:var(--fds-internal-overlay-body-scrollbarWidth, 0)!important;overflow:hidden;scrollbar-width:none;-ms-overflow-style:none;}.lifesg-ds-overlay-open::-webkit-scrollbar {display:none;}.lifesg-ds-overlay-scroll-lock {position:fixed;top:var(--fds-internal-overlay-body-scrollY, 0);bottom:0;}
+@layer fds{.r1042j6c{position:fixed;left:0;top:0;height:0;width:0;visibility:hidden;z-index:var(--fds-internal-overlay-root-zIndex);}.lifesg-ds-overlay-open {padding-right:var(--fds-internal-overlay-body-scrollbarWidth, 0)!important;overflow:hidden;scrollbar-width:none;-ms-overflow-style:none;}.lifesg-ds-overlay-open::-webkit-scrollbar {display:none;}.lifesg-ds-overlay-scroll-lock {position:fixed;top:var(--fds-internal-overlay-body-scrollY, 0);bottom:0;}
 .rceie2f{height:100%;width:100vw;visibility:visible;}
 .w1q7jcf6{position:absolute;left:0;top:0;background-color:var(--fds-colour-overlay-strong);-webkit-backdrop-filter:none;backdrop-filter:none;-webkit-transition:opacity 200ms ease;transition:opacity 200ms ease;}
 .w14rsmxt{background-color:var(--fds-colour-overlay-subtle);}
 .w1xh3xyq{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);}
 .wv8m6sc{visibility:visible;opacity:1;pointer-events:auto;height:100%;width:100vw;}
 .w1q7bprp{visibility:hidden;opacity:0;transition-delay:400ms;pointer-events:none;height:0;width:0;}
-.w1ttt09o{-webkit-transition:none;transition:none;transition-delay:0ms;}
+.w1ttt09o{-webkit-transition:none;transition:none;transition-delay:0ms;}}

package/cjs/pagination/pagination.styles_6bcgva.css

@@ -1,4 +1,4 @@
-.p1afjf30{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
+@layer fds{.p1afjf30{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
 .p1ma9kw3{-webkit-align-self:flex-start;-ms-flex-item-align:start;align-self:flex-start;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;}:where(body.fds-breakpoint-lg-max) .p1ma9kw3{-webkit-align-self:center;-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center;}
 .p1sz1s7f{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
 .irakt3t{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;outline:none;border-radius:var(--fds-radius-sm);height:2.5rem;width:2.5rem;padding:0 var(--fds-spacing-8);color:var(--fds-colour-icon-primary);}.irakt3t svg{height:1.25rem;width:1.25rem;}.irakt3t:disabled{color:var(--fds-colour-icon-disabled-subtle);cursor:not-allowed;}.irakt3t:not(:disabled):hover,.irakt3t:not(:disabled):focus-visible{background:var(--fds-colour-bg-hover);}
@@ -11,4 +11,4 @@
 .lquxmfr{margin:0 var(--fds-spacing-16);white-space:nowrap;}
 .i1hj21s6{width:3.5rem;height:2.5rem;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);}.i1hj21s6 input{padding:0 var(--fds-spacing-8);text-align:center;}
 .h1x6xag5{position:absolute;top:calc(var(--fds-spacing-8) * -1);-webkit-transform:translateY(-100%);-moz-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);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;border:none;border-radius:var(--fds-radius-sm);width:-webkit-max-content;width:-moz-max-content;width:max-content;padding:var(--fds-spacing-4) var(--fds-spacing-12);background:var(--fds-colour-bg-hover);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);color:var(--fds-colour-text-hover);}
-.issm41d{margin-left:var(--fds-spacing-4);width:10rem;}
+.issm41d{margin-left:var(--fds-spacing-4);width:10rem;}}

package/cjs/pill/pill.styles_xwrniu.css

@@ -1,4 +1,4 @@
-.w2wrvwd{border-radius:var(--fds-radius-full);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);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);}.w2wrvwd svg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}
+@layer fds{.w2wrvwd{border-radius:var(--fds-radius-full);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);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);}.w2wrvwd svg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}
 .w1bnitgk{color:var(--fds-colour-text-inverse);border-color:transparent;}
 .w10rd591{background:var(--fds-colour-bg-inverse);}
 .w14ozhbm{background:var(--fds-colour-bg-inverse-subtler);}
@@ -14,4 +14,4 @@
 .w1c1fn8z{background:var(--fds-colour-bg-error);border-color:var(--fds-colour-border-error);color:var(--fds-colour-text-error);}
 .w19krjn1{background:var(--fds-colour-bg-info);border-color:var(--fds-colour-border-info);color:var(--fds-colour-text-info);}
 .w1h3c6yz{background:var(--fds-colour-bg-primary-subtlest);border-color:var(--fds-colour-border-primary);color:var(--fds-colour-text-primary);}
-.l1uma0l6{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;text-align:left;}
+.l1uma0l6{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;text-align:left;}}

package/cjs/popover/popover-inline/popover-inline.styles_bkopnt.css

@@ -1,2 +1,2 @@
-.p1h7dfwa{color:var(--fds-colour-text-primary);font-weight:600;text-underline-position:under;}.p1h7dfwa[data-underline-style="underline"]{-webkit-text-decoration:underline 1px;text-decoration:underline 1px;}.p1h7dfwa[data-underline-style="underline-dashed"]{-webkit-text-decoration:underline dashed 1px;text-decoration:underline dashed 1px;}.p1h7dfwa:hover,.p1h7dfwa:focus-visible{color:var(--fds-colour-text-hover);}.p1h7dfwa[data-underline-hover-style="underline"]:hover,.p1h7dfwa[data-underline-hover-style="underline"]:focus-visible{-webkit-text-decoration:underline 1px;text-decoration:underline 1px;}.p1h7dfwa[data-underline-hover-style="underline-dashed"]:hover,.p1h7dfwa[data-underline-hover-style="underline-dashed"]:focus-visible{-webkit-text-decoration:underline dashed 1px;text-decoration:underline dashed 1px;}.p1h7dfwa svg{height:1lh;width:1em;vertical-align:top;}
-.pzf43s3{margin-left:0.25rem;}
+@layer fds{.p1h7dfwa{color:var(--fds-colour-text-primary);font-weight:600;text-underline-position:under;}.p1h7dfwa[data-underline-style="underline"]{-webkit-text-decoration:underline 1px;text-decoration:underline 1px;}.p1h7dfwa[data-underline-style="underline-dashed"]{-webkit-text-decoration:underline dashed 1px;text-decoration:underline dashed 1px;}.p1h7dfwa:hover,.p1h7dfwa:focus-visible{color:var(--fds-colour-text-hover);}.p1h7dfwa[data-underline-hover-style="underline"]:hover,.p1h7dfwa[data-underline-hover-style="underline"]:focus-visible{-webkit-text-decoration:underline 1px;text-decoration:underline 1px;}.p1h7dfwa[data-underline-hover-style="underline-dashed"]:hover,.p1h7dfwa[data-underline-hover-style="underline-dashed"]:focus-visible{-webkit-text-decoration:underline dashed 1px;text-decoration:underline dashed 1px;}.p1h7dfwa svg{height:1lh;width:1em;vertical-align:top;}
+.pzf43s3{margin-left:0.25rem;}}

package/cjs/popover/popover-trigger.styles_8zokig.css

@@ -1 +1 @@
-.tjxhm5y{display:inline;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;cursor:pointer;position:relative;}
+@layer fds{.tjxhm5y{display:inline;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;cursor:pointer;position:relative;}}

package/cjs/popover/popover.styles_ujnf0h.css

@@ -1,4 +1,4 @@
-.p1scb124{max-width:30rem;padding:0 1rem;pointer-events:auto;outline:none;}
+@layer fds{.p1scb124{max-width:30rem;padding:0 1rem;pointer-events:auto;outline:none;}
 .p1jmdldd{color:var(--fds-colour-text);}:where(body.fds-breakpoint-sm-max) .p1jmdldd{display:none;}.p1jmdldd::-webkit-scrollbar{width:14px;}.p1jmdldd::-webkit-scrollbar-track{background:transparent;}.p1jmdldd::-webkit-scrollbar-thumb{background:var(--fds-colour-bg-inverse-subtlest);border:5px solid transparent;border-radius:var(--fds-radius-full);-webkit-background-clip:padding-box;background-clip:padding-box;}
 .p51fygj{--fds-internal-popover-popoverCard-maxHeight:initial;max-height:var(--fds-internal-popover-popoverCard-maxHeight);}
-.p1hzbz92{--fds-internal-popover-popoverCard-overflowY:initial;overflow-y:var(--fds-internal-popover-popoverCard-overflowY);}
+.p1hzbz92{--fds-internal-popover-popoverCard-overflowY:initial;overflow-y:var(--fds-internal-popover-popoverCard-overflowY);}}

package/cjs/progress-indicator/progress-indicator.styles_1c038s4.css

@@ -1,8 +1,8 @@
-.w103113g{position:relative;width:100%;margin:2rem 0;}:where(body.fds-breakpoint-xl-max) .w103113g{margin:1.5rem 0;}:where(body.fds-breakpoint-lg-max) .w103113g{margin:1rem 0;}
+@layer fds{.w103113g{position:relative;width:100%;margin:2rem 0;}:where(body.fds-breakpoint-xl-max) .w103113g{margin:1.5rem 0;}:where(body.fds-breakpoint-lg-max) .w103113g{margin:1rem 0;}
 .ck7dr6z{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-basis:0;-ms-flex-preferred-size:0;flex-basis:0;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;width:100%;}
 .i1k6bqsf{height:4px;margin-bottom:var(--fds-spacing-8);border-radius:var(--fds-radius-full);background-color:var(--fds-colour-bg-disabled);}
 .inywq69{background-color:var(--fds-colour-bg-primary-subtle);}
 .i1ubzlq2{overflow-wrap:anywhere;color:var(--fds-colour-text-disabled);}
 .i8ugwdc{color:var(--fds-colour-text-primary);}
 .i8128on{overflow-wrap:anywhere;color:var(--fds-colour-text);}
-.i1vcego5{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex:1;-ms-flex:1;flex:1;}.i1vcego5:not(:last-child){margin-right:0.5rem;}
+.i1vcego5{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex:1;-ms-flex:1;flex:1;}.i1vcego5:not(:last-child){margin-right:0.5rem;}}

package/cjs/radio-button/radio-button.styles_1c4v6v.css

@@ -1,8 +1,8 @@
-.c22ppgr{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;}.c22ppgr[data-display-size="small"]{height:1.5rem;width:1.5rem;}.c22ppgr[data-display-size="default"]{height:2rem;width:2rem;}
+@layer fds{.c22ppgr{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;}.c22ppgr[data-display-size="small"]{height:1.5rem;width:1.5rem;}.c22ppgr[data-display-size="default"]{height:2rem;width:2rem;}
 .iwrt33w{height:100%;width:100%;-webkit-transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);transition:var(--fds-motion-duration-150) var(--fds-motion-timing-ease-default);}
 .u16bhkcz{color:var(--fds-colour-icon-subtle);}
 .ubjq3ci{color:var(--fds-colour-icon-disabled-subtle);}
 .crf4g3g{color:var(--fds-colour-icon-selected);}
 .c1bv24bs{color:var(--fds-colour-icon-selected-disabled);}
 .ie6234c{position:absolute;height:100%;width:100%;cursor:not-allowed;z-index:1;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:transparent;border:none;}
-.i1pcowd9{cursor:pointer;}@media (pointer: fine){.i1pcowd9:hover+svg{color:var(--fds-colour-icon-hover);}}
+.i1pcowd9{cursor:pointer;}@media (pointer: fine){.i1pcowd9:hover+svg{color:var(--fds-colour-icon-hover);}}}

package/cjs/schedule/schedule-day-view/schedule-day-view.styles_8ti149.css

@@ -1,4 +1,4 @@
-.a1gk5ipc{color:var(--fds-colour-icon);}
+@layer fds{.a1gk5ipc{color:var(--fds-colour-icon);}
 .ac6jj8s{width:2rem;}
 .syko8xg{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;height:100%;}
 .lfazoz2{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:25rem;height:100%;border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-radius:var(--fds-radius-md);background:var(--fds-colour-bg);}
@@ -27,4 +27,4 @@
 .s1cpyxi3{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);}
 .s2as1da{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);}
 .t42sdto{--fds-internal-scheduleDayView-timeline-top:0px;position:absolute;width:100%;height:2px;background:var(--fds-colour-icon-primary);top:var(--fds-internal-scheduleDayView-timeline-top);z-index:2;}
-.e1xn1uhc{width:100%;height:47px;}
+.e1xn1uhc{width:100%;height:47px;}}

package/cjs/schedule/schedule-header/schedule-header.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../../_virtual/_tslib.js"),a=require("react/jsx-runtime"),t=require("../../button/button.js"),r=require("../../date-navigator/date-navigator.js"),i=require("../../input-select/input-select.js"),l=require("../../typography/index.js");require("../../util/calendar-helper.js");var s=require("../../util/date-helper.js");require("../../external/dayjs/dayjs.min.js"),require("react"),require("../../util/simple-id-generator.js"),require("../../util/string-helper.js"),require("@react-aria/live-announcer");var n=require("./schedule-header.styles.js");exports.ScheduleHeader=o=>{var{date:c,view:d="day",minDate:u,maxDate:D,onPreviousDayClick:j,onNextDayClick:y,onCalendarDateSelect:v,onViewChange:p,onTodayClick:h}=o,x=e.__rest(o,["date","view","minDate","maxDate","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onViewChange","onTodayClick"]);const m=[{label:"Day",value:"day"},{label:"Week",value:"week"}],k=m.find((e=>e.value===d));return a.jsxs("div",Object.assign({className:n.scheduleHeaderWrapper},x,{children:[a.jsxs("div",{className:n.leftSection,children:[a.jsx(t.Button,{className:n.button,styleType:"light",onClick:h,children:"Today"}),a.jsx(r.DateNavigator,{className:n.dateNavigator,selectedDate:c,minDate:u,maxDate:D,view:d,onLeftArrowClick:e=>{if("week"===d){const a=s.DateHelper.toDayjs(e).subtract(1,"week");j(a.format("YYYY-MM-DD"))}else j(e)},onRightArrowClick:e=>{if("week"===d){const a=s.DateHelper.toDayjs(e).add(1,"week");y(a.format("YYYY-MM-DD"))}else y(e)},onCalendarDateSelect:v})]}),a.jsxs("div",{className:n.rightSection,children:[a.jsx(l.Typography.BodyMD,{className:n.text,children:"View by:"}),a.jsx(i.InputSelect,{options:m,selectedOption:k,onSelectOption:e=>null==p?void 0:p(e.value),listExtractor:e=>e.label,displayValueExtractor:e=>e.label,dropdownWidth:n.DROPDOWN_WIDTH})]})]}))};
+"use strict";var e=require("../../_virtual/_tslib.js"),a=require("react/jsx-runtime"),t=require("../../button/button.js"),r=require("../../date-navigator/date-navigator.js"),i=require("../../input-select/input-select.js"),l=require("../../typography/index.js");require("../../util/calendar-helper.js");var s=require("../../util/date-helper.js");require("../../external/dayjs/dayjs.min.js"),require("react"),require("../../util/simple-id-generator.js"),require("../../util/string-helper.js"),require("@react-aria/live-announcer");var n=require("./schedule-header.styles.js");exports.ScheduleHeader=o=>{var{date:c,view:d="day",minDate:u,maxDate:D,onPreviousDayClick:j,onNextDayClick:v,onCalendarDateSelect:y,onViewChange:p,onTodayClick:h}=o,x=e.__rest(o,["date","view","minDate","maxDate","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onViewChange","onTodayClick"]);const m=[{label:"Day",value:"day"},{label:"Week",value:"week"}],k=m.find((e=>e.value===d));return a.jsxs("div",Object.assign({className:n.scheduleHeaderWrapper},x,{children:[a.jsxs("div",{className:n.leftSection,children:[a.jsx(t.Button,{className:n.button,styleType:"light",onClick:h,children:"Today"}),a.jsx(r.DateNavigator,{className:n.dateNavigator,selectedDate:c,minDate:u,maxDate:D,view:d,onLeftArrowClick:e=>{if("week"===d){const a=s.DateHelper.toDayjs(e).subtract(1,"week");j(a.format("YYYY-MM-DD"))}else j(e)},onRightArrowClick:e=>{if("week"===d){const a=s.DateHelper.toDayjs(e).add(1,"week");v(a.format("YYYY-MM-DD"))}else v(e)},onCalendarDateSelect:y})]}),a.jsxs("div",{className:n.rightSection,children:[a.jsx(l.Typography.BodyMD,{className:n.text,children:"View by:"}),a.jsx(i.InputSelect,{"data-testid":"view-selector",options:m,selectedOption:k,onSelectOption:e=>null==p?void 0:p(e.value),listExtractor:e=>e.label,displayValueExtractor:e=>e.label,dropdownWidth:n.DROPDOWN_WIDTH})]})]}))};
 //# sourceMappingURL=schedule-header.js.map

package/cjs/schedule/schedule-header/schedule-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"schedule-header.js","sources":["../../../../src/schedule/schedule-header/schedule-header.tsx"],"sourcesContent":["import { Button } from \"../../button\";\nimport { DateNavigator } from \"../../date-navigator\";\nimport { InputSelect } from \"../../input-select\";\nimport { Typography } from \"../../typography\";\nimport { DateHelper } from \"../../util\";\nimport type { ScheduleView } from \"../types\";\nimport * as styles from \"./schedule-header.styles\";\n\nexport interface ScheduleHeaderProps {\n    id?: string | undefined;\n    date: string;\n    view: ScheduleView;\n    minDate?: string | undefined;\n    maxDate?: string | undefined;\n    onPreviousDayClick: (currentDate: string) => void;\n    onNextDayClick: (currentDate: string) => void;\n    onCalendarDateSelect?: (currentDate: string) => void;\n    onViewChange?: (view: ScheduleView) => void;\n    onTodayClick?: () => void;\n}\n\nexport const ScheduleHeader = ({\n    date,\n    view = \"day\",\n    minDate,\n    maxDate,\n    onPreviousDayClick,\n    onNextDayClick,\n    onCalendarDateSelect,\n    onViewChange,\n    onTodayClick,\n    ...otherProps\n}: ScheduleHeaderProps) => {\n    const viewOptions: Array<{ label: string; value: ScheduleView }> = [\n        { label: \"Day\", value: \"day\" },\n        { label: \"Week\", value: \"week\" },\n    ];\n    const selectedViewOption = viewOptions.find(\n        (option) => option.value === view\n    );\n\n    // Handle navigation based on view type\n    const handleLeftArrowClick = (currentDate: string) => {\n        if (view === \"week\") {\n            const currentDateObj = DateHelper.toDayjs(currentDate);\n            const previousWeek = currentDateObj.subtract(1, \"week\");\n            onPreviousDayClick(previousWeek.format(\"YYYY-MM-DD\"));\n        } else {\n            onPreviousDayClick(currentDate);\n        }\n    };\n\n    const handleRightArrowClick = (currentDate: string) => {\n        if (view === \"week\") {\n            const currentDateObj = DateHelper.toDayjs(currentDate);\n            const nextWeek = currentDateObj.add(1, \"week\");\n            onNextDayClick(nextWeek.format(\"YYYY-MM-DD\"));\n        } else {\n            onNextDayClick(currentDate);\n        }\n    };\n\n    return (\n        <div className={styles.scheduleHeaderWrapper} {...otherProps}>\n            <div className={styles.leftSection}>\n                <Button\n                    className={styles.button}\n                    styleType=\"light\"\n                    onClick={onTodayClick}\n                >\n                    Today\n                </Button>\n                <DateNavigator\n                    className={styles.dateNavigator}\n                    selectedDate={date}\n                    minDate={minDate}\n                    maxDate={maxDate}\n                    view={view}\n                    onLeftArrowClick={handleLeftArrowClick}\n                    onRightArrowClick={handleRightArrowClick}\n                    onCalendarDateSelect={onCalendarDateSelect}\n                />\n            </div>\n\n            <div className={styles.rightSection}>\n                <Typography.BodyMD className={styles.text}>\n                    View by:\n                </Typography.BodyMD>\n                <InputSelect\n                    options={viewOptions}\n                    selectedOption={selectedViewOption}\n                    onSelectOption={(option) => onViewChange?.(option.value)}\n                    listExtractor={(option) => option.label}\n                    displayValueExtractor={(option) => option.label}\n                    dropdownWidth={styles.DROPDOWN_WIDTH}\n                />\n            </div>\n        </div>\n    );\n};\n"],"names":["_a","date","view","minDate","maxDate","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onViewChange","onTodayClick","otherProps","__rest","viewOptions","label","value","selectedViewOption","find","option","_jsxs","Object","assign","className","styles.scheduleHeaderWrapper","styles.leftSection","children","_jsx","Button","styles.button","styleType","onClick","DateNavigator","styles.dateNavigator","selectedDate","onLeftArrowClick","currentDate","previousWeek","DateHelper","toDayjs","subtract","format","onRightArrowClick","nextWeek","add","styles.rightSection","Typography","BodyMD","styles.text","InputSelect","options","selectedOption","onSelectOption","listExtractor","displayValueExtractor","dropdownWidth","styles.DROPDOWN_WIDTH"],"mappings":"qlBAqB+BA,QAAAC,KAC3BA,EAAIC,KACJA,EAAO,MAAKC,QACZA,EAAOC,QACPA,EAAOC,mBACPA,EAAkBC,eAClBA,EAAcC,qBACdA,EAAoBC,aACpBA,EAAYC,aACZA,KACGC,EAAUC,EAAAA,OAAAX,EAVc,CAAA,OAAA,OAAA,UAAA,UAAA,qBAAA,iBAAA,uBAAA,eAAA,iBAY3B,MAAMY,EAA6D,CAC/D,CAAEC,MAAO,MAAOC,MAAO,OACvB,CAAED,MAAO,OAAQC,MAAO,SAEtBC,EAAqBH,EAAYI,MAClCC,GAAWA,EAAOH,QAAUZ,IAwBjC,OACIgB,OAAA,MAAAC,OAAAC,OAAA,CAAKC,UAAWC,EAAAA,uBAAkCZ,aAC9CQ,EAAAA,KAAA,MAAA,CAAKG,UAAWE,cAAkBC,SAAA,CAC9BC,EAAAA,IAACC,EAAAA,QACGL,UAAWM,SACXC,UAAU,QACVC,QAASpB,EAAYe,SAAA,UAIzBC,EAAAA,IAACK,gBAAa,CACVT,UAAWU,EAAAA,cACXC,aAAc/B,EACdE,QAASA,EACTC,QAASA,EACTF,KAAMA,EACN+B,iBApCcC,IAC1B,GAAa,SAAThC,EAAiB,CACjB,MACMiC,EADiBC,EAAAA,WAAWC,QAAQH,GACNI,SAAS,EAAG,QAChDjC,EAAmB8B,EAAaI,OAAO,cAC3C,MACIlC,EAAmB6B,EACvB,EA8BYM,kBA3BeN,IAC3B,GAAa,SAAThC,EAAiB,CACjB,MACMuC,EADiBL,EAAAA,WAAWC,QAAQH,GACVQ,IAAI,EAAG,QACvCpC,EAAemC,EAASF,OAAO,cACnC,MACIjC,EAAe4B,EACnB,EAqBY3B,qBAAsBA,OAI9BW,OAAA,MAAA,CAAKG,UAAWsB,EAAAA,aAAmBnB,SAAA,CAC/BC,MAACmB,EAAAA,WAAWC,OAAM,CAACxB,UAAWyB,OAAWtB,SAAA,aAGzCC,EAAAA,IAACsB,EAAAA,YAAW,CACRC,QAASpC,EACTqC,eAAgBlC,EAChBmC,eAAiBjC,GAAWT,aAAY,EAAZA,EAAeS,EAAOH,OAClDqC,cAAgBlC,GAAWA,EAAOJ,MAClCuC,sBAAwBnC,GAAWA,EAAOJ,MAC1CwC,cAAeC,EAAAA,uBAGrB"}
+{"version":3,"file":"schedule-header.js","sources":["../../../../src/schedule/schedule-header/schedule-header.tsx"],"sourcesContent":["import { Button } from \"../../button\";\nimport { DateNavigator } from \"../../date-navigator\";\nimport { InputSelect } from \"../../input-select\";\nimport { Typography } from \"../../typography\";\nimport { DateHelper } from \"../../util\";\nimport type { ScheduleView } from \"../types\";\nimport * as styles from \"./schedule-header.styles\";\n\nexport interface ScheduleHeaderProps {\n    id?: string | undefined;\n    date: string;\n    view: ScheduleView;\n    minDate?: string | undefined;\n    maxDate?: string | undefined;\n    onPreviousDayClick: (currentDate: string) => void;\n    onNextDayClick: (currentDate: string) => void;\n    onCalendarDateSelect?: (currentDate: string) => void;\n    onViewChange?: (view: ScheduleView) => void;\n    onTodayClick?: () => void;\n}\n\nexport const ScheduleHeader = ({\n    date,\n    view = \"day\",\n    minDate,\n    maxDate,\n    onPreviousDayClick,\n    onNextDayClick,\n    onCalendarDateSelect,\n    onViewChange,\n    onTodayClick,\n    ...otherProps\n}: ScheduleHeaderProps) => {\n    const viewOptions: Array<{ label: string; value: ScheduleView }> = [\n        { label: \"Day\", value: \"day\" },\n        { label: \"Week\", value: \"week\" },\n    ];\n    const selectedViewOption = viewOptions.find(\n        (option) => option.value === view\n    );\n\n    // Handle navigation based on view type\n    const handleLeftArrowClick = (currentDate: string) => {\n        if (view === \"week\") {\n            const currentDateObj = DateHelper.toDayjs(currentDate);\n            const previousWeek = currentDateObj.subtract(1, \"week\");\n            onPreviousDayClick(previousWeek.format(\"YYYY-MM-DD\"));\n        } else {\n            onPreviousDayClick(currentDate);\n        }\n    };\n\n    const handleRightArrowClick = (currentDate: string) => {\n        if (view === \"week\") {\n            const currentDateObj = DateHelper.toDayjs(currentDate);\n            const nextWeek = currentDateObj.add(1, \"week\");\n            onNextDayClick(nextWeek.format(\"YYYY-MM-DD\"));\n        } else {\n            onNextDayClick(currentDate);\n        }\n    };\n\n    return (\n        <div className={styles.scheduleHeaderWrapper} {...otherProps}>\n            <div className={styles.leftSection}>\n                <Button\n                    className={styles.button}\n                    styleType=\"light\"\n                    onClick={onTodayClick}\n                >\n                    Today\n                </Button>\n                <DateNavigator\n                    className={styles.dateNavigator}\n                    selectedDate={date}\n                    minDate={minDate}\n                    maxDate={maxDate}\n                    view={view}\n                    onLeftArrowClick={handleLeftArrowClick}\n                    onRightArrowClick={handleRightArrowClick}\n                    onCalendarDateSelect={onCalendarDateSelect}\n                />\n            </div>\n\n            <div className={styles.rightSection}>\n                <Typography.BodyMD className={styles.text}>\n                    View by:\n                </Typography.BodyMD>\n                <InputSelect\n                    data-testid=\"view-selector\"\n                    options={viewOptions}\n                    selectedOption={selectedViewOption}\n                    onSelectOption={(option) => onViewChange?.(option.value)}\n                    listExtractor={(option) => option.label}\n                    displayValueExtractor={(option) => option.label}\n                    dropdownWidth={styles.DROPDOWN_WIDTH}\n                />\n            </div>\n        </div>\n    );\n};\n"],"names":["_a","date","view","minDate","maxDate","onPreviousDayClick","onNextDayClick","onCalendarDateSelect","onViewChange","onTodayClick","otherProps","__rest","viewOptions","label","value","selectedViewOption","find","option","_jsxs","Object","assign","className","styles.scheduleHeaderWrapper","styles.leftSection","children","_jsx","Button","styles.button","styleType","onClick","DateNavigator","styles.dateNavigator","selectedDate","onLeftArrowClick","currentDate","previousWeek","DateHelper","toDayjs","subtract","format","onRightArrowClick","nextWeek","add","styles.rightSection","Typography","BodyMD","styles.text","InputSelect","options","selectedOption","onSelectOption","listExtractor","displayValueExtractor","dropdownWidth","styles.DROPDOWN_WIDTH"],"mappings":"qlBAqB+BA,QAAAC,KAC3BA,EAAIC,KACJA,EAAO,MAAKC,QACZA,EAAOC,QACPA,EAAOC,mBACPA,EAAkBC,eAClBA,EAAcC,qBACdA,EAAoBC,aACpBA,EAAYC,aACZA,KACGC,EAAUC,EAAAA,OAAAX,EAVc,CAAA,OAAA,OAAA,UAAA,UAAA,qBAAA,iBAAA,uBAAA,eAAA,iBAY3B,MAAMY,EAA6D,CAC/D,CAAEC,MAAO,MAAOC,MAAO,OACvB,CAAED,MAAO,OAAQC,MAAO,SAEtBC,EAAqBH,EAAYI,MAClCC,GAAWA,EAAOH,QAAUZ,IAwBjC,OACIgB,OAAA,MAAAC,OAAAC,OAAA,CAAKC,UAAWC,EAAAA,uBAAkCZ,aAC9CQ,EAAAA,KAAA,MAAA,CAAKG,UAAWE,cAAkBC,SAAA,CAC9BC,EAAAA,IAACC,EAAAA,QACGL,UAAWM,SACXC,UAAU,QACVC,QAASpB,EAAYe,SAAA,UAIzBC,MAACK,EAAAA,cAAa,CACVT,UAAWU,EAAAA,cACXC,aAAc/B,EACdE,QAASA,EACTC,QAASA,EACTF,KAAMA,EACN+B,iBApCcC,IAC1B,GAAa,SAAThC,EAAiB,CACjB,MACMiC,EADiBC,EAAAA,WAAWC,QAAQH,GACNI,SAAS,EAAG,QAChDjC,EAAmB8B,EAAaI,OAAO,cAC3C,MACIlC,EAAmB6B,EACvB,EA8BYM,kBA3BeN,IAC3B,GAAa,SAAThC,EAAiB,CACjB,MACMuC,EADiBL,EAAAA,WAAWC,QAAQH,GACVQ,IAAI,EAAG,QACvCpC,EAAemC,EAASF,OAAO,cACnC,MACIjC,EAAe4B,EACnB,EAqBY3B,qBAAsBA,OAI9BW,EAAAA,YAAKG,UAAWsB,EAAAA,aAAmBnB,SAAA,CAC/BC,EAAAA,IAACmB,aAAWC,OAAM,CAACxB,UAAWyB,EAAAA,KAAWtB,SAAA,aAGzCC,EAAAA,IAACsB,EAAAA,YAAW,CAAA,cACI,gBACZC,QAASpC,EACTqC,eAAgBlC,EAChBmC,eAAiBjC,GAAWT,aAAY,EAAZA,EAAeS,EAAOH,OAClDqC,cAAgBlC,GAAWA,EAAOJ,MAClCuC,sBAAwBnC,GAAWA,EAAOJ,MAC1CwC,cAAeC,EAAAA,uBAGrB"}

package/cjs/schedule/schedule-header/schedule-header.styles_1n2u5vj.css

@@ -1,6 +1,6 @@
-.smt7il1{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-bottom:var(--fds-spacing-16);color:var(--fds-colour-text-primary);gap:var(--fds-spacing-16);}
+@layer fds{.smt7il1{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:space-between;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-bottom:var(--fds-spacing-16);color:var(--fds-colour-text-primary);gap:var(--fds-spacing-16);}
 .lzjgzr2{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:var(--fds-spacing-16);}:where(body.fds-breakpoint-md-max) .lzjgzr2{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;width:100%;}
 .r1xv7b6y{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:var(--fds-spacing-16);}:where(body.fds-breakpoint-lg-max) .r1xv7b6y{display:none;}
 .d19djkwt{width:100%;max-width:400px;}
 .t1cre13t{color:var(--fds-colour-text-subtler);}
-.bzltxmo{min-width:5rem;}:where(body.fds-breakpoint-lg-max) .bzltxmo{display:none;}
+.bzltxmo{min-width:5rem;}:where(body.fds-breakpoint-lg-max) .bzltxmo{display:none;}}

package/cjs/schedule/schedule-week-view/schedule-week-view.styles_x7x50m.css

@@ -1,4 +1,4 @@
-.lmprb8g{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:25rem;height:100%;border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-radius:var(--fds-radius-md);background:var(--fds-colour-bg);}
+@layer fds{.lmprb8g{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:25rem;height:100%;border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);border-radius:var(--fds-radius-md);background:var(--fds-colour-bg);}
 .h1595692{display:-ms-grid;display:grid;-ms-grid-columns:42px repeat(7, 1fr);grid-template-columns:42px repeat(7, 1fr);max-height:130px;}
 .b155xk04{min-width:42px;position:-webkit-sticky;position:sticky;z-index:2;}
 .snwncax{display:-ms-grid;display:grid;-ms-grid-columns:repeat(7, 1fr);grid-template-columns:repeat(7, 1fr);-ms-grid-column:2;grid-column-start:2;-ms-grid-row-span:7;grid-column-end:9;}
@@ -7,4 +7,4 @@
 .b16u8uwa{display:-ms-grid;display:grid;-ms-grid-columns:42px repeat(7, 1fr);grid-template-columns:42px repeat(7, 1fr);overflow-x:hidden;overflow-y:auto;-webkit-flex:1;-ms-flex:1;flex:1;height:100%;border:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}
 .s1w10b64{-ms-grid-column:2;grid-column-start:2;-ms-grid-row-span:7;grid-column-end:9;display:-ms-grid;display:grid;-ms-grid-columns:repeat(7, 1fr);grid-template-columns:repeat(7, 1fr);min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content;}
 .tbbbluc{--fds-internal-scheduleWeekView-timeline-top:0px;position:absolute;width:100%;height:2px;background:var(--fds-colour-icon-primary);top:var(--fds-internal-scheduleWeekView-timeline-top);z-index:2;}.tbbbluc::before{content:"";position:absolute;left:-6px;top:-6px;width:var(--fds-spacing-12);height:var(--fds-spacing-12);border-radius:var(--fds-radius-full);background:var(--fds-colour-icon-primary);z-index:1;}
-.sej7vmd{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:relative;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;border-right:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}.sej7vmd:last-child{border-right:none;}
+.sej7vmd{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:relative;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;border-right:var(--fds-border-width-010) var(--fds-border-style-solid) var(--fds-colour-border);}.sej7vmd:last-child{border-right:none;}}