@hhgtech/hhg-components 1.29.87 → 1.29.89

package/build/{index-ddc36398.js → index-8a19ce1b.js}

@@ -1,51 +1,48 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-d6f7eba3.js');
+var tslib_es6 = require('./tslib.es6-f3c387c0.js');
 var React = require('react');
-var index$9 = require('./index-34ca22f2.js');
-var index$3 = require('./index-169bae02.js');
-var normalizeLink = require('./normalizeLink-8a458cb4.js');
-var routing = require('./routing-90dba95d.js');
-var dataTransform = require('./dataTransform-567bc0c2.js');
-var index$c = require('./index-4c15723a.js');
-var useTranslations = require('./useTranslations-6363932f.js');
+var index$7 = require('./index-6b7b4292.js');
+var index$2 = require('./index-648aac83.js');
+var normalizeLink = require('./normalizeLink-c1b2b407.js');
+var routing = require('./routing-7a9c8608.js');
+var dataTransform = require('./dataTransform-9ec385e3.js');
+var index$b = require('./index-526cee72.js');
+var useTranslations = require('./useTranslations-8a9fa84d.js');
 var throttle = require('lodash/throttle');
 var core = require('@mantine/core');
-var index$2 = require('./index-0450bf33.js');
+var index$4 = require('./index-4bf6b5da.js');
 require('@mantine/dates');
-require('./index-538200cd.js');
-var index$1 = require('./index-ddd1ae54.js');
-require('./useMantineLocale-8df90961.js');
-var index = require('./index-743255db.js');
-var index$6 = require('./index-b64c981f.js');
-require('./translationsContext-1fe0412c.js');
+require('./index-d471ff2d.js');
+var index$3 = require('./index-1a6a94cd.js');
+require('./useMantineLocale-cc272195.js');
+var index = require('./index-6b95442c.js');
+var index$a = require('./index-549b9e8c.js');
+require('./index.styles-9031f6d6.js');
+require('./translationsContext-cd046df4.js');
 var formatString = require('string-format');
 require('@mantine/hooks');
-var utils = require('./utils-03c7b063.js');
-require('./other-fcf0cbba.js');
-var constants = require('./constants-970e6cf6.js');
+var utils = require('./utils-ae9740c0.js');
+require('./other-eedaf6ca.js');
+var constants = require('./constants-f5c5e2ae.js');
 var styled = require('@emotion/styled');
-var core$1 = require('@hhgtech/icons/core');
+var navigationProfileButton = require('./index-5dcd87b7.js');
+var index$1 = require('./index-aad249ab.js');
+var togetherComponentGlobalContext = require('./utils-251b2841.js');
+var constantsDomainLocales = require('./constantsDomainLocales.js');
+var constants$1 = require('./constants-c3b9c9a9.js');
 var miscTheme = require('./miscTheme.js');
+var index$6 = require('./index-9151d357.js');
+var index$5 = require('./index-cc4ce0c4.js');
+var useIsInit = require('./useIsInit-e56642e4.js');
 var miscDefaultClassWrapper = require('./miscDefaultClassWrapper.js');
-var ChevronDown = require('./ChevronDown-89002c32.js');
-var react = require('@emotion/react');
-var index$5 = require('./index-418220e9.js');
-var index$4 = require('./index-477ad803.js');
-var Locale = require('./Locale-126bf6bd.js');
-var togetherComponentGlobalContext = require('./utils-87deb74b.js');
-var constantsDomainLocales = require('./constantsDomainLocales.js');
-var constants$1 = require('./constants-6b5e2780.js');
-var index$8 = require('./index-ffc38f11.js');
-var index$7 = require('./index-8a509409.js');
-var useIsInit = require('./useIsInit-3c23a980.js');
 var dayjs = require('dayjs');
 var relativeTime = require('dayjs/plugin/relativeTime');
-var index$a = require('./index-b502b7a7.js');
+var index$8 = require('./index-be262a50.js');
 var other = require('@hhgtech/icons/other');
-var index$b = require('./index-1fab78b5.js');
+var index$9 = require('./index-c6b0831a.js');
 var debounce = require('lodash/debounce');
-var core$2 = require('./core-bcde5ba8.js');
+var core$1 = require('./core-58a245c5.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -121,776 +118,14 @@ const DisplayWrapper = ({ forceDisplay, mediaQueryKey, children, className, styl
     return (React__default["default"].createElement(StyledDisplayWrapper, { lowerBound: forceDisplay ? 0 : lowerBoundValue, upperBound: forceDisplay ? 0 : upperBoundValue, className: className, style: style }, children));
 };
 
