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

package/cjs/navbar/navbar-action-buttons.js.map

@@ -1 +1 @@
-{"version":3,"file":"navbar-action-buttons.js","sources":["../../../src/navbar/navbar-action-buttons.tsx"],"sourcesContent":["import findIndex from \"lodash/findIndex\";\nimport React from \"react\";\nimport { ButtonProps } from \"../button/types\";\nimport {\n    ActionButton,\n    ButtonItem,\n    DownloadAppImageLink,\n    DownloadAppImageLinkWrapper,\n    DownloadAppTitle,\n    DownloadAppWrapper,\n    DrawerWrapper,\n    MobileWrapper,\n    Wrapper,\n} from \"./navbar-action-buttons.styles\";\nimport { NavbarActionButtonsProps, NavbarButtonProps } from \"./types\";\n\nconst APP_STORE_ICON =\n    \"https://assets.life.gov.sg/react-design-system/img/download/apple-app-store.png\";\nconst PLAY_STORE_ICON =\n    \"https://assets.life.gov.sg/react-design-system/img/download/google-play-store.png\";\n\ninterface Props {\n    actionButtons?: NavbarActionButtonsProps | undefined;\n    /** toggle for mobile or desktop view */\n    mobile?: boolean | undefined;\n    onActionButtonClick: (\n        event: React.MouseEvent<HTMLButtonElement> | React.MouseEvent<Element>,\n        actionButton: NavbarButtonProps\n    ) => void;\n    uncollapsible?: boolean | undefined;\n}\n\nexport const NavbarActionButtons = ({\n    actionButtons,\n    mobile = false,\n    onActionButtonClick,\n}: Props): JSX.Element => {\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleDownloadAppImageLinkClick = (\n        event: React.MouseEvent<HTMLAnchorElement>\n    ) => {\n        /**\n         * Have to do this to prevent the Overlay\n         * from picking the click, causing the action\n         * to not be run\n         */\n        event.stopPropagation();\n    };\n\n    const handleActionButtonClick = (actionButton: NavbarButtonProps) => {\n        return (event: React.MouseEvent<HTMLButtonElement>) => {\n            event.stopPropagation(); // in mobile, this prevents the drawer from intercepting event\n            if (actionButton.type === \"download\") {\n                window.scrollTo({\n                    left: 0,\n                    top: document.body.scrollHeight,\n                    behavior: \"smooth\",\n                });\n            }\n\n            onActionButtonClick(event, actionButton);\n        };\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const moveDownloadButtonToTheBack = (\n        actionButtons: NavbarButtonProps[]\n    ): NavbarButtonProps[] => {\n        const downloadButtonIndex = findIndex(actionButtons, (button) => {\n            return button.type === \"download\";\n        });\n\n        if (downloadButtonIndex > -1) {\n            const updatedButtons = [...actionButtons];\n            const removedButtons = updatedButtons.splice(\n                downloadButtonIndex,\n                1\n            );\n\n            return [...updatedButtons, removedButtons[0]];\n        }\n\n        return actionButtons;\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderDownloadAppMobileView = (args?: ButtonProps) => {\n        return (\n            <DownloadAppWrapper>\n                <DownloadAppTitle weight=\"semibold\">\n                    {(args && args.children) || \"Download the app\"}\n                </DownloadAppTitle>\n                <DownloadAppImageLinkWrapper>\n                    <DownloadAppImageLink\n                        href=\"https://apps.apple.com/sg/app/moments-of-life/id1383218758\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        data-testid=\"button__app-store\"\n                        onClick={handleDownloadAppImageLinkClick}\n                    >\n                        <img src={APP_STORE_ICON} alt=\"apple-app-store\" />\n                    </DownloadAppImageLink>\n                    <DownloadAppImageLink\n                        href=\"https://play.google.com/store/apps/details?id=sg.gov.app.mol&hl=en_SG\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        data-testid=\"button__play-store\"\n                        onClick={handleDownloadAppImageLinkClick}\n                    >\n                        <img src={PLAY_STORE_ICON} alt=\"google-play-store\" />\n                    </DownloadAppImageLink>\n                </DownloadAppImageLinkWrapper>\n            </DownloadAppWrapper>\n        );\n    };\n\n    const renderButtons = (\n        isMobile: boolean,\n        actionButtonList: NavbarButtonProps[]\n    ) => {\n        /**\n         * In drawer view, download app button will always be at\n         * the bottom, hence we will shift it to the back\n         */\n        const buttonsToRender = isMobile\n            ? moveDownloadButtonToTheBack(actionButtonList)\n            : actionButtonList;\n\n        return buttonsToRender.map((actionButton, index) => {\n            let component: React.ReactNode;\n            switch (actionButton.type) {\n                case \"download\":\n                    component = isMobile ? (\n                        renderDownloadAppMobileView(actionButton.args)\n                    ) : (\n                        <ActionButton\n                            {...actionButton.args}\n                            type=\"button\"\n                            onClick={handleActionButtonClick(actionButton)}\n                            data-testid=\"action-button__download\"\n                        >\n                            Download the app\n                        </ActionButton>\n                    );\n                    break;\n                case \"button\": {\n                    const testId = actionButton.args[\"data-testid\"]\n                        ? `action-button__${actionButton.args[\"data-testid\"]}`\n                        : `action-button__button-${isMobile ? \"mobile-\" : \"\"}${\n                              index + 1\n                          }`;\n\n                    component = (\n                        <ActionButton\n                            {...actionButton.args}\n                            type=\"button\"\n                            onClick={handleActionButtonClick(actionButton)}\n                            data-testid={testId}\n                        />\n                    );\n                    break;\n                }\n                case \"component\": {\n                    const args = actionButton.args;\n                    component = (args && args.render) || null;\n                    break;\n                }\n                default:\n                    component = null;\n                    break;\n            }\n\n            if (component) {\n                return (\n                    <ButtonItem\n                        key={`action-button-${index + 1}`}\n                        $mobile={isMobile}\n                    >\n                        {component}\n                    </ButtonItem>\n                );\n            }\n        });\n    };\n\n    if (actionButtons) {\n        const actionButtonList = actionButtons?.mobile || actionButtons.desktop;\n        const uncollapsableActionButtons = actionButtonList.filter(\n            (actionButton) => !!actionButton.uncollapsible\n        );\n        const collapsableActionButtons = actionButtonList.filter(\n            (actionButton) => !actionButton.uncollapsible\n        );\n        if (mobile) {\n            return (\n                <>\n                    {collapsableActionButtons.length > 0 && (\n                        <DrawerWrapper>\n                            {renderButtons(mobile, collapsableActionButtons)}\n                        </DrawerWrapper>\n                    )}\n                </>\n            );\n        } else {\n            return (\n                <>\n                    {uncollapsableActionButtons.length > 0 && (\n                        <MobileWrapper>\n                            {renderButtons(false, uncollapsableActionButtons)}\n                        </MobileWrapper>\n                    )}\n                    {actionButtons.desktop.length > 0 && (\n                        <Wrapper>\n                            {renderButtons(mobile, actionButtons.desktop)}\n                        </Wrapper>\n                    )}\n                </>\n            );\n        }\n    }\n\n    return <></>;\n};\n"],"names":["actionButtons","mobile","onActionButtonClick","handleDownloadAppImageLinkClick","event","stopPropagation","handleActionButtonClick","actionButton","type","window","scrollTo","left","top","document","body","scrollHeight","behavior","renderButtons","isMobile","actionButtonList","buttonsToRender","downloadButtonIndex","findIndex","button","updatedButtons","removedButtons","splice","moveDownloadButtonToTheBack","map","index","component","args","_jsxs","DownloadAppWrapper","_jsx","DownloadAppTitle","weight","children","DownloadAppImageLinkWrapper","DownloadAppImageLink","href","target","rel","onClick","src","alt","ActionButton","Object","assign","testId","render","ButtonItem","$mobile","desktop","uncollapsableActionButtons","filter","uncollapsible","collapsableActionButtons","length","DrawerWrapper","MobileWrapper","Wrapper"],"mappings":"wKAgCmC,EAC/BA,gBACAC,UAAS,EACTC,0BAKA,MAAMC,EACFC,IAOAA,EAAMC,iBAAiB,EAGrBC,EAA2BC,GACrBH,IACJA,EAAMC,kBACoB,aAAtBE,EAAaC,MACbC,OAAOC,SAAS,CACZC,KAAM,EACNC,IAAKC,SAASC,KAAKC,aACnBC,SAAU,WAIlBd,EAAoBE,EAAOG,EAAa,EA4D1CU,EAAgB,CAClBC,EACAC,KAMA,MAAMC,EAAkBF,EA7DQ,CAChClB,IAEA,MAAMqB,EAAsBC,EAAAA,QAAUtB,GAAgBuB,GAC3B,aAAhBA,EAAOf,OAGlB,GAAIa,GAAsB,EAAI,CAC1B,MAAMG,EAAiB,IAAIxB,GACrByB,EAAiBD,EAAeE,OAClCL,EACA,GAGJ,MAAO,IAAIG,EAAgBC,EAAe,GAC9C,CAEA,OAAOzB,CAAa,EA6Cd2B,CAA4BR,GAC5BA,EAEN,OAAOC,EAAgBQ,KAAI,CAACrB,EAAcsB,KACtC,IAAIC,EACJ,OAAQvB,EAAaC,MACjB,IAAK,WACDsB,EAAYZ,GA9CSa,EA+CWxB,EAAawB,KA7CrDC,EAAAA,KAACC,EAAAA,8BACGC,EAAAA,IAACC,EAAAA,kBAAiBC,OAAO,WAAUC,SAC7BN,GAAQA,EAAKM,UAAa,qBAEhCL,EAAAA,KAACM,EAAAA,uCACGJ,EAAAA,IAACK,EAAAA,sBACGC,KAAK,6DACLC,OAAO,SACPC,IAAI,oCACQ,oBACZC,QAASxC,WAET+B,EAAAA,IAAA,MAAA,CAAKU,IAzFzB,kFAyF8CC,IAAI,sBAElCX,EAAAA,IAACK,EAAAA,qBAAoB,CACjBC,KAAK,wEACLC,OAAO,SACPC,IAAI,sBAAqB,cACb,qBACZC,QAASxC,EAA+BkC,SAExCH,EAAAA,WAAKU,IAhGzB,oFAgG+CC,IAAI,+BA0B/BX,EAAAA,IAACY,eAAYC,OAAAC,OAAA,CAAA,EACLzC,EAAawB,KAAI,CACrBvB,KAAK,SACLmC,QAASrC,EAAwBC,iBACrB,0BAAyB8B,SAAA,sBAK7C,MACJ,IAAK,SAAU,CACX,MAAMY,EAAS1C,EAAawB,KAAK,eAC3B,kBAAkBxB,EAAawB,KAAK,iBACpC,yBAAyBb,EAAW,UAAY,KAC5CW,EAAQ,IAGlBC,EACII,EAAAA,IAACY,gCACOvC,EAAawB,KAAI,CACrBvB,KAAK,SACLmC,QAASrC,EAAwBC,GAAa,cACjC0C,KAGrB,KACJ,CACA,IAAK,YAAa,CACd,MAAMlB,EAAOxB,EAAawB,KAC1BD,EAAaC,GAAQA,EAAKmB,QAAW,KACrC,KACJ,CACA,QACIpB,EAAY,KAlFQ,IAACC,EAsF7B,GAAID,EACA,OACII,MAACiB,EAAAA,WAAU,CAAAC,QAEElC,EAAQmB,SAEhBP,GAHI,iBAAiBD,EAAQ,IAM1C,GACF,EAGN,GAAI7B,EAAe,CACf,MAAMmB,GAAmBnB,aAAa,EAAbA,EAAeC,SAAUD,EAAcqD,QAC1DC,EAA6BnC,EAAiBoC,QAC/ChD,KAAmBA,EAAaiD,gBAE/BC,EAA2BtC,EAAiBoC,QAC7ChD,IAAkBA,EAAaiD,gBAEpC,OAAIvD,EAEIiC,EAAAA,yBACKuB,EAAyBC,OAAS,GAC/BxB,EAAAA,IAACyB,EAAAA,wBACI1C,EAAchB,EAAQwD,OAOnCzB,EAAAA,2BACKsB,EAA2BI,OAAS,GACjCxB,EAAAA,IAAC0B,EAAAA,cAAa,CAAAvB,SACTpB,GAAc,EAAOqC,KAG7BtD,EAAcqD,QAAQK,OAAS,GAC5BxB,EAAAA,IAAC2B,EAAAA,QAAO,CAAAxB,SACHpB,EAAchB,EAAQD,EAAcqD,aAM7D,CAEA,OAAOnB,EAAAA,kBAAK"}
+{"version":3,"file":"navbar-action-buttons.js","sources":["../../../src/navbar/navbar-action-buttons.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport findIndex from \"lodash/findIndex\";\nimport type React from \"react\";\n\nimport { Button } from \"../button\";\nimport type { ButtonProps } from \"../button/types\";\nimport { Typography } from \"../typography\";\nimport * as styles from \"./navbar-action-buttons.styles\";\nimport type { NavbarActionButtonsProps, NavbarButtonProps } from \"./types\";\n\nconst APP_STORE_ICON =\n    \"https://assets.life.gov.sg/react-design-system/img/download/apple-app-store.png\";\nconst PLAY_STORE_ICON =\n    \"https://assets.life.gov.sg/react-design-system/img/download/google-play-store.png\";\n\ninterface Props {\n    actionButtons?: NavbarActionButtonsProps | undefined;\n    /** toggle for mobile or desktop view */\n    mobile?: boolean | undefined;\n    onActionButtonClick: (\n        event: React.MouseEvent<HTMLButtonElement> | React.MouseEvent<Element>,\n        actionButton: NavbarButtonProps\n    ) => void;\n    uncollapsible?: boolean | undefined;\n}\n\nexport const NavbarActionButtons = ({\n    actionButtons,\n    mobile = false,\n    onActionButtonClick,\n}: Props): JSX.Element => {\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleDownloadAppImageLinkClick = (\n        event: React.MouseEvent<HTMLAnchorElement>\n    ) => {\n        /**\n         * Have to do this to prevent the Overlay\n         * from picking the click, causing the action\n         * to not be run\n         */\n        event.stopPropagation();\n    };\n\n    const handleActionButtonClick = (actionButton: NavbarButtonProps) => {\n        return (event: React.MouseEvent<HTMLButtonElement>) => {\n            event.stopPropagation(); // in mobile, this prevents the drawer from intercepting event\n            if (actionButton.type === \"download\") {\n                window.scrollTo({\n                    left: 0,\n                    top: document.body.scrollHeight,\n                    behavior: \"smooth\",\n                });\n            }\n\n            onActionButtonClick(event, actionButton);\n        };\n    };\n\n    // =============================================================================\n    // HELPER FUNCTIONS\n    // =============================================================================\n    const moveDownloadButtonToTheBack = (\n        actionButtons: NavbarButtonProps[]\n    ): NavbarButtonProps[] => {\n        const downloadButtonIndex = findIndex(actionButtons, (button) => {\n            return button.type === \"download\";\n        });\n\n        if (downloadButtonIndex > -1) {\n            const updatedButtons = [...actionButtons];\n            const removedButtons = updatedButtons.splice(\n                downloadButtonIndex,\n                1\n            );\n\n            return [...updatedButtons, removedButtons[0]];\n        }\n\n        return actionButtons;\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderDownloadAppMobileView = (args?: ButtonProps) => {\n        return (\n            <div className={styles.downloadAppWrapper}>\n                <Typography.BodyMD\n                    className={styles.downloadAppTitle}\n                    weight=\"semibold\"\n                >\n                    {(args && args.children) || \"Download the app\"}\n                </Typography.BodyMD>\n                <div className={styles.downloadAppImageLinkWrapper}>\n                    <a\n                        className={styles.downloadAppImageLink}\n                        href=\"https://apps.apple.com/sg/app/moments-of-life/id1383218758\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        data-testid=\"button__app-store\"\n                        onClick={handleDownloadAppImageLinkClick}\n                    >\n                        <img src={APP_STORE_ICON} alt=\"apple-app-store\" />\n                    </a>\n                    <a\n                        className={styles.downloadAppImageLink}\n                        href=\"https://play.google.com/store/apps/details?id=sg.gov.app.mol&hl=en_SG\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        data-testid=\"button__play-store\"\n                        onClick={handleDownloadAppImageLinkClick}\n                    >\n                        <img src={PLAY_STORE_ICON} alt=\"google-play-store\" />\n                    </a>\n                </div>\n            </div>\n        );\n    };\n\n    const renderButtons = (\n        isMobile: boolean,\n        actionButtonList: NavbarButtonProps[]\n    ) => {\n        /**\n         * In drawer view, download app button will always be at\n         * the bottom, hence we will shift it to the back\n         */\n        const buttonsToRender = isMobile\n            ? moveDownloadButtonToTheBack(actionButtonList)\n            : actionButtonList;\n\n        return buttonsToRender.map((actionButton, index) => {\n            let component: React.ReactNode;\n            switch (actionButton.type) {\n                case \"download\":\n                    component = isMobile ? (\n                        renderDownloadAppMobileView(actionButton.args)\n                    ) : (\n                        <Button\n                            {...actionButton.args}\n                            className={clsx(\n                                styles.actionButton,\n                                actionButton.args?.className\n                            )}\n                            type=\"button\"\n                            sizeType=\"small\"\n                            onClick={handleActionButtonClick(actionButton)}\n                            data-testid=\"action-button__download\"\n                        >\n                            Download the app\n                        </Button>\n                    );\n                    break;\n                case \"button\": {\n                    const testId = actionButton.args[\"data-testid\"]\n                        ? `action-button__${actionButton.args[\"data-testid\"]}`\n                        : `action-button__button-${isMobile ? \"mobile-\" : \"\"}${\n                              index + 1\n                          }`;\n\n                    component = (\n                        <Button\n                            {...actionButton.args}\n                            className={clsx(\n                                styles.actionButton,\n                                actionButton.args?.className\n                            )}\n                            type=\"button\"\n                            sizeType=\"small\"\n                            onClick={handleActionButtonClick(actionButton)}\n                            data-testid={testId}\n                        />\n                    );\n                    break;\n                }\n                case \"component\": {\n                    const args = actionButton.args;\n                    component = (args && args.render) || null;\n                    break;\n                }\n                default:\n                    component = null;\n                    break;\n            }\n\n            if (component) {\n                return (\n                    <li\n                        key={`action-button-${index + 1}`}\n                        className={clsx(\n                            styles.buttonItem,\n                            isMobile && styles.buttonItemMobile\n                        )}\n                    >\n                        {component}\n                    </li>\n                );\n            }\n        });\n    };\n\n    if (actionButtons) {\n        const actionButtonList = actionButtons?.mobile || actionButtons.desktop;\n        const uncollapsableActionButtons = actionButtonList.filter(\n            (actionButton) => !!actionButton.uncollapsible\n        );\n        const collapsableActionButtons = actionButtonList.filter(\n            (actionButton) => !actionButton.uncollapsible\n        );\n        if (mobile) {\n            return (\n                <>\n                    {collapsableActionButtons.length > 0 && (\n                        <ul className={styles.drawerWrapper}>\n                            {renderButtons(mobile, collapsableActionButtons)}\n                        </ul>\n                    )}\n                </>\n            );\n        } else {\n            return (\n                <>\n                    {uncollapsableActionButtons.length > 0 && (\n                        <ul className={styles.mobileWrapper}>\n                            {renderButtons(false, uncollapsableActionButtons)}\n                        </ul>\n                    )}\n                    {actionButtons.desktop.length > 0 && (\n                        <ul className={styles.wrapper}>\n                            {renderButtons(mobile, actionButtons.desktop)}\n                        </ul>\n                    )}\n                </>\n            );\n        }\n    }\n\n    return <></>;\n};\n"],"names":["actionButtons","mobile","onActionButtonClick","handleDownloadAppImageLinkClick","event","stopPropagation","handleActionButtonClick","actionButton","type","window","scrollTo","left","top","document","body","scrollHeight","behavior","renderButtons","isMobile","actionButtonList","buttonsToRender","downloadButtonIndex","findIndex","button","updatedButtons","removedButtons","splice","moveDownloadButtonToTheBack","map","index","component","args","_jsxs","className","styles.downloadAppWrapper","children","_jsx","Typography","BodyMD","styles.downloadAppTitle","weight","styles.downloadAppImageLinkWrapper","styles.downloadAppImageLink","href","target","rel","onClick","src","alt","Button","Object","assign","clsx","styles.actionButton","_a","sizeType","testId","_b","render","styles.buttonItem","styles.buttonItemMobile","desktop","uncollapsableActionButtons","filter","uncollapsible","collapsableActionButtons","_Fragment","length","styles.drawerWrapper","styles.mobileWrapper","styles.wrapper"],"mappings":"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"}

