@hhgtech/hhg-components 1.29.367-beta-7 → 1.29.367-beta-9

package/build/esm/{index-7115471b.js → index-e4d1ac06.js}

@@ -1,26 +1,26 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-70e41331.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-0e998a55.js';
 import React__default, { createContext, useContext, useState, useMemo, useEffect } from 'react';
 import { Controller, useForm } from 'react-hook-form';
-import { u as useHealthToolsCache } from './useHealthToolCache-69d48de4.js';
-import { H as HEALTH_TOOL_TYPE } from './constants-91868561.js';
-import { G as GenderOptionControl } from './index-967b9a4a.js';
-import { I as Input } from './index-34b641af.js';
+import { u as useHealthToolsCache } from './useHealthToolCache-3454c2a2.js';
+import { H as HEALTH_TOOL_TYPE } from './constants-b5f52499.js';
+import { G as GenderOptionControl } from './index-fe84404d.js';
+import { I as Input } from './index-8018400e.js';
 import '@mantine/core';
 import '@mantine/dates';
-import './index-bc8c9fbf.js';
-import './index-46699ec2.js';
-import './index-3d001c5e.js';
-import './useMantineLocale-29856aca.js';
-import { T as Text } from './index-193e283c.js';
-import './index-9e4a1cdb.js';
+import './index-9e28d36f.js';
+import './index-df684842.js';
+import './index-a518abf9.js';
+import './useMantineLocale-63b0281d.js';
+import { T as Text } from './index-e3ce66af.js';
+import './index-34c60f8f.js';
 import { theme } from './miscTheme.js';
-import './index.styles-357cba27.js';
-import { u as useTranslations } from './index-d3e18755.js';
+import './index.styles-35793b10.js';
+import { u as useTranslations } from './index-e2a96a90.js';
 import '@mantine/hooks';
-import './utils-3b172cb3.js';
-import './other-7731d148.js';
-import './index-0357624f.js';
-import { H as HealthToolFormWrapper } from './index-5eff858f.js';
+import './utils-edd21030.js';
+import './other-c2010523.js';
+import './index-babd37c5.js';
+import { H as HealthToolFormWrapper } from './index-68891b84.js';
 import { domainLocales } from './constantsDomainLocales.js';
 import { getBmi } from './embeddedHeathToolCards_helpers.js';
 

package/build/esm/{index-23dcfab0.js → index-e6c14014.js}

@@ -1,8 +1,8 @@
-import { _ as __rest } from './tslib.es6-70e41331.js';
+import { _ as __rest } from './tslib.es6-0e998a55.js';
 import React__default, { useMemo } from 'react';
 import { Spoiler as Spoiler$1 } from '@mantine/core';
