@hhgtech/hhg-components 1.28.86 → 1.28.89

package/build/{index-0c13dde8.js → index-e0e0c14c.js}

@@ -1,48 +1,65 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-0594822f.js');
+var tslib_es6 = require('./tslib.es6-f8a6d852.js');
 var React = require('react');
-var index$2 = require('./index-77324378.js');
+var index$2 = require('./index-fbaabe3e.js');
 var styled = require('styled-components');
-var theme = require('./theme-f35daf01.js');
-var index = require('./index-c40e92e7.js');
-var index$1 = require('./index-8b63bb2b.js');
-var index$4 = require('./index-71b09a48.js');
-var normalizeLink = require('./normalizeLink-22fe20f2.js');
-var routing = require('./routing-235d1ae2.js');
-var index$5 = require('./index-b84e324a.js');
-var index$a = require('./index-431d6475.js');
-var useTranslations = require('./useTranslations-5da685bd.js');
+var theme = require('./theme-4c9d720c.js');
+var index = require('./index-6faac8f8.js');
+var index$1 = require('./index-83b2e376.js');
+var index$3 = require('./index-d0734e53.js');
+var normalizeLink = require('./normalizeLink-c8e0466f.js');
+var routing = require('./routing-4d1adb59.js');
+var index$4 = require('./index-b15ab04c.js');
+var index$9 = require('./index-0971679f.js');
+var useTranslations = require('./useTranslations-a09cfd3b.js');
 var throttle = require('lodash/throttle');
 var core = require('@mantine/core');
 require('@mantine/dates');
-var Subot = require('./Subot-23b8e7fd.js');
-require('./translationsContext-e480c858.js');
+var Subot = require('./Subot-0bc49830.js');
+require('./translationsContext-24b12e79.js');
 var formatString = require('string-format');
 require('@mantine/hooks');
-var utils = require('./utils-2001405c.js');
-var constants = require('./constants-2f8d3168.js');
-var index$3 = require('./index-ac4fef47.js');
+var utils = require('./utils-642deba8.js');
+var constants = require('./constants-11c0b7fa.js');
 var core$1 = require('@hhgtech/icons/core');
-var index_styles = require('./index.styles-30779c66.js');
-var ChevronDown = require('./ChevronDown-b53850df.js');
-var index$6 = require('./index-3c85ea24.js');
-var utils$1 = require('./utils-382019b8.js');
-var constants$1 = require('./constants-da291825.js');
-var index$8 = require('./index-f0dedb1f.js');
-var index$7 = require('./index-bf5df813.js');
-var useIsInit = require('./useIsInit-42717c75.js');
-require('./utils-0966025a.js');
-require('./index.styled-0efdf3dd.js');
-require('./index-c0d42a4a.js');
+var index_styles = require('./index.styles-ee4abc81.js');
+var ChevronDown = require('./ChevronDown-86e4e63a.js');
+var index$5 = require('./index-65e192bf.js');
+var utils$1 = require('./utils-c3c00a65.js');
+var constants$1 = require('./constants-b2d09f91.js');
+var index$7 = require('./index-d0fc47fb.js');
+var index$6 = require('./index-0ec3717f.js');
+var useIsInit = require('./useIsInit-31bc07cf.js');
+require('./utils-90d10764.js');
+require('./index.styled-6808b836.js');
+require('./index-3ed0b5e1.js');
 var dayjs = require('dayjs');
 var relativeTime = require('dayjs/plugin/relativeTime');
-var index$9 = require('./index-4770b309.js');
+var index$8 = require('./index-3ba71733.js');
 var debounce = require('lodash/debounce');