package/cjs/navbar/navbar-action-buttons.styles.js

@@ -1,101 +1,2 @@
-"use strict";var i=require("styled-components"),e=require("../button/button.js"),t=require("../theme/index.js"),a=require("../typography/typography.js");function n(i){return i&&"object"==typeof i&&"default"in i?i:{default:i}}var p=n(i);const r=p.default.ul`
-    display: flex;
-    list-style: none;
-    margin-left: ${t.Spacing["spacing-64"]};
-    flex-shrink: 0;
-
-    ${t.MediaQuery.MaxWidth.lg} {
-        display: none;
-    }
-`,l=p.default.ul`
-    display: none;
-
-    ${t.MediaQuery.MaxWidth.lg} {
-        display: flex;
-        list-style: none;
-        margin-left: ${t.Spacing["spacing-64"]};
-        flex-shrink: 0;
-    }
-`,d=p.default.ul`
-    display: none;
-    list-style: none;
-
-    ${t.MediaQuery.MaxWidth.lg} {
-        display: flex;
-        flex-direction: column;
-        margin-top: ${t.Spacing["spacing-40"]};
-        width: max-content;
-        min-width: 22rem;
-        max-width: 24rem;
-    }
-
-    ${t.MediaQuery.MaxWidth.sm} {
-        width: 100%;
-        max-width: unset;
-        min-width: unset;
-    }
-`,o=p.default.li`
-    position: relative;
-    display: flex;
-    align-items: center;
-
-    &:not(:last-of-type) {
-        margin-right: ${t.Spacing["spacing-16"]};
-    }
-
-    ${t.MediaQuery.MaxWidth.lg} {
-        width: 100%;
-        padding: 0 0 0 ${t.Spacing["spacing-16"]};
-        justify-content: center;
-
-        &:not(:last-of-type) {
-            margin-right: 0;
-            margin-bottom: ${i=>i.$mobile?t.Spacing["spacing-16"]:"0"};
-        }
-    }
-
-    ${t.MediaQuery.MaxWidth.sm} {
-        ${e=>{if(e.$mobile)return i.css`
-                    padding: 0 ${t.Spacing["spacing-16"]};
-                `}}
-    }
-`,s=p.default(e.Button.Small)`
-    ${t.MediaQuery.MaxWidth.lg} {
-        width: 100%;
-    }
-`,g=p.default.div`
-    display: none;
-
-    ${t.MediaQuery.MaxWidth.lg} {
-        display: flex;
-        flex-direction: column;
-        margin-top: ${t.Spacing["spacing-40"]};
-    }
-`,u=p.default(a.Typography.BodyMD)`
-    margin-bottom: ${t.Spacing["spacing-8"]};
-`,c=p.default.div`
-    display: flex;
-`,m=p.default.a`
-    &:not(:last-child) {
-        margin-right: ${t.Spacing["spacing-16"]};
-    }
-
-    img {
-        width: auto;
-        height: auto;
-        object-fit: contain;
-    }
-
-    ${t.MediaQuery.MaxWidth.lg} {
-        img {
-            max-width: 11rem;
-        }
-    }
-
-    ${t.MediaQuery.MaxWidth.sm} {
-        img {
-            max-width: 100%;
-        }
-    }
-`;exports.ActionButton=s,exports.ButtonItem=o,exports.DownloadAppImageLink=m,exports.DownloadAppImageLinkWrapper=c,exports.DownloadAppTitle=u,exports.DownloadAppWrapper=g,exports.DrawerWrapper=d,exports.MobileWrapper=l,exports.Wrapper=r;
+"use strict";require("./navbar-action-buttons.styles_1vpm0nk.css");exports.actionButton="a11s4qne",exports.buttonItem="bmx9nfs",exports.buttonItemMobile="b1x8wy30",exports.downloadAppImageLink="dbo95jy",exports.downloadAppImageLinkWrapper="d1s552j0",exports.downloadAppTitle="dq81je7",exports.downloadAppWrapper="dvtt0j5",exports.drawerWrapper="d2uo9g4",exports.mobileWrapper="m1gsi5dr",exports.wrapper="w62j500";
 //# sourceMappingURL=navbar-action-buttons.styles.js.map