-import { T as Text } from './index-193e283c.js';
-import { u as useTranslations } from './index-d3e18755.js';
+import { T as Text } from './index-e3ce66af.js';
+import { u as useTranslations } from './index-e2a96a90.js';
 import { theme } from './miscTheme.js';
 
 const Spoiler = (_a) => {

package/build/esm/{index-2ad384e1.js → index-eb3edc4c.js}

@@ -1,11 +1,11 @@
 import React__default, { useRef, useEffect } from 'react';
 import { Portal } from '@mantine/core';
-import { t as toggleNoScroll } from './utils-3b172cb3.js';
+import { t as toggleNoScroll } from './utils-edd21030.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-495dec8b.js';
-import { T as Text } from './index-193e283c.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-d8697a0e.js';
+import { T as Text } from './index-e3ce66af.js';
 
 const DURATION = '600ms';
 const generateStyleBasedOnPlacement = (placement, open) => {

package/build/esm/{index-45dd8563.js → index-ef8cb5d2.js}

@@ -1,9 +1,9 @@
-import { _ as __rest } from './tslib.es6-70e41331.js';
+import { _ as __rest } from './tslib.es6-0e998a55.js';
 import React__default, { useState, useCallback, useMemo, useEffect } from 'react';
 import { clsx } from '@mantine/core';
 import { Drawer } from 'vaul';
 import styled from '@emotion/styled';
-import { Z as ZINDEX_SSO } from './index-bc8c9fbf.js';
+import { Z as ZINDEX_SSO } from './index-9e28d36f.js';
 
 const StyledDrawerComponentContent = styled(Drawer.Content) `
   position: fixed;

package/build/esm/{index-b6cf8a1b.js → index-f9742c7b.js}

@@ -1,49 +1,49 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-70e41331.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-0e998a55.js';
 import React__default, { useMemo, useEffect, useContext, useState, useRef, useCallback } from 'react';
-import { V as VideoType } from './index-46699ec2.js';
-import { i as isInternalLink, V as VideoItem, L as LanguageSwitcher } from './index-6c1acfe1.js';
-import { a as CARE_LOCALES, b as CARE_BOOKING_LOCALES, T as TOGETHER_LOCALES, E as ECOM_LOCALES, c as VIDEO_LOCALES, S as STATIC_PAGES, L as LOCALE_SPECS } from './index-bc8c9fbf.js';
-import { g as getCurrentBaseUrl, a as getCurrentSsoUrl, b as getTogetherApiDomain, c as getDiscoverApiDomain, n as normalizeLink, e as normalizeLinkSlash, d as getCareApiDomain } from './normalizeLink-6338cff1.js';
-import { a as formatCommunity, b as formatPost } from './dataTransform-e32400d1.js';
+import { V as VideoType } from './index-df684842.js';
+import { i as isInternalLink, V as VideoItem, L as LanguageSwitcher } from './index-723bccf0.js';
+import { a as CARE_LOCALES, b as CARE_BOOKING_LOCALES, T as TOGETHER_LOCALES, E as ECOM_LOCALES, c as VIDEO_LOCALES, S as STATIC_PAGES, L as LOCALE_SPECS } from './index-9e28d36f.js';
+import { g as getCurrentBaseUrl, a as getCurrentSsoUrl, b as getTogetherApiDomain, c as getDiscoverApiDomain, n as normalizeLink, e as normalizeLinkSlash, d as getCareApiDomain } from './normalizeLink-e97a29ab.js';
+import { a as formatCommunity, b as formatPost } from './dataTransform-530b94a0.js';
 import { Close, Download } from '@hhgtech/icons/core';
 import { ArrowRight, ChatAi } from '@hhgtech/icons/other';
 import { createStyles, Box, Indicator, useMantineTheme } from '@mantine/core';
-import { L as Logo } from './index-3b24726c.js';
-import { u as useTranslations } from './index-d3e18755.js';
+import { L as Logo } from './index-1214c1f4.js';
+import { u as useTranslations } from './index-e2a96a90.js';
 import throttle from 'lodash/throttle';
-import { I as Input } from './index-34b641af.js';
+import { I as Input } from './index-8018400e.js';
 import '@mantine/dates';
-import { C as CommonGAssets } from './index-3d001c5e.js';
-import './useMantineLocale-29856aca.js';
-import { T as Text } from './index-193e283c.js';
-import { B as Button$1 } from './index-9e4a1cdb.js';
-import './index.styles-357cba27.js';
-import './translationsContext-dbbd7827.js';
+import { C as CommonGAssets } from './index-a518abf9.js';
+import './useMantineLocale-63b0281d.js';
+import { T as Text } from './index-e3ce66af.js';
+import { B as Button$1 } from './index-34c60f8f.js';
+import './index.styles-35793b10.js';
+import './translationsContext-a43276c7.js';
 import '@mantine/hooks';
-import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-3b172cb3.js';
-import './other-7731d148.js';
-import './index-0357624f.js';
-import { L as LOCALISED_SLUGS } from './constants-b99e22d3.js';
+import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-edd21030.js';
+import './other-c2010523.js';
+import './index-babd37c5.js';
+import { L as LOCALISED_SLUGS } from './constants-c8333ace.js';
 import styled from '@emotion/styled';
-import { u as useCSSFocusPopupHelper, N as NavigationProfileButton } from './index-6a54b2b1.js';
-import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-804b6e45.js';
-import { B as Button } from './index-76e64b04.js';
-import { i as domainLocalesMarryBaby } from './utils-394135d0.js';
+import { u as useCSSFocusPopupHelper, N as NavigationProfileButton } from './index-fcb491d5.js';
+import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-7da8940e.js';
+import { B as Button } from './index-31442c84.js';
+import { i as domainLocalesMarryBaby } from './utils-5caef9c7.js';
 import { domainLocales } from './constantsDomainLocales.js';
-import { L as LOCALIZED_SLUGS } from './constants-39403db4.js';
+import { L as LOCALIZED_SLUGS } from './constants-86a3e84d.js';
 import { theme } from './miscTheme.js';
-import { H as Heading } from './index-b9e4b5f0.js';
-import { I as Indicator$1 } from './index-138b8ff8.js';
-import { u as useIsInit } from './useIsInit-181d7820.js';
+import { H as Heading } from './index-af324a92.js';
+import { I as Indicator$1 } from './index-5ce6b9c5.js';
+import { u as useIsInit } from './useIsInit-527991ca.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
-import { U as UserAvatar } from './index-6496c495.js';
+import { U as UserAvatar } from './index-c6c1919e.js';
 import formatString from 'string-format';
-import { C as Container } from './index-e1a8d444.js';
-import { L as LOCALE } from './Locale-83805ec6.js';
+import { C as Container } from './index-0c15da39.js';
 import debounce from 'lodash/debounce';
-import { g as getDataWithCache } from './core-142f299b.js';
+import { L as LOCALE } from './Locale-8bb30833.js';
+import { g as getDataWithCache } from './core-31f19916.js';
 
 const getEcomUrl = ({ path, locale, }) => {
     var _a;
@@ -210,11 +210,10 @@ function HamburgerIcon({ siteType, enableSearch, className }) {
         React__default.createElement("path", { d: "M3.35 15a.65.65 0 0 1 .65-.65h10a.65.65 0 1 1 0 1.3H4a.65.65 0 0 1-.65-.65m0-6A.65.65 0 0 1 4 8.35h16a.65.65 0 1 1 0 1.3H4A.65.65 0 0 1 3.35 9", fill: "#3E3F58" })));
 }
 
-// import { StyledMenuPopupWrapperClass } from '../../atoms/PopupWrapper/index.styled'
 const StyledMasterMenuContainer = styled.div `
   position: fixed;
   z-index: 201;
-  top: calc(100% + 1px);
+  top: calc(100% - 1px);
   width: 100%;
   height: calc(100vh - var(--header-bottom));
   overflow-x: hidden;
@@ -228,20 +227,6 @@ const StyledMasterMenuContainer = styled.div `
     position: unset;
   }
 `;
-// Desktop
-// export const StyledMenuPopupWrapper = styled.div`
-//   position: fixed;
-//   z-index: ${Z_INDEX.menuCategoryPopupWrapper};
-//   top: 69px;
-//   left: 0;
-//   width: 100%;
-//   height: 100%;
-//   align-items: center;
-//   background-color: transparent;
-//   &[data-is-display='false'] {
-//     display: none;
-//   }
-// `
 styled.div `
   padding: 16px;
   padding-bottom: 12px;
@@ -270,6 +255,9 @@ const StyledWrapper = styled.div `
     width: 0;
     display: none;
   }
+`;
+const StyleWrapperSearch = styled.div `
+  padding: 0 16px;
 `;
 
 const Phone = (_a) => {
@@ -280,7 +268,6 @@ const Phone = (_a) => {
 
 const StyledItemGridLeft = styled.div `
   padding-right: 1rem;
-  margin-top: 10px;
   background: #ffffff;
   padding: 5px 15px;
   ${MediaQueries.mbUp} {
@@ -1523,13 +1510,13 @@ const VideoSpotlights = ({ spotlightsList = [], layout = 'default', }) => {
     return (React__default.createElement(Spotlights, { title: t('home.navigator.menu.lastestVideos') }, spotlightsList.length !== 0 ? (React__default.createElement(StyledContainerItems, null, spotlightsList === null || spotlightsList === void 0 ? void 0 : spotlightsList.slice(0, 4).map((video, index) => (React__default.createElement(VideoItem, { key: index, data: Object.assign(Object.assign({}, video), { type: VideoType.SHORTS }), layout: layout === 'default' ? 'overlay' : 'horizon', redirectToLandingPage: true, dataEventCategory: "Hamburger Navigation", dataEventAction: `Video Click ${index + 1}` }))))) : (React__default.createElement(SpotlightNoData, { title: t('home.navigator.menu.category.noDatas.title'), description: t('home.navigator.menu.category.noDatas.description'), link: `${statics.VIDEO_URL_FE}/`, cta: t('home.navigator.menu.category.noDatas.cta'), icon: CommonGAssets.getAssetPath('Spotlight.svg') }))));
 };
 
-const MenuServiceList = ({ closePopup, menuItems = [] }) => {
+const MenuServiceList = ({ closePopup, menuItems = [], projectType, isHomepage = false, }) => {
     var _a, _b;
-    const { 
-    // siteType,
-    ssrMenuContent: { categories, healthTools, care, together, ecom, videos }, activeMenuService, configs: { statics }, locale, } = useContext(NavigationContext);
+    const { siteType, ssrMenuContent: { categories, healthTools, care, together, ecom, videos }, activeMenuService, configs: { statics }, locale, } = useContext(NavigationContext);
     const { t } = useTranslations();
     return (React__default.createElement(StyledMasterMenuContainer, { id: 'categories-menu' },
+        !isHomepage && (React__default.createElement(StyleWrapperSearch, null,
+            React__default.createElement(NavigtionSearch, { siteType: siteType, projectType: projectType, isMobile: false }))),
         React__default.createElement(StyledWrapper, null,
             React__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.createElement(CategorySpotlights, { spotlightsList: (categories === null || categories === void 0 ? void 0 : categories.spotlights) || [], hrefViewMore: `${statics.HOME_PAGE_URL}${locale === 'tl-PH' ? '/fil' : ''}/spotlight/` })),
@@ -1540,10 +1527,8 @@ const MenuServiceList = ({ closePopup, menuItems = [] }) => {
             activeMenuService === 'video' && (React__default.createElement(VideoSpotlights, { spotlightsList: videos === null || videos === void 0 ? void 0 : videos.spotlights, layout: "stack" })))));
 };
 
-const HamburgerMenu = ({ menuItems }) => {
-    const { siteType,
-    // configs: { enableSearchBar },
-     } = useContext(NavigationContext);
+const HamburgerMenu = ({ menuItems, isHomepage, projectType }) => {
+    const { siteType } = useContext(NavigationContext);
     const { containerRef, onContainerFocus, onContainerBlur, onButtonMouseDown, onClose, } = useCSSFocusPopupHelper();
     return (React__default.createElement(DisplayWrapper, { mediaQueryKey: "mbDown" },
         React__default.createElement("header", { className: styles$2.menuContainer },
@@ -1551,7 +1536,7 @@ const HamburgerMenu = ({ menuItems }) => {
                 React__default.createElement("div", { className: styles$2.menuIconWrapper, onMouseDown: onButtonMouseDown, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": "Hamburger Navigation URL" },
                     React__default.createElement(ClosePopupIcon, { className: "mobile-close-icon" }),
                     React__default.createElement(HamburgerIcon, { siteType: siteType, enableSearch: false, className: "mobile-hamburger-icon" })),
-                React__default.createElement(MenuServiceList, { menuItems: menuItems, closePopup: onClose })))));
+                React__default.createElement(MenuServiceList, { menuItems: menuItems, isHomepage: isHomepage, projectType: projectType, closePopup: onClose })))));
 };
 
 const TOGETHER_PATHS = {
@@ -1748,7 +1733,7 @@ const StyledWrapMenuItems = styled.div `
   }
 `;
 const StyleWrapperNavigtionSearch = styled.div `
-  padding: 0 12px 6px;
+  padding: 0 16px 6px;
 `;
 const StyleButtonAiChat = styled(Button$1) `
   border-radius: 28px;
@@ -2135,7 +2120,7 @@ const ItemNavButton = ({ item, color = 'blue' }) => {
                 });
             }
             if (item.id === 'care') {
-                import('./doctor-c9878690.js').then((data) => {
+                import('./doctor-69dce91d.js').then((data) => {
                     if (data === null || data === void 0 ? void 0 : data.default)
                         setIconJson(() => data.default);
                 });
@@ -2293,7 +2278,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
     var _a, _b;
     const { siteType, isMobile = false, locale, sitewideBanner, sitewideBannerShown = true, sponsorComponent, isHomepage = false, onBookingClick, currentUrl, onLoginClick, cartNumber, 
     // ssrMenuContent: { categories, healthTools, care, together },
-    configs: { statics, enableNavCareBooking, enableSearchBar, enableNavChatbotAi,
+    configs: { statics, enableNavCareBooking, enableSearchBar, enableNavChatbotAi, enableAppIntroPage,
     // enableNavVideo,
     // enableNavCare,
     // enableProfileMyHealth,
@@ -2307,7 +2292,6 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
     const { t } = useTranslations();
     const { SSO_URL, HOME_PAGE_URL } = statics;
     const isSponsored = !!sponsorComponent;
-    const enableAppIntroPage = useMemo(() => locale === LOCALE.Vietnam && siteType === 'helloSites', [locale]);
     const [isCollapsed, setIsCollapsed] = useState(false);
     const scrollY = useRef(47);
     const headerRef = useRef(null);
@@ -2366,7 +2350,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
         sitewideBanner,
         React__default.createElement(StyledHeader, { "data-site-type": siteType },
             React__default.createElement(StyledLeftGroup, { "data-site-type": siteType },
-                isMobile && React__default.createElement(HamburgerMenu, { menuItems: menuItems }),
+                isMobile && (React__default.createElement(HamburgerMenu, { menuItems: menuItems, isHomepage: isHomepage, projectType: projectType })),
                 logoComponent || (React__default.createElement("a", { style: {
                         flexShrink: 0,
                     }, href: HOME_PAGE_URL },
@@ -2377,9 +2361,6 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
                 !isMobile && (React__default.createElement(React__default.Fragment, null, siteType === 'marryBaby' ? (React__default.createElement(NavigationMenu, { menuItems: menuItems })) : (enableSearchBar && (React__default.createElement(NavigtionSearch, { siteType: siteType, projectType: projectType, isMobile: isMobile })))))),
             React__default.createElement(StyledRightGroup, { "data-site-type": siteType },
                 !isMobile && siteType !== 'marryBaby' && (React__default.createElement(NavigationMenu, { menuItems: menuItems.filter((m) => m.id !== 'ecom' && m.id !== 'care') })),
-                (isMobile || siteType === 'marryBaby') &&
-                    enableSearchBar &&
-                    !isHomepage && (React__default.createElement(NavigtionSearch, { siteType: siteType, projectType: projectType, isMobile: isMobile })),
                 React__default.createElement(StyledProfileNavGroup, null,
                     !isMobile && (React__default.createElement(React__default.Fragment, null,
                         ecomNavItem ? (React__default.createElement(ItemNavButton, { item: ecomNavItem, color: 'transparent' })) : null,

package/build/esm/{index-6a54b2b1.js → index-fcb491d5.js}

@@ -1,15 +1,15 @@
-import { a as __awaiter } from './tslib.es6-70e41331.js';
+import { a as __awaiter } from './tslib.es6-0e998a55.js';
 import React__default, { useRef, useState, useMemo } from 'react';
 import { User } from '@hhgtech/icons/core';
-import { S as Spinner } from './Spinner-fdcaea04.js';
-import { a as Avatar } from './index-34b641af.js';
-import { B as Button } from './index-9e4a1cdb.js';
-import { T as Text } from './index-193e283c.js';
-import { u as useTranslations } from './index-d3e18755.js';
-import { C as CommonGAssets } from './index-3d001c5e.js';
+import { S as Spinner } from './Spinner-da1ad0d3.js';
+import { a as Avatar } from './index-8018400e.js';
+import { B as Button } from './index-34c60f8f.js';
+import { T as Text } from './index-e3ce66af.js';
+import { u as useTranslations } from './index-e2a96a90.js';
+import { C as CommonGAssets } from './index-a518abf9.js';
 import { theme } from './miscTheme.js';
 import styled from '@emotion/styled';
-import { M as MediaQueries } from './utils-3b172cb3.js';
+import { M as MediaQueries } from './utils-edd21030.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
 import { ProfileNavigation } from './profileNavigation.js';
 import { NavigationLogoutPopup } from './navigationLogoutPopup.js';

package/build/esm/{index-967b9a4a.js → index-fe84404d.js}

@@ -1,21 +1,21 @@
-import { _ as __rest } from './tslib.es6-70e41331.js';
+import { _ as __rest } from './tslib.es6-0e998a55.js';
 import React__default, { useState, useRef, useMemo, useEffect } from 'react';
 import { BabyBoyMB, BabyGirlMB } from '@hhgtech/icons/other';
 import { createStyles, rem, Box, Flex } from '@mantine/core';
-import { R as Radio } from './index-34b641af.js';
+import { R as Radio } from './index-8018400e.js';
 import '@mantine/dates';
-import './index-bc8c9fbf.js';
-import './index-46699ec2.js';
-import { C as CommonGAssets } from './index-3d001c5e.js';
-import './useMantineLocale-29856aca.js';
-import { T as Text } from './index-193e283c.js';
-import './index-9e4a1cdb.js';
-import './index.styles-357cba27.js';
-import { u as useTranslations } from './index-d3e18755.js';
+import './index-9e28d36f.js';
+import './index-df684842.js';
+import { C as CommonGAssets } from './index-a518abf9.js';
+import './useMantineLocale-63b0281d.js';
+import { T as Text } from './index-e3ce66af.js';
+import './index-34c60f8f.js';
+import './index.styles-35793b10.js';
+import { u as useTranslations } from './index-e2a96a90.js';
 import '@mantine/hooks';
-import './utils-3b172cb3.js';
-import './other-7731d148.js';
-import './index-0357624f.js';
+import './utils-edd21030.js';
+import './other-c2010523.js';
+import './index-babd37c5.js';
 
 var useStyles = createStyles((theme, { type }) => {
     const isMarryBaby = theme.other.template === 'mb';