-var core$2 = require('./core-a7ccec35.js');
+var core$2 = require('./core-300a990b.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
 var React__default = /*#__PURE__*/_interopDefault(React);
 var styled__default = /*#__PURE__*/_interopDefault(styled);
 var throttle__default = /*#__PURE__*/_interopDefault(throttle);
@@ -201,9 +218,6 @@ var useStyles = core.createStyles(() => {
         root: {
             textDecoration: 'none',
         },
-        indicatorRoot: {
-            marginRight: core.rem(10),
-        },
         iconText: {
             color: '#fff',
         },
@@ -218,10 +232,9 @@ const CartBadge = (_a) => {
         classNames,
     });
     return typeof count !== 'undefined' ? (React__default["default"].createElement(core.Box, Object.assign({ component: "a", href: getEcomUrl({ path: 'CART', locale }), className: cx(classes.root, className) }, boxProps),
-        React__default["default"].createElement(core.Indicator, { classNames: {
-                root: classes.indicatorRoot,
-            }, withBorder: true, color: 'red', size: 20, disabled: count === 0, label: React__default["default"].createElement(index.Text, { className: classes.iconText, size: "s5" }, count > 99 ? '99+' : count) },
-            React__default["default"].createElement(index$3.Icon.Cart, { size: 24 })))) : null;
+        React__default["default"].createElement(core.Indicator, { withBorder: true, color: 'red', size: 20, disabled: count === 0, label: React__default["default"].createElement(index.Text, { className: classes.iconText, size: "s5" }, count > 99 ? '99+' : count) },
+            React__default["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" },
+                React__default["default"].createElement("path", { d: "M5.308 21.5q-.748 0-1.278-.53a1.74 1.74 0 0 1-.53-1.278V8.308q0-.75.53-1.278.53-.53 1.278-.53H7.5q0-1.873 1.313-3.187Q10.127 2 12 2t3.187 1.313T16.5 6.5h2.192q.749 0 1.278.53.53.53.53 1.278v11.384q0 .749-.53 1.278-.53.53-1.278.53zm0-1.5h13.384a.3.3 0 0 0 .212-.096.3.3 0 0 0 .096-.212V8.308a.3.3 0 0 0-.096-.212.3.3 0 0 0-.212-.096H5.308a.3.3 0 0 0-.212.096.3.3 0 0 0-.096.212v11.384q0 .116.096.212a.3.3 0 0 0 .212.096M9 6.5h6q0-1.25-.875-2.125A2.9 2.9 0 0 0 12 3.5q-1.25 0-2.125.875A2.9 2.9 0 0 0 9 6.5m2.985 7q1.695 0 3.047-1.148 1.35-1.148 1.335-2.606a.74.74 0 0 0-.207-.528.7.7 0 0 0-.527-.218.7.7 0 0 0-.471.182 1 1 0 0 0-.295.506 2.8 2.8 0 0 1-1.036 1.665 2.9 2.9 0 0 1-1.846.647 2.93 2.93 0 0 1-1.854-.647A2.73 2.73 0 0 1 9.1 9.688q-.086-.34-.278-.514A.66.66 0 0 0 8.367 9a.72.72 0 0 0-.534.218.72.72 0 0 0-.216.528q0 1.457 1.336 2.606 1.335 1.148 3.032 1.148", fill: "#2D87F3" }))))) : null;
 };
 
 const StyledDisplayWrapper = styled__default["default"].div `
@@ -293,12 +306,9 @@ const _StyledPopup = styled__default["default"].div `
     z-index: 111;
     height: 100%;
     border: 1px solid #0000001a;
-    ${utils.MediaQueries.mbDown} {
-      > div {
-        border-top-left-radius: 0;
-        border-top-right-radius: 0;
-      }
-    }
+    border-radius: 16px;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
   }
 
   /* min-height: 415px; */
@@ -347,8 +357,8 @@ const _StyledPopupWrapper = styled__default["default"].div `
 const StyledPopupWrapperClass = 'hhgcomp-navprofilebutton-popupwrapper';
 index_styles.getDefaultClassWrapper(_StyledPopupWrapper, StyledPopupWrapperClass);
 const StyledAvatar = styled__default["default"].div `
