@hhgtech/hhg-components 1.29.520-beta-7 → 1.29.520-beta-8

package/build/{index-4b0c71ee.js → index-e1031474.js}

@@ -1,23 +1,23 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-7bc34a90.js');
+var tslib_es6 = require('./tslib.es6-51d1718e.js');
 var React = require('react');
 var core = require('@mantine/core');
 var form = require('@mantine/form');
-var LastPeriod = require('./LastPeriod-37031c2c.js');
-var index$4 = require('./index-6eb12f0a.js');
-var index$2 = require('./index-4864cc98.js');
-var index$3 = require('./index-a51f41ed.js');
-require('./index-4cd426ec.js');
-require('./index-87d55037.js');
-require('./index.styles-61901132.js');
-var index = require('./index-c5d790a7.js');
+var LastPeriod = require('./LastPeriod-5d2867ff.js');
+var index$4 = require('./index-64321da6.js');
+var index$2 = require('./index-2d80a67c.js');
+var index$3 = require('./index-52700cb9.js');
+require('./index-6550d336.js');
+require('./index-0d2250b3.js');
+require('./index.styles-9b6a8581.js');
+var index = require('./index-19ae89ad.js');
 require('@mantine/hooks');
-require('./index-5157a882.js');
-require('./utils-575eb638.js');
-require('./index-fd833bb6.js');
-var context = require('./context-8efb40bf.js');
-var index$1 = require('./index-6696baf6.js');
+require('./index-04f8890f.js');
+require('./utils-1608e424.js');
+require('./index-b7765710.js');
+var context = require('./context-efca7999.js');
+var index$1 = require('./index-81635d68.js');
 var other = require('@hhgtech/icons/other');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-c530f9ed.js → index-eb6d749b.js}

@@ -3,13 +3,13 @@
 var React = require('react');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
-var index = require('./index-4b3b1762.js');
-var index$1 = require('./index-a51f41ed.js');
-var tslib_es6 = require('./tslib.es6-7bc34a90.js');
+var index = require('./index-fd7cf219.js');
+var index$1 = require('./index-52700cb9.js');
+var tslib_es6 = require('./tslib.es6-51d1718e.js');
 var core = require('@mantine/core');
-var index$2 = require('./index-84ca601e.js');
+var index$2 = require('./index-df45ebf9.js');
 var vaul = require('vaul');