package/cjs/navbar/navbar-action-buttons.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"navbar-action-buttons.styles.js","sources":["../../../src/navbar/navbar-action-buttons.styles.tsx"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { Button } from \"../button\";\nimport { MediaQuery, Spacing } from \"../theme\";\nimport { Typography } from \"../typography/typography\";\n\n// =============================================================================\n// WRAPPER\n// =============================================================================\nexport const Wrapper = styled.ul`\n    display: flex;\n    list-style: none;\n    margin-left: ${Spacing[\"spacing-64\"]};\n    flex-shrink: 0;\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: none;\n    }\n`;\n\nexport const MobileWrapper = styled.ul`\n    display: none;\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: flex;\n        list-style: none;\n        margin-left: ${Spacing[\"spacing-64\"]};\n        flex-shrink: 0;\n    }\n`;\n\nexport const DrawerWrapper = styled.ul`\n    display: none;\n    list-style: none;\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: flex;\n        flex-direction: column;\n        margin-top: ${Spacing[\"spacing-40\"]};\n        width: max-content;\n        min-width: 22rem;\n        max-width: 24rem;\n    }\n\n    ${MediaQuery.MaxWidth.sm} {\n        width: 100%;\n        max-width: unset;\n        min-width: unset;\n    }\n`;\n\n// =============================================================================\n// BUTTON ITEMS\n// =============================================================================\nexport const ButtonItem = styled.li<{ $mobile?: boolean }>`\n    position: relative;\n    display: flex;\n    align-items: center;\n\n    &:not(:last-of-type) {\n        margin-right: ${Spacing[\"spacing-16\"]};\n    }\n\n    ${MediaQuery.MaxWidth.lg} {\n        width: 100%;\n        padding: 0 0 0 ${Spacing[\"spacing-16\"]};\n        justify-content: center;\n\n        &:not(:last-of-type) {\n            margin-right: 0;\n            margin-bottom: ${(props) =>\n                props.$mobile ? Spacing[\"spacing-16\"] : \"0\"};\n        }\n    }\n\n    ${MediaQuery.MaxWidth.sm} {\n        ${(props) => {\n            if (props.$mobile) {\n                return css`\n                    padding: 0 ${Spacing[\"spacing-16\"]};\n                `;\n            }\n        }}\n    }\n`;\n\nexport const ActionButton = styled(Button.Small)`\n    ${MediaQuery.MaxWidth.lg} {\n        width: 100%;\n    }\n`;\n\n// =============================================================================\n// DOWNLOAD APP\n// =============================================================================\nexport const DownloadAppWrapper = styled.div`\n    display: none;\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: flex;\n        flex-direction: column;\n        margin-top: ${Spacing[\"spacing-40\"]};\n    }\n`;\n\nexport const DownloadAppTitle = styled(Typography.BodyMD)`\n    margin-bottom: ${Spacing[\"spacing-8\"]};\n`;\n\nexport const DownloadAppImageLinkWrapper = styled.div`\n    display: flex;\n`;\n\nexport const DownloadAppImageLink = styled.a`\n    &:not(:last-child) {\n        margin-right: ${Spacing[\"spacing-16\"]};\n    }\n\n    img {\n        width: auto;\n        height: auto;\n        object-fit: contain;\n    }\n\n    ${MediaQuery.MaxWidth.lg} {\n        img {\n            max-width: 11rem;\n        }\n    }\n\n    ${MediaQuery.MaxWidth.sm} {\n        img {\n            max-width: 100%;\n        }\n    }\n`;\n"],"names":["Wrapper","styled","ul","Spacing","MediaQuery","MaxWidth","lg","MobileWrapper","DrawerWrapper","sm","ButtonItem","li","props","$mobile","css","ActionButton","Button","Small","DownloadAppWrapper","div","DownloadAppTitle","Typography","BodyMD","DownloadAppImageLinkWrapper","DownloadAppImageLink","a"],"mappings":"4OAQO,MAAMA,EAAUC,EAAAA,QAAOC,EAAE;;;mBAGbC,EAAAA,QAAQ;;;MAGrBC,EAAAA,WAAWC,SAASC;;;EAKbC,EAAgBN,EAAAA,QAAOC,EAAE;;;MAGhCE,EAAAA,WAAWC,SAASC;;;uBAGHH,EAAAA,QAAQ;;;EAKlBK,EAAgBP,EAAAA,QAAOC,EAAE;;;;MAIhCE,EAAAA,WAAWC,SAASC;;;sBAGJH,EAAAA,QAAQ;;;;;;MAMxBC,EAAAA,WAAWC,SAASI;;;;;EAUbC,EAAaT,EAAAA,QAAOU,EAAyB;;;;;;wBAMlCR,EAAAA,QAAQ;;;MAG1BC,EAAAA,WAAWC,SAASC;;yBAEDH,EAAAA,QAAQ;;;;;6BAKHS,GACdA,EAAMC,QAAUV,EAAAA,QAAQ,cAAgB;;;;MAIlDC,EAAAA,WAAWC,SAASI;UACfG,IACC,GAAIA,EAAMC,QACN,OAAOC,KAAG;iCACOX,EAAAA,QAAQ;iBAE7B;;EAKCY,EAAed,EAAAA,QAAOe,SAAOC,MAAM;MAC1Cb,EAAAA,WAAWC,SAASC;;;EAQbY,EAAqBjB,EAAAA,QAAOkB,GAAG;;;MAGtCf,EAAAA,WAAWC,SAASC;;;sBAGJH,EAAAA,QAAQ;;EAIjBiB,EAAmBnB,EAAAA,QAAOoB,aAAWC,OAAO;qBACpCnB,EAAAA,QAAQ;EAGhBoB,EAA8BtB,EAAAA,QAAOkB,GAAG;;EAIxCK,EAAuBvB,EAAAA,QAAOwB,CAAC;;wBAEpBtB,EAAAA,QAAQ;;;;;;;;;MAS1BC,EAAAA,WAAWC,SAASC;;;;;;MAMpBF,EAAAA,WAAWC,SAASI;;;;;"}
+{"version":3,"file":"navbar-action-buttons.styles.js","sources":["../../../src/navbar/navbar-action-buttons.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { MediaQuery, Spacing } from \"../theme\";\n\n// =============================================================================\n// WRAPPER\n// =============================================================================\nexport const wrapper = css`\n    display: flex;\n    list-style: none;\n    margin-left: ${Spacing[\"spacing-64\"]};\n    flex-shrink: 0;\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: none;\n    }\n`;\n\nexport const mobileWrapper = css`\n    display: none;\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: flex;\n        list-style: none;\n        margin-left: ${Spacing[\"spacing-64\"]};\n        flex-shrink: 0;\n    }\n`;\n\nexport const drawerWrapper = css`\n    display: none;\n    list-style: none;\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: flex;\n        flex-direction: column;\n        margin-top: ${Spacing[\"spacing-40\"]};\n        width: max-content;\n        min-width: 22rem;\n        max-width: 24rem;\n    }\n\n    ${MediaQuery.MaxWidth.sm} {\n        width: 100%;\n        max-width: unset;\n        min-width: unset;\n    }\n`;\n\n// =============================================================================\n// BUTTON ITEMS\n// =============================================================================\nexport const buttonItem = css`\n    position: relative;\n    display: flex;\n    align-items: center;\n\n    &:not(:last-of-type) {\n        margin-right: ${Spacing[\"spacing-16\"]};\n    }\n\n    ${MediaQuery.MaxWidth.lg} {\n        width: 100%;\n        padding: 0 0 0 ${Spacing[\"spacing-16\"]};\n        justify-content: center;\n\n        &:not(:last-of-type) {\n            margin-right: 0;\n            margin-bottom: 0;\n        }\n    }\n`;\n\nexport const buttonItemMobile = css`\n    ${MediaQuery.MaxWidth.lg} {\n        &:not(:last-of-type) {\n            margin-bottom: ${Spacing[\"spacing-16\"]};\n        }\n    }\n\n    ${MediaQuery.MaxWidth.sm} {\n        padding: 0 ${Spacing[\"spacing-16\"]};\n    }\n`;\n\nexport const actionButton = css`\n    ${MediaQuery.MaxWidth.lg} {\n        width: 100%;\n    }\n`;\n\n// =============================================================================\n// DOWNLOAD APP\n// =============================================================================\nexport const downloadAppWrapper = css`\n    display: none;\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: flex;\n        flex-direction: column;\n        margin-top: ${Spacing[\"spacing-40\"]};\n    }\n`;\n\nexport const downloadAppTitle = css`\n    margin-bottom: ${Spacing[\"spacing-8\"]};\n`;\n\nexport const downloadAppImageLinkWrapper = css`\n    display: flex;\n`;\n\nexport const downloadAppImageLink = css`\n    &:not(:last-child) {\n        margin-right: ${Spacing[\"spacing-16\"]};\n    }\n\n    img {\n        width: auto;\n        height: auto;\n        object-fit: contain;\n    }\n\n    ${MediaQuery.MaxWidth.lg} {\n        img {\n            max-width: 11rem;\n        }\n    }\n\n    ${MediaQuery.MaxWidth.sm} {\n        img {\n            max-width: 100%;\n        }\n    }\n`;\n"],"names":[],"mappings":"8GAqFyB,8BAjCF,mCAqBM,wCAuCI,8CAJO,oCAJX,qCAVE,gCAjEL,gCAXA,2BAXN"}

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

@@ -0,0 +1,10 @@
+@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;}
+:where(body.fds-breakpoint-lg-max) .b1x8wy30:not(:last-of-type){margin-bottom:var(--fds-spacing-16);}:where(body.fds-breakpoint-sm-max) .b1x8wy30{padding:0 var(--fds-spacing-16);}
+:where(body.fds-breakpoint-lg-max) .a11s4qne{width:100%;}
+.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%;}}

package/cjs/navbar/navbar-helper.js

@@ -1,2 +1,2 @@
-"use strict";var e;exports.NavbarHelper=void 0,(e=exports.NavbarHelper||(exports.NavbarHelper={})).isNavItemCommon=e=>!!e.onClick,e.isNavItemLink=e=>{const r=e;return!r.itemType||"link"===r.itemType};
+"use strict";exports.NavbarHelper=class{static isNavItemCommon(t){return!!t.onClick}static isNavItemLink(t){const e=t;return!e.itemType||"link"===e.itemType}};
 //# sourceMappingURL=navbar-helper.js.map

package/cjs/navbar/navbar-helper.js.map

@@ -1 +1 @@
-{"version":3,"file":"navbar-helper.js","sources":["../../../src/navbar/navbar-helper.ts"],"sourcesContent":["import { NavItemCommonProps, NavItemLinkProps, NavItemProps } from \"./types\";\n\nexport namespace NavbarHelper {\n    export const isNavItemCommon = <T>(\n        item: NavItemProps<T> | NavItemCommonProps<T>\n    ): item is NavItemCommonProps<T> => {\n        return !!(item as NavItemCommonProps<T>).onClick;\n    };\n\n    export const isNavItemLink = <T>(\n        item: NavItemProps<T> | NavItemCommonProps<T>\n    ): item is NavItemLinkProps<T> => {\n        const link = item as NavItemLinkProps<T>;\n        return !link.itemType || link.itemType === \"link\";\n    };\n}\n"],"names":["NavbarHelper","isNavItemCommon","item","onClick","isNavItemLink","link","itemType"],"mappings":"aAEA,IAAiBA,EAAAA,QAAAA,kBAAAA,GAAAA,EAAAA,QAAAA,eAAAA,qBAAY,CAAA,IACZC,gBACTC,KAEUA,EAA+BC,QAGhCH,EAAAI,cACTF,IAEA,MAAMG,EAAOH,EACb,OAAQG,EAAKC,UAA8B,SAAlBD,EAAKC,QAAmB"}
+{"version":3,"file":"navbar-helper.js","sources":["../../../src/navbar/navbar-helper.ts"],"sourcesContent":["import type {\n    NavItemCommonProps,\n    NavItemLinkProps,\n    NavItemProps,\n} from \"./types\";\n\nexport class NavbarHelper {\n    public static isNavItemCommon<T>(\n        item: NavItemProps<T> | NavItemCommonProps<T>\n    ): item is NavItemCommonProps<T> {\n        return !!(item as NavItemCommonProps<T>).onClick;\n    }\n\n    public static isNavItemLink<T>(\n        item: NavItemProps<T> | NavItemCommonProps<T>\n    ): item is NavItemLinkProps<T> {\n        const link = item as NavItemLinkProps<T>;\n        return !link.itemType || link.itemType === \"link\";\n    }\n}\n"],"names":["isNavItemCommon","item","onClick","isNavItemLink","link","itemType"],"mappings":"wCAOW,sBAAOA,CACVC,GAEA,QAAUA,EAA+BC,OAC7C,CAEO,oBAAOC,CACVF,GAEA,MAAMG,EAAOH,EACb,OAAQG,EAAKC,UAA8B,SAAlBD,EAAKC,QAClC"}

package/cjs/navbar/navbar-items.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_virtual/_tslib.js"),n=require("react/jsx-runtime"),i=require("react"),t=require("../menu/menu.js"),r=require("./menu.js");require("../util/calendar-helper.js"),require("../util/date-helper.js"),require("../util/date-input-helper.js");var s=require("../util/simple-id-generator.js");require("../util/string-helper.js"),require("@react-aria/live-announcer");var l=require("./navbar-items.styles.js");exports.NavbarItems=({items:a,selectedId:d,mobile:u=!1,hideNavBranding:o,hideLinkIndicator:c=!1,onItemClick:p})=>{const[h,j]=i.useState(-1),[x,m]=i.useState(!1),[b,g]=i.useState(null),v=i.useRef(null),$=s.useId();i.useEffect((()=>{const e=e=>{v.current&&!v.current.contains(e.target)&&(m(!1),j(-1),g(null))};return document.addEventListener("click",e,!0),()=>{document.removeEventListener("click",e,!0)}}),[]);const k=(e,n)=>i=>{var t;if(i.stopPropagation(),u&&(null===(t=e.subMenu)||void 0===t?void 0:t.length)){const e=!(h===n&&x);j(n),m(e)}p(i,e)},L=(e,n)=>{e.stopPropagation(),p(e,n),m(!1),j(-1)},f=(e,i)=>n.jsx(t.Menu.Content,{id:i,children:n.jsx(t.Menu.Section,{showDivider:!1,children:e.map(((e,i)=>n.jsx(t.Menu.Link,{href:e.href,children:e.children},`${e.id}-${i}`)))})}),I=e=>n.jsx(r.Menu,{items:e,onItemClick:L}),q=(i,r)=>{const{children:s,options:p,subMenu:j}=i,m=e.__rest(i,["children","options","subMenu"]),v=!!(null==j?void 0:j.length),L=(e=>{var n;return e.id===d||!!(null===(n=e.subMenu)||void 0===n?void 0:n.length)&&!!e.subMenu.find((e=>e.id===d))})(i),q=u&&v&&h===r&&x,M=!u&&v&&b===r||q,C=null!==b?b===r:L,_=!c&&C,O=C?u?"bold":"semibold":"regular",w=u?`link__mobile-${r+1}`:`link__${r+1}`,E=()=>_?n.jsx(l.LinkIndicator,{"data-testid":`${w}-indicator`,$selected:C}):null;return n.jsx(l.LinkItem,{$hiddenBranding:o,children:v?(e=>{const a=`navbar-submenu-${$}-${i.id}`;return u?n.jsxs(n.Fragment,{children:[n.jsxs(l.Link,Object.assign({"data-testid":w,$weight:O,$selected:C},m,{"aria-current":L?"page":void 0,"aria-haspopup":"menu","aria-expanded":M,onClick:k(i,r)},p,{children:[n.jsx(l.LinkLabel,{children:s}),E(),u&&v?n.jsx(l.LinkIconContainer,{children:n.jsx(l.ExpandCollapseButton,{"data-testid":`${w}-expand-collapse-button`,$selected:C,$expanded:M,focusHighlight:!1,focusOutline:"browser","aria-label":M?"Collapse":"Expand",children:n.jsx(l.ChevronIcon,{$selected:C})})}):null]})),q&&I(j)]}):n.jsx(t.Menu,{position:e?"bottom-end":"bottom",customOffset:0,menuContent:f(j,a),triggerOnFocus:!0,isModal:!1,onPopoverAppear:()=>g(r),onPopoverDismiss:()=>{g((e=>e===r?null:e))},children:n.jsxs(l.LinkButton,Object.assign({type:"button",tabIndex:0,"data-testid":w,$weight:O,$selected:C,"aria-haspopup":"menu","aria-expanded":M},p,{children:[n.jsx(l.LinkLabel,{children:s}),E(),n.jsx(l.ChevronIconDesktop,{$selected:C,$expanded:M})]}))})})(r===a.length-1):n.jsxs(l.Link,Object.assign({tabIndex:0,"data-testid":w,$weight:O,$selected:C},m,{"aria-current":L?"page":void 0,onClick:k(i,r)},p,{children:[n.jsx(l.LinkLabel,{children:s}),E()]}))},r)},M=()=>a.map(((e,i)=>{var t;return"component"===e.itemType?n.jsx("li",{children:null!==(t=e.children)&&void 0!==t?t:null},i):q(e,i)}));return a&&a.length>0?u?n.jsx(l.MobileWrapper,{ref:v,children:M()}):n.jsx(l.Wrapper,{ref:v,$alignLeft:o,children:M()}):n.jsx(n.Fragment,{})};
+"use strict";var e=require("../_virtual/_tslib.js"),n=require("react/jsx-runtime"),i=require("@lifesg/react-icons/chevron-up"),r=require("clsx"),t=require("react"),l=require("../menu/menu.js"),a=require("../shared/clickable-icon/clickable-icon.js");require("../util/calendar-helper.js"),require("../external/dayjs/dayjs.min.js");var s=require("../util/simple-id-generator.js");require("../util/string-helper.js"),require("@react-aria/live-announcer");var c=require("./menu.js"),u=require("./navbar-items.styles.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=d(r);exports.NavbarItems=({items:r,selectedId:d,mobile:m=!1,hideNavBranding:h,hideLinkIndicator:p=!1,onItemClick:v})=>{const[b,j]=t.useState(-1),[x,g]=t.useState(!1),[f,k]=t.useState(null),I=t.useRef(null),N=s.useId();t.useEffect((()=>{const e=e=>{I.current&&!I.current.contains(e.target)&&(g(!1),j(-1),k(null))};return document.addEventListener("click",e,!0),()=>{document.removeEventListener("click",e,!0)}}),[]);const q=(e,n)=>i=>{var r;if(i.stopPropagation(),m&&(null===(r=e.subMenu)||void 0===r?void 0:r.length)){const e=!(b===n&&x);j(n),g(e)}v(i,e)},M=(e,n)=>{e.stopPropagation(),v(e,n),g(!1),j(-1)},C=(e,i)=>n.jsx(l.Menu.Content,{id:i,children:n.jsx(l.Menu.Section,{showDivider:!1,children:e.map(((e,i)=>n.jsx(l.Menu.Link,{href:e.href,children:e.children},`${e.id}-${i}`)))})}),S=e=>n.jsx(c.Menu,{items:e,onItemClick:M}),L=(t,s)=>{const{children:c,options:v,subMenu:j}=t,g=e.__rest(t,["children","options","subMenu"]),I=!!(null==j?void 0:j.length),M=(e=>{var n;return e.id===d||!!(null===(n=e.subMenu)||void 0===n?void 0:n.length)&&!!e.subMenu.find((e=>e.id===d))})(t),L=!m&&I&&f===s,$=m&&I&&b===s&&x,_=L||$,y=null!==f?f===s:M,E=!p&&y,O=y?m?"bold":"semibold":"regular",w=m?`link__mobile-${s+1}`:`link__${s+1}`,B=()=>E?n.jsx("div",{"data-testid":`${w}-indicator`,className:o.default(u.linkIndicator,y&&u.linkIndicatorSelected)}):null,P=o.default(u.link,(e=>{switch(e){case"bold":return u.linkWeightBold;case"semibold":return u.linkWeightSemibold;default:return u.linkWeightRegular}})(O),y&&u.linkSelected);return n.jsx("li",{className:o.default(u.linkItem,h&&u.linkItemHiddenBranding),children:I?(e=>{const r=`navbar-submenu-${N}-${t.id}`;return m?n.jsxs(n.Fragment,{children:[n.jsxs("a",Object.assign({"data-testid":w,className:P},g,{"aria-current":M?"page":void 0,"aria-haspopup":"menu","aria-expanded":_,onClick:q(t,s)},v,{children:[n.jsx("div",{className:u.linkLabel,children:c}),B(),m&&I?n.jsx("div",{className:u.linkIconContainer,children:n.jsx(a.ClickableIcon,{"data-testid":`${w}-expand-collapse-button`,className:o.default(u.expandCollapseButton,$&&u.subMenuExpanded),focusHighlight:!1,focusOutline:"browser","aria-label":$?"Collapse":"Expand",children:n.jsx(i.ChevronUpIcon,{className:o.default(u.chevronIcon,y&&u.chevronIconSelected)})})}):null]})),$&&S(j)]}):n.jsx(l.Menu,{position:e?"bottom-end":"bottom",customOffset:0,menuContent:C(j,r),triggerOnFocus:!0,isModal:!1,onPopoverAppear:()=>k(s),onPopoverDismiss:()=>{k((e=>e===s?null:e))},children:n.jsxs("button",Object.assign({type:"button",tabIndex:0,"data-testid":w,className:o.default(P,u.linkButton),"aria-haspopup":"menu","aria-expanded":_},v,{children:[n.jsx("div",{className:u.linkLabel,children:c}),B(),n.jsx(i.ChevronUpIcon,{className:o.default(u.chevronIcon,u.chevronIconDesktop,y&&u.chevronIconSelected,L&&u.subMenuExpanded)})]}))})})(s===r.length-1):n.jsxs("a",Object.assign({tabIndex:0,"data-testid":w,className:P},g,{"aria-current":M?"page":void 0,onClick:q(t,s)},v,{children:[n.jsx("div",{className:u.linkLabel,children:c}),B()]}))},s)},$=()=>r.map(((e,i)=>{var r;return"component"===e.itemType?n.jsx("li",{children:null!==(r=e.children)&&void 0!==r?r:null},i):L(e,i)}));return r&&r.length>0?m?n.jsx("ul",{ref:I,className:u.mobileWrapper,children:$()}):n.jsx("ul",{ref:I,className:o.default(u.wrapper,h&&u.wrapperAlignLeft),children:$()}):n.jsx(n.Fragment,{})};
 //# sourceMappingURL=navbar-items.js.map

package/cjs/navbar/navbar-items.js.map

@@ -1 +1 @@
-{"version":3,"file":"navbar-items.js","sources":["../../../src/navbar/navbar-items.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport { Menu as DesktopMenu } from \"../menu\";\nimport { TypographyWeight } from \"../typography\";\nimport { Menu as MobileMenu } from \"./menu\";\n\nimport { useId } from \"../util\";\nimport {\n    ChevronIcon,\n    ChevronIconDesktop,\n    ExpandCollapseButton,\n    Link,\n    LinkButton,\n    LinkIconContainer,\n    LinkIndicator,\n    LinkItem,\n    LinkLabel,\n    MobileWrapper,\n    Wrapper,\n} from \"./navbar-items.styles\";\nimport { NavItemCommonProps, NavItemLinkProps, NavItemProps } from \"./types\";\n\ninterface Props<T> {\n    items: NavItemProps<T>[];\n    selectedId?: string | undefined;\n    /** toggle for mobile or desktop view */\n    mobile?: boolean | undefined;\n    hideNavBranding?: boolean | undefined;\n    /** hide the selected LinkIndicator */\n    hideLinkIndicator?: boolean | undefined;\n    onItemClick: (\n        event: React.MouseEvent<HTMLAnchorElement>,\n        item: NavItemProps<T> | NavItemCommonProps<T>\n    ) => void;\n}\n\nexport const NavbarItems = <T,>({\n    items,\n    selectedId,\n    mobile = false,\n    hideNavBranding,\n    hideLinkIndicator = false,\n    onItemClick,\n}: Props<T>): JSX.Element => {\n    // =============================================================================\n    // CONST, STATE, REFS\n    // =============================================================================\n    const [selectedIndex, setSelectedIndex] = useState<number>(-1);\n    const [showSubMenu, setShowSubMenu] = useState<boolean>(false);\n    const [openSubMenuIndex, setOpenSubMenuIndex] = useState<number | null>(\n        null\n    );\n    const listRef = useRef<HTMLUListElement>(null);\n    const instanceId = useId();\n\n    // =============================================================================\n    // HELPERS\n    // =============================================================================\n    const resetAll = () => {\n        setShowSubMenu(false);\n        setSelectedIndex(-1);\n        setOpenSubMenuIndex(null);\n    };\n\n    const closeMobileSubMenu = () => {\n        setShowSubMenu(false);\n        setSelectedIndex(-1);\n    };\n\n    const checkSelected = (item: NavItemLinkProps<T>): boolean => {\n        if (item.id === selectedId) return true;\n        if (item.subMenu?.length) {\n            return !!item.subMenu.find((s) => s.id === selectedId);\n        }\n        return false;\n    };\n\n    useEffect(() => {\n        const handleClickOutside = (event: MouseEvent) => {\n            if (\n                listRef.current &&\n                !listRef.current.contains(event.target as Node)\n            ) {\n                resetAll();\n            }\n        };\n        document.addEventListener(\"click\", handleClickOutside, true);\n        return () => {\n            document.removeEventListener(\"click\", handleClickOutside, true);\n        };\n    }, []);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleLinkClick = (item: NavItemLinkProps<T>, index: number) => {\n        return (event: React.MouseEvent<HTMLAnchorElement>) => {\n            event.stopPropagation();\n\n            // mobile expands inline when link has submenu\n            if (mobile && item.subMenu?.length) {\n                const nextExpanded = !(selectedIndex === index && showSubMenu);\n                setSelectedIndex(index);\n                setShowSubMenu(nextExpanded);\n            }\n\n            onItemClick(event, item);\n        };\n    };\n\n    const handleMobileSubLinkClick = (\n        event: React.MouseEvent<HTMLAnchorElement>,\n        item: NavItemCommonProps<T>\n    ) => {\n        event.stopPropagation();\n        onItemClick(event, item);\n        closeMobileSubMenu();\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderDesktopSubMenu = (\n        subMenu: NavItemCommonProps<T>[],\n        subMenuId: string\n    ) => (\n        <DesktopMenu.Content id={subMenuId}>\n            <DesktopMenu.Section showDivider={false}>\n                {subMenu.map((item, subIndex) => (\n                    <DesktopMenu.Link\n                        key={`${item.id}-${subIndex}`}\n                        href={item.href}\n                    >\n                        {item.children}\n                    </DesktopMenu.Link>\n                ))}\n            </DesktopMenu.Section>\n        </DesktopMenu.Content>\n    );\n\n    const renderMobileSubMenu = (subMenu: NavItemCommonProps<T>[]) => (\n        <MobileMenu items={subMenu} onItemClick={handleMobileSubLinkClick} />\n    );\n\n    const renderLinkItem = (item: NavItemLinkProps<T>, index: number) => {\n        const { children, options, subMenu, ...otherItemAttrs } = item;\n\n        const hasSubMenu = !!subMenu?.length;\n\n        const isRouteSelected = checkSelected(item);\n\n        // desktop popover open state\n        const isDesktopExpanded =\n            !mobile && hasSubMenu && openSubMenuIndex === index;\n\n        // mobile inline expanded state\n        const isMobileExpanded =\n            mobile && hasSubMenu && selectedIndex === index && showSubMenu;\n\n        const isExpanded = isDesktopExpanded || isMobileExpanded;\n\n        const selected =\n            openSubMenuIndex !== null\n                ? openSubMenuIndex === index\n                : isRouteSelected;\n\n        const showIndicator = !hideLinkIndicator && selected;\n\n        const textWeight: TypographyWeight = selected\n            ? mobile\n                ? \"bold\"\n                : \"semibold\"\n            : \"regular\";\n\n        const testId = mobile\n            ? `link__mobile-${index + 1}`\n            : `link__${index + 1}`;\n\n        const renderIndicator = () =>\n            showIndicator ? (\n                <LinkIndicator\n                    data-testid={`${testId}-indicator`}\n                    $selected={selected}\n                />\n            ) : null;\n\n        const renderMobileChevron = () =>\n            mobile && hasSubMenu ? (\n                <LinkIconContainer>\n                    <ExpandCollapseButton\n                        data-testid={`${testId}-expand-collapse-button`}\n                        $selected={selected}\n                        $expanded={isExpanded}\n                        focusHighlight={false}\n                        focusOutline=\"browser\"\n                        aria-label={isExpanded ? \"Collapse\" : \"Expand\"}\n                    >\n                        <ChevronIcon $selected={selected} />\n                    </ExpandCollapseButton>\n                </LinkIconContainer>\n            ) : null;\n\n        const renderLink = () => (\n            <Link\n                tabIndex={0}\n                data-testid={testId}\n                $weight={textWeight}\n                $selected={selected}\n                {...otherItemAttrs}\n                aria-current={isRouteSelected ? \"page\" : undefined}\n                onClick={handleLinkClick(item, index)}\n                {...options}\n            >\n                <LinkLabel>{children}</LinkLabel>\n                {renderIndicator()}\n            </Link>\n        );\n\n        const renderLinkWithSubmenu = (isLastItem: boolean) => {\n            const subMenuId = `navbar-submenu-${instanceId}-${item.id}`;\n\n            if (mobile) {\n                return (\n                    <>\n                        <Link\n                            data-testid={testId}\n                            $weight={textWeight}\n                            $selected={selected}\n                            {...otherItemAttrs}\n                            aria-current={isRouteSelected ? \"page\" : undefined}\n                            aria-haspopup=\"menu\"\n                            aria-expanded={isExpanded}\n                            onClick={handleLinkClick(item, index)}\n                            {...options}\n                        >\n                            <LinkLabel>{children}</LinkLabel>\n                            {renderIndicator()}\n                            {renderMobileChevron()}\n                        </Link>\n\n                        {isMobileExpanded && renderMobileSubMenu(subMenu!)}\n                    </>\n                );\n            }\n\n            return (\n                <DesktopMenu\n                    position={isLastItem ? \"bottom-end\" : \"bottom\"}\n                    customOffset={0}\n                    menuContent={renderDesktopSubMenu(subMenu!, subMenuId)}\n                    triggerOnFocus\n                    isModal={false}\n                    onPopoverAppear={() => setOpenSubMenuIndex(index)}\n                    onPopoverDismiss={() => {\n                        setOpenSubMenuIndex((prev) =>\n                            prev === index ? null : prev\n                        );\n                    }}\n                >\n                    <LinkButton\n                        type=\"button\"\n                        tabIndex={0}\n                        data-testid={testId}\n                        $weight={textWeight}\n                        $selected={selected}\n                        aria-haspopup=\"menu\"\n                        aria-expanded={isExpanded}\n                        {...options}\n                    >\n                        <LinkLabel>{children}</LinkLabel>\n                        {renderIndicator()}\n                        <ChevronIconDesktop\n                            $selected={selected}\n                            $expanded={isExpanded}\n                        />\n                    </LinkButton>\n                </DesktopMenu>\n            );\n        };\n\n        return (\n            <LinkItem key={index} $hiddenBranding={hideNavBranding}>\n                {hasSubMenu\n                    ? renderLinkWithSubmenu(index === items.length - 1)\n                    : renderLink()}\n            </LinkItem>\n        );\n    };\n\n    const renderItems = () =>\n        items.map((item, index) => {\n            switch (item.itemType) {\n                case \"component\": {\n                    return <li key={index}>{item.children ?? null}</li>;\n                }\n                case \"link\":\n                default: {\n                    return renderLinkItem(item as NavItemLinkProps<T>, index);\n                }\n            }\n        });\n\n    if (items && items.length > 0) {\n        return mobile ? (\n            <MobileWrapper ref={listRef}>{renderItems()}</MobileWrapper>\n        ) : (\n            <Wrapper ref={listRef} $alignLeft={hideNavBranding}>\n                {renderItems()}\n            </Wrapper>\n        );\n    }\n\n    return <></>;\n};\n"],"names":["items","selectedId","mobile","hideNavBranding","hideLinkIndicator","onItemClick","selectedIndex","setSelectedIndex","useState","showSubMenu","setShowSubMenu","openSubMenuIndex","setOpenSubMenuIndex","listRef","useRef","instanceId","useId","useEffect","handleClickOutside","event","current","contains","target","document","addEventListener","removeEventListener","handleLinkClick","item","index","stopPropagation","_a","subMenu","length","nextExpanded","handleMobileSubLinkClick","renderDesktopSubMenu","subMenuId","_jsx","DesktopMenu","Content","id","children","Section","showDivider","map","subIndex","Link","href","renderMobileSubMenu","MobileMenu","renderLinkItem","options","otherItemAttrs","__rest","hasSubMenu","isRouteSelected","find","s","checkSelected","isMobileExpanded","isExpanded","selected","showIndicator","textWeight","testId","renderIndicator","LinkIndicator","$selected","LinkItem","$hiddenBranding","isLastItem","_jsxs","_Fragment","Object","assign","$weight","undefined","onClick","LinkLabel","LinkIconContainer","ExpandCollapseButton","$expanded","focusHighlight","focusOutline","ChevronIcon","position","customOffset","menuContent","triggerOnFocus","isModal","onPopoverAppear","onPopoverDismiss","prev","LinkButton","type","tabIndex","ChevronIconDesktop","renderLinkWithSubmenu","renderItems","itemType","MobileWrapper","ref","Wrapper","$alignLeft"],"mappings":"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"}
+{"version":3,"file":"navbar-items.js","sources":["../../../src/navbar/navbar-items.tsx"],"sourcesContent":["import { ChevronUpIcon } from \"@lifesg/react-icons/chevron-up\";\nimport clsx from \"clsx\";\nimport type React from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\n\nimport { Menu as DesktopMenu } from \"../menu\";\nimport { ClickableIcon } from \"../shared/clickable-icon\";\nimport type { TypographyWeight } from \"../typography\";\nimport { useId } from \"../util\";\nimport { Menu as MobileMenu } from \"./menu\";\nimport * as styles from \"./navbar-items.styles\";\nimport type {\n    NavItemCommonProps,\n    NavItemLinkProps,\n    NavItemProps,\n} from \"./types\";\n\nconst getLinkWeightClass = (weight: TypographyWeight) => {\n    switch (weight) {\n        case \"bold\":\n            return styles.linkWeightBold;\n        case \"semibold\":\n            return styles.linkWeightSemibold;\n        case \"regular\":\n        default:\n            return styles.linkWeightRegular;\n    }\n};\n\ninterface Props<T> {\n    items: NavItemProps<T>[];\n    selectedId?: string | undefined;\n    /** toggle for mobile or desktop view */\n    mobile?: boolean | undefined;\n    hideNavBranding?: boolean | undefined;\n    /** hide the selected LinkIndicator */\n    hideLinkIndicator?: boolean | undefined;\n    onItemClick: (\n        event: React.MouseEvent<HTMLAnchorElement>,\n        item: NavItemProps<T> | NavItemCommonProps<T>\n    ) => void;\n}\n\nexport const NavbarItems = <T,>({\n    items,\n    selectedId,\n    mobile = false,\n    hideNavBranding,\n    hideLinkIndicator = false,\n    onItemClick,\n}: Props<T>): JSX.Element => {\n    // =============================================================================\n    // CONST, STATE, REFS\n    // =============================================================================\n    const [selectedIndex, setSelectedIndex] = useState<number>(-1);\n    const [showSubMenu, setShowSubMenu] = useState<boolean>(false);\n    const [openSubMenuIndex, setOpenSubMenuIndex] = useState<number | null>(\n        null\n    );\n    const listRef = useRef<HTMLUListElement>(null);\n    const instanceId = useId();\n\n    // =============================================================================\n    // HELPERS\n    // =============================================================================\n    const resetAll = () => {\n        setShowSubMenu(false);\n        setSelectedIndex(-1);\n        setOpenSubMenuIndex(null);\n    };\n\n    const closeMobileSubMenu = () => {\n        setShowSubMenu(false);\n        setSelectedIndex(-1);\n    };\n\n    const checkSelected = (item: NavItemLinkProps<T>): boolean => {\n        if (item.id === selectedId) return true;\n        if (item.subMenu?.length) {\n            return !!item.subMenu.find((s) => s.id === selectedId);\n        }\n        return false;\n    };\n\n    useEffect(() => {\n        const handleClickOutside = (event: MouseEvent) => {\n            if (\n                listRef.current &&\n                !listRef.current.contains(event.target as Node)\n            ) {\n                resetAll();\n            }\n        };\n        document.addEventListener(\"click\", handleClickOutside, true);\n        return () => {\n            document.removeEventListener(\"click\", handleClickOutside, true);\n        };\n    }, []);\n\n    // =============================================================================\n    // EVENT HANDLERS\n    // =============================================================================\n    const handleLinkClick = (item: NavItemLinkProps<T>, index: number) => {\n        return (event: React.MouseEvent<HTMLAnchorElement>) => {\n            event.stopPropagation();\n\n            // mobile expands inline when link has submenu\n            if (mobile && item.subMenu?.length) {\n                const nextExpanded = !(selectedIndex === index && showSubMenu);\n                setSelectedIndex(index);\n                setShowSubMenu(nextExpanded);\n            }\n\n            onItemClick(event, item);\n        };\n    };\n\n    const handleMobileSubLinkClick = (\n        event: React.MouseEvent<HTMLAnchorElement>,\n        item: NavItemCommonProps<T>\n    ) => {\n        event.stopPropagation();\n        onItemClick(event, item);\n        closeMobileSubMenu();\n    };\n\n    // =============================================================================\n    // RENDER FUNCTIONS\n    // =============================================================================\n    const renderDesktopSubMenu = (\n        subMenu: NavItemCommonProps<T>[],\n        subMenuId: string\n    ) => (\n        <DesktopMenu.Content id={subMenuId}>\n            <DesktopMenu.Section showDivider={false}>\n                {subMenu.map((item, subIndex) => (\n                    <DesktopMenu.Link\n                        key={`${item.id}-${subIndex}`}\n                        href={item.href}\n                    >\n                        {item.children}\n                    </DesktopMenu.Link>\n                ))}\n            </DesktopMenu.Section>\n        </DesktopMenu.Content>\n    );\n\n    const renderMobileSubMenu = (subMenu: NavItemCommonProps<T>[]) => (\n        <MobileMenu items={subMenu} onItemClick={handleMobileSubLinkClick} />\n    );\n\n    const renderLinkItem = (item: NavItemLinkProps<T>, index: number) => {\n        const { children, options, subMenu, ...otherItemAttrs } = item;\n\n        const hasSubMenu = !!subMenu?.length;\n\n        const isRouteSelected = checkSelected(item);\n\n        // desktop popover open state\n        const isDesktopExpanded =\n            !mobile && hasSubMenu && openSubMenuIndex === index;\n\n        // mobile inline expanded state\n        const isMobileExpanded =\n            mobile && hasSubMenu && selectedIndex === index && showSubMenu;\n\n        const isExpanded = isDesktopExpanded || isMobileExpanded;\n\n        const selected =\n            openSubMenuIndex !== null\n                ? openSubMenuIndex === index\n                : isRouteSelected;\n\n        const showIndicator = !hideLinkIndicator && selected;\n\n        const textWeight: TypographyWeight = selected\n            ? mobile\n                ? \"bold\"\n                : \"semibold\"\n            : \"regular\";\n\n        const testId = mobile\n            ? `link__mobile-${index + 1}`\n            : `link__${index + 1}`;\n\n        const renderIndicator = () =>\n            showIndicator ? (\n                <div\n                    data-testid={`${testId}-indicator`}\n                    className={clsx(\n                        styles.linkIndicator,\n                        selected && styles.linkIndicatorSelected\n                    )}\n                />\n            ) : null;\n\n        const renderMobileChevron = () =>\n            mobile && hasSubMenu ? (\n                <div className={styles.linkIconContainer}>\n                    <ClickableIcon\n                        data-testid={`${testId}-expand-collapse-button`}\n                        className={clsx(\n                            styles.expandCollapseButton,\n                            isMobileExpanded && styles.subMenuExpanded\n                        )}\n                        focusHighlight={false}\n                        focusOutline=\"browser\"\n                        aria-label={isMobileExpanded ? \"Collapse\" : \"Expand\"}\n                    >\n                        <ChevronUpIcon\n                            className={clsx(\n                                styles.chevronIcon,\n                                selected && styles.chevronIconSelected\n                            )}\n                        />\n                    </ClickableIcon>\n                </div>\n            ) : null;\n\n        const linkClassName = clsx(\n            styles.link,\n            getLinkWeightClass(textWeight),\n            selected && styles.linkSelected\n        );\n\n        const renderLink = () => (\n            <a\n                tabIndex={0}\n                data-testid={testId}\n                className={linkClassName}\n                {...otherItemAttrs}\n                aria-current={isRouteSelected ? \"page\" : undefined}\n                onClick={handleLinkClick(item, index)}\n                {...options}\n            >\n                <div className={styles.linkLabel}>{children}</div>\n                {renderIndicator()}\n            </a>\n        );\n\n        const renderLinkWithSubmenu = (isLastItem: boolean) => {\n            const subMenuId = `navbar-submenu-${instanceId}-${item.id}`;\n\n            if (mobile) {\n                return (\n                    <>\n                        <a\n                            data-testid={testId}\n                            className={linkClassName}\n                            {...otherItemAttrs}\n                            aria-current={isRouteSelected ? \"page\" : undefined}\n                            aria-haspopup=\"menu\"\n                            aria-expanded={isExpanded}\n                            onClick={handleLinkClick(item, index)}\n                            {...options}\n                        >\n                            <div className={styles.linkLabel}>{children}</div>\n                            {renderIndicator()}\n                            {renderMobileChevron()}\n                        </a>\n\n                        {isMobileExpanded && renderMobileSubMenu(subMenu!)}\n                    </>\n                );\n            }\n\n            return (\n                <DesktopMenu\n                    position={isLastItem ? \"bottom-end\" : \"bottom\"}\n                    customOffset={0}\n                    menuContent={renderDesktopSubMenu(subMenu!, subMenuId)}\n                    triggerOnFocus\n                    isModal={false}\n                    onPopoverAppear={() => setOpenSubMenuIndex(index)}\n                    onPopoverDismiss={() => {\n                        setOpenSubMenuIndex((prev) =>\n                            prev === index ? null : prev\n                        );\n                    }}\n                >\n                    <button\n                        type=\"button\"\n                        tabIndex={0}\n                        data-testid={testId}\n                        className={clsx(linkClassName, styles.linkButton)}\n                        aria-haspopup=\"menu\"\n                        aria-expanded={isExpanded}\n                        {...options}\n                    >\n                        <div className={styles.linkLabel}>{children}</div>\n                        {renderIndicator()}\n                        <ChevronUpIcon\n                            className={clsx(\n                                styles.chevronIcon,\n                                styles.chevronIconDesktop,\n                                selected && styles.chevronIconSelected,\n                                isDesktopExpanded && styles.subMenuExpanded\n                            )}\n                        />\n                    </button>\n                </DesktopMenu>\n            );\n        };\n\n        return (\n            <li\n                key={index}\n                className={clsx(\n                    styles.linkItem,\n                    hideNavBranding && styles.linkItemHiddenBranding\n                )}\n            >\n                {hasSubMenu\n                    ? renderLinkWithSubmenu(index === items.length - 1)\n                    : renderLink()}\n            </li>\n        );\n    };\n\n    const renderItems = () =>\n        items.map((item, index) => {\n            switch (item.itemType) {\n                case \"component\": {\n                    return <li key={index}>{item.children ?? null}</li>;\n                }\n                case \"link\":\n                default: {\n                    return renderLinkItem(item as NavItemLinkProps<T>, index);\n                }\n            }\n        });\n\n    if (items && items.length > 0) {\n        return mobile ? (\n            <ul ref={listRef} className={styles.mobileWrapper}>\n                {renderItems()}\n            </ul>\n        ) : (\n            <ul\n                ref={listRef}\n                className={clsx(\n                    styles.wrapper,\n                    hideNavBranding && styles.wrapperAlignLeft\n                )}\n            >\n                {renderItems()}\n            </ul>\n        );\n    }\n\n    return <></>;\n};\n"],"names":["items","selectedId","mobile","hideNavBranding","hideLinkIndicator","onItemClick","selectedIndex","setSelectedIndex","useState","showSubMenu","setShowSubMenu","openSubMenuIndex","setOpenSubMenuIndex","listRef","useRef","instanceId","useId","useEffect","handleClickOutside","event","current","contains","target","document","addEventListener","removeEventListener","handleLinkClick","item","index","stopPropagation","_a","subMenu","length","nextExpanded","handleMobileSubLinkClick","renderDesktopSubMenu","subMenuId","_jsx","DesktopMenu","Content","id","children","Section","showDivider","map","subIndex","Link","href","renderMobileSubMenu","MobileMenu","renderLinkItem","options","otherItemAttrs","__rest","hasSubMenu","isRouteSelected","find","s","checkSelected","isDesktopExpanded","isMobileExpanded","isExpanded","selected","showIndicator","textWeight","testId","renderIndicator","className","clsx","styles.linkIndicator","styles.linkIndicatorSelected","linkClassName","styles.link","weight","styles.linkWeightBold","styles.linkWeightSemibold","styles.linkWeightRegular","getLinkWeightClass","styles.linkSelected","styles.linkItem","styles.linkItemHiddenBranding","isLastItem","_jsxs","_Fragment","Object","assign","undefined","onClick","styles.linkLabel","styles.linkIconContainer","ClickableIcon","styles.expandCollapseButton","styles.subMenuExpanded","focusHighlight","focusOutline","ChevronUpIcon","styles.chevronIcon","styles.chevronIconSelected","position","customOffset","menuContent","triggerOnFocus","isModal","onPopoverAppear","onPopoverDismiss","prev","type","tabIndex","styles.linkButton","styles.chevronIconDesktop","renderLinkWithSubmenu","renderItems","itemType","ref","styles.mobileWrapper","styles.wrapper","styles.wrapperAlignLeft"],"mappings":"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"}

package/cjs/navbar/navbar-items.styles.js

@@ -1,133 +1,2 @@
-"use strict";var e=require("@lifesg/react-icons/chevron-up"),t=require("styled-components"),r=require("../shared/clickable-icon/clickable-icon.js"),o=require("../theme/index.js"),i=require("../theme/components/theme-helper.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=n(t);const l=a.default.ul`
-    display: flex;
-    list-style: none;
-    position: relative;
-
-    ${e=>e.$alignLeft&&"margin-right: auto;"}
-
-    ${o.MediaQuery.MaxWidth.lg} {
-        display: none;
-    }
-`,d=a.default.ul`
-    display: none;
-    list-style: none;
-
-    ${o.MediaQuery.MaxWidth.lg} {
-        display: flex;
-        flex-direction: column;
-        overflow: hidden;
-    }
-`,s=a.default.li`
-    display: flex;
-    margin: 0 1rem;
-
-    &:first-child {
-        // negative margin to preserve touch target size for link
-        margin-left: ${e=>e.$hiddenBranding?"-0.5rem":"0"};
-    }
-
-    ${o.MediaQuery.MaxWidth.lg} {
-        flex-direction: column;
-        padding: 0.125rem 0;
-        width: 100%;
-        margin-left: 0rem;
-    }
-`,c=t.css`
-    ${e=>o.Font[`body-md-${e.$weight}`]}
-
-    display: flex;
-    position: relative;
-    align-items: center;
-    text-align: center;
-    color: ${i.ThemeNavbar["navbar-link-colour-text"]};
-    height: 100%;
-    gap: 0.5rem;
-
-    &:active,
-    &:hover,
-    &:focus,
-    &:focus-within {
-        color: ${e=>e.$selected?i.ThemeNavbar["navbar-link-colour-text-selected-hover"]:i.ThemeNavbar["navbar-link-colour-text-hover"]};
-    }
-
-    ${o.MediaQuery.MaxWidth.lg} {
-        width: 100%;
-        padding: 0.5rem 1rem;
-        text-align: left;
-    }
-`,u=a.default.a`
-    ${c}
-`,h=a.default.button`
-    ${c}
-    background: none;
-    border: 0;
-    padding: 0;
-    cursor: pointer;
-    text-align: left;
-    margin: 0;
-    box-shadow: none;
-    font: inherit;
-    color: inherit;
-`,p=a.default.div`
-    flex: 1;
-
-    overflow: hidden;
-    display: -webkit-box;
-    -webkit-box-orient: vertical;
-    -webkit-line-clamp: 3;
-    white-space: pre-wrap;
-`,m=a.default.div`
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    height: 0.25rem;
-    background-color: ${o.Colour["border-selected"]};
-
-    ${e=>e.$selected&&t.css`
-            ${u}:active &,
-            ${u}:hover &,
-            ${u}:focus &,
-            ${h}:active &,
-            ${h}:hover &,
-            ${h}:focus & {
-                background-color: ${o.Colour["border-selected-hover"]};
-            }
-        `};
-
-    ${o.MediaQuery.MaxWidth.lg} {
-        left: 0;
-        right: unset;
-        top: 0;
-        bottom: 0;
-        height: 100%;
-        width: 0.25rem;
-    }
-`,f=a.default.div`
-    margin-right: -0.5rem;
-`,g=a.default(r.ClickableIcon)`
-    padding: 0.5rem;
-    transform: rotate(${e=>e.$expanded?0:180}deg);
-    transition: transform 300ms ease-in-out;
-    margin: auto 0.25rem auto 0;
-`,$=a.default(e.ChevronUpIcon)`
-    height: 1.25rem;
-    width: 1.25rem;
-    color: ${o.Colour.icon};
-
-    ${u}:active &,
-    ${u}:hover &,
-    ${u}:focus &,
-    ${h}:active &,
-    ${h}:hover &,
-    ${h}:focus & {
-        color: ${e=>e.$selected?o.Colour["icon-selected-hover"]:o.Colour["icon-hover"]};
-    }
-`,v=a.default($)`
-    transform: rotate(${e=>e.$expanded?0:180}deg);
-    transition: transform 300ms ease-in-out;
-
-    height: 1.125rem;
-    width: 1.125rem;
-`;exports.ChevronIcon=$,exports.ChevronIconDesktop=v,exports.ExpandCollapseButton=g,exports.Link=u,exports.LinkButton=h,exports.LinkIconContainer=f,exports.LinkIndicator=m,exports.LinkItem=s,exports.LinkLabel=p,exports.MobileWrapper=d,exports.Wrapper=l;
+"use strict";require("./navbar-items.styles_1b1zx.css");exports.chevronIcon="c160mxwv",exports.chevronIconDesktop="c1s8ur0k",exports.chevronIconSelected="c1euxgs0",exports.expandCollapseButton="ej7h5do",exports.link="l1o3p4yu",exports.linkButton="l1xfqf3s",exports.linkIconContainer="l1p9u80z",exports.linkIndicator="lnocj2s",exports.linkIndicatorSelected="l5qfat1",exports.linkItem="l18t6f3m",exports.linkItemHiddenBranding="lsn8o0d",exports.linkLabel="lsc0hr8",exports.linkSelected="lkwvsmx",exports.linkWeightBold="l1p7dxu8",exports.linkWeightRegular="l1kp5n19",exports.linkWeightSemibold="lqgrg2a",exports.mobileWrapper="mw9gug8",exports.subMenuExpanded="s178e7hk",exports.wrapper="w1ndf2sj",exports.wrapperAlignLeft="w177nfye";
 //# sourceMappingURL=navbar-items.styles.js.map

package/cjs/navbar/navbar-items.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"navbar-items.styles.js","sources":["../../../src/navbar/navbar-items.styles.tsx"],"sourcesContent":["import { ChevronUpIcon } from \"@lifesg/react-icons/chevron-up\";\nimport styled, { css } from \"styled-components\";\nimport { ClickableIcon } from \"../shared/clickable-icon\";\nimport { Font, MediaQuery } from \"../theme\";\nimport { Colour } from \"../theme\";\nimport { ThemeNavbar } from \"../theme/components/theme-helper\";\nimport { TypographyWeight } from \"../typography\";\n\n// =============================================================================\n// STYLE INTERFACE, transient props are denoted with $\n// See more https://styled-components.com/docs/api#transient-props\n// =============================================================================\ninterface StyleProps {\n    $selected: boolean;\n    $expanded?: boolean;\n}\n\ninterface WrapperStyleProps {\n    $alignLeft: boolean | undefined;\n}\n\ninterface ItemStyleProps {\n    $hiddenBranding: boolean | undefined;\n}\n\n// =============================================================================\n// WRAPPER\n// =============================================================================\n\nexport const Wrapper = styled.ul<WrapperStyleProps>`\n    display: flex;\n    list-style: none;\n    position: relative;\n\n    ${(props) => props.$alignLeft && \"margin-right: auto;\"}\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: none;\n    }\n`;\n\nexport const MobileWrapper = styled.ul`\n    display: none;\n    list-style: none;\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: flex;\n        flex-direction: column;\n        overflow: hidden;\n    }\n`;\n\n// =============================================================================\n// LINK ITEMS\n// =============================================================================\nexport const LinkItem = styled.li<ItemStyleProps>`\n    display: flex;\n    margin: 0 1rem;\n\n    &:first-child {\n        // negative margin to preserve touch target size for link\n        margin-left: ${(props) => (props.$hiddenBranding ? \"-0.5rem\" : \"0\")};\n    }\n\n    ${MediaQuery.MaxWidth.lg} {\n        flex-direction: column;\n        padding: 0.125rem 0;\n        width: 100%;\n        margin-left: 0rem;\n    }\n`;\n\nconst linkCss = css<{ $selected: boolean; $weight: TypographyWeight }>`\n    ${(props) => Font[`body-md-${props.$weight}`]}\n\n    display: flex;\n    position: relative;\n    align-items: center;\n    text-align: center;\n    color: ${ThemeNavbar[\"navbar-link-colour-text\"]};\n    height: 100%;\n    gap: 0.5rem;\n\n    &:active,\n    &:hover,\n    &:focus,\n    &:focus-within {\n        color: ${(props) =>\n            props.$selected\n                ? ThemeNavbar[\"navbar-link-colour-text-selected-hover\"]\n                : ThemeNavbar[\"navbar-link-colour-text-hover\"]};\n    }\n\n    ${MediaQuery.MaxWidth.lg} {\n        width: 100%;\n        padding: 0.5rem 1rem;\n        text-align: left;\n    }\n`;\nexport const Link = styled.a<{ $selected: boolean; $weight: TypographyWeight }>`\n    ${linkCss}\n`;\n\nexport const LinkButton = styled.button<{\n    $selected: boolean;\n    $weight: TypographyWeight;\n}>`\n    ${linkCss}\n    background: none;\n    border: 0;\n    padding: 0;\n    cursor: pointer;\n    text-align: left;\n    margin: 0;\n    box-shadow: none;\n    font: inherit;\n    color: inherit;\n`;\n\nexport const LinkLabel = styled.div`\n    flex: 1;\n\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 3;\n    white-space: pre-wrap;\n`;\n\nexport const LinkIndicator = styled.div<StyleProps>`\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 0.25rem;\n    background-color: ${Colour[\"border-selected\"]};\n\n    ${(props) =>\n        props.$selected &&\n        css`\n            ${Link}:active &,\n            ${Link}:hover &,\n            ${Link}:focus &,\n            ${LinkButton}:active &,\n            ${LinkButton}:hover &,\n            ${LinkButton}:focus & {\n                background-color: ${Colour[\"border-selected-hover\"]};\n            }\n        `};\n\n    ${MediaQuery.MaxWidth.lg} {\n        left: 0;\n        right: unset;\n        top: 0;\n        bottom: 0;\n        height: 100%;\n        width: 0.25rem;\n    }\n`;\n\nexport const LinkIconContainer = styled.div`\n    margin-right: -0.5rem;\n`;\n\nexport const ExpandCollapseButton = styled(ClickableIcon)<StyleProps>`\n    padding: 0.5rem;\n    transform: rotate(${(props) => (props.$expanded ? 0 : 180)}deg);\n    transition: transform 300ms ease-in-out;\n    margin: auto 0.25rem auto 0;\n`;\n\nexport const ChevronIcon = styled(ChevronUpIcon)<StyleProps>`\n    height: 1.25rem;\n    width: 1.25rem;\n    color: ${Colour.icon};\n\n    ${Link}:active &,\n    ${Link}:hover &,\n    ${Link}:focus &,\n    ${LinkButton}:active &,\n    ${LinkButton}:hover &,\n    ${LinkButton}:focus & {\n        color: ${(props) =>\n            props.$selected\n                ? Colour[\"icon-selected-hover\"]\n                : Colour[\"icon-hover\"]};\n    }\n`;\n\nexport const ChevronIconDesktop = styled(ChevronIcon)<StyleProps>`\n    transform: rotate(${(props) => (props.$expanded ? 0 : 180)}deg);\n    transition: transform 300ms ease-in-out;\n\n    height: 1.125rem;\n    width: 1.125rem;\n`;\n"],"names":["Wrapper","styled","ul","props","$alignLeft","MediaQuery","MaxWidth","lg","MobileWrapper","LinkItem","li","$hiddenBranding","linkCss","css","Font","$weight","ThemeNavbar","$selected","Link","a","LinkButton","button","LinkLabel","div","LinkIndicator","Colour","LinkIconContainer","ExpandCollapseButton","ClickableIcon","$expanded","ChevronIcon","ChevronUpIcon","icon","ChevronIconDesktop"],"mappings":"uTA6BO,MAAMA,EAAUC,EAAAA,QAAOC,EAAqB;;;;;MAK5CC,GAAUA,EAAMC,YAAc;;MAE/BC,EAAAA,WAAWC,SAASC;;;EAKbC,EAAgBP,EAAAA,QAAOC,EAAE;;;;MAIhCG,EAAAA,WAAWC,SAASC;;;;;EAUbE,EAAWR,EAAAA,QAAOS,EAAkB;;;;;;uBAMzBP,GAAWA,EAAMQ,gBAAkB,UAAY;;;MAGjEN,EAAAA,WAAWC,SAASC;;;;;;EAQpBK,EAAUC,EAAAA,GAAsD;MAC/DV,GAAUW,OAAK,WAAWX,EAAMY;;;;;;aAM1BC,EAAAA,YAAY;;;;;;;;iBAQPb,GACNA,EAAMc,UACAD,EAAAA,YAAY,0CACZA,EAAAA,YAAY;;;MAGxBX,EAAAA,WAAWC,SAASC;;;;;EAMbW,EAAOjB,EAAAA,QAAOkB,CAAoD;MACzEP;EAGOQ,EAAanB,EAAAA,QAAOoB,MAG/B;MACIT;;;;;;;;;;EAYOU,EAAYrB,EAAAA,QAAOsB,GAAG;;;;;;;;EAUtBC,EAAgBvB,EAAAA,QAAOsB,GAAe;;;;;;wBAM3BE,EAAAA,OAAO;;MAExBtB,GACCA,EAAMc,WACNJ,KAAG;cACGK;cACAA;cACAA;cACAE;cACAA;cACAA;oCACsBK,EAAAA,OAAO;;;;MAIrCpB,EAAAA,WAAWC,SAASC;;;;;;;;EAUbmB,EAAoBzB,EAAAA,QAAOsB,GAAG;;EAI9BI,EAAuB1B,EAAAA,QAAO2B,EAAAA,cAA0B;;wBAE5CzB,GAAWA,EAAM0B,UAAY,EAAI;;;EAK7CC,EAAc7B,EAAAA,QAAO8B,EAAAA,cAA0B;;;aAG/CN,EAAAA,OAAOO;;MAEdd;MACAA;MACAA;MACAE;MACAA;MACAA;iBACYjB,GACNA,EAAMc,UACAQ,EAAAA,OAAO,uBACPA,EAAAA,OAAO;;EAIZQ,EAAqBhC,EAAAA,QAAO6B,EAAwB;wBACxC3B,GAAWA,EAAM0B,UAAY,EAAI;;;;;"}
+{"version":3,"file":"navbar-items.styles.js","sources":["../../../src/navbar/navbar-items.styles.ts"],"sourcesContent":["import { css } from \"@linaria/core\";\n\nimport { Colour, ComponentToken, Font, MediaQuery } from \"../theme\";\n\n// =============================================================================\n// WRAPPER\n// =============================================================================\n\nexport const wrapper = css`\n    display: flex;\n    list-style: none;\n    position: relative;\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: none;\n    }\n`;\n\nexport const wrapperAlignLeft = css`\n    margin-right: auto;\n`;\n\nexport const mobileWrapper = css`\n    display: none;\n    list-style: none;\n\n    ${MediaQuery.MaxWidth.lg} {\n        display: flex;\n        flex-direction: column;\n        overflow: hidden;\n    }\n`;\n\n// =============================================================================\n// LINK ITEMS\n// =============================================================================\nexport const linkItem = css`\n    display: flex;\n    margin: 0 1rem;\n    &:first-child {\n        margin-left: 0;\n    }\n\n    ${MediaQuery.MaxWidth.lg} {\n        flex-direction: column;\n        padding: 0.125rem 0;\n        width: 100%;\n        margin-left: 0rem;\n    }\n`;\n\nexport const linkItemHiddenBranding = css`\n    // negative margin to preserve touch target size for link\n    &:first-child {\n        margin-left: -0.5rem;\n    }\n\n    ${MediaQuery.MaxWidth.lg} {\n        &:first-child {\n            margin-left: 0rem;\n        }\n    }\n`;\n\nexport const link = css`\n    display: flex;\n    position: relative;\n    align-items: center;\n    text-align: center;\n    color: ${ComponentToken.Navbar[\"link-colour-text\"]};\n    height: 100%;\n    gap: 0.5rem;\n\n    &:active,\n    &:hover,\n    &:focus,\n    &:focus-within {\n        color: ${ComponentToken.Navbar[\"link-colour-text-hover\"]};\n    }\n\n    ${MediaQuery.MaxWidth.lg} {\n        width: 100%;\n        padding: 0.5rem 1rem;\n        text-align: left;\n    }\n`;\n\nexport const linkSelected = css`\n    &:active,\n    &:hover,\n    &:focus {\n        color: ${ComponentToken.Navbar[\"link-colour-text-selected-hover\"]};\n    }\n`;\n\nexport const linkWeightRegular = css`\n    ${Font[\"body-md-regular\"]}\n`;\n\nexport const linkWeightSemibold = css`\n    ${Font[\"body-md-semibold\"]}\n`;\n\nexport const linkWeightBold = css`\n    ${Font[\"body-md-bold\"]}\n`;\n\nexport const linkButton = css`\n    background: none;\n    border: 0;\n    padding: 0;\n    cursor: pointer;\n    text-align: left;\n    margin: 0;\n    box-shadow: none;\n    font: inherit;\n    color: inherit;\n    gap: 8px;\n`;\n\nexport const linkLabel = css`\n    flex: 1;\n\n    overflow: hidden;\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: 3;\n    white-space: pre-wrap;\n`;\n\nexport const linkIndicator = css`\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 0.25rem;\n    background-color: ${Colour[\"border-selected\"]};\n\n    ${MediaQuery.MaxWidth.lg} {\n        left: 0;\n        right: unset;\n        top: 0;\n        bottom: 0;\n        height: 100%;\n        width: 0.25rem;\n    }\n`;\n\nexport const linkIndicatorSelected = css`\n    .${link}:active &,\n    .${link}:hover &,\n    .${link}:focus & {\n        background-color: ${Colour[\"border-selected-hover\"]};\n    }\n`;\n\nexport const linkIconContainer = css`\n    margin-right: -0.5rem;\n`;\n\nexport const expandCollapseButton = css`\n    padding: 0.5rem;\n    margin: auto 0.25rem auto 0;\n`;\n\nexport const chevronIcon = css`\n    height: 1.25rem;\n    width: 1.25rem;\n    color: ${Colour.icon};\n    transition: transform 300ms ease-in-out;\n    transform: rotate(180deg);\n\n    .${link}:active &,\n    .${link}:hover &,\n    .${link}:focus & {\n        color: ${Colour[\"icon-hover\"]};\n    }\n`;\n\nexport const chevronIconDesktop = css`\n    height: 1.125rem;\n    width: 1.125rem;\n`;\n\nexport const subMenuExpanded = css`\n    transform: rotate(0deg);\n`;\n\nexport const chevronIconSelected = css`\n    .${link}:active &,\n    .${link}:hover &,\n    .${link}:focus & {\n        color: ${Colour[\"icon-selected-hover\"]};\n    }\n`;\n"],"names":[],"mappings":"kGAqKwB,sCAcO,uCASC,wCA5BC,uBAhGhB,8BA2CM,qCAiDO,iCA1BJ,wCAkBQ,2BAhHb,0CAec,4BAqEb,+BAjCG,iCAgBE,qCARG,sCAIC,gCA7EL,kCAkKE,2BAhLR,oCAUS"}

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

@@ -0,0 +1,20 @@
+@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;}
+.lsn8o0d:first-child{margin-left:-0.5rem;}:where(body.fds-breakpoint-lg-max) .lsn8o0d:first-child{margin-left:0rem;}
+.l1o3p4yu{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:relative;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center;color:var(--fds-navbar-link-colour-text);height:100%;gap:0.5rem;}.l1o3p4yu:active,.l1o3p4yu:hover,.l1o3p4yu:focus,.l1o3p4yu:focus-within{color:var(--fds-navbar-link-colour-text-hover);}:where(body.fds-breakpoint-lg-max) .l1o3p4yu{width:100%;padding:0.5rem 1rem;text-align:left;}
+.lkwvsmx:active,.lkwvsmx:hover,.lkwvsmx:focus{color:var(--fds-navbar-link-colour-text-selected-hover);}
+.l1kp5n19{font-family:var(--fds-font-family-body);font-variant:var(--fds-font-variant);font-size:var(--fds-font-body-size-md);font-weight:var(--fds-font-weight-regular);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);}
+.lqgrg2a{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);}
+.l1p7dxu8{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-bold);line-height:var(--fds-font-body-lh-md);letter-spacing:var(--fds-font-body-ls-md);}
+.l1xfqf3s{background:none;border:0;padding:0;cursor:pointer;text-align:left;margin:0;box-shadow:none;font:inherit;color:inherit;gap:8px;}
+.lsc0hr8{-webkit-flex:1;-ms-flex:1;flex:1;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;white-space:pre-wrap;}
+.lnocj2s{position:absolute;bottom:0;left:0;right:0;height:0.25rem;background-color:var(--fds-colour-border-selected);}:where(body.fds-breakpoint-lg-max) .lnocj2s{left:0;right:unset;top:0;bottom:0;height:100%;width:0.25rem;}
+.l1o3p4yu:active .l5qfat1,.l1o3p4yu:hover .l5qfat1,.l1o3p4yu:focus .l5qfat1{background-color:var(--fds-colour-border-selected-hover);}
+.l1p9u80z{margin-right:-0.5rem;}
+.ej7h5do{padding:0.5rem;margin:auto 0.25rem auto 0;}
+.c160mxwv{height:1.25rem;width:1.25rem;color:var(--fds-colour-icon);-webkit-transition:-webkit-transform 300ms ease-in-out;transition:transform 300ms ease-in-out;-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg);}.l1o3p4yu:active .c160mxwv,.l1o3p4yu:hover .c160mxwv,.l1o3p4yu:focus .c160mxwv{color:var(--fds-colour-icon-hover);}
+.c1s8ur0k{height:1.125rem;width:1.125rem;}
+.s178e7hk{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}
+.l1o3p4yu:active .c1euxgs0,.l1o3p4yu:hover .c1euxgs0,.l1o3p4yu:focus .c1euxgs0{color:var(--fds-colour-icon-selected-hover);}}