-  width: 40px;
-  height: 40px;
+  width: 36px;
+  height: 36px;
   cursor: pointer;
 
   img {
@@ -356,8 +366,8 @@ const StyledAvatar = styled__default["default"].div `
   }
 
   .avatar {
-    width: 40px;
-    height: 40px;
+    width: 36px;
+    height: 36px;
     object-fit: cover;
   }
 
@@ -375,8 +385,8 @@ const StyledAvatar = styled__default["default"].div `
 const StyledImageWrapper$1 = styled__default["default"].div `
   display: inline-flex;
   position: relative;
-  width: 40px;
-  height: 40px;
+  width: 36px;
+  height: 36px;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -657,7 +667,7 @@ const ProfileNavigation = ({ className, activeItem: forceActiveItem, navMenuItem
                 key: 'userProfile.nav.card.myBooking',
                 icon: React__default["default"].createElement(NavBookingIcon, { width: "24", height: "24" }),
                 value: 'booking',
-                disabled: !index$4.CARE_LOCALES.includes(locale),
+                disabled: !index$3.CARE_LOCALES.includes(locale),
                 tracking: {
                     action: 'Manage Booking Click',
                 },
@@ -667,21 +677,21 @@ const ProfileNavigation = ({ className, activeItem: forceActiveItem, navMenuItem
                 key: 'userProfile.nav.card.myCommunity',
                 icon: React__default["default"].createElement(NavCommunityIcon, { width: "24", height: "24" }),
                 value: 'myCommunities',
-                disabled: !index$4.TOGETHER_LOCALES.includes(locale),
+                disabled: !index$3.TOGETHER_LOCALES.includes(locale),
                 tracking: {
                     action: 'Community Click',
                 },
                 link: `${SSO_URL}user/my-communities/`,
             },
         ],
-        ...(index$4.ECOM_LOCALES.includes(locale)
+        ...(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$4.ECOM_LOCALES.includes(locale),
+                        disabled: !index$3.ECOM_LOCALES.includes(locale),
                         subMenu: [
                             {
                                 key: 'userProfile.nav.card.ecom.manageOrders',
@@ -928,7 +938,7 @@ const NavigationLogoutPopup = ({ openLogoutPopup, onCloseHandler, onLogoutHandle
         document.body.classList.toggle('noscroll', openLogoutPopup);
     }, [openLogoutPopup]);
     return (React__default["default"].createElement(core.Portal, null,
-        React__default["default"].createElement(index$5.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(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'
@@ -936,8 +946,8 @@ const NavigationLogoutPopup = ({ openLogoutPopup, onCloseHandler, onLogoutHandle
                     : '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$6.Button, { className: "logout-button", color: "tertiary", size: "lg", onClick: onLogoutHandler }, t('logout.popup.button.logout')),
-                    React__default["default"].createElement(index$6.Button, { className: "cancel-button", color: "primary", size: "lg", onClick: onCloseHandler }, t('logout.popup.button.cancel')))))));
+                    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, }) => {
@@ -966,7 +976,7 @@ const NavigationProfileButton = ({ userInfo, siteType, onLoginClick, SSO_URL, cu
             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: 40, className: "user-avatar", src: userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar, color: siteType === 'marryBaby'
+                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'
                         ? theme.theme.mbColors.pink
                         : theme.theme.colors.secondaryBase, placeholderText: name && name.length ? name[0].toUpperCase() : 'A' })),
             React__default["default"].createElement(ProfilePopup, { dispatchLogout: () => {
@@ -1003,17 +1013,17 @@ const NavigationProfileButton = ({ userInfo, siteType, onLoginClick, SSO_URL, cu
                 paddingLeft: 16,
             } },
             React__default["default"].createElement(index.Text, { size: "p3", color: theme.theme.mbColors.pink }, t('navigation.loginJoin')))),
-        React__default["default"].createElement(index$2.Button, { className: "login-btn", size: "md", onClick: onLoginClick, leftIcon: React__default["default"].createElement(core$1.User, { color: "currentColor", isSolid: true, size: 22 }) }, t('navigation.loginJoin'))))));
+        siteType === 'marryBaby' ? (React__default["default"].createElement(index$2.Button, { className: "login-btn", size: "md", onClick: onLoginClick, leftIcon: React__default["default"].createElement(core$1.User, { color: "currentColor", isSolid: true, size: 22 }) }, t('navigation.loginJoin'))) : (React__default["default"].createElement(index$2.Button, { className: "login-btn", size: "md", onClick: onLoginClick, 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$6.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$5.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$6.Button, { className: styles$3.bookingButton, size: "md", color: "primary", dataEventCategory: "Care", dataEventAction: "Navigation Bar Click", dataEventLabel: currentUrl }, btnName)));
+        React__default["default"].createElement(index$5.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"};
@@ -1025,18 +1035,18 @@ const useNavConfig = ({ locale, projectType, siteType, enableBookingBtn, }) => {
             (projectType === 'profile' && siteType === 'marryBaby');
         const enableNavCare = siteType !== 'marryBaby' &&
             projectType !== 'marryBaby' &&
-            index$4.CARE_LOCALES.includes(locale);
+            index$3.CARE_LOCALES.includes(locale);
         const enableNavCareBooking = enableBookingBtn &&
             projectType !== 'marryBaby' &&
             projectType === 'discover' &&
             siteType !== 'marryBaby' &&
-            index$4.CARE_BOOKING_LOCALES.includes(locale);
-        const enableNavTogether = projectType === 'marryBaby' || index$4.TOGETHER_LOCALES.includes(locale);
+            index$3.CARE_BOOKING_LOCALES.includes(locale);
+        const enableNavTogether = projectType === 'marryBaby' || index$3.TOGETHER_LOCALES.includes(locale);
         const enableNavDiscover = true;
         const enableNavHealthTools = true;
         const enableProfileMySaved = true;
-        const enableNavEcom = siteType !== 'marryBaby' && index$4.ECOM_LOCALES.includes(locale);
-        const enableProfileEcom = siteType !== 'marryBaby' && index$4.ECOM_LOCALES.includes(locale);
+        const enableNavEcom = siteType !== 'marryBaby' && index$3.ECOM_LOCALES.includes(locale);
+        const enableProfileEcom = siteType !== 'marryBaby' && index$3.ECOM_LOCALES.includes(locale);
         const enableProfileMyHealth = true;
         const baseUrl = routing.getCurrentBaseUrl(locale, siteType === 'marryBaby');
         let fixBaseUrl = baseUrl;
@@ -1081,7 +1091,7 @@ const NavigationProvider = (_a) => {
         return (props.currentUrl ||
             `https://${props.siteType === 'marryBaby'
                 ? utils$1.domainLocalesMarryBaby[props.locale || 'en-PH']
-                : index$4.domainLocales[props.locale || 'en-PH']}${props.projectType === 'together'
+                : index$3.domainLocales[props.locale || 'en-PH']}${props.projectType === 'together'
                 ? '/community'
                 : props.projectType === 'ecom'
                     ? '/ecom'
@@ -1194,8 +1204,8 @@ const SearchInput = ({ id }) => {
     return (React__default["default"].createElement(index$2.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$4.LOCALE_SPECS[locale || 'en-PH']
-                    ? index$4.LOCALE_SPECS[locale || 'en-PH'].SITE_NAME
+                site: index$3.LOCALE_SPECS[locale || 'en-PH']
+                    ? index$3.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) => {
@@ -1323,30 +1333,21 @@ const StyledViewMore$1 = styled__default["default"].a `
   }
 `;
 
-var styles$1 = {"menuIconWrapper":"wnUb-dV","menuButton":"cjbOxWe","careIconContainer":"gB4rp89","scale":"EDlp5Zf"};
+var styles$1 = {"menuIconWrapper":"wnUb-dV","menuButton":"cjbOxWe","itemNavButton":"-sx0jrx","scale":"EDlp5Zf"};
 
-const CareIcon = () => {
-    return (React__default["default"].createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" },
-        React__default["default"].createElement("path", { d: "M13.475 21.5q-2.5 0-4.25-1.75t-1.75-4.25v-.55q-2.025-.25-3.387-1.8T2.725 9.5V4.65a.87.87 0 0 1 .262-.638.87.87 0 0 1 .638-.262h2.1V3.5a.73.73 0 0 1 .75-.75q.325 0 .538.212a.73.73 0 0 1 .212.538v2a.73.73 0 0 1-.75.75.726.726 0 0 1-.75-.75v-.25h-1.5V9.5q0 1.65 1.175 2.825T8.225 13.5t2.825-1.175T12.225 9.5V5.25h-1.5v.25a.73.73 0 0 1-.75.75.726.726 0 0 1-.75-.75v-2a.73.73 0 0 1 .75-.75q.325 0 .538.212a.73.73 0 0 1 .212.538v.25h2.1a.87.87 0 0 1 .638.262.87.87 0 0 1 .262.638V9.5q0 2.1-1.362 3.65t-3.388 1.8v.55q0 1.875 1.313 3.188Q11.6 20 13.475 20t3.188-1.312q1.312-1.313 1.312-3.188v-1.625a2.6 2.6 0 0 1-1.287-.913 2.4 2.4 0 0 1-.513-1.512q0-1.075.75-1.825t1.8-.75q1.075 0 1.825.75t.75 1.825q0 .85-.512 1.512-.513.663-1.313.913V15.5q0 2.5-1.75 4.25t-4.25 1.75", fill: "#2D87F3", strokeWidth: 0 })));
-};
 const ItemMenu = ({ item, menu }) => {
-    const { containerRef, onContainerFocus, onContainerBlur, onButtonMouseDown, onClose, } = useCSSFocusPopupHelper({
+    const { containerRef, onButtonMouseDown, onClose } = useCSSFocusPopupHelper({
         allowBgScroll: true,
     });
     const isInit = useIsInit.useIsInit();
     if (!item.popupType && item.link) {
         return (React__default["default"].createElement(NewWrapper, { isNew: item.isNew },
-            React__default["default"].createElement("a", { className: `hhgcomp-navigation-itemnav-headeritem ${!isInit ? `menu-handler-${item.id}` : ''} ${item.id === 'care' ? 'force-focus' : ''}`, tabIndex: 0, href: item.link, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link },
-                React__default["default"].createElement("div", { "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link, className: styles$1.menuButton },
-                    item.id === 'care' && (React__default["default"].createElement("div", { className: styles$1.careIconContainer },
-                        React__default["default"].createElement(CareIcon, null))),
-                    item.name))));
+            React__default["default"].createElement("a", { className: `hhgcomp-navigation-itemnav-headeritem ${!isInit ? `menu-handler-${item.id}` : ''}`, tabIndex: 0, href: item.link, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link },
+                React__default["default"].createElement("div", { "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link, className: styles$1.menuButton }, item.name))));
     }
     return (React__default["default"].createElement(NewWrapper, { isNew: item.isNew },
-        React__default["default"].createElement("div", { ref: containerRef, className: `hhgcomp-navigation-itemnav-headeritem ${!isInit ? `menu-handler-${item.id}` : ''} ${item.id === 'care' ? 'force-focus' : ''}`, tabIndex: 0, key: item.id, onBlur: onContainerBlur, onFocus: onContainerFocus, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link },
+        React__default["default"].createElement("div", { ref: containerRef, className: `hhgcomp-navigation-itemnav-headeritem ${!isInit ? `menu-handler-${item.id}` : ''}`, tabIndex: 0, key: item.id, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link },
             React__default["default"].createElement("div", { "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": item.link, onMouseDown: onButtonMouseDown, className: styles$1.menuButton },
-                item.id === 'care' && (React__default["default"].createElement("a", { className: styles$1.careIconContainer, href: normalizeLink.normalizeLinkSlash(item.link + '/') },
-                    React__default["default"].createElement(CareIcon, null))),
                 item.name,
                 item.popupType && (React__default["default"].createElement("div", { className: styles$1.menuIconWrapper },
                     React__default["default"].createElement("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none" },
@@ -1360,7 +1361,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$6.Indicator, { color: "green", label: t('home.navigator.menuItem.new'), size: 20, styles: {
                 root: {
                     paddingRight: 10,
                 },
@@ -1373,7 +1374,7 @@ const Categories = ({ hrefViewMore, titleBtnViewMore, UrlFE, onClosePopup, menuI
     const { siteType } = React.useContext(NavigationContext);
     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 :
+            React__default["default"].createElement(index$7.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) => {
             const href = (item === null || item === void 0 ? void 0 : item.link)
                 ? (item === null || item === void 0 ? void 0 : item.link.startsWith('http'))
@@ -1671,7 +1672,7 @@ const SpotlightNoData = ({ title, link, description, cta, icon }) => {
             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$6.Button, { theme: siteType, className: "survey-contact-submit", size: "md" }, cta)))))));
+                    React__default["default"].createElement(index$5.Button, { theme: siteType, className: "survey-contact-submit", size: "md" }, cta)))))));
 };
 
 const StyledItemGridRight = styled__default["default"].div `
@@ -1718,7 +1719,7 @@ 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$7.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'
@@ -1738,7 +1739,7 @@ const CareSpotlights = ({ spotlights = [], hrefViewMore }) => {
                 right: '1rem',
             } },
             React__default["default"].createElement("a", { href: hrefViewMore },
-                React__default["default"].createElement(index$6.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$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') }))));
 };
 
 const StyledContainerItems$3 = styled__default["default"].div `
@@ -1950,7 +1951,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$5.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$4.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,
@@ -2422,7 +2423,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$4.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$3.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 })))));
@@ -2755,7 +2756,7 @@ const getTogetherUserPostsApiPath = (locale, isMarryBaby, apiDomain, params) =>
         'api/v1/' +
         formatString__default["default"](TOGETHER_PATHS.GET_USER_POSTS, Object.assign(Object.assign({}, params), { websiteUrl: isMarryBaby
                 ? 'https://marrybaby.vn'
-                : `https://${index$4.domainLocales[locale]}` })));
+                : `https://${index$3.domainLocales[locale]}` })));
 };
 const getCareSearchUrl = ({ type, specialtySlug, locale, }) => {
     var _a, _b;
@@ -2800,10 +2801,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$9.Container, null,
+        React__default["default"].createElement(index$8.Container, null,
             !hideCloseBtn && (React__default["default"].createElement("div", { className: styles.container },
                 React__default["default"].createElement(BtnClosePopup, { onClosePopup: onClosePopup }))),
-            React__default["default"].createElement(index$9.Container, { className: styles.gridContainer }, children))));
+            React__default["default"].createElement(index$8.Container, { className: styles.gridContainer }, children))));
 };
 
 const MenuCareList = ({ careSpecialties = [], isOpen, onClose, spotlights = [], }) => {
@@ -2863,7 +2864,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$4.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`;
+    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) || ''}`;
     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,
@@ -2877,6 +2878,69 @@ const MenuHealthToolsList = ({ locale, onClose, isOpen, spotlightHealthTools = [
         React__default["default"].createElement(ToolSpotlights, { spotlightHealthTools: spotlightHealthTools, hrefViewMore: hrefViewMore })));
 };
 
+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({
+        allowBgScroll: true,
+    });
+    React.useEffect(() => {
+        setTimeout(() => {
+            if (item.id === 'care' || item.id === 'ecom') {
+                Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-lottie')); }).then((lottie) => {
+                    setLottie(() => lottie.default);
+                });
+            }
+            if (item.id === 'care') {
+                Promise.resolve().then(function () { return require('./doctor-339f9942.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-f02db1b2.js'); }).then((data) => {
+                    if (data === null || data === void 0 ? void 0 : data.default)
+                        setIconJson(() => data.default);
+                });
+            }
+        }, 500);
+    }, [item.id]);
+    const hasIcon = item.id === 'care' || item.id === 'ecom';
+    const linkOnly = !item.popupType && !!item.link;
+    const Tag = linkOnly ? 'a' : 'div';
+    const buttonStyle = color === 'gray'
+        ? {
+            border: '1px solid #E4E8EC',
+            background: '#F7F9FC',
+        }
+        : {
+            border: '1px solid #BCDEFF',
+            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, onMouseDown: onButtonMouseDown },
+        React__default["default"].createElement(index$2.Button, { variant: "light", leftIcon: Lottie && iconJson ? (linkOnly ? (React__default["default"].createElement(Lottie, { options: {
+                    loop: true,
+                    autoplay: true,
+                    animationData: iconJson,
+                }, height: 28, width: 28 })) : (React__default["default"].createElement("a", { href: normalizeLink.normalizeLinkSlash(item.link + '/') },
+                React__default["default"].createElement(Lottie, { options: {
+                        loop: true,
+                        autoplay: true,
+                        animationData: iconJson,
+                    }, height: 28, width: 28 })))) : hasIcon ? (React__default["default"].createElement("div", { style: {
+                    width: 28,
+                    height: 28,
+                } })) : null, styles: {
+                leftIcon: {
+                    marginRight: 4,
+                },
+            }, style: Object.assign(Object.assign({}, buttonStyle), { padding: '6px 8px 6px 8px', color: '#262626', height: 'unset' }), size: "sm", rightIcon: item.popupType ? (React__default["default"].createElement("div", { className: styles$1.menuIconWrapper },
+                React__default["default"].createElement("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none" },
+                    React__default["default"].createElement("path", { d: "M11.5 7.5L9 10L6.5 7.5", stroke: "#202135", strokeWidth: "1.33", strokeLinecap: "round", strokeLinejoin: "round" })))) : (React__default["default"].createElement("div", null)) }, item.name),
+        item.popupType === 'categories' ? (React__default["default"].createElement(MenuCategoriesList, { categories: categories === null || categories === void 0 ? void 0 : categories.items, spotlightsList: categories === null || categories === void 0 ? void 0 : categories.spotlights, onClose: onClose })) : item.popupType === 'tools' ? (React__default["default"].createElement(MenuHealthToolsList, { locale: locale, healthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.items, spotlightHealthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.spotlights, onClose: onClose })) : item.popupType === 'together' ? (React__default["default"].createElement(MenuCommunitiesList, { communities: together === null || together === void 0 ? void 0 : together.items, spotlights: together === null || together === void 0 ? void 0 : together.spotlights, onClose: onClose })) : item.popupType === 'care' ? (React__default["default"].createElement(MenuCareList, { careSpecialties: care === null || care === void 0 ? void 0 : care.items, spotlights: care === null || care === void 0 ? void 0 : care.spotlights, onClose: onClose })) : null));
+};
+
 const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent, }) => {
     var _a;
     const { siteType, isMobile = false, locale, sitewideBanner, sitewideBannerShown = true, sponsorComponent, onBookingClick, currentUrl, onLoginClick, cartNumber, 
@@ -2904,7 +2968,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
             : currentLocation;
     };
     const logoType = siteType === 'helloSites'
-        ? (_a = index$4.LOCALE_SPECS[locale]) === null || _a === void 0 ? void 0 : _a.LOGO_TYPE
+        ? (_a = index$3.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"](() => {
@@ -2941,6 +3005,8 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
             scrolling();
     }, [isMobile]);
     const isShowingSiteWideBanner = sitewideBannerShown && !!sitewideBanner;
+    const ecomNavItem = menuItems.find((m) => m.id === 'ecom');
+    const careNavItem = menuItems.find((m) => m.id === 'care');
     return (React__default["default"].createElement(StyledHeaderWrapper, { "data-site-type": siteType, "data-sponsored": isSponsored, "data-sitewide-banner-shown": isShowingSiteWideBanner, "data-header-type": "home", "data-collapsed": isCollapsed, "data-is-displayed": true, id: "site-header", ref: headerRef },
         sitewideBanner,
         React__default["default"].createElement(StyledHeader, { "data-site-type": siteType },
@@ -2950,18 +3016,28 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
                         flexShrink: 0,
                     }, href: HOME_PAGE_URL },
                     React__default["default"].createElement("div", null,
-                        React__default["default"].createElement(index$a.Logo, { style: {
+                        React__default["default"].createElement(index$9.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' })))),
                 !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 })))),
+                !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') })))),
                 React__default["default"].createElement(StyledProfileNavGroup, null,
-                    React__default["default"].createElement(CartBadge, { "data-cart-menu": "true", "data-event-category": "Ecommerce", "data-event-action": "Cart Click", "data-event-label": currentUrl, count: cartNumber, locale: locale }),
-                    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 }))),
+                    !isMobile && (React__default["default"].createElement(React__default["default"].Fragment, null,
+                        ecomNavItem ? React__default["default"].createElement(ItemNavButton, { item: ecomNavItem }) : null,
+                        careNavItem ? (React__default["default"].createElement(ItemNavButton, { item: careNavItem, color: "gray" })) : null,
+                        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, { 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,
+                                width: 0,
+                                border: 'none',
+                                borderLeft: '1px solid #E4E8EC',
+                            } })),
+                        React__default["default"].createElement(CartBadge, { "data-cart-menu": "true", "data-event-category": "Ecommerce", "data-event-action": "Cart Click", "data-event-label": currentUrl, count: cartNumber, locale: locale })))))),
         sponsorComponent
             ? !React__default["default"].isValidElement(sponsorComponent)
                 ? sponsorComponent
@@ -3098,7 +3174,7 @@ const useNavServices = () => {
             _services.push({
                 name: t('home.navigator.menuItem.healthTools'),
                 id: 'tools',
-                link: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = index$4.STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_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) || ''}`,
                 thumbnail: isMarryBaby
                     ? index$1.CommonGAssets.getAssetPath('healthtools-mb.svg')
                     : index$1.CommonGAssets.getAssetPath('nav-icons/health-tools.svg'),
@@ -3214,26 +3290,26 @@ const getNavMenuContent = (locale) => tslib_es6.__awaiter(void 0, void 0, void 0
             };
         }
         catch (_z) { }
-        if (isMarryBaby || index$4.TOGETHER_LOCALES.includes(locale)) {
+        if (isMarryBaby || index$3.TOGETHER_LOCALES.includes(locale)) {
             try {
                 const [communities, spotlightPosts] = yield Promise.all([
-                    fetch(normalizeLink.normalizeLinkSlash(`${routing.getTogetherApiDomain()}/api/v1/community?website_url=https://${index$4.domainLocales[locale]}`)).then((res) => res.json()),
-                    fetch(normalizeLink.normalizeLinkSlash(`${routing.getTogetherApiDomain()}/api/v1/options?website_url=https://${index$4.domainLocales[locale]}&meta_key=popular_post`)).then((res) => res.json()),
+                    fetch(normalizeLink.normalizeLinkSlash(`${routing.getTogetherApiDomain()}/api/v1/community?website_url=https://${index$3.domainLocales[locale]}`)).then((res) => res.json()),
+                    fetch(normalizeLink.normalizeLinkSlash(`${routing.getTogetherApiDomain()}/api/v1/options?website_url=https://${index$3.domainLocales[locale]}&meta_key=popular_post`)).then((res) => res.json()),
                 ]);
                 res.together = {
-                    items: ((_o = (_m = (_l = communities === null || communities === void 0 ? void 0 : communities.data) === null || _l === void 0 ? void 0 : _l.communities) === null || _m === void 0 ? void 0 : _m.map) === null || _o === void 0 ? void 0 : _o.call(_m, index$5.formatCommunity)) || [],
-                    spotlights: ((_r = (_q = (_p = spotlightPosts === null || spotlightPosts === void 0 ? void 0 : spotlightPosts.data) === null || _p === void 0 ? void 0 : _p.posts) === null || _q === void 0 ? void 0 : _q.map) === null || _r === void 0 ? void 0 : _r.call(_q, index$5.formatPost)) || [],
+                    items: ((_o = (_m = (_l = communities === null || communities === void 0 ? void 0 : communities.data) === null || _l === void 0 ? void 0 : _l.communities) === null || _m === void 0 ? void 0 : _m.map) === null || _o === void 0 ? void 0 : _o.call(_m, index$4.formatCommunity)) || [],
+                    spotlights: ((_r = (_q = (_p = spotlightPosts === null || spotlightPosts === void 0 ? void 0 : spotlightPosts.data) === null || _p === void 0 ? void 0 : _p.posts) === null || _q === void 0 ? void 0 : _q.map) === null || _r === void 0 ? void 0 : _r.call(_q, index$4.formatPost)) || [],
                 };
             }
             catch (_0) { }
         }
-        if (index$4.CARE_LOCALES.includes(locale)) {
+        if (index$3.CARE_LOCALES.includes(locale)) {
             try {
                 const [specialties, hospitals] = yield Promise.all([
                     fetch(normalizeLink.normalizeLinkSlash(routing.getCareApiDomain() +
-                        `/api/options/setting_menu?site=${index$4.domainLocales[locale]}&type=0`)).then((res) => res.json()),
+                        `/api/options/setting_menu?site=${index$3.domainLocales[locale]}&type=0`)).then((res) => res.json()),
                     fetch(normalizeLink.normalizeLinkSlash(routing.getCareApiDomain() +
-                        `/api/options/setting_menu?site=${index$4.domainLocales[locale]}&type=1`)).then((res) => res.json()),
+                        `/api/options/setting_menu?site=${index$3.domainLocales[locale]}&type=1`)).then((res) => res.json()),
                 ]);
                 res.care = {
                     items: ((_v = (_u = (_t = (_s = specialties === null || specialties === void 0 ? void 0 : specialties._data) === null || _s === void 0 ? void 0 : _s.setting_menu) === null || _t === void 0 ? void 0 : _t.menu_specialty) === null || _u === void 0 ? void 0 : _u.map) === null || _v === void 0 ? void 0 : _v.call(_u, formatSpecialties)) || [],