-var index$3 = require('./index-9a668cef.js');
+var index$3 = require('./index-f45cbe15.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-68431109.js → index-f016bc75.js}

@@ -2,25 +2,25 @@
 
 var React = require('react');
 var styled = require('@emotion/styled');
-var utils = require('./utils-575eb638.js');
+var utils = require('./utils-1608e424.js');
 var miscTheme = require('./miscTheme.js');
-var tslib_es6 = require('./tslib.es6-7bc34a90.js');
-var index = require('./index-b97395b3.js');
-var index$1 = require('./index-6eb12f0a.js');
+var tslib_es6 = require('./tslib.es6-51d1718e.js');
+var index = require('./index-9a0159e9.js');
+var index$1 = require('./index-64321da6.js');
 require('@mantine/core');
 require('@mantine/dates');
-require('./index-9a668cef.js');
-require('./index-4988efe5.js');
-require('./index-f3bfad00.js');
-require('./index-5157a882.js');
-require('./index-a51f41ed.js');
-require('./index-4cd426ec.js');
-require('./index-87d55037.js');
-require('./index.styles-61901132.js');
-require('./translationsContext-aefaf371.js');
+require('./index-f45cbe15.js');
+require('./index-7340b4d2.js');
+require('./index-2936f660.js');
+require('./index-04f8890f.js');
+require('./index-52700cb9.js');
+require('./index-6550d336.js');
+require('./index-0d2250b3.js');
+require('./index.styles-9b6a8581.js');
+require('./translationsContext-e290b302.js');
 require('@mantine/hooks');
-require('./index-fd833bb6.js');
-var Close = require('./Close-4cbfb100.js');
+require('./index-b7765710.js');
+var Close = require('./Close-5b95b043.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-4fa39e95.js → index-f2b0de3a.js}

@@ -1,11 +1,11 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-7bc34a90.js');
+var tslib_es6 = require('./tslib.es6-51d1718e.js');
 var constantsIsProduction = require('./constantsIsProduction.js');
-var normalizeLink = require('./normalizeLink-4790135a.js');
-var index = require('./index-9a668cef.js');
+var normalizeLink = require('./normalizeLink-20b1ac2b.js');
+var index = require('./index-f45cbe15.js');
 var miscCookieHelper = require('./miscCookieHelper.js');
-var Locale = require('./Locale-51f0b940.js');
+var Locale = require('./Locale-5ef1f682.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 
 const SSO_V2_PATHS = {

package/build/{index-ecdcf50a.js → index-f33e55e5.js}

@@ -1,55 +1,55 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-7bc34a90.js');
+var tslib_es6 = require('./tslib.es6-51d1718e.js');
 var React = require('react');
-var SiteWideBanner = require('./SiteWideBanner-375b63a6.js');
-var index$2 = require('./index-9a668cef.js');
-var normalizeLink = require('./normalizeLink-4790135a.js');
-var dataTransform = require('./dataTransform-d22b4528.js');
+var SiteWideBanner = require('./SiteWideBanner-56919229.js');
+var index$2 = require('./index-f45cbe15.js');
+var normalizeLink = require('./normalizeLink-20b1ac2b.js');
+var dataTransform = require('./dataTransform-345e1e63.js');
 var core = require('@hhgtech/icons/core');
-var index = require('./index-6eb12f0a.js');
-require('./translationsContext-aefaf371.js');
-var Locale = require('./Locale-51f0b940.js');
+var index = require('./index-64321da6.js');
+require('./translationsContext-e290b302.js');
+var Locale = require('./Locale-5ef1f682.js');
 var react = require('@emotion/react');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
-var navigationProfileButton = require('./index-f6a41536.js');
+var navigationProfileButton = require('./index-a8c9757f.js');
 var other = require('@hhgtech/icons/other');
 var core$1 = require('@mantine/core');
-var index$c = require('./index-2a37a48c.js');
+var index$c = require('./index-111f49b7.js');
 var throttle = require('lodash/throttle');
 require('@mantine/dates');
-var index$b = require('./index-4988efe5.js');
-var index$6 = require('./index-f3bfad00.js');
-require('./index-5157a882.js');
-var index$4 = require('./index-a51f41ed.js');
-var index$3 = require('./index-4cd426ec.js');
-require('./index-87d55037.js');
-require('./index.styles-61901132.js');
+var index$b = require('./index-7340b4d2.js');
+var index$6 = require('./index-2936f660.js');
+require('./index-04f8890f.js');
+var index$4 = require('./index-52700cb9.js');
+var index$3 = require('./index-6550d336.js');
+require('./index-0d2250b3.js');
+require('./index.styles-9b6a8581.js');
 require('@mantine/hooks');
-var utils = require('./utils-575eb638.js');
-require('./index-fd833bb6.js');
-var constants = require('./constants-deaf5b3f.js');
-var store = require('./store-5b7838da.js');
-var constants$2 = require('./constants-09c2b217.js');
-var index$5 = require('./index-678905e1.js');
-var index$1 = require('./index-c5d790a7.js');
-var useCartCareService = require('./useCartCareService-b0ebe5e3.js');
-var constants$1 = require('./constants-c085b41c.js');
+var utils = require('./utils-1608e424.js');
+require('./index-b7765710.js');
+var constants = require('./constants-0d087447.js');
+var store = require('./store-be4fce84.js');
+var constants$2 = require('./constants-7f0b49d2.js');
+var index$5 = require('./index-3573ee5a.js');
+var index$1 = require('./index-19ae89ad.js');
+var useCartCareService = require('./useCartCareService-6ae01e5d.js');
+var constants$1 = require('./constants-86d20f23.js');
 var miscDefaultClassWrapper = require('./miscDefaultClassWrapper.js');
-var index$7 = require('./index-be9d3ef8.js');
-var index$8 = require('./index-7d3da00a.js');
-var utils$1 = require('./utils-4ab4fd7a.js');
-var index$9 = require('./index-f40bdd3a.js');
+var index$7 = require('./index-8c22d3df.js');
+var index$8 = require('./index-9ee7494d.js');
+var utils$1 = require('./utils-5e01fba2.js');
+var index$9 = require('./index-c4c47670.js');
 var dayjs = require('dayjs');
 var relativeTime = require('dayjs/plugin/relativeTime');
-var index$a = require('./index-4b2b7389.js');
+var index$a = require('./index-4a3d2101.js');
 var get = require('lodash/get');
 var isEmpty = require('lodash/isEmpty');
-var index$d = require('./index-d4c5f28f.js');
+var index$d = require('./index-33e35c20.js');
 var debounce = require('lodash/debounce');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
-var core$2 = require('./core-3973bc2e.js');
+var core$2 = require('./core-6afe7a59.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -918,12 +918,12 @@ const Categories = ({ hrefViewMore, titleBtnViewMore, UrlFE, onClosePopup, menuI
                             : index$6.CommonGAssets.getAssetPath('chevronRightActive.svg'), style: { width: '16px', height: '16px' }, loading: "lazy" })))))));
 };
 const CategoriesItem = ({ href, menuItem, activeItem, siteType, onClick, }) => {
-    const { name, thumbnail, link, isNew, id, isMobileAppTool } = menuItem;
+    const { name, thumbnail, link, linkTarget, isNew, id, isMobileAppTool,
+    // Break line
+     } = menuItem;
     const { t } = index$1.useTranslations();
     const theme = core$1.useMantineTheme();
-    return (React__namespace["default"].createElement(StyledItem$5, Object.assign({ className: core$1.clsx('iconMenu', `itemMenu-${id}`), "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": link, "data-is-heading-category": false, "data-active": id && id === activeItem, "data-is-mobile-tool": isMobileAppTool, href: href }, (!SiteWideBanner.isInternalLink(href) && {
-        target: '_blank',
-    }), { "data-theme": siteType, onClick: onClick }),
+    return (React__namespace["default"].createElement(StyledItem$5, { className: core$1.clsx('iconMenu', `itemMenu-${id}`), "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": link, "data-is-heading-category": false, "data-active": id && id === activeItem, "data-is-mobile-tool": isMobileAppTool, href: href, target: linkTarget || !SiteWideBanner.isInternalLink(href) ? '_blank' : undefined, "data-theme": siteType, onClick: onClick },
         React__namespace["default"].createElement("div", { className: "icon" },
             React__namespace["default"].createElement("img", { loading: "lazy", alt: name, src: thumbnail || '/images/avatar.jpg', style: {
                     width: 32,
@@ -2059,7 +2059,7 @@ var img$1 = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAABICAYAAABV7bNHA
 var img = "data:image/png;base64,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";
   var WhatsAppMessageIcon = img;
 
-const O2O_STICKY_PANEL_HEIGHT = 40;
+const O2O_MENU_DESKTOP_HEIGHT = 40;
 const O2O_MENU_ALLOWED_LOCALES = [
     Locale.LOCALE.Vietnam,
     Locale.LOCALE.Malaysia,
@@ -2070,15 +2070,17 @@ const getO2OContacts = (t) => {
             name: t('navigation.o2oMenu.consultADoctor'),
             imgUrl: FacebookMessageIcon,
             link: 'http://m.me/hellobacsi',
+            linkTarget: '_blank',
         },
         [Locale.LOCALE.Malaysia]: {
             name: t('navigation.o2oMenu.consultADoctor'),
             imgUrl: WhatsAppMessageIcon,
             link: 'https://api.whatsapp.com/send/?phone=601133221899&text=MULA+SEKARANG&type=phone_number&app_absent=0',
+            linkTarget: '_blank',
         },
     };
 };
-const checkIsDisplayO2OMenu = ({ locale, isHomepage, }) => {
+const canDisplayO2ONavigationMenu = ({ locale, isHomepage, }) => {
     return O2O_MENU_ALLOWED_LOCALES.includes(locale) && !isHomepage;
 };
 const getO2OCategoryItems = (t) => {
@@ -2122,14 +2124,19 @@ const getO2OCategoryItems = (t) => {
 const getO2OHamburgerMenuItems = (locale, t) => {
     const contacts = get__default["default"](getO2OContacts(t), locale);
     const categories = get__default["default"](getO2OCategoryItems(t), locale) || [];
-    return [...categories, contacts].filter(Boolean).map((item) => ({
-        name: item.name,
-        id: 'other',
-        link: item.link,
-        thumbnail: item.imgUrl,
-        popupType: 'categories',
-        icon: React__namespace["default"].createElement("img", { width: 24, height: 24, loading: "lazy", src: item.imgUrl }),
-    }));
+    const menuItems = [...categories, contacts].filter(Boolean).map((item) => {
+        const data = {
+            name: item.name,
+            id: 'other',
+            link: item.link,
+            linkTarget: item.linkTarget,
+            thumbnail: item.imgUrl,
+            popupType: 'categories',
+            icon: React__namespace["default"].createElement("img", { width: 24, height: 24, loading: "lazy", src: item.imgUrl }),
+        };
+        return data;
+    });
+    return menuItems;
 };
 
 const headerStickyPanelVisibilityCss = `
@@ -2138,6 +2145,7 @@ const headerStickyPanelVisibilityCss = `
     z-index: 10;
   }
 
+  // When sub navigation menu is open --> the sticky panel should be under the menu
   &:has(.hhgcomp-navigation-itemnav-headeritem:focus-within) {
     .header-sticky-panel {
       position: relative;
@@ -2147,8 +2155,8 @@ const headerStickyPanelVisibilityCss = `
 `;
 const StyledStickyPanel = styled__default["default"].div `
   width: 100%;
-  height: ${O2O_STICKY_PANEL_HEIGHT}px;
-  max-height: ${O2O_STICKY_PANEL_HEIGHT}px;
+  height: ${O2O_MENU_DESKTOP_HEIGHT}px;
+  max-height: ${O2O_MENU_DESKTOP_HEIGHT}px;
   background-color: #ffffff;
   border-bottom: 1px solid #0000001a;
 `;
@@ -2499,14 +2507,14 @@ function O2ONavigationMenu() {
             React__namespace["default"].createElement(StyledCategoryList, null, o2oCategoryItems.map((item) => (React__namespace["default"].createElement("a", { key: item.name, tabIndex: 0, href: item.link, "data-event-category": "O2O Sticky Menu", "data-event-action": "Click", "data-event-label": item.link },
                 React__namespace["default"].createElement(StyleButton, { variant: "tertiary", size: "sm", px: 8, leftIcon: React__namespace["default"].createElement("img", { width: 24, height: 24, src: item.imgUrl }) }, item.name))))),
             React__namespace["default"].createElement(core$1.Flex, { align: "center", justify: "center" },
-                React__namespace["default"].createElement("a", { href: contact.link, "data-event-category": "O2O Sticky Menu", "data-event-action": "Click", "data-event-label": contact.link },
+                React__namespace["default"].createElement("a", { href: contact.link, "data-event-category": "O2O Sticky Menu", "data-event-action": "Click", "data-event-label": contact.link, rel: "noopener noreferrer", target: "_blank" },
                     React__namespace["default"].createElement(StyleButton, { variant: "tertiary", size: "sm", px: 8, styles: { leftIcon: { width: 20, height: 20 } }, leftIcon: React__namespace["default"].createElement("img", { width: 20, height: 20, src: contact.imgUrl }) }, contact.name))))));
 }
 
 // Use this component for all product context,
 // .. if not --> use `subHead` prop to render specific component for separated product
 function StickyBottomPanel({ locale, isHomepage, }) {
-    const isDisplayO2OMenu = checkIsDisplayO2OMenu({
+    const isDisplayO2OMenu = canDisplayO2ONavigationMenu({
         locale,
         isHomepage,
     });
@@ -2580,7 +2588,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
     }, 200), []);
     const getHamburgerMenuItems = () => {
         const isDisplayO2OMenu = enableO2ONavigationMenu
-            ? checkIsDisplayO2OMenu({
+            ? canDisplayO2ONavigationMenu({
                 locale,
                 isHomepage,
             })
@@ -2649,6 +2657,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
                                 borderLeft: '1px solid #E4E8EC',
                             } })),
                         React__namespace["default"].createElement(CartBadge, { "data-cart-menu": "true", "data-event-category": "Ecommerce", "data-event-action": "Cart Click", "data-event-label": currentUrl, count: cartNumber, locale: locale })))))),
+        !isMobile && enableO2ONavigationMenu && (React__namespace["default"].createElement(StickyBottomPanel, { locale: locale, isHomepage: isHomepage })),
         isMobile && isHomepage && (React__namespace["default"].createElement(StyleWrapperNavigtionSearch, { className: "search-wrapper" },
             React__namespace["default"].createElement(NavigtionSearch, { siteType: siteType, projectType: projectType, isMobile: isMobile, isHomepage: isHomepage }))),
         sponsorComponent
@@ -2660,7 +2669,6 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
                     isMobile,
                 })
             : null,
-        !isMobile && enableO2ONavigationMenu && (React__namespace["default"].createElement(StickyBottomPanel, { locale: locale, isHomepage: isHomepage })),
         subHead && subHead));
 };
 const NavigtionSearch = ({ siteType, projectType, isMobile = false, isHomepage = false, isRedirectSearchPage = false, }) => (React__namespace["default"].createElement(DisplayWrapper, { mediaQueryKey: "mbUp", className: `${siteType === 'marryBaby' ? 'marry-baby' : ''} ${isHomepage ? 'block-show' : ''}` },
@@ -2684,7 +2692,6 @@ const useHeaderHeight = ({ hasSponsoredBanners, isSponsored, isShowingSiteWideBa
         if (window.scrollY <= newHeaderHeight + 200) {
             setHeaderHeight(newHeaderHeight);
             setHeaderBottom(((_d = headerRef.current) === null || _d === void 0 ? void 0 : _d.getBoundingClientRect().bottom) || headerHeight);
-            // setTimeout(() => debounceSetHeader(), 200)
         }
     }, 200), []);
     React.useEffect(() => {
@@ -2722,9 +2729,36 @@ const useHeaderHeight = ({ hasSponsoredBanners, isSponsored, isShowingSiteWideBa
         }
         return res;
     }, [isMobile, isShowingSiteWideBanner, hasSponsoredBanners, isSponsored]);
+    // ResizeObserver for accurate height observation
+    React.useEffect(() => {
+        const element = headerRef.current;
+        if (!element || typeof ResizeObserver === 'undefined') {
+            // Fallback for environments without ResizeObserver
+            debounceSetHeader();
+            return;
+        }
+        const resizeObserver = new ResizeObserver((entries) => {
+            for (const entry of entries) {
+                if (entry.target === element) {
+                    const newHeight = entry.contentRect.height || entry.target.clientHeight;
+                    if (newHeight > 0) {
+                        setHeaderHeight(newHeight);
+                        setHeaderBottom(element.getBoundingClientRect().bottom || newHeight);
+                    }
+                }
+            }
+        });
+        resizeObserver.observe(element);
+        // Initial measurement
+        debounceSetHeader();
+        return () => {
+            resizeObserver.disconnect();
+        };
+    }, [debounceSetHeader]);
+    const finalHeaderHeight = headerHeight || defaultHeaderHeight;
     return {
         defaultHeaderHeight,
-        headerHeight: headerHeight || defaultHeaderHeight,
+        headerHeight: finalHeaderHeight,
         headerBottom,
         headerRef,
     };
@@ -2876,40 +2910,54 @@ const StyledContainer = styled__default["default"].div `
   }
 `;
 
-const getInstantStickyPanelHeight = ({ locale, isHomepage, }) => {
-    const isDisplayO2OMenu = checkIsDisplayO2OMenu({
-        locale,
-        isHomepage,
-    });
-    return isDisplayO2OMenu ? O2O_STICKY_PANEL_HEIGHT : 0;
+const CSS_VAR_DEFAULT_HEADER_HEIGHT = '--default-header-height';
+const CSS_VAR_HEADER_HEIGHT = '--header-height';
+const setRootCSSVariable = (name, value) => {
+    if (typeof document !== 'undefined') {
+        document.documentElement.style.setProperty(name, value);
+    }
+};
+/**
+ * Updates all header-related CSS variables on :root
+ */
+const updateRootHeaderVariables = ({ defaultHeaderHeight, headerHeight, }) => {
+    setRootCSSVariable(CSS_VAR_DEFAULT_HEADER_HEIGHT, `${defaultHeaderHeight}px`);
+    setRootCSSVariable(CSS_VAR_HEADER_HEIGHT, `${headerHeight}px`);
+};
+const useSetGlobalHeaderHeight = ({ headerHeight, defaultHeaderHeight, allowRootVariablesUpdate = true, }) => {
+    const finalHeaderHeight = headerHeight || defaultHeaderHeight;
+    React.useEffect(() => {
+        if (allowRootVariablesUpdate) {
+            updateRootHeaderVariables({
+                defaultHeaderHeight,
+                headerHeight: finalHeaderHeight,
+            });
+        }
+    }, [defaultHeaderHeight, finalHeaderHeight]);
 };
 
 const _NavigationV2 = (props) => {
     var _a, _b;
-    const { isMobile, locale, onTopBarAppears, languageOptions, sponsorComponent, sitewideBanner, sitewideBannerShown, className, logoComponent, subHead, projectType, customClasses = {}, isHomepage, enableO2ONavigationMenu, } = props;
+    const { isMobile, locale, onTopBarAppears, languageOptions, sponsorComponent, sitewideBanner, sitewideBannerShown, className, logoComponent, subHead, projectType, customClasses = {}, } = props;
     const services = useNavServices();
     useInsider();
     const isShowingSiteWideBanner = sitewideBannerShown && !!sitewideBanner;
     const isSponsored = !!sponsorComponent;
     const hasSponsoredBanners = !!((_b = (_a = sponsorComponent === null || sponsorComponent === void 0 ? void 0 : sponsorComponent.props) === null || _a === void 0 ? void 0 : _a.sponsoredBy) === null || _b === void 0 ? void 0 : _b.length);
-    const instantStickyMenuHeight = enableO2ONavigationMenu
-        ? getInstantStickyPanelHeight({
-            locale,
-            isHomepage,
-        })
-        : 0;
     const { headerRef, defaultHeaderHeight, headerHeight, headerBottom } = useHeaderHeight({
         isShowingSiteWideBanner,
         isSponsored,
         hasSponsoredBanners,
         isMobile,
     });
+    useSetGlobalHeaderHeight({
+        headerHeight,
+        defaultHeaderHeight,
+    });
     return (React__namespace["default"].createElement(StyledContainer, { id: "navigation-v2", style: {
             '--default-header-height': defaultHeaderHeight + 'px',
             '--header-height': `calc(${headerHeight}px - var(--amp-site-wide-closed), 64px)`,
             '--header-bottom': headerBottom + 'px',
-            '--header-nav-bottom': `calc(${headerHeight}px - ${instantStickyMenuHeight}px)`,
-            '--header-instant-sticky-menu-height': instantStickyMenuHeight + 'px',
         }, className: className },
         React__namespace["default"].createElement("section", { ref: headerRef },
             React__namespace["default"].createElement(NavigationBar, { menuItems: services, onTopBarAppears: onTopBarAppears, logoComponent: logoComponent, subHead: subHead, projectType: projectType, languageMenu: React__namespace["default"].createElement(SiteWideBanner.LanguageSwitcher, { languageOptions: languageOptions, locale: locale }), customClasses: customClasses }))));

package/build/{index-11be9830.js → index-f34cf861.js}

@@ -1,23 +1,23 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-7bc34a90.js');
+var tslib_es6 = require('./tslib.es6-51d1718e.js');
 var React = require('react');
 var core = require('@mantine/core');
 var form = require('@mantine/form');
-require('./index-6eb12f0a.js');
-var index$3 = require('./index-4864cc98.js');
-var index$4 = require('./index-a51f41ed.js');
-require('./index-4cd426ec.js');
-require('./index-87d55037.js');
-require('./index.styles-61901132.js');
-var index = require('./index-c5d790a7.js');
+require('./index-64321da6.js');
+var index$3 = require('./index-2d80a67c.js');
+var index$4 = require('./index-52700cb9.js');
+require('./index-6550d336.js');
+require('./index-0d2250b3.js');
+require('./index.styles-9b6a8581.js');
+var index = require('./index-19ae89ad.js');
 require('@mantine/hooks');
-require('./index-5157a882.js');
-require('./utils-575eb638.js');
-require('./index-fd833bb6.js');
-var context = require('./context-8efb40bf.js');
-var index$1 = require('./index-6696baf6.js');
-var index$2 = require('./index-ba87766b.js');
+require('./index-04f8890f.js');
+require('./utils-1608e424.js');
+require('./index-b7765710.js');
+var context = require('./context-efca7999.js');
+var index$1 = require('./index-81635d68.js');
+var index$2 = require('./index-9b8c506b.js');
 var other = require('@hhgtech/icons/other');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-9a668cef.js → index-f45cbe15.js}

@@ -1,12 +1,12 @@
 'use strict';
 
 var locale = require('date-fns/locale');
-require('./index-4988efe5.js');
+require('./index-7340b4d2.js');
 var constantsSite = require('./constantsSite.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 var constantsRiskScreener = require('./constantsRiskScreener.js');
 var constantsIsProduction = require('./constantsIsProduction.js');
-var Locale = require('./Locale-51f0b940.js');
+var Locale = require('./Locale-5ef1f682.js');
 
 const basePath = process.env.NEXT_PUBLIC_DEPLOY_LOCALE === 'tl-PH' ? '/fil' : '';
 const SSO_URL = process.env.NEXT_PUBLIC_SSO;

package/build/{index-9b3ac9ee.js → index-fca4c2bb.js}

@@ -1,27 +1,27 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-7bc34a90.js');
+var tslib_es6 = require('./tslib.es6-51d1718e.js');
 var React = require('react');
 var form = require('@mantine/form');
-var useHealthToolCache = require('./useHealthToolCache-10f2f44e.js');
-var index = require('./index-c5d790a7.js');
-var index$6 = require('./index-f3bfad00.js');
-var constants = require('./constants-09c2b217.js');
-var index$2 = require('./index-ba87766b.js');
-var index$5 = require('./index-6eb12f0a.js');
-var index$3 = require('./index-4864cc98.js');
-var index$4 = require('./index-a51f41ed.js');
-require('./index-4cd426ec.js');
+var useHealthToolCache = require('./useHealthToolCache-21ca4d52.js');
+var index = require('./index-19ae89ad.js');
+var index$6 = require('./index-2936f660.js');
+var constants = require('./constants-7f0b49d2.js');
+var index$2 = require('./index-9b8c506b.js');
+var index$5 = require('./index-64321da6.js');
+var index$3 = require('./index-2d80a67c.js');
+var index$4 = require('./index-52700cb9.js');
+require('./index-6550d336.js');
 require('@mantine/core');
-require('./index-87d55037.js');
-require('./index.styles-61901132.js');
+require('./index-0d2250b3.js');
+require('./index.styles-9b6a8581.js');
 require('@mantine/hooks');
-require('./index-5157a882.js');
-require('./utils-575eb638.js');
-require('./index-fd833bb6.js');
-require('./index-9a668cef.js');
-var context = require('./context-8efb40bf.js');
-var index$1 = require('./index-6696baf6.js');
+require('./index-04f8890f.js');
+require('./utils-1608e424.js');
+require('./index-b7765710.js');
+require('./index-f45cbe15.js');
+var context = require('./context-efca7999.js');
+var index$1 = require('./index-81635d68.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-4b3b1762.js → index-fd7cf219.js}

@@ -1,8 +1,8 @@
 'use strict';
 
 var React = require('react');
-var utils = require('./utils-575eb638.js');
-var tslib_es6 = require('./tslib.es6-7bc34a90.js');
+var utils = require('./utils-1608e424.js');
+var tslib_es6 = require('./tslib.es6-51d1718e.js');
 var styled = require('@emotion/styled');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }