@hhgtech/hhg-components 1.29.558 → 1.29.559-beta-2

package/build/esm/{index-394313dc.js → index-b309710b.js}

@@ -1,56 +1,56 @@
-import { _ as __awaiter, a as __rest } from './tslib.es6-3550cecb.js';
+import { _ as __awaiter, a as __rest } from './tslib.es6-cdcdb9ff.js';
 import * as React from 'react';
-import React__default, { useContext, useState, useCallback, useMemo, useEffect, useRef } from 'react';
-import { i as isInternalLink, V as VideoItem, S as SiteWideBanner, L as LanguageSwitcher } from './SiteWideBanner-e68a26c3.js';
-import { b as basePath, L as LOCALE_SPECS, S as STATIC_PAGES, Z as ZINDEX_HEADER, V as VIDEO_LOCALES, a as LOCALE_HAS_COMMUNITY_SITE, C as CARE_LOCALES } from './index-3fc3385c.js';
-import { r as resolveDiscoverNavLink, n as normalizeLink, e as normalizeLinkSlash, g as getCurrentBaseUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain, d as getCareApiDomain } from './normalizeLink-bace5508.js';
-import { f as formatArticle, a as formatCommunity, b as formatPost } from './dataTransform-49babbdc.js';
+import React__default, { useContext, useState, useRef, useCallback, useMemo, useEffect } from 'react';
+import { i as isInternalLink, V as VideoItem, S as SiteWideBanner, L as LanguageSwitcher } from './SiteWideBanner-4ba948e1.js';
+import { b as basePath, L as LOCALE_SPECS, S as STATIC_PAGES, Z as ZINDEX_HEADER, V as VIDEO_LOCALES, a as LOCALE_HAS_COMMUNITY_SITE, C as CARE_LOCALES } from './index-f9cfcbae.js';
+import { w as withLocalePathPrefix, r as resolveDiscoverNavLink, a as normalizeLink, n as normalizeLinkSlash, b as getCurrentBaseUrl, e as getDiscoverApiDomain, d as getTogetherApiDomain, h as getCareApiDomain } from './routing-570ec474.js';
+import { f as formatArticle, a as formatCommunity, b as formatPost } from './dataTransform-2a3c7950.js';
 import { Close, Logo } from '@hhgtech/icons/core';
-import { I as Input, D as DEBOUNCED_TIME } from './index-2e7972c2.js';
-import './translationsContext-9130eed4.js';
-import { L as LOCALE } from './Locale-920710c5.js';
+import { I as Input, D as DEBOUNCED_TIME } from './index-f6f63edb.js';
+import './translationsContext-7b1ffeba.js';
+import { L as LOCALE } from './Locale-66042c79.js';
 import { keyframes } from '@emotion/react';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { a as NavigationContext, u as useCSSFocusPopupHelper, N as NavigationProfileButton, b as NavigationProvider } from './index-99211ceb.js';
+import { a as NavigationContext, u as useCSSFocusPopupHelper, N as NavigationProfileButton, b as NavigationProvider } from './index-f10e16bb.js';
 import { ArrowRight, ChatAi } from '@hhgtech/icons/other';
 import { createStyles, Box, Indicator, useMantineTheme, clsx, Flex } from '@mantine/core';
-import { L as Logo$1 } from './index-4e1120cd.js';
+import { L as Logo$1 } from './index-150bc4ad.js';
 import throttle from 'lodash/throttle';
 import '@mantine/dates';
-import { V as VideoType } from './index-2037d8b3.js';
-import { C as CommonGAssets } from './index-e46bb798.js';
-import './index-1fc823ab.js';
-import { T as Text } from './index-ebe6c97f.js';
-import { B as Button } from './index-da9d347e.js';
-import './index-cd6c853a.js';
-import './index.styles-53d6af5f.js';
+import { V as VideoType } from './index-1865f8cf.js';
+import { C as CommonGAssets } from './index-1745a270.js';
+import './index-485a2408.js';
+import { T as Text } from './index-745219b8.js';
+import { B as Button } from './index-c50b46f9.js';
+import './index-b093c227.js';
+import './index.styles-0fbc6a4a.js';
 import '@mantine/hooks';
-import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-8e8be0d6.js';
-import './index-277000a9.js';
-import { L as LOCALISED_SLUGS, C as CARE_BASE_PATH } from './constants-49af42a6.js';
-import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-011370e8.js';
-import { L as LOCALISED_SLUGS$1 } from './constants-140b143a.js';
-import { I as Indicator$1 } from './index-6e065485.js';
-import { u as useTranslations } from './index-77b468b9.js';
-import { u as useIsInit, a as useCartCareService } from './useCartCareService-13cc4922.js';
-import { L as LOCALIZED_SLUGS } from './constants-85bf9872.js';
+import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-35237fc5.js';
+import './index-26e10db9.js';
+import { L as LOCALISED_SLUGS, C as CARE_BASE_PATH } from './constants-f798e08c.js';
+import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-716da79d.js';
+import { L as LOCALISED_SLUGS$1 } from './constants-548b8c1a.js';
+import { I as Indicator$1 } from './index-e8923390.js';
+import { u as useTranslations } from './index-2f9c78a2.js';
+import { u as useIsInit, a as useCartCareService } from './useCartCareService-1a6c0ce1.js';
+import { L as LOCALIZED_SLUGS } from './constants-169bd4be.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
-import { B as Button$1 } from './index-8e53d9a1.js';
-import { H as Heading } from './index-2566eff8.js';
-import { g as getCareSearchUrl, h as hexToRgb, r as rgbToHsb, a as hsbToRgb, f as formatCategory, b as formatSpotlightsList, c as checkAvailableSpotlight, d as formatHealthTool, e as formatVideoItem, i as formatSpecialties, j as formatHospital } from './utils-029a863d.js';
-import { C as Container } from './index-ceb5bd0b.js';
-import { b as useResolvedCaptureUrls } from './useResolvedCaptureUrls-09f50d68.js';
+import { B as Button$1 } from './index-1ae61967.js';
+import { H as Heading } from './index-3d03cb56.js';
+import { g as getCareSearchUrl, h as hexToRgb, r as rgbToHsb, a as hsbToRgb, f as formatCategory, b as formatSpotlightsList, c as checkAvailableSpotlight, d as formatHealthTool, e as formatVideoItem, i as formatSpecialties, j as formatHospital } from './utils-83da301c.js';
+import { C as Container } from './index-25b010c2.js';
+import { b as useResolvedCaptureUrls } from './useResolvedCaptureUrls-0a6e6ea1.js';
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
-import { U as UserAvatar } from './index-e0c5aae6.js';
+import { U as UserAvatar } from './index-0b0586bc.js';
 import get from 'lodash/get';
-import { Z as Z_INDEX, D as DEFAULT_HEADER_HEIGHT_MOBILE, a as DEFAULT_HEADER_HEIGHT_DESKTOP } from './constants-6ea06354.js';
+import { Z as Z_INDEX, D as DEFAULT_HEADER_HEIGHT_MOBILE, a as DEFAULT_HEADER_HEIGHT_DESKTOP } from './constants-8ce5e238.js';
 import isEmpty from 'lodash/isEmpty';
-import { C as CartCareButton } from './index-e8351a12.js';
+import { C as CartCareButton } from './index-606ec788.js';
 import debounce from 'lodash/debounce';
 import { domainLocales } from './constantsDomainLocales.js';
-import { g as getDataWithCache } from './core-7ea0854e.js';
+import { g as getDataWithCache } from './core-1a9851c5.js';
 
 const HamburgerWhite = (props) => (React.createElement("svg", Object.assign({ width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
     React.createElement("path", { d: "M4 12H20", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
@@ -97,7 +97,8 @@ const applyHelloWellnessNavCategories = ({ helloWellness, categoryItems = [], ca
     var _a, _b, _c;
     const helloWellnessSpotlightMenu = (_b = (_a = helloWellness === null || helloWellness === void 0 ? void 0 : helloWellness.settings) === null || _a === void 0 ? void 0 : _a.menu) === null || _b === void 0 ? void 0 : _b.spotlightMenu;
     const helloWellnessCategory = (_c = helloWellness === null || helloWellness === void 0 ? void 0 : helloWellness.settings) === null || _c === void 0 ? void 0 : _c.helloWellnessCategory;
-    const helloWellnessCategoryPermalink = `${basePath}/hello-wellness/`;
+    // Locale path prefix is applied when rendering the URL.
+    const helloWellnessCategoryPermalink = '/hello-wellness/';
     const helloWellnessSpotlightPermalink = (helloWellnessSpotlightMenu === null || helloWellnessSpotlightMenu === void 0 ? void 0 : helloWellnessSpotlightMenu.url) || helloWellnessCategoryPermalink;
     const spotlights = categorySpotlights.map((item) => (Object.assign(Object.assign({}, item), { image: item.image || DEFAULT_SPOTLIGHT_IMAGE })));
     const helloWellnessSpotlightMenuItem = {
@@ -271,33 +272,61 @@ const StyledTextAnimation = styled.p `
 `;
 
 const HHG_SEARCH_BACK_KEY = 'hhg_search_history';
+const getSearchSourceParam = (projectType) => {
+    if (projectType === 'together') {
+        return 'community';
+    }
+    if (projectType === 'discover') {
+        if (typeof window !== 'undefined' &&
+            window.location.pathname.startsWith('/health-tools/')) {
+            return 'health-tools';
+        }
+        return projectType;
+    }
+    return '';
+};
+const buildSearchPageUrl = (searchValue = '', projectType) => {
+    const searchParams = new URLSearchParams(typeof window !== 'undefined' ? window.location.search : '');
+    searchParams.set('source', getSearchSourceParam(projectType));
+    searchParams.set('s', searchValue);
+    searchParams.delete('page');
+    return `/search/?${searchParams.toString()}`;
+};
 const SearchInput = ({ id, isMobile = false, isHomepage = false, projectType, isRedirectSearchPage = false, }) => {
-    const { locale, siteType, isWinCashBackTheme: winCashBackTheme, } = useContext(NavigationContext);
+    const { locale, siteType, isWinCashBackTheme: winCashBackTheme, searchRouterPush, searchRouterPrefetch, } = useContext(NavigationContext);
     const [keyword, setKeyword] = useState('');
     const [isFocused, setIsFocused] = useState(false);
     const [eventCategoryTracking, setEventCategoryTracking] = useState('Search From Another Page');
     const [currentTextIndex, setCurrentTextIndex] = useState(0);
     const { t } = useTranslations();
-    const goToSearchPage = useCallback((searchValue = '') => {
-        let sourceParam = '';
-        if (projectType === 'together') {
-            sourceParam = 'community';
+    const hasPrefetchedRef = useRef(false);
+    const shouldRedirectOnInteract = (isMobile && isHomepage) || isRedirectSearchPage;
+    const prefetchSearchPage = useCallback(() => {
+        if (hasPrefetchedRef.current || typeof window === 'undefined') {
+            return;
         }
-        if (projectType === 'discover') {
-            if (window.location.pathname.startsWith('/health-tools/')) {
-                sourceParam = 'health-tools';
-            }
-            else {
-                sourceParam = projectType;
-            }
+        hasPrefetchedRef.current = true;
+        const searchUrl = buildSearchPageUrl('', projectType);
+        searchRouterPrefetch === null || searchRouterPrefetch === void 0 ? void 0 : searchRouterPrefetch(searchUrl);
+        // Browser document prefetch as fallback / warm cache for hard navigations
+        if (!document.querySelector(`link[data-hhg-prefetch-search]`)) {
+            const link = document.createElement('link');
+            link.rel = 'prefetch';
+            link.as = 'document';
+            link.href = searchUrl;
+            link.setAttribute('data-hhg-prefetch-search', 'true');
+            document.head.appendChild(link);
         }
+    }, [projectType, searchRouterPrefetch]);
+    const goToSearchPage = useCallback((searchValue = '') => {
         localStorage.setItem(HHG_SEARCH_BACK_KEY, window.location.href);
-        const searchParams = new URLSearchParams(window.location.search);
-        searchParams.set('source', sourceParam);
-        searchParams.set('s', searchValue);
-        searchParams.delete('page');
-        window.location.href = `/search/?${searchParams.toString()}`;
-    }, [projectType]);
+        const searchUrl = buildSearchPageUrl(searchValue, projectType);
+        if (searchRouterPush) {
+            searchRouterPush(searchUrl);
+            return;
+        }
+        window.location.href = searchUrl;
+    }, [projectType, searchRouterPush]);
     const debouncedTime = useMemo(() => {
         return ALLOW_SHOW_SEARCH_ANIMATION.includes(locale)
             ? 0
@@ -324,6 +353,13 @@ const SearchInput = ({ id, isMobile = false, isHomepage = false, projectType, is
             setKeyword(searchValue);
         }
     }, []);
+    // Prefetch search page on mobile homepage so focus/click redirect feels faster
+    useEffect(() => {
+        if (!shouldRedirectOnInteract) {
+            return;
+        }
+        prefetchSearchPage();
+    }, [shouldRedirectOnInteract, prefetchSearchPage]);
     useEffect(() => {
         if (!keyword && ALLOW_SHOW_SEARCH_ANIMATION.includes(locale)) {
             const texts = TEXT_PLACEHOLDER_INPUT[locale];
@@ -358,20 +394,20 @@ const SearchInput = ({ id, isMobile = false, isHomepage = false, projectType, is
         React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", style: {
                 verticalAlign: 'bottom',
             } },
-            React__default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.3097 9.06111C3.3097 5.88483 5.88458 3.30994 9.06087 3.30994C12.2372 3.30994 14.812 5.88483 14.812 9.06111C14.812 12.2374 12.2372 14.8123 9.06087 14.8123C5.88458 14.8123 3.3097 12.2374 3.3097 9.06111ZM9.06087 1.66675C4.97707 1.66675 1.6665 4.97732 1.6665 9.06111C1.6665 13.1449 4.97707 16.4555 9.06087 16.4555C10.8067 16.4555 12.4112 15.8505 13.6761 14.8387L16.9305 18.0931C17.2514 18.4139 17.7716 18.4139 18.0924 18.0931C18.4133 17.7722 18.4133 17.252 18.0924 16.9312L14.8381 13.6768C15.8501 12.4118 16.4552 10.8071 16.4552 9.06111C16.4552 4.97732 13.1447 1.66675 9.06087 1.66675Z", fill: "#8C8C8C" })))) : (React__default.createElement(StyleSearchInputWrapper, null,
+            React__default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.3097 9.06111C3.3097 5.88483 5.88458 3.30994 9.06087 3.30994C12.2372 3.30994 14.812 5.88483 14.812 9.06111C14.812 12.2374 12.2372 14.8123 9.06087 14.8123C5.88458 14.8123 3.3097 12.2374 3.3097 9.06111ZM9.06087 1.66675C4.97707 1.66675 1.6665 4.97732 1.6665 9.06111C1.6665 13.1449 4.97707 16.4555 9.06087 16.4555C10.8067 16.4555 12.4112 15.8505 13.6761 14.8387L16.9305 18.0931C17.2514 18.4139 17.7716 18.4139 18.0924 18.0931C18.4133 17.7722 18.4133 17.252 18.0924 16.9312L14.8381 13.6768C15.8501 12.4118 16.4552 10.8071 16.4552 9.06111C16.4552 4.97732 13.1447 1.66675 9.06087 1.66675Z", fill: "#8C8C8C" })))) : (React__default.createElement(StyleSearchInputWrapper, { onPointerDown: prefetchSearchPage },
         React__default.createElement(StyleInput, { className: "fake-search-input", name: 'search-input-menu-service' + id, size: "md", "data-event-category": eventCategoryTracking, "data-event-action": "Search", "data-event-label": keyword, placeholder: getPlaceholder, onChange: setKeyword, debouncedTime: debouncedTime, value: keyword, onKeyDown: (e) => e.key === 'Enter' &&
                 goToSearchPage(e.target.value), onBlur: () => {
                 setIsFocused(false);
                 setCurrentTextIndex(0);
             }, type: "search", onFocus: (e) => {
                 e.preventDefault();
-                if ((isMobile && isHomepage) || isRedirectSearchPage) {
+                if (shouldRedirectOnInteract) {
                     goToSearchPage('');
                 }
                 setIsFocused(true);
             }, rightSection: keyword ? (React__default.createElement("div", { className: "close-icon-wrapper", onClick: () => setKeyword(''), "data-event-category": "Search Page", "data-event-action": "Delete Search" },
                 React__default.createElement(Close, { size: 17, color: theme.colors.white }))) : winCashBackTheme ? (React__default.createElement(StarPair, { className: "star-pair-icon" })) : (''), icon: React__default.createElement("a", { "data-event-category": "Search Button", "data-event-action": "Click", className: "search-icon-btn", onClick: () => {
-                    if ((isMobile && isHomepage) || isRedirectSearchPage) {
+                    if (shouldRedirectOnInteract) {
                         goToSearchPage('');
                     }
                 } },
@@ -958,17 +994,23 @@ const StyledViewMore = styled.a `
 `;
 
 const Categories = ({ hrefViewMore, titleBtnViewMore, UrlFE, onClosePopup, menuItems, headingTitle, activeItem, }) => {
-    const { siteType } = useContext(NavigationContext);
+    const { siteType, locale, configs: { statics }, } = useContext(NavigationContext);
+    const homePageUrl = (statics === null || statics === void 0 ? void 0 : statics.HOME_PAGE_URL) || '';
     return (React__default.createElement(StyledItemGridLeft, null,
         React__default.createElement("div", null,
             React__default.createElement(StyledHeading, null,
                 React__default.createElement(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)
+                const rawHref = (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('/')}/`
                     : '/';
+                const isDiscoverHref = !!homePageUrl &&
+                    (UrlFE === homePageUrl || rawHref.startsWith(homePageUrl));
+                const href = isDiscoverHref
+                    ? withLocalePathPrefix(rawHref, locale)
+                    : rawHref;
                 return (React__default.createElement(CategoriesItem, { key: index, menuItem: item, href: href, activeItem: activeItem, siteType: siteType, onClick: onClosePopup }));
             })),
         titleBtnViewMore && (React__default.createElement(StyledViewMore, { "data-theme": siteType, style: { textDecoration: 'none' }, href: hrefViewMore, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": hrefViewMore },
@@ -1166,12 +1208,12 @@ const Item$3 = ({ item, index = 0 }) => {
 
 const CategorySpotlights = ({ spotlightsList = [], hrefViewMore }) => {
     const { t } = useTranslations();
-    const { configs: { statics }, } = useContext(NavigationContext);
+    const { locale, configs: { statics }, } = useContext(NavigationContext);
     const spotlightPermalinks = useMemo(() => spotlightsList.map((spotlight) => spotlight.permalink), [spotlightsList]);
     const resolvedPermalinks = useResolvedCaptureUrls(spotlightPermalinks);
     return (React__default.createElement(Spotlights, { title: t('home.navigator.menu.spotlights'), viewMore: t('home.navigator.menu.spotlights.seeAll'), link: hrefViewMore, dataEventAction: "Spotlight See More Click" }, spotlightsList.length !== 0 ? (React__default.createElement(StyledContainerItems$4, null, spotlightsList === null || spotlightsList === void 0 ? void 0 : spotlightsList.slice(0, 4).map((spotlight, index) => (React__default.createElement(Item$3, { key: index, index: index, item: {
             id: spotlight.id,
-            link: resolveDiscoverNavLink(statics.HOME_PAGE_URL, resolvedPermalinks[index] || spotlight.permalink),
+            link: resolveDiscoverNavLink(statics.HOME_PAGE_URL, resolvedPermalinks[index] || spotlight.permalink, locale),
             title: spotlight.name,
             banner: spotlight.image,
             buttonDisplay: spotlight.buttonDisplay,
@@ -1182,7 +1224,7 @@ const MenuCategoriesList = ({ categories = [], spotlightsList = [], onClose, isO
     const { t } = useTranslations();
     const { locale, configs: { statics }, } = useContext(NavigationContext);
     return (React__default.createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
-        React__default.createElement(Categories, { hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/categories/`, UrlFE: statics.HOME_PAGE_URL, onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allCategories'), menuItems: (categories === null || categories === void 0 ? void 0 : categories.map((cat) => {
+        React__default.createElement(Categories, { hrefViewMore: withLocalePathPrefix(`${statics.HOME_PAGE_URL}/categories/`, locale), UrlFE: statics.HOME_PAGE_URL, onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allCategories'), menuItems: (categories === null || categories === void 0 ? void 0 : categories.map((cat) => {
                 if (!cat)
                     return {};
                 return {
@@ -1191,7 +1233,7 @@ const MenuCategoriesList = ({ categories = [], spotlightsList = [], onClose, isO
                     thumbnail: cat.iconUrl || null,
                 };
             })) || [], headingTitle: t('home.navigator.menuItem.healthCategories') }),
-        React__default.createElement(CategorySpotlights, { spotlightsList: spotlightsList, hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/spotlight/` })));
+        React__default.createElement(CategorySpotlights, { spotlightsList: spotlightsList, hrefViewMore: withLocalePathPrefix(`${statics.HOME_PAGE_URL}/spotlight/`, locale) })));
 };
 
 const StyledContainerItems$3 = styled.div `
@@ -1497,13 +1539,13 @@ const StyledContentWrapper$1 = styled.div `
 
 const Item$1 = ({ item, index = 0 }) => {
     const { t } = useTranslations();
-    const { configs: { statics }, } = useContext(NavigationContext);
+    const { locale, configs: { statics }, } = useContext(NavigationContext);
     if (!item)
         return null;
     const link = item.link
-        ? item.link.startsWith('http')
+        ? withLocalePathPrefix(item.link.startsWith('http')
             ? item.link
-            : `${statics.HOME_PAGE_URL}${item.link}`
+            : `${statics.HOME_PAGE_URL}${item.link}`, locale)
         : undefined;
     return (React__default.createElement(StyledItem$2, { href: link, "data-event-category": "Hamburger Navigation", "data-event-action": `Engage Click ${index + 1}`, "data-event-label": link },
         item.isMobileAppTool && React__default.createElement(Phone, { size: 20, className: "phone-badge" }),
@@ -1729,13 +1771,13 @@ const StyledWrapName = styled.div `
 
 const ItemMarryBaby = ({ item, index = 0, color }) => {
     const { t } = useTranslations();
-    const { configs: { statics }, } = useContext(NavigationContext);
+    const { locale, configs: { statics }, } = useContext(NavigationContext);
     if (!item)
         return null;
     const link = item.link
-        ? item.link.startsWith('http')
+        ? withLocalePathPrefix(item.link.startsWith('http')
             ? item.link
-            : `${statics.HOME_PAGE_URL}${item.link}`
+            : `${statics.HOME_PAGE_URL}${item.link}`, locale)
         : undefined;
     const renderIcon = () => (React__default.createElement(StyledImageCard, null,
         React__default.createElement("img", { loading: "lazy", alt: item.title, src: item.icon || '/images/avatar.jpg' })));
@@ -1775,14 +1817,14 @@ const MenuHealthToolsList = ({ locale, onClose, isOpen, spotlightHealthTools = [
     var _a;
     const { t } = useTranslations();
     const { configs: { statics }, } = useContext(NavigationContext);
-    const hrefViewMore = `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`;
+    const hrefViewMore = withLocalePathPrefix(`${statics.HOME_PAGE_URL}${((_a = STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`, locale);
     return (React__default.createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
         React__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,
                 link: t.link
-                    ? t.link.startsWith('http')
+                    ? withLocalePathPrefix(t.link.startsWith('http')
                         ? t.link
-                        : `${statics.HOME_PAGE_URL}${t.link}`
+                        : `${statics.HOME_PAGE_URL}${t.link}`, locale)
                     : undefined,
                 thumbnail: t.icon,
                 isMobileAppTool: t.isMobileAppTool,
@@ -1839,7 +1881,7 @@ const MenuVideoList = ({ spotlightsList = [], onClose, isOpen }) => {
         // },
     ], []);
     return (React__default.createElement(PopupWrapper, { onClosePopup: onClose, isDisplay: isOpen, isNavMenu: true },
-        React__default.createElement(Categories, { hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/videos/`, UrlFE: statics.HOME_PAGE_URL, onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allVideos'), menuItems: listing, headingTitle: t('home.navigator.menuItem.videoCategories') }),
+        React__default.createElement(Categories, { hrefViewMore: withLocalePathPrefix(`${statics.HOME_PAGE_URL}/videos/`, locale), UrlFE: statics.HOME_PAGE_URL, onClosePopup: onClose, titleBtnViewMore: t('home.navigator.menuItem.allVideos'), menuItems: listing, headingTitle: t('home.navigator.menuItem.videoCategories') }),
         React__default.createElement(VideoSpotlights, { spotlightsList: spotlightsList })));
 };
 
@@ -2096,8 +2138,8 @@ const MenuServiceList = ({ closePopup, menuItems = [], extraMenuItems = [], proj
                     ? undefined
                     : t('home.navigator.menuItem.allCategories'), onClosePopup: closePopup, activeItem: activeMenuService }),
             !!(extraMenuItems === null || extraMenuItems === void 0 ? void 0 : extraMenuItems.length) && (React__default.createElement(ExtraCategories, { menuItems: extraMenuItems, siteType: siteType, onClick: closePopup })),
-            activeMenuService === 'categories' && (React__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.createElement(ToolSpotlights, { spotlightHealthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.spotlights, hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}` })),
+            activeMenuService === 'categories' && (React__default.createElement(CategorySpotlights, { spotlightsList: (categories === null || categories === void 0 ? void 0 : categories.spotlights) || [], hrefViewMore: withLocalePathPrefix(`${statics.HOME_PAGE_URL}/spotlight/`, locale) })),
+            activeMenuService === 'tools' && (React__default.createElement(ToolSpotlights, { spotlightHealthTools: healthTools === null || healthTools === void 0 ? void 0 : healthTools.spotlights, hrefViewMore: withLocalePathPrefix(`${statics.HOME_PAGE_URL}${((_a = STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`, locale) })),
             activeMenuService === 'care' && (React__default.createElement(CareSpotlights, { spotlights: care === null || care === void 0 ? void 0 : care.spotlights, hrefViewMore: `${statics.CARE_URL_FE}/${(_b = LOCALIZED_SLUGS[locale]) === null || _b === void 0 ? void 0 : _b.SPECIALTIES}` })),
             activeMenuService === 'together' && (React__default.createElement(CommunitySpotlights, { spotlights: together === null || together === void 0 ? void 0 : together.spotlights })),
             activeMenuService === 'ecom' && (React__default.createElement(EcomSpotlights, { helpfulUrls: ecom === null || ecom === void 0 ? void 0 : ecom.helpfulUrls })),
@@ -2713,9 +2755,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
                             }, type: logoType, badge: locale === 'id-ID' && (React__default.createElement("img", { src: CommonGAssets.getAssetPath('sehat-badge.png'), width: "56", height: "23", loading: "lazy" })), dateForSeasonal: new Date(), locale: locale, key: typeof window !== 'undefined' ? 'client' : 'server', isLightLogo: winCashBackTheme })))),
                 !isMobile && (React__default.createElement(React__default.Fragment, null, siteType === 'marryBaby' ? (React__default.createElement(NavigationMenu, { menuItems: menuItems, originalMenuItems: menuItems, className: customClasses.navMenu })) : (enableSearchBar && (React__default.createElement(NavigtionSearch, { siteType: siteType, projectType: projectType, isMobile: isMobile })))))),
             React__default.createElement(StyledRightGroup, { className: customClasses.rightGroup, "data-site-type": siteType },
-                !isMobile && siteType !== 'marryBaby' && (React__default.createElement(NavigationMenu, { menuItems: menuItems.filter((m) => locale === LOCALE.Vietnam
-                        ? m.id !== 'ecom' && m.id !== 'care'
-                        : true), originalMenuItems: menuItems, className: customClasses.navMenu })),
+                !isMobile && siteType !== 'marryBaby' && (React__default.createElement(NavigationMenu, { menuItems: menuItems.filter((m) => locale === LOCALE.Vietnam ? m.id !== 'ecom' : true), originalMenuItems: menuItems, className: customClasses.navMenu })),
                 React__default.createElement(StyledProfileNavGroup, { className: "profile-nav-group" },
                     languageMenu,
                     enableNavCartCare && winCashBackTheme && (React__default.createElement(CartCareButton, { href: cartHref !== null && cartHref !== void 0 ? cartHref : cartBaseUrl, count: cartHref ? 1 : 0 })),
@@ -3259,7 +3299,7 @@ const useNavServices = () => {
             _services.push({
                 name: t('home.navigator.menuItem.discover'),
                 id: 'categories',
-                link: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/categories/`,
+                link: withLocalePathPrefix(`${statics.HOME_PAGE_URL}/categories/`, locale),
                 niceName: '',
                 thumbnail: isMarryBaby
                     ? CommonGAssets.getAssetPath('categories-mb.svg')
@@ -3270,7 +3310,7 @@ const useNavServices = () => {
             _services.push({
                 name: t('home.navigator.menuItem.video'),
                 id: 'video',
-                link: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/videos/`,
+                link: withLocalePathPrefix(`${statics.HOME_PAGE_URL}/videos/`, locale),
                 niceName: '',
                 thumbnail: CommonGAssets.getAssetPath('nav-icons/video.svg'),
                 popupType: 'video',
@@ -3279,7 +3319,7 @@ const useNavServices = () => {
             _services.push({
                 name: t('home.navigator.menuItem.healthTools'),
                 id: 'tools',
-                link: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}${((_a = STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`,
+                link: withLocalePathPrefix(`${statics.HOME_PAGE_URL}${((_a = STATIC_PAGES[locale]) === null || _a === void 0 ? void 0 : _a.HEALTH_TOOLS) || ''}`, locale),
                 thumbnail: isMarryBaby
                     ? CommonGAssets.getAssetPath('healthtools-mb.svg')
                     : CommonGAssets.getAssetPath('nav-icons/health-tools.svg'),
@@ -3299,7 +3339,7 @@ const useNavServices = () => {
             _services.push({
                 name: t('home.navigator.menuItem.helloEcom'),
                 id: 'ecom',
-                link: normalizeLinkSlash(statics.HOME_PAGE_URL + '/shop/'),
+                link: normalizeLinkSlash(withLocalePathPrefix(`${statics.HOME_PAGE_URL}/shop/`, locale)),
                 thumbnail: CommonGAssets.getAssetPath('nav-icons/shop.svg'),
                 popupType: null,
             });

package/build/esm/{index-c2fb254d.js → index-b4909fa9.js}

@@ -1,35 +1,35 @@
-import { a as __rest, _ as __awaiter } from './tslib.es6-3550cecb.js';
+import { a as __rest, _ as __awaiter } from './tslib.es6-cdcdb9ff.js';
 import React__default, { useState, useContext, useMemo, useRef, useCallback, useEffect, createContext } from 'react';
 import dayjs from 'dayjs';
-import { T as Tabs } from './index-277000a9.js';
-import { L as Loading } from './index-c0cd4659.js';
-import { b as formatPost, a as formatCommunity, f as formatArticle } from './dataTransform-49babbdc.js';
+import { T as Tabs } from './index-26e10db9.js';
+import { L as Loading } from './index-dbfa058a.js';
+import { b as formatPost, a as formatCommunity, f as formatArticle } from './dataTransform-2a3c7950.js';
 import { PATHS } from './togetherApiPaths.js';
-import { T as TogetherComponentGlobalContext, c as callApi, f as getApiPath, e as callApiWithAuth } from './utils-daed56a0.js';
+import { T as TogetherComponentGlobalContext, c as callApi, f as getApiPath, e as callApiWithAuth } from './utils-29ca6d81.js';
 import { Plus } from '@hhgtech/icons/core';
 import { createStyles, Anchor, Accordion, Flex, useMantineTheme } from '@mantine/core';
-import { C as CommonGAssets } from './index-e46bb798.js';
-import { I as ImageWrap } from './index-0a40a3ad.js';
-import { P as PopupExpert, d as CardAuthor, C as CardAuthor$1 } from './index-e47aa146.js';
-import { S as SocialType } from './index-2037d8b3.js';
-import { u as useTranslations } from './index-77b468b9.js';
+import { C as CommonGAssets } from './index-1745a270.js';
+import { I as ImageWrap } from './index-07c99ec2.js';
+import { P as PopupExpert, d as CardAuthor, C as CardAuthor$1 } from './index-93af6c53.js';
+import { S as SocialType } from './index-1865f8cf.js';
+import { u as useTranslations } from './index-2f9c78a2.js';
 import { theme } from './miscTheme.js';
 import { CrossLogo, ArrowDown } from '@hhgtech/icons/other';
-import { b as Anchor$1 } from './index-2e7972c2.js';
+import { b as Anchor$1 } from './index-f6f63edb.js';
 import '@mantine/dates';
-import './index-3fc3385c.js';
-import './index-1fc823ab.js';
-import { T as Text } from './index-ebe6c97f.js';
-import { B as Button } from './index-da9d347e.js';
-import './index-cd6c853a.js';
-import './index.styles-53d6af5f.js';
+import './index-f9cfcbae.js';
+import './index-485a2408.js';
+import { T as Text } from './index-745219b8.js';
+import { B as Button } from './index-c50b46f9.js';
+import './index-b093c227.js';
+import './index.styles-0fbc6a4a.js';
 import '@mantine/hooks';
-import './utils-8e8be0d6.js';
+import './utils-35237fc5.js';
 import styled from '@emotion/styled';
 import { useTogetherAuthRequiredAction } from './useTogetherAuthRequiredAction.js';
-import { d as decodeMention, b as decodePostUrl } from './post-503f90b7.js';
-import { B as Button$1 } from './index-8e53d9a1.js';
-import './translationsContext-9130eed4.js';
+import { d as decodeMention, b as decodePostUrl } from './post-39552dbe.js';
+import { B as Button$1 } from './index-1ae61967.js';
+import './translationsContext-7b1ffeba.js';
 
 const StyledPostContent = styled.div `
   padding: 0.5rem 1rem 1rem;

package/build/esm/{index-be4f6414.js → index-b4970615.js}

@@ -1,9 +1,9 @@
-import { a as __rest } from './tslib.es6-3550cecb.js';
+import { a as __rest } from './tslib.es6-cdcdb9ff.js';
 import React__default, { createContext, useContext } from 'react';
 import { createStyles, rem, Box, Input, Chip, useMantineTheme, Flex, Switch } from '@mantine/core';
-import { T as Text } from './index-ebe6c97f.js';
-import { B as Button } from './index-da9d347e.js';
-import { u as useTranslations } from './index-77b468b9.js';
+import { T as Text } from './index-745219b8.js';
+import { B as Button } from './index-c50b46f9.js';
+import { u as useTranslations } from './index-2f9c78a2.js';
 import flattenChildren from 'react-keyed-flatten-children';
 import { theme } from './miscTheme.js';
 

package/build/esm/{index-8eb76c52.js → index-b65fea37.js}

@@ -1,22 +1,22 @@
-import { _ as __awaiter, a as __rest } from './tslib.es6-3550cecb.js';
+import { _ as __awaiter, a as __rest } from './tslib.es6-cdcdb9ff.js';
 import React__default, { useReducer, useState, useEffect } from 'react';
 import { Stack, Input as Input$1 } from '@mantine/core';
-import { I as Input, S as Select } from './index-2e7972c2.js';
+import { I as Input, S as Select } from './index-f6f63edb.js';
 import '@mantine/dates';
-import { g as CDN_ADDRESS } from './index-3fc3385c.js';
-import './index-2037d8b3.js';
-import './index-e46bb798.js';
-import './index-1fc823ab.js';
-import './index-ebe6c97f.js';
-import './index-da9d347e.js';
-import './index-cd6c853a.js';
-import './index.styles-53d6af5f.js';
-import { u as useTranslations } from './index-77b468b9.js';
+import { g as CDN_ADDRESS } from './index-f9cfcbae.js';
+import './index-1865f8cf.js';
+import './index-1745a270.js';
+import './index-485a2408.js';
+import './index-745219b8.js';
+import './index-c50b46f9.js';
+import './index-b093c227.js';
+import './index.styles-0fbc6a4a.js';
+import { u as useTranslations } from './index-2f9c78a2.js';
 import '@mantine/hooks';
-import './utils-8e8be0d6.js';
-import './index-277000a9.js';
-import { M as MAPPED_LOCALE } from './utils-6f317049.js';
-import { L as LOCALE } from './Locale-920710c5.js';
+import './utils-35237fc5.js';
+import './index-26e10db9.js';
+import { M as MAPPED_LOCALE } from './utils-be1da97e.js';
+import { L as LOCALE } from './Locale-66042c79.js';
 
 const generateGetAddressDetail = (locale) => {
     return `${CDN_ADDRESS}/cities-data-${MAPPED_LOCALE[locale]}.json`;

package/build/esm/{index-cf19960e.js → index-be5d7abc.js}

@@ -1,7 +1,7 @@
-import { a as __rest } from './tslib.es6-3550cecb.js';
+import { a as __rest } from './tslib.es6-cdcdb9ff.js';
 import React__default from 'react';
 import { Modal as Modal$1 } from '@mantine/core';
-import { u as useStyles } from './index.styles-53d6af5f.js';
+import { u as useStyles } from './index.styles-0fbc6a4a.js';
 
 const Modal = (_a) => {
     var { styles, classNames, transitionProps } = _a, rest = __rest(_a, ["styles", "classNames", "transitionProps"]);

package/build/esm/{index-a7bf1e27.js → index-c2d86493.js}

@@ -1,22 +1,22 @@
-import { a as __rest } from './tslib.es6-3550cecb.js';
+import { a as __rest } from './tslib.es6-cdcdb9ff.js';
 import React__default, { useContext } from 'react';
 import { createStyles, rem, Box, clsx } from '@mantine/core';
-import './index-2e7972c2.js';
+import './index-f6f63edb.js';
 import '@mantine/dates';
-import './index-3fc3385c.js';
-import './index-2037d8b3.js';
-import './index-e46bb798.js';
-import './index-1fc823ab.js';
-import { T as Text } from './index-ebe6c97f.js';
-import { B as Button } from './index-da9d347e.js';
-import './index-cd6c853a.js';
-import './index.styles-53d6af5f.js';
-import { u as useTranslations } from './index-77b468b9.js';
+import './index-f9cfcbae.js';
+import './index-1865f8cf.js';
+import './index-1745a270.js';
+import './index-485a2408.js';
+import { T as Text } from './index-745219b8.js';
+import { B as Button } from './index-c50b46f9.js';
+import './index-b093c227.js';
+import './index.styles-0fbc6a4a.js';
+import { u as useTranslations } from './index-2f9c78a2.js';
 import '@mantine/hooks';
-import './utils-8e8be0d6.js';
-import './index-277000a9.js';
-import { C as CardWrapperContext } from './context-fb577440.js';
-import { H as HealthToolFormWrapper } from './index-be4f6414.js';
+import './utils-35237fc5.js';
+import './index-26e10db9.js';
+import { C as CardWrapperContext } from './context-f54faf2e.js';
+import { H as HealthToolFormWrapper } from './index-b4970615.js';
 
 var useStyles = createStyles((theme, { hasOnClickFn }) => {
     return {

package/build/esm/{index-da9d347e.js → index-c50b46f9.js}

@@ -1,8 +1,8 @@
-import { a as __rest } from './tslib.es6-3550cecb.js';
+import { a as __rest } from './tslib.es6-cdcdb9ff.js';
 import React__default, { forwardRef } from 'react';
 import { createStyles, getStylesRef, useMantineTheme, Button as Button$1 } from '@mantine/core';
-import { A as ANIMATION_DURATION } from './shared-f340cd66.js';
-import { C as CustomStylesType, F as FontWeight, u as useTemplateVariant } from './index-cd6c853a.js';
+import { A as ANIMATION_DURATION } from './shared-03b433af.js';
+import { C as CustomStylesType, F as FontWeight, u as useTemplateVariant } from './index-b093c227.js';
 
 var useStyles = createStyles((_theme, _params) => {
     var _a, _b, _c, _d, _e, _f;

package/build/esm/{index-4e7161af.js → index-cd967fe7.js}

@@ -1,11 +1,11 @@
 import React__default, { useRef, useEffect } from 'react';
 import { Portal } from '@mantine/core';
-import { t as toggleNoScroll } from './utils-8e8be0d6.js';
+import { t as toggleNoScroll } from './utils-35237fc5.js';
 import { css } from '@emotion/react';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { s as slideInUp, e as slideOutDown, b as slideInLeft, f as slideOutLeft, c as slideInRight, g as slideOutRight, a as slideInDown, d as slideOutUp } from './animation-a620fb90.js';
-import { T as Text } from './index-ebe6c97f.js';
+import { s as slideInUp, e as slideOutDown, b as slideInLeft, f as slideOutLeft, c as slideInRight, g as slideOutRight, a as slideInDown, d as slideOutUp } from './animation-0ce8177e.js';
+import { T as Text } from './index-745219b8.js';
 
 const DURATION = '600ms';
 const generateStyleBasedOnPlacement = (placement, open) => {