package/cjs/navbar/navbar-logo-data.js

@@ -1,2 +1,2 @@
-"use strict";const e={primary:{brandName:"LifeSG",logoSrc:"https://assets.life.gov.sg/lifesg/logo-lifesg.svg"}},s={primary:{brandName:"BookingSG",logoSrc:"https://www.booking.gov.sg/logo.svg"}},o={primary:{brandName:"CCube",logoSrc:"https://assets.life.gov.sg/ccube/logo-ccube.svg"}},g={primary:{brandName:"IMDA",logoSrc:"https://assets.life.gov.sg/react-design-system/img/logo/imda-logo.svg"}},r={primary:{brandName:"MyLegacy",logoSrc:"https://mylegacy.life.gov.sg/images/site-logo.png"}},t={primary:{brandName:"SPF",logoSrc:"https://assets.life.gov.sg/react-design-system/img/logo/spf-logo.png"}},a={primary:{brandName:"SupportGoWhere",logoSrc:"https://assets.life.gov.sg/react-design-system/img/logo/sgw-logo.png"}},i={primary:{brandName:"ToteBoard",logoSrc:"https://assets.life.gov.sg/react-design-system/img/logo/tote-board-logo.svg"}};exports.getDefaultResourceLogo=l=>{switch(l){case"bookingsg":return s;case"mylegacy":return r;case"ccube":return o;case"spf":return t;case"supportgowhere":return a;case"imda":return g;case"toteboard":return i;default:return e}};
+"use strict";const e={primary:{brandName:"LifeSG",logoSrc:"https://assets.life.gov.sg/lifesg/logo-lifesg.svg"}},s={primary:{brandName:"BookingSG",logoSrc:"https://www.booking.gov.sg/logo.svg"}},o={primary:{brandName:"CCube",logoSrc:"https://assets.life.gov.sg/ccube/logo-ccube.svg"}},g={primary:{brandName:"IMDA",logoSrc:"https://assets.life.gov.sg/react-design-system/img/logo/imda-logo.svg"}},r={primary:{brandName:"MyLegacy",logoSrc:"https://mylegacy.life.gov.sg/images/site-logo.png"}},t={primary:{brandName:"SPF",logoSrc:"https://assets.life.gov.sg/react-design-system/img/logo/spf-logo.png"}},a={primary:{brandName:"SupportGoWhere",logoSrc:"https://assets.life.gov.sg/react-design-system/img/logo/sgw-logo.png"}},i={primary:{brandName:"Tote Board",logoSrc:"https://assets.life.gov.sg/react-design-system/img/logo/tote-board-logo.svg"}};exports.getDefaultResourceLogo=l=>{switch(l){case"bookingsg":return s;case"mylegacy":return r;case"ccube":return o;case"spf":return t;case"supportgowhere":case"sgw-digital-lobby":return a;case"imda":return g;case"tote-board":return i;default:return e}};
 //# sourceMappingURL=navbar-logo-data.js.map