-const useCSSFocusPopupHelper = (configs) => {
-    const { allowBgScroll } = configs || {};
-    const ref = React.useRef();
-    return {
-        containerRef: ref,
-        onContainerFocus: () => {
-            if (!allowBgScroll)
-                document.documentElement.style.overflow = 'hidden';
-        },
-        onContainerBlur: () => {
-            if (!allowBgScroll)
-                document.documentElement.style.overflow = '';
-        },
-        onButtonMouseDown: (e) => {
-            // this close popup when click, run after REact init
-            if (ref.current &&
-                (document.activeElement === ref.current ||
-                    ref.current.contains(document.activeElement))) {
-                ref.current.blur();
-                document.activeElement.blur();
-                e.preventDefault();
-            }
-        },
-        onClose: () => {
-            if (ref.current &&
-                (document.activeElement === ref.current ||
-                    ref.current.contains(document.activeElement))) {
-                ref.current.blur();
-                document.activeElement.blur();
-            }
-        },
-    };
-};
-
-const StyledPopup$1 = miscDefaultClassWrapper.setDefaultClass(styled__default["default"].div `
-    position: absolute;
-    right: 0;
-    transition: all 0.5s ease-in-out;
-    overflow-y: auto;
-
-    &[data-open='true'] {
-      z-index: 200;
-      top: 120%;
-      opacity: 1;
-      visibility: visible;
-    }
-
-    &[data-open='false'] {
-      display: none;
-    }
-
-    .popup-content {
-      z-index: 111;
-      height: 100%;
-      border: 1px solid #0000001a;
-      border-radius: 16px;
-      border-top-left-radius: 0;
-      border-top-right-radius: 0;
-    }
-
-    /* min-height: 415px; */
-    ${utils.MediaQueries.mbUp} {
-      width: 320px;
-    }
-    ${utils.MediaQueries.mbDown} {
-      position: fixed;
-      left: 0;
-      width: 100%;
-      padding-bottom: 70px;
-    }
-  `, 'hhgcomp-navprofilebutton-popup');
-const StyledPopupWrapper = miscDefaultClassWrapper.setDefaultClass(styled__default["default"].div `
-    position: fixed;
-    z-index: 150;
-    top: var(--header-bottom, 56px);
-    left: 0;
-    width: 100%;
-    height: 100%;
-    align-items: center;
-
-    ${utils.MediaQueries.mbUp} {
-      background-color: transparent;
-      &[data-type='welcome'] {
-        background: rgba(38, 38, 38, 0.3);
-      }
-      &[data-type='due-date'] {
-        background: rgba(38, 38, 38, 0.3);
-      }
-    }
-
-    ${utils.MediaQueries.mbDown} {
-      background: rgba(38, 38, 38, 0.3);
-    }
-
-    &[data-type='welcome'] {
-      top: 0;
-    }
-
-    &[data-open='false'] {
-      display: none;
-    }
-  `, 'hhgcomp-navprofilebutton-popupwrapper');
-const StyledAvatar = styled__default["default"].div `
-  width: 36px;
-  height: 36px;
-  cursor: pointer;
-
-  img {
-    border-radius: 50%;
-  }
-
-  .avatar {
-    width: 36px;
-    height: 36px;
-    object-fit: cover;
-  }
-
-  .avatar-default {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background-color: ${miscTheme.theme.colors.secondaryBase};
-    border-radius: 50%;
-    color: white;
-    font-size: 20px;
-    font-weight: bold;
-  }
-`;
-const StyledImageWrapper$1 = styled__default["default"].div `
-  display: inline-flex;
-  position: relative;
-  width: 36px;
-  height: 36px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  text-decoration: none;
-  flex-shrink: 0;
-  cursor: pointer;
-
-  .user-close-icon {
-    display: none;
-  }
-  &:focus-within {
-    .user-close-icon {
-      display: block;
-    }
-    .user-avatar {
-      display: none;
-    }
-    ${StyledPopup$1.classSelector} {
-      z-index: 200;
-      top: 120%;
-      opacity: 1;
-      visibility: visible;
-      display: initial;
-      ${utils.MediaQueries.mbDown} {
-        top: 100%;
-      }
-    }
-    ${StyledPopupWrapper.classSelector} {
-      display: initial;
-    }
-  }
-`;
-const StyledLoggedOutAnchor = styled__default["default"].a `
-  display: inline-flex;
-  .login-btn[data-color='tertiary'][data-size='md'] {
-    padding-left: 12px;
-    padding-right: 12px;
-  }
-  .mobile-only {
-    ${utils.MediaQueries.mbUp} {
-      display: none;
-    }
-  }
-  .login-btn {
-    display: none;
-    ${utils.MediaQueries.mbUp} {
-      display: block;
-    }
-  }
-`;
-
-const NavBookingIcon = (props) => (React__default["default"].createElement("svg", Object.assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
-    React__default["default"].createElement("path", { d: "M2.5 6.5a3.2 3.2 0 0 1 3.2-3.2h7.9a3.2 3.2 0 0 1 3.19 3.2v4.72a3.2 3.2 0 0 1-3.2 3.2H5.7a3.2 3.2 0 0 1-3.19-3.2V6.49Z", fill: "#E3F2FF" }),
-    React__default["default"].createElement("path", { d: "M2.5 5.68A2.38 2.38 0 0 1 4.88 3.3h9.52a2.38 2.38 0 0 1 2.39 2.38z", fill: "#2D87F3" }),
-    React__default["default"].createElement("path", { d: "M13.6 2.5h-.03c-.36 0-.65.3-.65.65V4.2c0 .36.3.65.65.65h.03c.36 0 .65-.3.65-.65V3.15a.65.65 0 0 0-.65-.65M5.27 4.86h.03c.36 0 .65-.3.65-.65V3.15a.65.65 0 0 0-.65-.65h-.03c-.36 0-.65.3-.65.65V4.2c0 .36.3.65.65.65Z", fill: "#2743AD" }),
-    React__default["default"].createElement("path", { d: "M5.56 8.17h-.5a.4.4 0 0 0-.4.4v.59c0 .22.18.4.4.4h.5a.4.4 0 0 0 .4-.4v-.58a.4.4 0 0 0-.4-.41m2.7 0h-.5a.4.4 0 0 0-.4.4v.59c0 .22.18.4.4.4h.5a.4.4 0 0 0 .4-.4v-.58a.4.4 0 0 0-.4-.41m2.7 0h-.5a.4.4 0 0 0-.4.4v.59c0 .22.18.4.4.4h.5a.4.4 0 0 0 .4-.4v-.58a.4.4 0 0 0-.4-.41m2.87 0h-.49a.4.4 0 0 0-.4.4v.59c0 .22.18.4.4.4h.49a.4.4 0 0 0 .4-.4v-.58a.4.4 0 0 0-.4-.41m-8.3 2.52h-.5a.4.4 0 0 0-.4.4v.58c0 .23.18.4.4.4h.5a.4.4 0 0 0 .4-.4v-.58a.4.4 0 0 0-.4-.4m2.7 0h-.5a.4.4 0 0 0-.4.4v.58c0 .23.18.4.4.4h.5a.4.4 0 0 0 .4-.4v-.58a.4.4 0 0 0-.4-.4m2.7 0h-.49a.4.4 0 0 0-.4.4v.58c0 .23.18.4.4.4h.5a.4.4 0 0 0 .4-.4v-.58a.4.4 0 0 0-.4-.4Zm2.87 0h-.49a.4.4 0 0 0-.4.4v.58c0 .23.18.4.4.4h.5a.4.4 0 0 0 .4-.4v-.58a.4.4 0 0 0-.4-.4Z", fill: "#2D87F3" }),
-    React__default["default"].createElement("path", { d: "M16 16.8a3.17 3.17 0 1 0 0-6.36 3.17 3.17 0 0 0 0 6.35Z", fill: "#FE921D" }),
-    React__default["default"].createElement("path", { d: "M15.78 13.62v-1.36a.21.21 0 0 1 .42 0v1.26l.48.4a.21.21 0 0 1-.01.33.21.21 0 0 1-.26-.01l-.55-.46-.02-.01a.2.2 0 0 1-.06-.15", fill: "#fff" })));
-
-const NavCommunityIcon = (props) => (React__default["default"].createElement("svg", Object.assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
-    React__default["default"].createElement("path", { d: "M7.06 4.97h-2.3a3.12 3.12 0 0 0-3.1 3.1v.43a3.12 3.12 0 0 0 3.1 3.1h1.39s1.47 1.11 1.5.97c.03-.22-.23-.99-.23-.99a3.13 3.13 0 0 0 2.72-3.09v-.41a3.12 3.12 0 0 0-3.08-3.11m-2.7 3.55a.23.23 0 1 1 0-.46.23.23 0 0 1 0 .46m1.35.4a.33.33 0 1 1 0-.66.33.33 0 0 1 0 .65Zm1.57-.05", fill: "#2D87F3" }),
-    React__default["default"].createElement("path", { d: "M12.88 9.52a3.53 3.53 0 0 0-1.35 6.8s-.23 1.03-.2 1.25c.03.14 1.55-.99 1.55-.99a3.53 3.53 0 0 0 0-7.06m-1.33 4.24a.48.48 0 1 1 0-.97.48.48 0 0 1 0 .97m1.58.04a.33.33 0 1 1 0-.66.33.33 0 0 1 0 .66m1.34-.39a.23.23 0 1 1 0-.46.23.23 0 0 1 0 .46", fill: "#FFB521" }),
-    React__default["default"].createElement("path", { d: "M16.45 1.67h-3.87a1.88 1.88 0 0 0-1.88 2.06l.22 2.29a1.88 1.88 0 0 0 1.73 1.7s-.17.94-.14 1.16c.02.14 1.66-1.13 1.66-1.13l1.92-.03a1.88 1.88 0 0 0 1.86-1.59l.36-2.29a1.88 1.88 0 0 0-1.86-2.17M13.1 5.23a.48.48 0 1 1 .34-.14c-.1.1-.22.14-.34.14m1.57.05a.33.33 0 1 1 .23-.1.33.33 0 0 1-.23.1m1.34-.4a.23.23 0 1 1 .1-.01.2.2 0 0 1-.1.02Z", fill: "#91CAFF" })));
-
-const NavDotIcon = (props) => (React__default["default"].createElement("svg", Object.assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
-    React__default["default"].createElement("rect", { x: "8.333", y: "8.333", width: "3.333", height: "3.333", rx: "1.667", fill: "#2D87F3" })));
-
-const NavEshopIcon = (props) => (React__default["default"].createElement("svg", Object.assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
-    React__default["default"].createElement("path", { d: "m3.18 7.06 1.6 1.6 4.33-4.69a.72.72 0 0 0-.03-.99l-.22-.22a.72.72 0 0 0-.99-.02zm13.64 0-1.6 1.6-4.33-4.69a.72.72 0 0 1 .02-.99l.23-.22a.72.72 0 0 1 .99-.02z", fill: "#2743AD" }),
-    React__default["default"].createElement("path", { d: "M15.04 16.7H4.9a.78.78 0 0 1-.77-.7l-.7-6.67h13.09l-.7 6.67a.78.78 0 0 1-.78.7", fill: "#2D87F3" }),
-    React__default["default"].createElement("path", { d: "M6.23 15.7a.23.23 0 0 1-.23-.22l-.3-4.46a.23.23 0 1 1 .47-.04l.3 4.47a.23.23 0 0 1-.22.25zm2.39 0a.23.23 0 0 1-.23-.23L8.3 11a.23.23 0 1 1 .47 0l.07 4.46a.23.23 0 0 1-.22.24h-.01Zm5.15 0h-.02a.23.23 0 0 1-.2-.16.2.2 0 0 1-.02-.09l.3-4.47a.24.24 0 0 1 .25-.22.23.23 0 0 1 .22.26l-.3 4.46a.23.23 0 0 1-.23.22m-2.39 0a.23.23 0 0 1-.23-.23l.07-4.47a.24.24 0 0 1 .24-.23.23.23 0 0 1 .23.23l-.08 4.47a.23.23 0 0 1-.23.23", fill: "#2743AD" }),
-    React__default["default"].createElement("path", { d: "M16.04 18.12a2.01 2.01 0 1 0 0-4.03 2.01 2.01 0 0 0 0 4.03", fill: "#FE921D" }),
-    React__default["default"].createElement("path", { d: "M16.97 15.87h-.7v-.7a.23.23 0 0 0-.46 0v.7h-.7a.23.23 0 1 0 0 .47h.7v.69a.23.23 0 1 0 .47 0v-.7h.69a.23.23 0 1 0 0-.46", fill: "#fff" }),
-    React__default["default"].createElement("path", { d: "M16.58 9.48H3.42a.8.8 0 0 1-.78-.7l-.13-1.1a.8.8 0 0 1 .78-.88h13.42a.8.8 0 0 1 .78.88l-.13 1.1a.8.8 0 0 1-.78.7", fill: "#BCDEFF" })));
-
-const NavHelpIcon = (props) => (React__default["default"].createElement("svg", Object.assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
-    React__default["default"].createElement("path", { d: "M10 1.667c-4.595 0-8.333 3.738-8.333 8.333 0 4.595 3.738 8.333 8.333 8.333 4.595 0 8.333-3.738 8.333-8.333 0-4.595-3.738-8.333-8.333-8.333Zm0 13.194a.695.695 0 1 1 0-1.39.695.695 0 0 1 0 1.39Zm1.1-4.415a.698.698 0 0 0-.405.631v.312a.694.694 0 1 1-1.39 0v-.312c0-.81.477-1.553 1.213-1.893.707-.326 1.218-1.19 1.218-1.615 0-.956-.778-1.736-1.736-1.736s-1.736.78-1.736 1.736a.694.694 0 1 1-1.389 0A3.129 3.129 0 0 1 10 4.444a3.129 3.129 0 0 1 3.125 3.125c0 .939-.814 2.318-2.026 2.877Z", fill: "#FF6F4D" })));
-
-const NavLogOutIcon = (props) => (React__default["default"].createElement("svg", Object.assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
-    React__default["default"].createElement("path", { d: "M11.116 1.72 5.488.85a1.898 1.898 0 0 0-2.155 1.856v14.588a1.898 1.898 0 0 0 2.158 1.855l5.625-.869a1.865 1.865 0 0 0 1.592-1.855V3.575a1.87 1.87 0 0 0-1.592-1.855", fill: "#2D87F3" }),
-    React__default["default"].createElement("path", { d: "M17.642 9.584a.6.6 0 0 1-.232.472l-1.964 1.518a.446.446 0 0 1-.719-.353v-.51l-2.118-.01a.225.225 0 0 1-.223-.225v-1.8a.225.225 0 0 1 .224-.225l2.12.002-.004-.506a.446.446 0 0 1 .719-.354l1.965 1.52a.6.6 0 0 1 .232.471", fill: "#FF6F4D" }),
-    React__default["default"].createElement("path", { d: "M17.642 9.584a.6.6 0 0 1-.232.472l-1.964 1.518a.446.446 0 0 1-.719-.353v-.51l-2.118-.01a.225.225 0 0 1-.223-.225v-1.8a.225.225 0 0 1 .224-.225l2.12.002-.004-.506a.446.446 0 0 1 .719-.354l1.965 1.52a.6.6 0 0 1 .232.471m-7.603-.908v1.802c0 .124.1.225.224.225h1.257c.124 0 .225-.1.225-.225V8.676c0-.124-.1-.224-.225-.224h-1.257c-.124 0-.224.1-.224.224m-.673 1.809a.224.224 0 0 1-.225.225h-.407a.61.61 0 0 1-.609-.61V9.069a.61.61 0 0 1 .61-.61h.406a.224.224 0 0 1 .225.225z", fill: "#FF6F4D" })));
-
-const NavMyHealthIcon = (props) => (React__default["default"].createElement("svg", Object.assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
-    React__default["default"].createElement("path", { d: "M6.114 3.333a4.64 4.64 0 0 1 3.565 1.708.412.412 0 0 0 .642 0 4.64 4.64 0 0 1 3.565-1.708c2.646 0 4.447 2.302 4.447 5.142 0 1.698-.904 4.446-2.675 6.102-2.522 2.358-4.665 2.965-5.392 3.11a1.3 1.3 0 0 1-.53 0c-.728-.146-2.871-.752-5.393-3.11-1.772-1.656-2.676-4.404-2.676-6.102 0-2.84 1.801-5.142 4.447-5.142", fill: "#FF6F4D" }),
-    React__default["default"].createElement("path", { d: "M13.298 11.226v-.829a1.205 1.205 0 0 0-1.202-1.204h-.208a.26.26 0 0 1-.261-.259v-.208a1.205 1.205 0 0 0-1.201-1.204h-.832A1.205 1.205 0 0 0 8.39 8.726v.205a.26.26 0 0 1-.259.261h-.207a1.2 1.2 0 0 0-1.202 1.202v.834a1.204 1.204 0 0 0 1.202 1.201h.207a.26.26 0 0 1 .259.262v.205A1.205 1.205 0 0 0 9.594 14.1h.832a1.204 1.204 0 0 0 1.201-1.204v-.208a.26.26 0 0 1 .261-.258h.208a1.205 1.205 0 0 0 1.202-1.204", fill: "#fff" })));
-
-const NavSaveIcon = (props) => (React__default["default"].createElement("svg", Object.assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
-    React__default["default"].createElement("path", { d: "M4.767 17.236a1.36 1.36 0 0 0 1.256.188l4.097-1.397a.37.37 0 0 1 .28 0l4.097 1.397q.22.071.45.075c.29.002.573-.09.807-.263a1.43 1.43 0 0 0 .6-1.171V3.935A1.417 1.417 0 0 0 14.946 2.5H5.573a1.416 1.416 0 0 0-1.406 1.434v12.13a1.43 1.43 0 0 0 .6 1.172", fill: "#00CB8A" })));
-
-const NavSettingsIcon = (props) => (React__default["default"].createElement("svg", Object.assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
-    React__default["default"].createElement("path", { d: "M17.339 8.075a2.177 2.177 0 0 1-1.717-2.944 1.02 1.02 0 0 0-.305-1.15 8.2 8.2 0 0 0-2.445-1.417 1.03 1.03 0 0 0-1.16.323 2.173 2.173 0 0 1-3.423 0 1.03 1.03 0 0 0-1.161-.323A8.2 8.2 0 0 0 4.85 3.842a1.03 1.03 0 0 0-.322 1.183 2.167 2.167 0 0 1-1.806 2.978 1.03 1.03 0 0 0-.9.828 8 8 0 0 0-.05 2.861 1.03 1.03 0 0 0 .906.861 2.166 2.166 0 0 1 1.767 3.061 1.01 1.01 0 0 0 .283 1.211A8.2 8.2 0 0 0 7.15 18.22q.17.059.35.061a1.02 1.02 0 0 0 .833-.433 2.15 2.15 0 0 1 1.778-.934 2.18 2.18 0 0 1 1.745.878 1.02 1.02 0 0 0 1.2.339 8.3 8.3 0 0 0 2.222-1.328 1.03 1.03 0 0 0 .3-1.172 2.167 2.167 0 0 1 1.739-2.995 1.03 1.03 0 0 0 .872-.844 8 8 0 0 0 .144-1.405q0-.749-.138-1.484a1.02 1.02 0 0 0-.856-.828m-4.561 2.312a2.778 2.778 0 1 1-5.556 0 2.778 2.778 0 0 1 5.556 0", fill: "#2D87F3" })));
-
-const NavUserIcon = (props) => (React__default["default"].createElement("svg", Object.assign({ width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, props),
-    React__default["default"].createElement("path", { d: "M10 19.167A9.167 9.167 0 1 0 10 .833a9.167 9.167 0 0 0 0 18.334", fill: "#BCDEFF" }),
-    React__default["default"].createElement("path", { d: "M17.356 15.463a9.188 9.188 0 0 0-14.716-.005 9.155 9.155 0 0 0 14.716.005", fill: "#2D87F3" }),
-    React__default["default"].createElement("path", { d: "M10 10.591a3.548 3.548 0 1 0 0-7.096 3.548 3.548 0 0 0 0 7.096", fill: "#2D87F3" })));
-
-const StyledNavMenu = styled__default["default"].div `
-  padding: 16px;
-  border-radius: 16px;
-  background-color: white;
-  hr {
-    border-color: ${miscTheme.theme.colors.neutral100};
-    border-bottom-width: 0px;
-    border-style: solid;
-  }
-  .profile-nav-item-group {
-    background-color: white;
-    border-radius: 8px;
-  }
-`;
-const StyledNavMenuItem = styled__default["default"].div `
-  display: block;
-  border: 1px solid transparent;
-  transition: all 300ms linear;
-  cursor: pointer;
-  position: relative;
-
-  ${(props) => props.hasSubmenu &&
-    react.css `
-      cursor: pointer;
-    `}
-
-  &[data-is-open='true'] {
-    & + div {
-      margin-top: 8px;
-    }
-  }
-
-  border-left-width: 0;
-  border-right-width: 0;
-  &[data-is-open='true'] {
-    & + div {
-      margin-top: 0;
-    }
-    .nav-menu-item:last-child {
-      border-bottom-color: ${miscTheme.theme.colors.neutral100};
-    }
-  }
-  .nav-menu-item {
-    background-color: ${miscTheme.theme.colors.neutral50};
-  }
-
-  .nav-menu-item {
-    padding-left: 38px;
-  }
-`;
-const StyledNavMenuItemContent = styled__default["default"].div `
-  display: flex;
-  align-items: center;
-  height: 48px;
-  border: 1px solid transparent;
-  transition: all 300ms;
-  border-radius: 8px;
-
-  &:hover {
-    background-color: ${miscTheme.theme.colors.neutral150};
-  }
-  &[data-active='true'] {
-    background-color: ${miscTheme.theme.colors.blue50};
-  }
-`;
-const StyledNavMenuItemDropdown = styled__default["default"].div `
-  margin-left: auto;
-
-  svg {
-    fill: ${miscTheme.theme.colors.gray600};
-    transition: transform 300ms;
-  }
-
-  &[data-is-open='true'] svg {
-    transform: rotate(180deg);
-  }
-`;
-const StyledNavFooterSubMenu = styled__default["default"].div `
-  overflow: hidden;
-  max-height: 0;
-  transition: max-height 0.3s ease-out;
-
-  [data-is-open='true'] & {
-    max-height: 500px;
-    transition-timing-function: ease-in;
-  }
-`;
-
-const rankIconUrlMap = {
-    helloSites: {
-        member: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-member.svg'),
-        ambassador: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-ambassador.svg'),
-        doctor: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-doctor.svg'),
-        expert: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-expert.svg'),
-        influencer: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-influencer.svg'),
-    },
-    marryBaby: {
-        member: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-member.svg'),
-        ambassador: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-ambassador.svg'),
-        doctor: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-doctor.svg'),
-        expert: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-expert.svg'),
-        influencer: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-influencer.svg'),
-    },
-};
-const Rank = ({ rank, siteType = 'helloSites', }) => {
-    const iconUrl = React.useMemo(() => {
-        var _a, _b;
-        return ((_b = (_a = rankIconUrlMap[siteType]) === null || _a === void 0 ? void 0 : _a[rank]) === null || _b === void 0 ? void 0 : _b.call(_a)) || '';
-    }, [rank, siteType]);
-    const { t } = useTranslations.useTranslations();
-    return (React__default["default"].createElement("div", { style: {
-            display: 'inline-flex',
-            height: 'fit-content',
-            alignItems: 'center',
-            padding: '5px 12px',
-            gap: '4px',
-            borderRadius: 16,
-            border: `1px solid ${siteType === 'helloSites' ? miscTheme.theme.colors.blue100 : miscTheme.theme.colors.mb100}`,
-        } },
-        React__default["default"].createElement("img", { src: iconUrl, alt: rank, style: {
-                height: 16,
-                width: 16,
-            } }),
-        React__default["default"].createElement(index.Text, { size: "s5", color: "gray.8", weight: "semiBold" }, t(`userProfile.userRank.${rank}`))));
-};
-
-const UserInfoSection = ({ siteType = 'helloSites', userInfo, }) => {
-    return (userInfo === null || userInfo === void 0 ? void 0 : userInfo.id) ? (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].createElement("div", { style: {
-                display: 'flex',
-                width: '100%',
-                justifyContent: 'space-between',
-            } },
-            React__default["default"].createElement(index$2.Avatar, { src: userInfo.avatar, alt: userInfo.name, size: 48, style: { marginBottom: 8 } }),
-            React__default["default"].createElement(Rank, { rank: "member", siteType: siteType })),
-        React__default["default"].createElement(index.Text, { size: "s3", weight: "semiBold", color: "gray.8", style: { marginBottom: 4 } }, userInfo.name),
-        React__default["default"].createElement(index.Text, { size: "n1", weight: "regular", color: siteType === 'helloSites' ? 'hb.6' : 'mb.6' },
-            "@",
-            userInfo.username),
-        React__default["default"].createElement("hr", null))) : null;
-};
-
-const ProfileNavigation = ({ className, activeItem: forceActiveItem, navMenuItems: navMenuItemsProp, style, onLogout, siteType = 'helloSites', userInfo, }) => {
-    const { locale } = useTranslations.useTranslations();
-    const [localActiveItem, setLocalActiveItem] = React.useState();
-    const activeItem = typeof forceActiveItem === 'string' ? forceActiveItem : localActiveItem;
-    const SSO_URL = normalizeLink.normalizeLinkSlash(routing.getCurrentSsoUrl(locale, siteType === 'marryBaby') + '/');
-    const BASE_URL = normalizeLink.normalizeLinkSlash(routing.getCurrentBaseUrl(locale, siteType === 'marryBaby') + '/');
-    const navMenuItems = navMenuItemsProp || [
-        [
-            {
-                key: 'userProfile.nav.header.viewProfile',
-                icon: React__default["default"].createElement(NavUserIcon, { width: "24", height: "24" }),
-                value: 'profile',
-                tracking: {
-                    action: 'Profile Click',
-                },
-                link: `${SSO_URL}user/profile/`,
-            },
-            {
-                key: 'userProfile.nav.card.myHealth',
-                icon: React__default["default"].createElement(NavMyHealthIcon, { width: "24", height: "24" }),
-                value: 'myHealth',
-                tracking: {
-                    action: 'My Health Click',
-                },
-                link: `${SSO_URL}user/health/`,
-            },
-            {
-                key: 'userProfile.nav.card.mySaved',
-                icon: React__default["default"].createElement(NavSaveIcon, { width: "24", height: "24" }),
-                iconColor: 'green_300',
-                value: 'saved',
-                tracking: {
-                    action: 'Bookmarks Click',
-                },
-                link: `${SSO_URL}user/saved/`,
-            },
-            {
-                key: 'userProfile.nav.card.myBooking',
-                icon: React__default["default"].createElement(NavBookingIcon, { width: "24", height: "24" }),
-                value: 'booking',
-                disabled: !index$3.CARE_LOCALES.includes(locale),
-                tracking: {
-                    action: 'Manage Booking Click',
-                },
-                link: `${SSO_URL}user/booking/`,
-            },
-            {
-                key: 'userProfile.nav.card.myCommunity',
-                icon: React__default["default"].createElement(NavCommunityIcon, { width: "24", height: "24" }),
-                value: 'myCommunities',
-                disabled: !index$3.TOGETHER_LOCALES.includes(locale),
-                tracking: {
-                    action: 'Community Click',
-                },
-                link: `${SSO_URL}user/my-communities/`,
-            },
-        ],
-        ...(index$3.ECOM_LOCALES.includes(locale)
-            ? [
-                [
-                    {
-                        key: 'userProfile.nav.card.eCom',
-                        icon: React__default["default"].createElement(NavEshopIcon, { width: "24", height: "24" }),
-                        value: 'eCom',
-                        disabled: !index$3.ECOM_LOCALES.includes(locale),
-                        subMenu: [
-                            {
-                                key: 'userProfile.nav.card.ecom.manageOrders',
-                                value: 'eCom-manageOrders',
-                                icon: React__default["default"].createElement(NavDotIcon, { width: "24", height: "24" }),
-                                link: `${BASE_URL}shop/ho-so/quan-li-don-hang/`,
-                                tracking: {
-                                    action: 'Order Management Click',
-                                },
-                            },
-                            {
-                                key: 'userProfile.nav.card.ecom.DeliveryAddress',
-                                value: 'eCom-manageAddress',
-                                icon: React__default["default"].createElement(NavDotIcon, { width: "24", height: "24" }),
-                                link: `${BASE_URL}shop/ho-so/dia-chi-giao-hang/`,
-                                tracking: {
-                                    action: 'Address Management Click',
-                                },
-                            },
-                            {
-                                key: 'userProfile.nav.card.ecom.voucher',
-                                value: 'eCom-voucher',
-                                icon: React__default["default"].createElement(NavDotIcon, { width: "24", height: "24" }),
-                                link: `${BASE_URL}shop/ho-so/khuyen-mai/`,
-                                tracking: {
-                                    action: 'Voucher Click',
-                                },
-                            },
-                            // {
-                            //   key: 'nav.card.memberCard',
-                            //   value: 'eCom-memberCard',
-                            //   icon: <NavDotIcon   width="24"
-                            // height="24"/>,
-                            //   link: routingHandler
-                            //     .getLocalisedUrl('', 'PROFILE_MEMBER_CARD')
-                            //     .toString(),
-                            //   tracking: {
-                            //     action: 'Member Card Click',
-                            //   },
-                            // },
-                        ],
-                    },
-                ],
-            ]
-            : []),
-        [
-            {
-                key: 'userProfile.nav.menu.accountSettings',
-                icon: React__default["default"].createElement(NavSettingsIcon, { width: "24", height: "24" }),
-                subMenu: [
-                    // {
-                    //   key: 'common.profileNavigator.newsletterSubscription',
-                    //   value: 'subscription',
-                    //   icon: <NavDotIcon width="24" height="24" />,
-                    //   tracking: { action: 'Subscription Click' },
-                    //   link: `${SSO_URL}user/subscriptions/`,
-                    //   disabled: locale !== 'vi-VN',
-                    // },
-                    {
-                        key: 'userProfile.nav.menu.password',
-                        value: 'password',
-                        icon: React__default["default"].createElement(NavDotIcon, { width: "24", height: "24" }),
-                        tracking: { action: 'Set Password Click' },
-                        link: `${SSO_URL}user/password/`,
-                    },
-                    {
-                        key: 'userProfile.nav.menu.disableAccount',
-                        value: 'disable-account',
-                        icon: React__default["default"].createElement(NavDotIcon, { width: "24", height: "24" }),
-                        tracking: { action: 'Disable Account Click' },
-                        link: `${SSO_URL}user/disable-account/`,
-                    },
-                ],
-            },
-        ],
-        [
-            {
-                key: 'userProfile.nav.menu.help',
-                icon: React__default["default"].createElement(NavHelpIcon, { width: "24", height: "24" }),
-                value: 'help',
-                link: `${SSO_URL}user/help`,
-                tracking: {
-                    action: 'Support Click',
-                },
-            },
-            {
-                key: 'userProfile.nav.menu.logout',
-                icon: React__default["default"].createElement(NavLogOutIcon, { width: "24", height: "24" }),
-                value: 'logout',
-                tracking: {
-                    action: 'Sign Out Click',
-                },
-            },
-        ],
-    ];
-    return (React__default["default"].createElement(StyledNavMenu, { className: className, style: style },
-        React__default["default"].createElement(UserInfoSection, { userInfo: userInfo, siteType: siteType }),
-        navMenuItems.map((items, index) => (React__default["default"].createElement(React.Fragment, { key: index },
-            React__default["default"].createElement("div", { className: "profile-nav-item-group", key: index }, items.map((item) => (React__default["default"].createElement(NavMenuItem, { key: item.key, item: item, activeKey: activeItem || '', onLogout: onLogout, onClick: () => setLocalActiveItem((k) => k === item.key ? undefined : item.key), siteType: siteType })))),
-            index !== navMenuItems.length - 1 && React__default["default"].createElement("hr", null))))));
-};
-const NavMenuItem = ({ item, activeKey, forceOpen, onLogout, onClick, siteType = 'helloSites', }) => {
-    var _a, _b;
-    const [localOpen, setLocalOpen] = React.useState(false);
-    const currentUrl = React.useMemo(() => {
-        if (typeof window !== 'undefined') {
-            return window.location.href;
-        }
-        else
-            return '';
-    }, []);
-    if (item.disabled) {
-        return null;
-    }
-    const { t } = useTranslations.useTranslations();
-    const hasChildActive = (_a = item.subMenu) === null || _a === void 0 ? void 0 : _a.some((subItem) => subItem.key === activeKey);
-    const isActive = activeKey === item.key;
-    React.useEffect(() => {
-        if (hasChildActive || isActive) {
-            setLocalOpen(true);
-        }
-    }, [hasChildActive, isActive]);
-    const isOpen = typeof forceOpen === 'boolean' ? forceOpen : localOpen;
-    return (React__default["default"].createElement(StyledNavMenuItem, { as: !item.subMenu ? 'a' : undefined, "data-is-open": isOpen, key: item.key, hasSubmenu: !!item.subMenu, onClick: () => {
-            onClick === null || onClick === void 0 ? void 0 : onClick();
-            if (item.subMenu && !forceOpen) {
-                setLocalOpen((k) => !k);
-            }
-            else {
-                if (item.value === 'logout') {
-                    onLogout === null || onLogout === void 0 ? void 0 : onLogout();
-                }
-                else if (item.link) {
-                    window.location.href = item.link;
-                }
-            }
-        }, "data-event-category": "Ecommerce", "data-event-action": ((_b = item === null || item === void 0 ? void 0 : item.tracking) === null || _b === void 0 ? void 0 : _b.action) || '', "data-event-label": currentUrl },
-        React__default["default"].createElement(StyledNavMenuItemContent, { "data-active": isActive },
-            item.icon,
-            React__default["default"].createElement(index.Text, { size: "p3", style: {
-                    marginLeft: item.icon ? 24 : 48,
-                    transition: `color 300ms`,
-                }, color: isActive ? (siteType === 'helloSites' ? 'hb.6' : 'mb.6') : 'gray.8' }, t(item.key)),
-            item.subMenu && (React__default["default"].createElement(StyledNavMenuItemDropdown, { "data-is-open": isOpen },
-                React__default["default"].createElement(ChevronDown.ChevronDown, { width: 14 })))),
-        item.subMenu && (React__default["default"].createElement(StyledNavFooterSubMenu, null, item.subMenu.map((subItem) => (React__default["default"].createElement(NavMenuItem, { key: subItem.key, item: subItem, activeKey: activeKey, onLogout: onLogout, siteType: siteType })))))));
-};
-
-const ProfilePopup = ({ isOpen, userInfo, closePopup, siteType = 'helloSites', dispatchLogout, }) => {
-    const handleClickLogout = () => {
-        if (dispatchLogout) {
-            dispatchLogout();
-            closePopup();
-        }
-    };
-    return (React__default["default"].createElement(StyledPopup$1, { "data-open": isOpen },
-        React__default["default"].createElement("div", { className: "popup-content" },
-            React__default["default"].createElement(ProfileNavigation, { siteType: siteType, onLogout: handleClickLogout, userInfo: userInfo }))));
-};
-
-const StyledPopup = styled__default["default"].div `
-  background-color: white;
-  text-align: center;
-  .cancle-img {
-    margin-top: 24px;
-    ${utils.MediaQueries.mbDown} {
-      width: 80px;
-      height: 80px;
-    }
-
-    ${utils.MediaQueries.mbUp} {
-      width: 100px;
-      height: 100px;
-    }
-  }
-
-  h2 {
-    margin-top: 32px;
-    color: ${miscTheme.theme.colors.gray800};
-    font-style: normal;
-    font-weight: bold;
-    ${utils.MediaQueries.mbDown} {
-      font-size: 24px;
-      line-height: 32px;
-    }
-
-    ${utils.MediaQueries.mbUp} {
-      font-size: 32px;
-      line-height: 42px;
-    }
-  }
-
-  p {
-    margin-top: 8px;
-    color: ${miscTheme.theme.colors.gray600};
-    font-style: normal;
-    font-weight: normal;
-    ${utils.MediaQueries.mbDown} {
-      font-size: 16px;
-      line-height: 24px;
-    }
-
-    ${utils.MediaQueries.mbUp} {
-      font-size: 16px;
-      line-height: 24px;
-    }
-  }
-`;
-const StyledButtonGroup = styled__default["default"].div `
-  display: flex;
-
-  ${utils.MediaQueries.mbDown} {
-    margin-top: 24px;
-  }
-
-  ${utils.MediaQueries.mbUp} {
-    margin-top: 32px;
-  }
-  justify-content: space-around;
-  button {
-    flex: 1;
-    margin: 4px;
-  }
-
-  ${(props) => props.siteType === 'marryBaby'
-    ? `
-        .cancel-button {
-            background-color: #E55C8A;
-        }
-        .cancel-button:hover {
-          background-color: #E55C8A !important;
-        }
-        .logout-button {
-            border-color: #E55C8A;
-            color: #E55C8A;
-        }
-      `
-    : ''}
-`;
-
-const NavigationLogoutPopup = ({ openLogoutPopup, onCloseHandler, onLogoutHandler, siteType = 'helloSites', }) => {
-    const { t } = useTranslations.useTranslations();
-    React.useEffect(() => {
-        document.body.classList.toggle('noscroll', openLogoutPopup);
-    }, [openLogoutPopup]);
-    return (React__default["default"].createElement(core.Portal, null,
-        React__default["default"].createElement(index$4.Popup, { type: "confirm", isOpen: openLogoutPopup, closeIcon: React__default["default"].createElement("img", { src: index$1.CommonGAssets.getAssetPath('closeLight.svg'), style: { width: 24, height: 24 }, alt: "close-icon", loading: "lazy" }), onClose: onCloseHandler },
-            React__default["default"].createElement(StyledPopup, null,
-                siteType === 'helloSites' && (React__default["default"].createElement("img", { src: index$1.CommonGAssets.getAssetPath('arrowDoor.svg'), className: "cancle-img", alt: "close-account", loading: "lazy" })),
-                React__default["default"].createElement("h2", null, t(siteType === 'helloSites'
-                    ? 'logout.popup.ask1'
-                    : 'logout.popup.ask.mb')),
-                React__default["default"].createElement("p", null, t('logout.popup.ask2')),
-                React__default["default"].createElement(StyledButtonGroup, { siteType: siteType },
-                    React__default["default"].createElement(index$5.Button, { className: "logout-button", color: "tertiary", size: "lg", onClick: onLogoutHandler }, t('logout.popup.button.logout')),
-                    React__default["default"].createElement(index$5.Button, { className: "cancel-button", color: "primary", size: "lg", onClick: onCloseHandler }, t('logout.popup.button.cancel')))))));
-};
-
-const NavigationProfileButton = ({ userInfo, siteType, onLoginClick, SSO_URL, currentUrl, isMinifyLogin, onLogout, style, isLoading, locale, }) => {
-    const { t } = useTranslations.useTranslations();
-    const [isLogoutConfirmOpen, setIsLogoutConfirmOpen] = React.useState(false);
-    const name = (userInfo === null || userInfo === void 0 ? void 0 : userInfo.name) || (userInfo === null || userInfo === void 0 ? void 0 : userInfo.username);
-    const [init, setInit] = React.useState(false);
-    React.useEffect(() => {
-        setInit(true);
-    }, []);
-    const { containerRef, onContainerFocus, onContainerBlur, onButtonMouseDown, onClose, } = useCSSFocusPopupHelper();
-    if (isLoading)
-        return React__default["default"].createElement(index$6.Button, { size: "sm", color: "transparent", loading: true });
-    return (userInfo === null || userInfo === void 0 ? void 0 : userInfo.id) ? (React__default["default"].createElement(React__default["default"].Fragment, null,
-        React__default["default"].createElement(StyledImageWrapper$1, { ref: containerRef, style: style, tabIndex: 0, onBlur: onContainerBlur, onFocus: () => {
-                var _a;
-                onContainerFocus();
-                const popup = (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.querySelector('#desktop-sticky-header .hhgcomp-navprofilebutton-popup');
-                if (popup) {
-                    const bound = popup.getBoundingClientRect();
-                    const top = bound.top;
-                    const maxHeight = `calc(100vh - ${top}px)`;
-                    popup.setAttribute('style', `max-height: ${maxHeight};`);
-                }
-            } },
-            React__default["default"].createElement("div", { onMouseDown: onButtonMouseDown },
-                React__default["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", className: "user-close-icon" },
-                    React__default["default"].createElement("path", { d: "M18 6L6 18M18 18L6 6", stroke: "#3E3F58", strokeWidth: "1.3", strokeLinecap: "round" })),
-                React__default["default"].createElement(index$2.Avatar, { size: 36, className: "user-avatar", src: userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar, color: siteType === 'marryBaby'
-                        ? miscTheme.theme.mbColors.pink
-                        : miscTheme.theme.colors.secondaryBase, placeholderText: name && name.length ? name[0].toUpperCase() : 'A' })),
-            React__default["default"].createElement(ProfilePopup, { dispatchLogout: () => {
-                    onClose();
-                    setIsLogoutConfirmOpen(true);
-                }, isOpen: false, closePopup: onClose, siteType: siteType, userInfo: userInfo })),
-        React__default["default"].createElement(NavigationLogoutPopup, { openLogoutPopup: isLogoutConfirmOpen, onCloseHandler: () => {
-                document.body.classList.toggle('noscroll', false);
-                setIsLogoutConfirmOpen(false);
-            }, siteType: siteType, onLogoutHandler: () => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
-                setIsLogoutConfirmOpen(false);
-                document.body.classList.toggle('noscroll', false);
-                yield onLogout();
-            }) }))) : (React__default["default"].createElement(StyledLoggedOutAnchor, { style: Object.assign({ textDecoration: 'none' }, style), "data-event-category": "Sign Up", "data-event-action": "Button Click", "data-event-label": currentUrl, href: !init
-            ? normalizeLink.normalizeLinkSlash(`${SSO_URL}?returnUrl=${currentUrl}`)
-            : undefined, "data-site-type": siteType, onClick: onLoginClick }, isMinifyLogin ? (React__default["default"].createElement(StyledAvatar, null,
-        React__default["default"].createElement("img", { src: index$1.CommonGAssets.getAssetPath('lock.png'), className: "avatar", loading: "lazy", alt: "avatar" }))) : (
-    // LOGIC:
-    // - DEsktop: always show button
-    // - Mobile: show button only for helloSites, show text for MarryBaby
-    React__default["default"].createElement(React__default["default"].Fragment, null,
-        siteType === 'helloSites' &&
-            (locale === Locale.LOCALE.Indonesia ||
-                locale === Locale.LOCALE.PhilippinesTagalog ||
-                locale === Locale.LOCALE.PhilippinesEnglish ? (React__default["default"].createElement("img", { className: "mobile-only", src: index$1.CommonGAssets.getAssetPath('login.svg'), style: {
-                    cursor: 'pointer',
-                    height: 24,
-                    width: 24,
-                } })) : (React__default["default"].createElement(index$6.Button, { className: "mobile-only", size: "sm", leftIcon: React__default["default"].createElement(core$1.User, { color: "currentColor", isSolid: true, size: 22 }), sx: {
-                    paddingLeft: '8px',
-                    paddingRight: '12px',
-                } }, t('navigation.loginJoin')))),
-        siteType === 'marryBaby' && (React__default["default"].createElement("div", { className: "mobile-only", style: {
-                paddingLeft: 16,
-            } },
-            React__default["default"].createElement(index.Text, { size: "p3", color: miscTheme.theme.mbColors.pink }, t('navigation.loginJoin')))),
-        siteType === 'marryBaby' ? (React__default["default"].createElement(index$6.Button, { className: "login-btn", size: "md", leftIcon: React__default["default"].createElement(core$1.User, { color: "currentColor", isSolid: true, size: 22 }) }, t('navigation.loginJoin'))) : (React__default["default"].createElement(index$6.Button, { className: "login-btn", size: "md", leftIcon: React__default["default"].createElement(core$1.User, { color: "#595959", isSolid: true, size: 22 }), variant: "ghost", color: "#262626" }, t('navigation.loginJoin')))))));
-};
-
 var styles$3 = {"bookingButton":"spdlGfq","bookingButtonAnchor":"vgS16jX"};
 
 const BookingButton = ({ onCareHeaderClick, currentUrl, careUrlFe, btnName, }) => {
-    return onCareHeaderClick ? (React__default["default"].createElement(index$5.Button, { className: styles$3.bookingButton, size: "md", color: "primary", dataEventCategory: "Care", dataEventAction: "Navigation Bar Click", dataEventLabel: currentUrl, onClick: (e) => onCareHeaderClick(e), style: {
+    return onCareHeaderClick ? (React__default["default"].createElement(index$1.Button, { className: styles$3.bookingButton, size: "md", color: "primary", dataEventCategory: "Care", dataEventAction: "Navigation Bar Click", dataEventLabel: currentUrl, onClick: (e) => onCareHeaderClick(e), style: {
             paddingLeft: 10,
             paddingRight: 10,
         } }, btnName)) : (React__default["default"].createElement("a", { href: careUrlFe, className: `${styles$3.bookingButtonAnchor} care-button no-replace-click` },
-        React__default["default"].createElement(index$5.Button, { className: styles$3.bookingButton, size: "md", color: "primary", dataEventCategory: "Care", dataEventAction: "Navigation Bar Click", dataEventLabel: currentUrl }, btnName)));
+        React__default["default"].createElement(index$1.Button, { className: styles$3.bookingButton, size: "md", color: "primary", dataEventCategory: "Care", dataEventAction: "Navigation Bar Click", dataEventLabel: currentUrl }, btnName)));
 };
 
 var styles$2 = {"menuContainer":"y5VJdvw","menuIcon":"oVhOSCy","menuIconWrapper":"pX8OXTM"};
@@ -902,18 +137,18 @@ const useNavConfig = ({ locale, projectType, siteType, enableBookingBtn, }) => {
             (projectType === 'profile' && siteType === 'marryBaby');
         const enableNavCare = siteType !== 'marryBaby' &&
             projectType !== 'marryBaby' &&
-            index$3.CARE_LOCALES.includes(locale);
+            index$2.CARE_LOCALES.includes(locale);
         const enableNavCareBooking = enableBookingBtn &&
             projectType !== 'marryBaby' &&
             projectType === 'discover' &&
             siteType !== 'marryBaby' &&
-            index$3.CARE_BOOKING_LOCALES.includes(locale);
-        const enableNavTogether = projectType === 'marryBaby' || index$3.TOGETHER_LOCALES.includes(locale);
+            index$2.CARE_BOOKING_LOCALES.includes(locale);
+        const enableNavTogether = projectType === 'marryBaby' || index$2.TOGETHER_LOCALES.includes(locale);
         const enableNavDiscover = true;
         const enableNavHealthTools = true;
         const enableProfileMySaved = true;
-        const enableNavEcom = siteType !== 'marryBaby' && index$3.ECOM_LOCALES.includes(locale);
-        const enableProfileEcom = siteType !== 'marryBaby' && index$3.ECOM_LOCALES.includes(locale);
+        const enableNavEcom = siteType !== 'marryBaby' && index$2.ECOM_LOCALES.includes(locale);
+        const enableProfileEcom = siteType !== 'marryBaby' && index$2.ECOM_LOCALES.includes(locale);
         const enableProfileMyHealth = true;
         const baseUrl = routing.getCurrentBaseUrl(locale, siteType === 'marryBaby');
         let fixBaseUrl = baseUrl;
@@ -995,8 +230,8 @@ function HamburgerIcon({ siteType, enableSearch, className }) {
     if (siteType === 'helloSites') {
         return (React__default["default"].createElement("div", null,
             React__default["default"].createElement("img", { "data-list-type": "Header", "data-content-type": "Navigation", "data-content-topic": "Hamburger", src: enableSearch
-                    ? index$1.CommonGAssets.getAssetPath('hamburgerMenuNewWithSearch.svg')
-                    : index$1.CommonGAssets.getAssetPath('hamburgerMenuNew.svg'), style: { width: '24px', height: '24px' }, alt: "home", className: className, loading: "lazy" })));
+                    ? index$3.CommonGAssets.getAssetPath('hamburgerMenuNewWithSearch.svg')
+                    : index$3.CommonGAssets.getAssetPath('hamburgerMenuNew.svg'), style: { width: '24px', height: '24px' }, alt: "home", className: className, loading: "lazy" })));
     }
     /** Marry Baby */
     return (React__default["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", className: className },
@@ -1068,11 +303,11 @@ const StyledWrapper = styled__default["default"].div `
 const SearchInput = ({ id }) => {
     const { locale, configs: { statics }, siteType, } = React.useContext(NavigationContext);
     const { t } = useTranslations.useTranslations();
-    return (React__default["default"].createElement(index$2.Input, { className: "fake-search-input", name: 'search-input-menu-service' + id, size: "md", placeholder: siteType === 'marryBaby'
+    return (React__default["default"].createElement(index$4.Input, { className: "fake-search-input", name: 'search-input-menu-service' + id, size: "md", placeholder: siteType === 'marryBaby'
             ? t('navigation.search.input.placeholder')
             : t('home.search', {
-                site: index$3.LOCALE_SPECS[locale || 'en-PH']
-                    ? index$3.LOCALE_SPECS[locale || 'en-PH'].SITE_NAME
+                site: index$2.LOCALE_SPECS[locale || 'en-PH']
+                    ? index$2.LOCALE_SPECS[locale || 'en-PH'].SITE_NAME
                     : '',
             }), onChange: () => undefined, onKeyDown: (e) => e.key === 'Enter' &&
             (window.location.href = `${statics.HOME_PAGE_URL}/search/?s=${e.target.value}`), type: "search", onFocus: (e) => {
@@ -1214,7 +449,7 @@ const StyledViewMore$1 = styled__default["default"].a `
 var styles$1 = {"menuIconWrapper":"wnUb-dV","menuButton":"cjbOxWe","itemNavButton":"-sx0jrx","scale":"EDlp5Zf"};
 
 const ItemMenu = ({ item, menu }) => {
-    const { containerRef, onButtonMouseDown, onClose } = useCSSFocusPopupHelper({
+    const { containerRef, onButtonMouseDown, onClose } = navigationProfileButton.useCSSFocusPopupHelper({
         allowBgScroll: true,
     });
     const isInit = useIsInit.useIsInit();
@@ -1239,7 +474,7 @@ const ItemMenu = ({ item, menu }) => {
 const NewWrapper = ({ isNew, children, }) => {
     const { t } = useTranslations.useTranslations();
     if (isNew) {
-        return (React__default["default"].createElement(index$7.Indicator, { color: "green", label: t('home.navigator.menuItem.new'), size: 20, styles: {
+        return (React__default["default"].createElement(index$5.Indicator, { color: "green", label: t('home.navigator.menuItem.new'), size: 20, styles: {
                 root: {
                     paddingRight: 10,
                 },
@@ -1254,16 +489,16 @@ const Categories = ({ hrefViewMore, titleBtnViewMore, UrlFE, onClosePopup, menuI
     const theme = core.useMantineTheme();
     return (React__default["default"].createElement(StyledItemGridLeft, null,
         React__default["default"].createElement(StyledHeading$1, null,
-            React__default["default"].createElement(index$8.Heading, { tag: siteType === 'marryBaby' ? 'h5' : 'h6', as: "p", fontWeight: "semibold" }, headingTitle)), menuItems === null || menuItems === void 0 ? void 0 :
-        menuItems.slice(0, 6).map((item, index$2) => {
+            React__default["default"].createElement(index$6.Heading, { tag: siteType === 'marryBaby' ? 'h5' : 'h6', as: "p", fontWeight: "semibold" }, headingTitle)), menuItems === null || menuItems === void 0 ? void 0 :
+        menuItems.slice(0, 6).map((item, index$1) => {
             const href = (item === null || item === void 0 ? void 0 : item.link)
                 ? (item === null || item === void 0 ? void 0 : item.link.startsWith('http'))
                     ? item === null || item === void 0 ? void 0 : item.link
                     : `${UrlFE}/${item === null || item === void 0 ? void 0 : item.link.split('/').filter(Boolean).join('/')}/`
                 : '/';
-            return (React__default["default"].createElement(StyledItem$6, Object.assign({ className: "iconMenu", "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": href, "data-is-heading-category": false, "data-active": item.id && item.id === activeItem, "data-is-mobile-tool": item.isMobileAppTool, href: href }, (!index$9.isInternalLink(href) && {
+            return (React__default["default"].createElement(StyledItem$6, Object.assign({ className: "iconMenu", "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": href, "data-is-heading-category": false, "data-active": item.id && item.id === activeItem, "data-is-mobile-tool": item.isMobileAppTool, href: href }, (!index$7.isInternalLink(href) && {
                 target: '_blank',
-            }), { "data-theme": siteType, key: index$2, onClick: onClosePopup }),
+            }), { "data-theme": siteType, key: index$1, onClick: onClosePopup }),
                 React__default["default"].createElement("div", { className: "icon" },
                     React__default["default"].createElement("img", { loading: "lazy", alt: item.name, src: item.thumbnail || '/images/avatar.jpg', style: {
                             width: 32,
@@ -1282,15 +517,15 @@ const Categories = ({ hrefViewMore, titleBtnViewMore, UrlFE, onClosePopup, menuI
                 item.isMobileAppTool && (React__default["default"].createElement(StyledIconNav, null,
                     React__default["default"].createElement(Phone, { className: "phone-icon", size: 16 }))),
                 React__default["default"].createElement(StyledIconNav, { className: "arrow-icon" },
-                    React__default["default"].createElement("img", { src: index$1.CommonGAssets.getAssetPath('chevronRight.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" }))));
+                    React__default["default"].createElement("img", { src: index$3.CommonGAssets.getAssetPath('chevronRight.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" }))));
         }),
         titleBtnViewMore && (React__default["default"].createElement(StyledViewMore$1, { "data-theme": siteType, style: { textDecoration: 'none' }, href: hrefViewMore, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": hrefViewMore },
             React__default["default"].createElement(StyledItemAll, { onClick: onClosePopup, "data-theme": siteType, "data-is-heading-category": false },
                 titleBtnViewMore,
                 React__default["default"].createElement(StyledImageWrapper, null,
                     React__default["default"].createElement("img", { className: "svg", src: siteType === 'marryBaby'
-                            ? index$1.CommonGAssets.getAssetPath('chevronRightPink.svg')
-                            : index$1.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" })))))));
+                            ? index$3.CommonGAssets.getAssetPath('chevronRightPink.svg')
+                            : index$3.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" })))))));
 };
 
 const StyledContainerItems$4 = styled__default["default"].div `
@@ -1462,7 +697,7 @@ const Item$4 = ({ item, index = 0 }) => {
         return null;
     const href = `${statics.CARE_URL_FE}/${(_a = constants$1.LOCALIZED_SLUGS[locale]) === null || _a === void 0 ? void 0 : _a.HOSPITAL}/${item.slug}-${item.id}`;
     return (React__default["default"].createElement(StyledItem$5, { key: item.id, href: href, "data-event-category": "Hamburger Navigation", "data-event-action": `Care Click ${index + 1}`, "data-event-label": href },
-        React__default["default"].createElement("img", { src: index$1.CommonGAssets.getAssetPath('navCareCardBg.svg'), alt: "", className: "bg-svg", loading: "lazy" }),
+        React__default["default"].createElement("img", { src: index$3.CommonGAssets.getAssetPath('navCareCardBg.svg'), alt: "", className: "bg-svg", loading: "lazy" }),
         React__default["default"].createElement(StyledImageCard$3, null,
             React__default["default"].createElement(StyledImageCardInner, null,
                 React__default["default"].createElement("img", { loading: "lazy", alt: item.name, src: item.logo || '/images/avatar.jpg' }))),
@@ -1471,7 +706,7 @@ const Item$4 = ({ item, index = 0 }) => {
             React__default["default"].createElement(StyledDes$2, null, item.description),
             React__default["default"].createElement(StyledBtnView$2, null,
                 t('home.seeMore'),
-                React__default["default"].createElement("img", { src: index$1.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: {
+                React__default["default"].createElement("img", { src: index$3.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: {
                         width: '16px',
                         height: '16px',
                         marginTop: '3px',
@@ -1550,15 +785,15 @@ const SpotlightNoData = ({ title, link, description, cta, icon }) => {
     return (React__default["default"].createElement(StyledContainerNoPosts, { "data-theme": siteType },
         React__default["default"].createElement(StyledLeft, null,
             React__default["default"].createElement("img", { src: siteType === 'marryBaby'
-                    ? index$1.CommonGAssets.getAssetPath('navMBSpotlightBgNoData.svg')
-                    : index$1.CommonGAssets.getAssetPath('navSpotlightBgNoData.svg'), alt: "", loading: "lazy", className: "bg-svg" }),
+                    ? index$3.CommonGAssets.getAssetPath('navMBSpotlightBgNoData.svg')
+                    : index$3.CommonGAssets.getAssetPath('navSpotlightBgNoData.svg'), alt: "", loading: "lazy", className: "bg-svg" }),
             React__default["default"].createElement(StyledContentLeft, null, icon && React__default["default"].createElement("img", { src: icon, width: 64, height: 64, loading: "lazy" }))),
         React__default["default"].createElement("div", null,
             title && React__default["default"].createElement(StyledTitle$4, null, title),
             description && React__default["default"].createElement(StyledDescription, null, description),
             cta && (React__default["default"].createElement("div", null,
                 React__default["default"].createElement("a", { href: link },
-                    React__default["default"].createElement(index$5.Button, { theme: siteType, className: "survey-contact-submit", size: "md" }, cta)))))));
+                    React__default["default"].createElement(index$1.Button, { theme: siteType, className: "survey-contact-submit", size: "md" }, cta)))))));
 };
 
 const StyledItemGridRight = styled__default["default"].div `
@@ -1605,12 +840,12 @@ const Spotlights = ({ title, viewMore, children, link, dataEventAction = '', })
     const { siteType } = React.useContext(NavigationContext);
     return (React__default["default"].createElement(StyledItemGridRight, null,
         React__default["default"].createElement(StyledHeading, null,
-            React__default["default"].createElement(index$8.Heading, { tag: siteType === 'marryBaby' ? 'h5' : 'h6', as: "p", fontWeight: "semibold" }, title),
+            React__default["default"].createElement(index$6.Heading, { tag: siteType === 'marryBaby' ? 'h5' : 'h6', as: "p", fontWeight: "semibold" }, title),
             viewMore && (React__default["default"].createElement(StyledViewMore, { "data-event-category": "Hamburger Navigation", "data-event-action": dataEventAction, "data-event-label": link, href: link, "data-theme": siteType },
                 viewMore,
                 React__default["default"].createElement("img", { src: siteType === 'marryBaby'
-                        ? index$1.CommonGAssets.getAssetPath('chevronRightPink.svg')
-                        : index$1.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" })))),
+                        ? index$3.CommonGAssets.getAssetPath('chevronRightPink.svg')
+                        : index$3.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" })))),
         children));
 };
 
@@ -1625,7 +860,7 @@ const CareSpotlights = ({ spotlights = [], hrefViewMore }) => {
                 right: '1rem',
             } },
             React__default["default"].createElement("a", { href: hrefViewMore },
-                React__default["default"].createElement(index$5.Button, { theme: siteType, className: "survey-contact-submit", size: "md" }, t('home.navigator.menu.care.homeButton')))))) : (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.care.noDatas.title'), description: t('home.navigator.menu.care.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.care.homeButton'), icon: index$1.CommonGAssets.getAssetPath('community.svg') }))));
+                React__default["default"].createElement(index$1.Button, { theme: siteType, className: "survey-contact-submit", size: "md" }, t('home.navigator.menu.care.homeButton')))))) : (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.care.noDatas.title'), description: t('home.navigator.menu.care.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.care.homeButton'), icon: index$3.CommonGAssets.getAssetPath('community.svg') }))));
 };
 
 const StyledContainerItems$3 = styled__default["default"].div `
@@ -1699,7 +934,7 @@ const CategorySpotlights = ({ spotlightsList = [], hrefViewMore }) => {
             link: statics.HOME_PAGE_URL + spotlight.permalink,
             title: spotlight.name,
             banner: spotlight.image,
-        } }))))) : (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.category.noDatas.title'), description: t('home.navigator.menu.category.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.category.noDatas.cta'), icon: index$1.CommonGAssets.getAssetPath('Spotlight.svg') }))));
+        } }))))) : (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.category.noDatas.title'), description: t('home.navigator.menu.category.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.category.noDatas.cta'), icon: index$3.CommonGAssets.getAssetPath('Spotlight.svg') }))));
 };
 
 const StyledContainerItems$2 = styled__default["default"].div `
@@ -1837,7 +1072,7 @@ const Item$2 = ({ post, index = 0 }) => {
     return (React__default["default"].createElement(StyledItem$3, { href: postUrl, "data-event-category": "Hamburger Navigation", "data-event-action": `Together Click ${index + 1}`, "data-event-label": postUrl },
         React__default["default"].createElement(StyledContent$1, null,
             React__default["default"].createElement(StyledInfoUser, null,
-                React__default["default"].createElement(index$a.UserAvatar, { avatar: (_b = post.author) === null || _b === void 0 ? void 0 : _b.avatar, username: ((_c = post.author) === null || _c === void 0 ? void 0 : _c.name) || ((_d = post.author) === null || _d === void 0 ? void 0 : _d.username) }),
+                React__default["default"].createElement(index$8.UserAvatar, { avatar: (_b = post.author) === null || _b === void 0 ? void 0 : _b.avatar, username: ((_c = post.author) === null || _c === void 0 ? void 0 : _c.name) || ((_d = post.author) === null || _d === void 0 ? void 0 : _d.username) }),
                 React__default["default"].createElement(StyledWrapInfo, null,
                     React__default["default"].createElement(StyledName, { "data-theme": siteType }, (_e = post.author) === null || _e === void 0 ? void 0 : _e.name),
                     React__default["default"].createElement(StyledInfo, null,
@@ -1854,7 +1089,7 @@ const Item$2 = ({ post, index = 0 }) => {
 const CommunitySpotlights = ({ spotlights = [] }) => {
     const { configs: { statics }, } = React.useContext(NavigationContext);
     const { t } = useTranslations.useTranslations();
-    return (React__default["default"].createElement(Spotlights, { title: t('home.navigator.menu.trendingPosts'), viewMore: t('home.navigator.menu.trendingPosts.seeMore'), link: normalizeLink.normalizeLink(statics.TOGETHER_URL_FE), dataEventAction: "Together See More Click" }, spotlights.length !== 0 ? (React__default["default"].createElement(StyledContainerItems$2, null, spotlights === null || spotlights === void 0 ? void 0 : spotlights.slice(0, 4).map((p, index) => (React__default["default"].createElement(Item$2, { index: index, post: p, key: p.id }))))) : (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.together.noPosts.title'), description: t('home.navigator.menu.together.noPosts.description'), link: `${statics.HOME_PAGE_URL}/community/`, cta: t('home.navigator.menu.together.noPosts.cta'), icon: index$1.CommonGAssets.getAssetPath('community.svg') }))));
+    return (React__default["default"].createElement(Spotlights, { title: t('home.navigator.menu.trendingPosts'), viewMore: t('home.navigator.menu.trendingPosts.seeMore'), link: normalizeLink.normalizeLink(statics.TOGETHER_URL_FE), dataEventAction: "Together See More Click" }, spotlights.length !== 0 ? (React__default["default"].createElement(StyledContainerItems$2, null, spotlights === null || spotlights === void 0 ? void 0 : spotlights.slice(0, 4).map((p, index) => (React__default["default"].createElement(Item$2, { index: index, post: p, key: p.id }))))) : (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.together.noPosts.title'), description: t('home.navigator.menu.together.noPosts.description'), link: `${statics.HOME_PAGE_URL}/community/`, cta: t('home.navigator.menu.together.noPosts.cta'), icon: index$3.CommonGAssets.getAssetPath('community.svg') }))));
 };
 
 const StyledContainerItems$1 = styled__default["default"].div `
@@ -1874,10 +1109,10 @@ const StyledItem$2 = styled__default["default"].a `
   align-items: center;
 `;
 
-const Item$1 = ({ item, index: index$2 = 0 }) => {
+const Item$1 = ({ item, index: index$1 = 0 }) => {
     if (!item)
         return null;
-    return (React__default["default"].createElement(StyledItem$2, { href: item.url, "data-event-category": "Hamburger Navigation", "data-event-action": `Care Click ${index$2 + 1}`, "data-event-label": item.url },
+    return (React__default["default"].createElement(StyledItem$2, { href: item.url, "data-event-category": "Hamburger Navigation", "data-event-action": `Care Click ${index$1 + 1}`, "data-event-label": item.url },
         React__default["default"].createElement("img", { loading: "lazy", alt: item.name, src: item.featuredImage || '/images/avatar.jpg', style: {
                 width: '40px',
                 height: '40px',
@@ -1885,7 +1120,7 @@ const Item$1 = ({ item, index: index$2 = 0 }) => {
         React__default["default"].createElement(index.Text, { size: "p2", weight: "regular", style: {
                 marginLeft: 16,
             } }, item.name),
-        React__default["default"].createElement("img", { src: index$1.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: {
+        React__default["default"].createElement("img", { src: index$3.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: {
                 width: '20px',
                 height: '20px',
                 marginLeft: 'auto',
@@ -2050,7 +1285,7 @@ const Item = ({ item, index = 0 }) => {
         : undefined;
     return (React__default["default"].createElement(StyledItem$1, { href: link, "data-event-category": "Hamburger Navigation", "data-event-action": `Engage Click ${index + 1}`, "data-event-label": link },
         item.isMobileAppTool && React__default["default"].createElement(Phone, { size: 20, className: "phone-badge" }),
-        React__default["default"].createElement("img", { src: index$1.CommonGAssets.getAssetPath('navToolCardBg.svg'), alt: "", loading: "lazy", className: "bg-svg" }),
+        React__default["default"].createElement("img", { src: index$3.CommonGAssets.getAssetPath('navToolCardBg.svg'), alt: "", loading: "lazy", className: "bg-svg" }),
         React__default["default"].createElement(StyledContentWrapper$1, null,
             React__default["default"].createElement(StyledTitle$1, null, item.title),
             React__default["default"].createElement(StyledDes$1, null, item.subtitle),
@@ -2288,7 +1523,7 @@ const ItemMarryBaby = ({ item, index = 0, color }) => {
             React__default["default"].createElement(StyledDes, null, item.subtitle)),
         React__default["default"].createElement(StyledBtnView, null,
             React__default["default"].createElement("div", { className: "mobile-only" }, t('home.seeMore')),
-            React__default["default"].createElement("img", { src: index$1.CommonGAssets.getAssetPath('arrowRightGray.svg'), style: {
+            React__default["default"].createElement("img", { src: index$3.CommonGAssets.getAssetPath('arrowRightGray.svg'), style: {
                     width: '12px',
                     height: '12px',
                     marginTop: '2px',
@@ -2297,7 +1532,7 @@ const ItemMarryBaby = ({ item, index = 0, color }) => {
     return (React__default["default"].createElement(StyledItem, { href: link, "data-event-category": "Hamburger Navigation", "data-event-action": `Engage Click ${index + 1}`, "data-event-label": link, "data-color": color },
         React__default["default"].createElement("svg", { className: "bg-svg", width: "74", height: "121", viewBox: "0 0 74 121", fill: "none" },
             React__default["default"].createElement("path", { d: "M58.5713 53.428C40.6466 70.0213 12.9929 71.0875 -7.00506 84.9856C-24.9277 97.4005 -38.3893 120.472 -60.213 120.346C-73.3615 120.271 -84.9289 110.925 -91.9303 99.8138C-101.443 84.7327 -103.994 64.0482 -93.916 49.3276C-81.8133 31.6505 -56.6933 28.1101 -41.7246 12.7895C-35.4351 6.35117 -31.2212 -1.90115 -24.8564 -8.25051C-7.17639 -25.9054 34.9604 -29.7543 56.852 -16.9562C80.9056 -2.89888 77.046 36.3304 58.5713 53.428Z", strokeWidth: "0" })),
-        React__default["default"].createElement("img", { src: index$1.CommonGAssets.getAssetPath('navMBCardDotBg.svg'), className: "dot-svg", loading: "lazy", alt: "" }),
+        React__default["default"].createElement("img", { src: index$3.CommonGAssets.getAssetPath('navMBCardDotBg.svg'), className: "dot-svg", loading: "lazy", alt: "" }),
         React__default["default"].createElement(StyledContentWrapper, null,
             React__default["default"].createElement("div", { className: "mobile-only" }, renderIcon()),
             React__default["default"].createElement("div", { className: "desktop-only" }, renderName())),
@@ -2311,7 +1546,7 @@ const ToolSpotlights = ({ hrefViewMore, spotlightHealthTools = [] }) => {
     const { siteType } = React.useContext(NavigationContext);
     return (React__default["default"].createElement(Spotlights, { title: t('home.navigator.menu.spotlightTools') },
         spotlightHealthTools.length !== 0 && (React__default["default"].createElement(StyledContainerItems, null, spotlightHealthTools === null || spotlightHealthTools === void 0 ? void 0 : spotlightHealthTools.slice(0, 3).map((item, index) => siteType === 'marryBaby' ? (React__default["default"].createElement(ItemMarryBaby, { key: index, index: index, item: item, color: marryBabyCardColor[index] })) : (React__default["default"].createElement(Item, { key: index, index: index, item: item }))))),
-        spotlightHealthTools.length === 0 && (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.healthTools.noDatas.title'), description: t('home.navigator.menu.healthTools.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.healthTools.noDatas.cta'), icon: index$1.CommonGAssets.getAssetPath('community.svg') }))));
+        spotlightHealthTools.length === 0 && (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.healthTools.noDatas.title'), description: t('home.navigator.menu.healthTools.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.healthTools.noDatas.cta'), icon: index$3.CommonGAssets.getAssetPath('community.svg') }))));
 };
 
 const MenuServiceList = ({ closePopup, menuItems = [] }) => {
@@ -2326,7 +1561,7 @@ const MenuServiceList = ({ closePopup, menuItems = [] }) => {
         React__default["default"].createElement(StyledWrapper, null,
             React__default["default"].createElement(Categories, { UrlFE: statics.HOME_PAGE_URL, titleBtnViewMore: t('home.navigator.menuItem.allCategories'), menuItems: menuItems, headingTitle: t('home.navigator.menuItem.healthCategories'), onClosePopup: closePopup, activeItem: activeMenuService }),
             activeMenuService === 'categories' && (React__default["default"].createElement(CategorySpotlights, { spotlightsList: (categories === null || categories === void 0 ? void 0 : categories.spotlights) || [], hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/spotlight/` })),
-            activeMenuService === 'tools' && (React__default["default"].createElement(ToolSpotlights, { spotlightHealthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.spotlights, hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$3.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}` })),
+            activeMenuService === 'tools' && (React__default["default"].createElement(ToolSpotlights, { spotlightHealthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.spotlights, hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$2.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}` })),
             activeMenuService === 'care' && (React__default["default"].createElement(CareSpotlights, { spotlights: care === null || care === void 0 ? void 0 : care.spotlights, hrefViewMore: `${statics.CARE_URL_FE}/${(_b = constants$1.LOCALIZED_SLUGS[locale]) === null || _b === void 0 ? void 0 : _b.SPECIALTIES}` })),
             activeMenuService === 'together' && (React__default["default"].createElement(CommunitySpotlights, { spotlights: together === null || together === void 0 ? void 0 : together.spotlights })),
             activeMenuService === 'ecom' && (React__default["default"].createElement(EcomSpotlights, { helpfulUrls: ecom === null || ecom === void 0 ? void 0 : ecom.helpfulUrls })))));
@@ -2334,7 +1569,7 @@ const MenuServiceList = ({ closePopup, menuItems = [] }) => {
 
 const HamburgerMenu = ({ menuItems }) => {
     const { siteType, configs: { enableSearchBar }, } = React.useContext(NavigationContext);
-    const { containerRef, onContainerFocus, onContainerBlur, onButtonMouseDown, onClose, } = useCSSFocusPopupHelper();
+    const { containerRef, onContainerFocus, onContainerBlur, onButtonMouseDown, onClose, } = navigationProfileButton.useCSSFocusPopupHelper();
     return (React__default["default"].createElement(DisplayWrapper, { mediaQueryKey: "mbDown" },
         React__default["default"].createElement("header", { className: styles$2.menuContainer },
             React__default["default"].createElement("div", { className: styles$2.menuIcon, ref: containerRef, role: "button", tabIndex: 0, onBlur: onContainerBlur, onFocus: onContainerFocus },
@@ -2774,10 +2009,10 @@ const BtnClosePopup = ({ onClosePopup }) => {
 
 const PopupWrapper = ({ onClosePopup, isDisplay, children, isNavMenu, hideCloseBtn, }) => {
     return (React__default["default"].createElement("div", { className: "hhgcomp-navigation-popupwrapper-menuwrapper top-menu-health-tools", "data-is-display": !!isDisplay, "data-is-nav-menu": !!isNavMenu },
-        React__default["default"].createElement(index$b.Container, { className: "hhgcomp-navigation-popupwrapper-menuwrapper-child" },
+        React__default["default"].createElement(index$9.Container, { className: "hhgcomp-navigation-popupwrapper-menuwrapper-child" },
             !hideCloseBtn && (React__default["default"].createElement("div", { className: styles.container },
                 React__default["default"].createElement(BtnClosePopup, { onClosePopup: onClosePopup }))),
-            React__default["default"].createElement(index$b.Container, { className: styles.gridContainer }, children))));
+            React__default["default"].createElement(index$9.Container, { className: styles.gridContainer }, children))));
 };
 
 const MenuCareList = ({ careSpecialties = [], isOpen, onClose, spotlights = [], }) => {
@@ -2837,7 +2072,7 @@ const MenuHealthToolsList = ({ locale, onClose, isOpen, spotlightHealthTools = [
     var _a;
     const { t } = useTranslations.useTranslations();
     const { configs: { statics }, } = React.useContext(NavigationContext);
-    const hrefViewMore = `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$3.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`;
+    const hrefViewMore = `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$2.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`;
     return (React__default["default"].createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
         React__default["default"].createElement(Categories, { hrefViewMore: hrefViewMore, UrlFE: statics.HOME_PAGE_URL, onClosePopup: onClose, headingTitle: t('home.navigator.menuItem.healthToolsList'), titleBtnViewMore: t('home.navigator.menuItem.allHealthTools'), menuItems: healthTools.map((t) => ({
                 name: t.title,
@@ -2856,7 +2091,7 @@ const ItemNavButton = ({ item, color = 'blue' }) => {
     const [Lottie, setLottie] = React.useState();
     const [iconJson, setIconJson] = React.useState();
     const { locale, ssrMenuContent: { categories, healthTools, care, together }, } = React.useContext(NavigationContext);
-    const { containerRef, onButtonMouseDown, onClose } = useCSSFocusPopupHelper({
+    const { containerRef, onButtonMouseDown, onClose } = navigationProfileButton.useCSSFocusPopupHelper({
         allowBgScroll: true,
     });
     React.useEffect(() => {
@@ -2867,13 +2102,13 @@ const ItemNavButton = ({ item, color = 'blue' }) => {
                 });
             }
             if (item.id === 'care') {
-                Promise.resolve().then(function () { return require('./doctor-2a2b78b0.js'); }).then((data) => {
+                Promise.resolve().then(function () { return require('./doctor-dca6d1b2.js'); }).then((data) => {
                     if (data === null || data === void 0 ? void 0 : data.default)
                         setIconJson(() => data.default);
                 });
             }
             else if (item.id === 'ecom') {
-                Promise.resolve().then(function () { return require('./cart-d32faa71.js'); }).then((data) => {
+                Promise.resolve().then(function () { return require('./cart-7bc1b943.js'); }).then((data) => {
                     if (data === null || data === void 0 ? void 0 : data.default)
                         setIconJson(() => data.default);
                 });
@@ -2893,7 +2128,7 @@ const ItemNavButton = ({ item, color = 'blue' }) => {
             background: '#E3F2FF',
         };
     return (React__default["default"].createElement(Tag, { tabIndex: 0, href: item.link, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link, className: styles$1.itemNavButton, ref: containerRef },
-        React__default["default"].createElement(index$6.Button, { variant: "light", leftIcon: Lottie && iconJson ? (linkOnly ? (React__default["default"].createElement(Lottie, { animationData: iconJson, loop: true, autoplay: true, style: {
+        React__default["default"].createElement(index$a.Button, { variant: "light", leftIcon: Lottie && iconJson ? (linkOnly ? (React__default["default"].createElement(Lottie, { animationData: iconJson, loop: true, autoplay: true, style: {
                     width: 28,
                     height: 28,
                 } })) : (React__default["default"].createElement("a", { href: normalizeLink.normalizeLinkSlash(item.link + '/') },
@@ -2947,7 +2182,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
             : currentLocation;
     };
     const logoType = siteType === 'helloSites'
-        ? (_a = index$3.LOCALE_SPECS[locale]) === null || _a === void 0 ? void 0 : _a.LOGO_TYPE
+        ? (_a = index$2.LOCALE_SPECS[locale]) === null || _a === void 0 ? void 0 : _a.LOGO_TYPE
         : siteType;
     const isBrowser = typeof window !== 'undefined';
     const scrolling = React.useCallback(throttle__default["default"](() => {
@@ -2997,9 +2232,9 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
                         flexShrink: 0,
                     }, href: HOME_PAGE_URL },
                     React__default["default"].createElement("div", null,
-                        React__default["default"].createElement(index$c.Logo, { style: {
+                        React__default["default"].createElement(index$b.Logo, { style: {
                                 display: 'flex',
-                            }, type: logoType, badge: locale === 'id-ID' && (React__default["default"].createElement("img", { src: index$1.CommonGAssets.getAssetPath('sehat-badge.png'), width: "56", height: "23", loading: "lazy" })), dateForSeasonal: new Date(), locale: locale, key: typeof window !== 'undefined' ? 'client' : 'server' })))),
+                            }, type: logoType, badge: locale === 'id-ID' && (React__default["default"].createElement("img", { src: index$3.CommonGAssets.getAssetPath('sehat-badge.png'), width: "56", height: "23", loading: "lazy" })), dateForSeasonal: new Date(), locale: locale, key: typeof window !== 'undefined' ? 'client' : 'server' })))),
                 !isMobile && (React__default["default"].createElement(React__default["default"].Fragment, null, siteType === 'marryBaby' ? (React__default["default"].createElement(NavigationMenu, { menuItems: menuItems })) : (enableSearchBar && React__default["default"].createElement(NavigtionSearch, { siteType: siteType }))))),
             React__default["default"].createElement(StyledRightGroup, { "data-site-type": siteType },
                 !isMobile && (React__default["default"].createElement(React__default["default"].Fragment, null, siteType === 'marryBaby' ? (enableSearchBar && React__default["default"].createElement(NavigtionSearch, { siteType: siteType })) : (React__default["default"].createElement(NavigationMenu, { menuItems: menuItems.filter((m) => m.id !== 'ecom' && m.id !== 'care') })))),
@@ -3010,7 +2245,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
                         enableNavCareBooking && (React__default["default"].createElement(DisplayWrapper, { mediaQueryKey: "mbUp" },
                             React__default["default"].createElement(BookingButton, { careUrlFe: statics.CARE_URL_FE, currentUrl: currentUrl, btnName: t('login.booking'), onCareHeaderClick: onBookingClick }))))),
                     languageMenu,
-                    React__default["default"].createElement(NavigationProfileButton, { userInfo: userInfo, siteType: siteType, onLoginClick: onLoginClick || goToLogin, SSO_URL: normalizeLink.normalizeLink(statics.SSO_URL), currentUrl: currentUrl, onLogout: onLogout, isLoading: isUserLoading, locale: locale }),
+                    React__default["default"].createElement(navigationProfileButton.NavigationProfileButton, { userInfo: userInfo, siteType: siteType, onLoginClick: onLoginClick || goToLogin, SSO_URL: normalizeLink.normalizeLink(statics.SSO_URL), currentUrl: currentUrl, onLogout: onLogout, isLoading: isUserLoading, locale: locale }),
                     cartNumber !== undefined && (React__default["default"].createElement(React__default["default"].Fragment, null,
                         !isMobile && (React__default["default"].createElement("hr", { style: {
                                 height: 20,
@@ -3148,18 +2383,18 @@ const useNavServices = () => {
                 link: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/categories`,
                 niceName: '',
                 thumbnail: isMarryBaby
-                    ? index$1.CommonGAssets.getAssetPath('categories-mb.svg')
-                    : index$1.CommonGAssets.getAssetPath('nav-icons/discover.svg'),
+                    ? index$3.CommonGAssets.getAssetPath('categories-mb.svg')
+                    : index$3.CommonGAssets.getAssetPath('nav-icons/discover.svg'),
                 popupType: 'categories',
             });
         enableNavHealthTools &&
             _services.push({
                 name: t('home.navigator.menuItem.healthTools'),
                 id: 'tools',
-                link: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$3.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`,
+                link: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$2.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`,
                 thumbnail: isMarryBaby
-                    ? index$1.CommonGAssets.getAssetPath('healthtools-mb.svg')
-                    : index$1.CommonGAssets.getAssetPath('nav-icons/health-tools.svg'),
+                    ? index$3.CommonGAssets.getAssetPath('healthtools-mb.svg')
+                    : index$3.CommonGAssets.getAssetPath('nav-icons/health-tools.svg'),
                 popupType: 'tools',
             });
         enableNavTogether &&
@@ -3168,8 +2403,8 @@ const useNavServices = () => {
                 id: 'together',
                 link: normalizeLink.normalizeLinkSlash(statics.TOGETHER_URL_FE + '/'),
                 thumbnail: isMarryBaby
-                    ? index$1.CommonGAssets.getAssetPath('community-mb.svg')
-                    : index$1.CommonGAssets.getAssetPath('nav-icons/community.svg'),
+                    ? index$3.CommonGAssets.getAssetPath('community-mb.svg')
+                    : index$3.CommonGAssets.getAssetPath('nav-icons/community.svg'),
                 popupType: 'together',
             });
         enableNavEcom &&
@@ -3177,7 +2412,7 @@ const useNavServices = () => {
                 name: t('home.navigator.menuItem.helloEcom'),
                 id: 'ecom',
                 link: normalizeLink.normalizeLinkSlash(statics.HOME_PAGE_URL + '/shop'),
-                thumbnail: index$1.CommonGAssets.getAssetPath('nav-icons/shop.svg'),
+                thumbnail: index$3.CommonGAssets.getAssetPath('nav-icons/shop.svg'),
                 popupType: null,
             });
         enableNavCare &&
@@ -3185,7 +2420,7 @@ const useNavServices = () => {
                 name: t('home.navigator.menuItem.helloCare'),
                 id: 'care',
                 link: normalizeLink.normalizeLinkSlash(statics.HOME_PAGE_URL + '/care'),
-                thumbnail: index$1.CommonGAssets.getAssetPath('nav-icons/care.svg'),
+                thumbnail: index$3.CommonGAssets.getAssetPath('nav-icons/care.svg'),
                 popupType: locale === 'id-ID' ? 'care' : null,
             });
         return _services;
@@ -3240,7 +2475,7 @@ const _NavigationV2 = (props) => {
             '--header-bottom': headerBottom + 'px',
         }, className: className },
         React__default["default"].createElement("section", { ref: headerRef },
-            React__default["default"].createElement(NavigationBar, { menuItems: services, onTopBarAppears: onTopBarAppears, logoComponent: logoComponent, subHead: subHead, languageMenu: React__default["default"].createElement(index$9.LanguageSwitcher, { languageOptions: languageOptions, locale: locale }) }))));
+            React__default["default"].createElement(NavigationBar, { menuItems: services, onTopBarAppears: onTopBarAppears, logoComponent: logoComponent, subHead: subHead, languageMenu: React__default["default"].createElement(index$7.LanguageSwitcher, { languageOptions: languageOptions, locale: locale }) }))));
 };
 const NavigationV2 = (props) => {
     const propsWithDefaultValues = Object.assign({ siteType: 'helloSites', projectType: 'discover', locale: 'vi-VN', activeMenuService: 'categories', ssrMenuContent: {} }, props);
@@ -3270,7 +2505,7 @@ const getNavMenuContent = (locale) => tslib_es6.__awaiter(void 0, void 0, void 0
             };
         }
         catch (_z) { }
-        if (isMarryBaby || index$3.TOGETHER_LOCALES.includes(locale)) {
+        if (isMarryBaby || index$2.TOGETHER_LOCALES.includes(locale)) {
             try {
                 const [communities, spotlightPosts] = yield Promise.all([
                     fetch(normalizeLink.normalizeLinkSlash(`${routing.getTogetherApiDomain()}/api/v1/community?website_url=https://${constantsDomainLocales.domainLocales[locale]}`)).then((res) => res.json()),
@@ -3283,7 +2518,7 @@ const getNavMenuContent = (locale) => tslib_es6.__awaiter(void 0, void 0, void 0
             }
             catch (_0) { }
         }
-        if (index$3.CARE_LOCALES.includes(locale)) {
+        if (index$2.CARE_LOCALES.includes(locale)) {
             try {
                 const [specialties, hospitals] = yield Promise.all([
                     fetch(normalizeLink.normalizeLinkSlash(routing.getCareApiDomain() +
@@ -3305,13 +2540,10 @@ const getNavMenuContent = (locale) => tslib_es6.__awaiter(void 0, void 0, void 0
     return res;
 });
 const getNavMenuContentWithCache = (locale) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
-    return (yield core$2.getDataWithCache('nav-menu-content', () => getNavMenuContent(locale || 'en-PH'), (data) => { var _a, _b; return !!((_b = (_a = data === null || data === void 0 ? void 0 : data.categories) === null || _a === void 0 ? void 0 : _a.items) === null || _b === void 0 ? void 0 : _b.length); })) || {};
+    return (yield core$1.getDataWithCache('nav-menu-content', () => getNavMenuContent(locale || 'en-PH'), (data) => { var _a, _b; return !!((_b = (_a = data === null || data === void 0 ? void 0 : data.categories) === null || _a === void 0 ? void 0 : _a.items) === null || _b === void 0 ? void 0 : _b.length); })) || {};
 });
 
-exports.NavigationLogoutPopup = NavigationLogoutPopup;
-exports.NavigationProfileButton = NavigationProfileButton;
 exports.NavigationV2 = NavigationV2;
-exports.ProfileNavigation = ProfileNavigation;
 exports.getNavMenuContent = getNavMenuContent;
 exports.getNavMenuContentWithCache = getNavMenuContentWithCache;
 exports.getTogetherUserPostsApiPath = getTogetherUserPostsApiPath;