package/cjs/navbar/navbar-logo-data.js.map

@@ -1 +1 @@
-{"version":3,"file":"navbar-logo-data.js","sources":["../../../src/navbar/navbar-logo-data.ts"],"sourcesContent":["import { ResourceScheme } from \"../theme/types\";\nimport { NavbarResourcesProps } from \"./types\";\n\nconst DEFAULT_RESOURCES_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"LifeSG\",\n        logoSrc: \"https://assets.life.gov.sg/lifesg/logo-lifesg.svg\",\n    },\n};\n\nconst BOOKINGSG_RESOURCES_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"BookingSG\",\n        logoSrc: \"https://www.booking.gov.sg/logo.svg\",\n    },\n};\n\nconst CCUBE_RESOURCES_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"CCube\",\n        logoSrc: \"https://assets.life.gov.sg/ccube/logo-ccube.svg\",\n    },\n};\n\nconst IMDA_RESOURCE_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"IMDA\",\n        logoSrc:\n            \"https://assets.life.gov.sg/react-design-system/img/logo/imda-logo.svg\",\n    },\n};\n\nconst MYLEGACY_RESOURCES_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"MyLegacy\",\n        logoSrc: \"https://mylegacy.life.gov.sg/images/site-logo.png\",\n    },\n};\n\nconst SPF_RESOURCE_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"SPF\",\n        logoSrc:\n            \"https://assets.life.gov.sg/react-design-system/img/logo/spf-logo.png\",\n    },\n};\n\nconst SUPPORTGOWHERE_RESOURCE_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"SupportGoWhere\",\n        logoSrc:\n            \"https://assets.life.gov.sg/react-design-system/img/logo/sgw-logo.png\",\n    },\n};\n\nconst TOTEBOARD_RESOURCE_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"ToteBoard\",\n        logoSrc:\n            \"https://assets.life.gov.sg/react-design-system/img/logo/tote-board-logo.svg\",\n    },\n};\n\nexport const getDefaultResourceLogo = (resourceScheme?: ResourceScheme) => {\n    switch (resourceScheme) {\n        case \"bookingsg\":\n            return BOOKINGSG_RESOURCES_LOGO;\n        case \"mylegacy\":\n            return MYLEGACY_RESOURCES_LOGO;\n        case \"ccube\":\n            return CCUBE_RESOURCES_LOGO;\n        case \"spf\":\n            return SPF_RESOURCE_LOGO;\n        case \"supportgowhere\":\n            return SUPPORTGOWHERE_RESOURCE_LOGO;\n        case \"imda\":\n            return IMDA_RESOURCE_LOGO;\n        case \"toteboard\":\n            return TOTEBOARD_RESOURCE_LOGO;\n        default:\n            return DEFAULT_RESOURCES_LOGO;\n    }\n};\n"],"names":["DEFAULT_RESOURCES_LOGO","primary","brandName","logoSrc","BOOKINGSG_RESOURCES_LOGO","CCUBE_RESOURCES_LOGO","IMDA_RESOURCE_LOGO","MYLEGACY_RESOURCES_LOGO","SPF_RESOURCE_LOGO","SUPPORTGOWHERE_RESOURCE_LOGO","TOTEBOARD_RESOURCE_LOGO","resourceScheme"],"mappings":"aAGA,MAAMA,EAA+C,CACjDC,QAAS,CACLC,UAAW,SACXC,QAAS,sDAIXC,EAAiD,CACnDH,QAAS,CACLC,UAAW,YACXC,QAAS,wCAIXE,EAA6C,CAC/CJ,QAAS,CACLC,UAAW,QACXC,QAAS,oDAIXG,EAA2C,CAC7CL,QAAS,CACLC,UAAW,OACXC,QACI,0EAINI,EAAgD,CAClDN,QAAS,CACLC,UAAW,WACXC,QAAS,sDAIXK,EAA0C,CAC5CP,QAAS,CACLC,UAAW,MACXC,QACI,yEAINM,EAAqD,CACvDR,QAAS,CACLC,UAAW,iBACXC,QACI,yEAINO,EAAgD,CAClDT,QAAS,CACLC,UAAW,YACXC,QACI,+GAI2BQ,IACnC,OAAQA,GACJ,IAAK,YACD,OAAOP,EACX,IAAK,WACD,OAAOG,EACX,IAAK,QACD,OAAOF,EACX,IAAK,MACD,OAAOG,EACX,IAAK,iBACD,OAAOC,EACX,IAAK,OACD,OAAOH,EACX,IAAK,YACD,OAAOI,EACX,QACI,OAAOV"}
+{"version":3,"file":"navbar-logo-data.js","sources":["../../../src/navbar/navbar-logo-data.ts"],"sourcesContent":["import type { ThemeType } from \"../theme/types\";\nimport type { NavbarResourcesProps } from \"./types\";\n\nconst DEFAULT_RESOURCES_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"LifeSG\",\n        logoSrc: \"https://assets.life.gov.sg/lifesg/logo-lifesg.svg\",\n    },\n};\n\nconst BOOKINGSG_RESOURCES_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"BookingSG\",\n        logoSrc: \"https://www.booking.gov.sg/logo.svg\",\n    },\n};\n\nconst CCUBE_RESOURCES_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"CCube\",\n        logoSrc: \"https://assets.life.gov.sg/ccube/logo-ccube.svg\",\n    },\n};\n\nconst IMDA_RESOURCE_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"IMDA\",\n        logoSrc:\n            \"https://assets.life.gov.sg/react-design-system/img/logo/imda-logo.svg\",\n    },\n};\n\nconst MYLEGACY_RESOURCES_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"MyLegacy\",\n        logoSrc: \"https://mylegacy.life.gov.sg/images/site-logo.png\",\n    },\n};\n\nconst SPF_RESOURCE_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"SPF\",\n        logoSrc:\n            \"https://assets.life.gov.sg/react-design-system/img/logo/spf-logo.png\",\n    },\n};\n\nconst SUPPORTGOWHERE_RESOURCE_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"SupportGoWhere\",\n        logoSrc:\n            \"https://assets.life.gov.sg/react-design-system/img/logo/sgw-logo.png\",\n    },\n};\n\nconst TOTEBOARD_RESOURCES_LOGO: NavbarResourcesProps = {\n    primary: {\n        brandName: \"Tote Board\",\n        logoSrc:\n            \"https://assets.life.gov.sg/react-design-system/img/logo/tote-board-logo.svg\",\n    },\n};\n\nexport const getDefaultResourceLogo = (resourceScheme?: ThemeType) => {\n    switch (resourceScheme) {\n        case \"bookingsg\":\n            return BOOKINGSG_RESOURCES_LOGO;\n        case \"mylegacy\":\n            return MYLEGACY_RESOURCES_LOGO;\n        case \"ccube\":\n            return CCUBE_RESOURCES_LOGO;\n        case \"spf\":\n            return SPF_RESOURCE_LOGO;\n        case \"supportgowhere\":\n        case \"sgw-digital-lobby\":\n            return SUPPORTGOWHERE_RESOURCE_LOGO;\n        case \"imda\":\n            return IMDA_RESOURCE_LOGO;\n        case \"tote-board\":\n            return TOTEBOARD_RESOURCES_LOGO;\n        default:\n            return DEFAULT_RESOURCES_LOGO;\n    }\n};\n"],"names":["DEFAULT_RESOURCES_LOGO","primary","brandName","logoSrc","BOOKINGSG_RESOURCES_LOGO","CCUBE_RESOURCES_LOGO","IMDA_RESOURCE_LOGO","MYLEGACY_RESOURCES_LOGO","SPF_RESOURCE_LOGO","SUPPORTGOWHERE_RESOURCE_LOGO","TOTEBOARD_RESOURCES_LOGO","resourceScheme"],"mappings":"aAGA,MAAMA,EAA+C,CACjDC,QAAS,CACLC,UAAW,SACXC,QAAS,sDAIXC,EAAiD,CACnDH,QAAS,CACLC,UAAW,YACXC,QAAS,wCAIXE,EAA6C,CAC/CJ,QAAS,CACLC,UAAW,QACXC,QAAS,oDAIXG,EAA2C,CAC7CL,QAAS,CACLC,UAAW,OACXC,QACI,0EAINI,EAAgD,CAClDN,QAAS,CACLC,UAAW,WACXC,QAAS,sDAIXK,EAA0C,CAC5CP,QAAS,CACLC,UAAW,MACXC,QACI,yEAINM,EAAqD,CACvDR,QAAS,CACLC,UAAW,iBACXC,QACI,yEAINO,EAAiD,CACnDT,QAAS,CACLC,UAAW,aACXC,QACI,+GAI2BQ,IACnC,OAAQA,GACJ,IAAK,YACD,OAAOP,EACX,IAAK,WACD,OAAOG,EACX,IAAK,QACD,OAAOF,EACX,IAAK,MACD,OAAOG,EACX,IAAK,iBACL,IAAK,oBACD,OAAOC,EACX,IAAK,OACD,OAAOH,EACX,IAAK,aACD,OAAOI,EACX,QACI,OAAOV"}