@hhgtech/hhg-components 1.29.551 → 1.29.553-beta-1

package/build/esm/{index-e05c5a80.js → index-da45fd54.js}

@@ -1,56 +1,56 @@
-import { a as __awaiter, _ as __rest } from './tslib.es6-93aa8f12.js';
+import { _ as __awaiter, a as __rest } from './tslib.es6-e8301414.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-4cef3cd7.js';
-import { b as basePath, L as LOCALE_SPECS, S as STATIC_PAGES, a as ZINDEX_HEADER, V as VIDEO_LOCALES, c as LOCALE_HAS_COMMUNITY_SITE, C as CARE_LOCALES } from './index-20de1094.js';
-import { r as resolveDiscoverNavLink, e as normalizeLink, n as normalizeLinkSlash, g as getCurrentBaseUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain, d as getCareApiDomain } from './normalizeLink-e6cdb3d0.js';
-import { f as formatArticle, a as formatCommunity, b as formatPost } from './dataTransform-35189612.js';
+import { i as isInternalLink, V as VideoItem, S as SiteWideBanner, L as LanguageSwitcher } from './SiteWideBanner-7eaf7c8e.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-0418d8ce.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-c74e4594.js';
+import { f as formatArticle, a as formatCommunity, b as formatPost } from './dataTransform-deafa298.js';
 import { Close, Logo } from '@hhgtech/icons/core';
-import { I as Input, D as DEBOUNCED_TIME } from './index-b748bcd6.js';
-import './translationsContext-fd0a148f.js';
-import { L as LOCALE } from './Locale-67fb4e9b.js';
+import { I as Input, D as DEBOUNCED_TIME } from './index-a253b69f.js';
+import './translationsContext-6d8b09b2.js';
+import { L as LOCALE } from './Locale-574fe0ae.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-7952f6ba.js';
+import { a as NavigationContext, u as useCSSFocusPopupHelper, N as NavigationProfileButton, b as NavigationProvider } from './index-e9fc31e1.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-31f66281.js';
+import { L as Logo$1 } from './index-62cb320a.js';
 import throttle from 'lodash/throttle';
 import '@mantine/dates';
-import { V as VideoType } from './index-ba706942.js';
-import { C as CommonGAssets } from './index-578f906d.js';
-import './index-31c848ae.js';
-import { T as Text } from './index-6580ebec.js';
-import { B as Button } from './index-49eaac83.js';
-import './index-920b0729.js';
-import './index.styles-62e88e3e.js';
+import { V as VideoType } from './index-1bed4b30.js';
+import { C as CommonGAssets } from './index-5f582eb1.js';
+import './index-cf08696e.js';
+import { T as Text } from './index-cd8deb84.js';
+import { B as Button } from './index-a85fa1ec.js';
+import './index-c8b57f1a.js';
+import './index.styles-2efb7b19.js';
 import '@mantine/hooks';
-import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-13f5d721.js';
-import './index-a3b71d67.js';
-import { L as LOCALISED_SLUGS, C as CARE_BASE_PATH } from './constants-64720fba.js';
-import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-56c5ba57.js';
-import { L as LOCALISED_SLUGS$1 } from './constants-438a26d7.js';
-import { I as Indicator$1 } from './index-acdf0b59.js';
-import { u as useTranslations } from './index-fad85dbc.js';
-import { u as useIsInit, a as useCartCareService } from './useCartCareService-80db7532.js';
-import { L as LOCALIZED_SLUGS } from './constants-e94ab8d3.js';
+import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-180e09c3.js';
+import './index-00e60ff4.js';
+import { L as LOCALISED_SLUGS, C as CARE_BASE_PATH } from './constants-45a4d6b4.js';
+import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-ef2e53a0.js';
+import { L as LOCALISED_SLUGS$1 } from './constants-1857270b.js';
+import { I as Indicator$1 } from './index-75c7275e.js';
+import { u as useTranslations } from './index-386bd963.js';
+import { u as useIsInit, a as useCartCareService } from './useCartCareService-ac3f25fa.js';
+import { L as LOCALIZED_SLUGS } from './constants-60ad6b18.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
-import { B as Button$1 } from './index-5b88f1d2.js';
-import { H as Heading } from './index-d0c829ea.js';
-import { a as getCareSearchUrl, h as hexToRgb, r as rgbToHsb, b as hsbToRgb, f as formatCategory, c as formatSpotlightsList, d as checkAvailableSpotlight, e as formatHealthTool, i as formatVideoItem, j as formatSpecialties, k as formatHospital } from './utils-36418811.js';
-import { C as Container } from './index-3016a642.js';
-import { b as useResolvedCaptureUrls } from './useResolvedCaptureUrls-018094ba.js';
+import { B as Button$1 } from './index-8ab7187e.js';
+import { H as Heading } from './index-08af5fd0.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-3f643924.js';
+import { C as Container } from './index-8d0185b0.js';
+import { b as useResolvedCaptureUrls } from './useResolvedCaptureUrls-01d1b4b4.js';
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
-import { U as UserAvatar } from './index-47ae4418.js';
+import { U as UserAvatar } from './index-328e010e.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-acf0895e.js';
+import { Z as Z_INDEX, D as DEFAULT_HEADER_HEIGHT_MOBILE, a as DEFAULT_HEADER_HEIGHT_DESKTOP } from './constants-e7896436.js';
 import isEmpty from 'lodash/isEmpty';
-import { C as CartCareButton } from './index-81dea577.js';
+import { C as CartCareButton } from './index-5d642bd6.js';
 import debounce from 'lodash/debounce';
 import { domainLocales } from './constantsDomainLocales.js';
-import { g as getDataWithCache } from './core-2458ebb2.js';
+import { g as getDataWithCache } from './core-1cb8a3c2.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" }),
@@ -1812,7 +1812,7 @@ const VideoSpotlights = ({ spotlightsList = [], layout = 'default', }) => {
     const helloWellnessVideoMenu = (_c = (_b = (_a = ssrMenuContent === null || ssrMenuContent === void 0 ? void 0 : ssrMenuContent.helloWellness) === null || _a === void 0 ? void 0 : _a.settings) === null || _b === void 0 ? void 0 : _b.menu) === null || _c === void 0 ? void 0 : _c.videoMenu;
     return (React__default.createElement(Spotlights, { title: t('home.navigator.menu.lastestVideos') }, spotlightsList.length !== 0 ? (React__default.createElement(StyledContainerItems$1, null, spotlightsList === null || spotlightsList === void 0 ? void 0 : spotlightsList.slice(0, 4).map((video, index) => {
         const isHelloWellness = isHelloWellnessVideo(video, helloWellnessVideoMenu === null || helloWellnessVideoMenu === void 0 ? void 0 : helloWellnessVideoMenu.videoUrl, helloWellnessVideoMenu === null || helloWellnessVideoMenu === void 0 ? void 0 : helloWellnessVideoMenu.thumbnail);
-        return (React__default.createElement(VideoItem, { key: index, data: Object.assign(Object.assign({}, video), { type: VideoType.SHORTS }), layout: layout === 'default' ? 'overlay' : 'horizon', dataEventCategory: "Hamburger Navigation", dataEventAction: isHelloWellness
+        return (React__default.createElement(VideoItem, { key: index, data: Object.assign(Object.assign({}, video), { type: VideoType.SHORTS }), forceTypeModal: VideoType.SHORTS, layout: layout === 'default' ? 'overlay' : 'horizon', dataEventCategory: "Hamburger Navigation", dataEventAction: isHelloWellness
                 ? 'Click to Pin Video'
                 : `Video Click ${index + 1}`, dataEventLabel: isHelloWellness ? video.url : undefined }));
     }))) : (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') }))));
@@ -2759,12 +2759,291 @@ const NavigationMenu = ({ menuItems, originalMenuItems, className, }) => {
         React__default.createElement(StyledWrapMenuItems, { "data-site-type": siteType }, menuItems === null || menuItems === void 0 ? void 0 : menuItems.map((menuItem, index) => (React__default.createElement(ItemMenu, { key: index, item: menuItem, menu: menuItem.popupType === 'categories' ? (React__default.createElement(MenuCategoriesList, { categories: categories === null || categories === void 0 ? void 0 : categories.items, spotlightsList: categories === null || categories === void 0 ? void 0 : categories.spotlights })) : menuItem.popupType === 'tools' ? (React__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 })) : menuItem.popupType === 'together' ? (React__default.createElement(MenuCommunitiesList, { communities: together === null || together === void 0 ? void 0 : together.items, spotlights: together === null || together === void 0 ? void 0 : together.spotlights })) : menuItem.popupType === 'care' ? (React__default.createElement(MenuCareList, { careSpecialties: care === null || care === void 0 ? void 0 : care.items, spotlights: care === null || care === void 0 ? void 0 : care.spotlights })) : menuItem.popupType === 'video' ? (React__default.createElement(MenuVideoList, { spotlightsList: videos === null || videos === void 0 ? void 0 : videos.spotlights })) : menuItem.popupType === 'other' ? (React__default.createElement(MenuViewMore, { menuItems: originalMenuItems })) : null }))))));
 };
 
+const normalizeApiString = (value) => {
+    if (typeof value !== 'string')
+        return '';
+    return value.trim();
+};
+const VALID_CTA_BANNER_LAYOUTS = [
+    'image_overlay_button',
+    'image_on_top_button_below',
+];
+const VALID_CTA_BANNER_GRIDS = [
+    'layout_1_block',
+    'layout_2_block',
+    'layout_3_block',
+    'layout_4_block',
+];
+const DEFAULT_CTA_BANNER_LAYOUT = 'image_on_top_button_below';
+const DEFAULT_CTA_BANNER_GRID = 'layout_4_block';
+const resolveCtaBannerLayoutFromApi = (apiLayout, apiGridLayout) => {
+    const rawLayout = (apiLayout !== null && apiLayout !== void 0 ? apiLayout : '').trim();
+    const rawGridLayout = (apiGridLayout !== null && apiGridLayout !== void 0 ? apiGridLayout : '').trim();
+    const isDisplayLayout = VALID_CTA_BANNER_LAYOUTS.includes(rawLayout);
+    const layout = isDisplayLayout
+        ? rawLayout
+        : DEFAULT_CTA_BANNER_LAYOUT;
+    const rawGrid = rawGridLayout || (!isDisplayLayout ? rawLayout : '');
+    const gridLayout = VALID_CTA_BANNER_GRIDS.includes(rawGrid)
+        ? rawGrid
+        : DEFAULT_CTA_BANNER_GRID;
+    return { layout, gridLayout };
+};
+const formatCommonProps = (data) => {
+    const hashtagProp = data.hashtag || '';
+    const hashtag = hashtagProp.startsWith('#')
+        ? hashtagProp.substring(1)
+        : hashtagProp;
+    const idScroll = data.id_scroll || '';
+    return {
+        wrapperProps: {
+            title: data.title || '',
+            description: data.description || '',
+            icon: typeof data.icon === 'string' ? data.icon : '',
+            bgColor: data.background_color || '',
+        },
+        sessionLayout: data.session_layout || '',
+        idScroll: hashtag ? idScroll : idScroll.toLowerCase(),
+        title: data.title || '',
+        description: data.description || '',
+        icon: typeof data.icon === 'string' ? data.icon : '',
+        hashtag: encodeURIComponent(hashtag),
+        backgroundColor: data.background_color || '',
+    };
+};
+const isCtaBannerMultiplePopupMode = (setting) => setting === 'include-popup';
+const formatCtaBannerPopupActionButton = (button, buttonStyle) => {
+    var _a, _b, _c, _d, _e, _f;
+    const title = (_b = (_a = button === null || button === void 0 ? void 0 : button.button_name) === null || _a === void 0 ? void 0 : _a.trim()) !== null && _b !== void 0 ? _b : '';
+    const url = (_d = (_c = button === null || button === void 0 ? void 0 : button.button_link) === null || _c === void 0 ? void 0 : _c.trim()) !== null && _d !== void 0 ? _d : '';
+    if (!title && !url) {
+        return undefined;
+    }
+    return {
+        backgroundColor: (_e = buttonStyle === null || buttonStyle === void 0 ? void 0 : buttonStyle.backgroundColor) !== null && _e !== void 0 ? _e : '',
+        backgroundGradient: (_f = buttonStyle === null || buttonStyle === void 0 ? void 0 : buttonStyle.backgroundGradient) !== null && _f !== void 0 ? _f : '',
+        title,
+        url,
+        openNewTab: Boolean(buttonStyle === null || buttonStyle === void 0 ? void 0 : buttonStyle.openNewTab),
+    };
+};
+const formatCtaBannerNestedPopupSetting = (popupSetting, fallbackDescriptionColour, buttonStyle) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    const isBackgroundImage = popupSetting.background_style === 'background-image';
+    const isBackgroundColor = popupSetting.background_style === 'background-color';
+    const popupSecondaryButton = formatCtaBannerPopupActionButton((_a = popupSetting.popup_buttons) === null || _a === void 0 ? void 0 : _a.first_button, buttonStyle);
+    const popupPrimaryButton = formatCtaBannerPopupActionButton((_b = popupSetting.popup_buttons) === null || _b === void 0 ? void 0 : _b.second_button, buttonStyle);
+    return Object.assign(Object.assign(Object.assign({ title: (_c = popupSetting.title) !== null && _c !== void 0 ? _c : '', titleColour: (_d = popupSetting.title_colour) !== null && _d !== void 0 ? _d : '', description: (_e = popupSetting.description) !== null && _e !== void 0 ? _e : '', descriptionColour: (_f = popupSetting.description_colour) !== null && _f !== void 0 ? _f : fallbackDescriptionColour, buttonColour: (_g = popupSetting.button_colour) !== null && _g !== void 0 ? _g : '', gradientButton: (_h = popupSetting.gradient_button) !== null && _h !== void 0 ? _h : '', backgroundStyle: (_j = popupSetting.background_style) !== null && _j !== void 0 ? _j : '', desktop: '', mobile: '' }, (isBackgroundColor && {
+        backgroundColour: (_k = popupSetting.background_colour) !== null && _k !== void 0 ? _k : '',
+        icon: normalizeApiString(popupSetting.icon),
+    })), (isBackgroundImage && {
+        imageDesktop: normalizeApiString(popupSetting.image_desktop),
+        imageMobile: normalizeApiString(popupSetting.image_mobile),
+    })), ((popupSecondaryButton || popupPrimaryButton) && {
+        buttons: Object.assign(Object.assign({}, (popupSecondaryButton && { secondary: popupSecondaryButton })), (popupPrimaryButton && { primary: popupPrimaryButton })),
+    }));
+};
+const formatCTABannerTypeSingleSession = (data) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+    if (!data) {
+        return {
+            type: 'single-image',
+            layout: 'image_overlay_content',
+            layoutPosition: 'left_banner',
+            fixSizeBanner: false,
+            listing: [],
+        };
+    }
+    const { cta_banner_type, layout, fix_size_banner, desktop_banner, mobile_banner, content_setting, popup_setting, advanced_settings, popup_display_button, } = data;
+    const defaultDescriptionColour = (_b = (_a = content_setting === null || content_setting === void 0 ? void 0 : content_setting.text) === null || _a === void 0 ? void 0 : _a.text_color) !== null && _b !== void 0 ? _b : '';
+    const header = content_setting === null || content_setting === void 0 ? void 0 : content_setting.header;
+    const text = content_setting === null || content_setting === void 0 ? void 0 : content_setting.text;
+    const buttons = content_setting === null || content_setting === void 0 ? void 0 : content_setting.buttons;
+    const primaryButton = buttons === null || buttons === void 0 ? void 0 : buttons.primary;
+    const secondaryButton = buttons === null || buttons === void 0 ? void 0 : buttons.secondary_button;
+    const buttonStyle = {
+        backgroundColor: (_c = buttons === null || buttons === void 0 ? void 0 : buttons.button_color) !== null && _c !== void 0 ? _c : '',
+        backgroundGradient: (_d = buttons === null || buttons === void 0 ? void 0 : buttons.gradient_button) !== null && _d !== void 0 ? _d : '',
+        openNewTab: Boolean(buttons === null || buttons === void 0 ? void 0 : buttons.open_new_tab),
+    };
+    const sharedPopupSetting = popup_setting
+        ? formatCtaBannerNestedPopupSetting(popup_setting, defaultDescriptionColour, buttonStyle)
+        : undefined;
+    const listing = [
+        {
+            banners: [
+                {
+                    desktop: normalizeApiString(desktop_banner),
+                    mobile: normalizeApiString(mobile_banner),
+                    titleColor: (_e = header === null || header === void 0 ? void 0 : header.text_color) !== null && _e !== void 0 ? _e : '',
+                    title: (_f = header === null || header === void 0 ? void 0 : header.header_content) !== null && _f !== void 0 ? _f : '',
+                    descriptionColor: (_g = text === null || text === void 0 ? void 0 : text.text_color) !== null && _g !== void 0 ? _g : '',
+                    description: (_h = text === null || text === void 0 ? void 0 : text.text_content) !== null && _h !== void 0 ? _h : '',
+                    buttons: {
+                        primary: {
+                            backgroundColor: buttonStyle.backgroundColor,
+                            backgroundGradient: buttonStyle.backgroundGradient,
+                            title: (_j = primaryButton === null || primaryButton === void 0 ? void 0 : primaryButton.button_name) !== null && _j !== void 0 ? _j : '',
+                            url: (_k = primaryButton === null || primaryButton === void 0 ? void 0 : primaryButton.button_link) !== null && _k !== void 0 ? _k : '',
+                            openNewTab: buttonStyle.openNewTab,
+                        },
+                        secondary: {
+                            backgroundColor: buttonStyle.backgroundColor,
+                            backgroundGradient: buttonStyle.backgroundGradient,
+                            title: (_l = secondaryButton === null || secondaryButton === void 0 ? void 0 : secondaryButton.button_name) !== null && _l !== void 0 ? _l : '',
+                            url: (_m = secondaryButton === null || secondaryButton === void 0 ? void 0 : secondaryButton.button_link) !== null && _m !== void 0 ? _m : '',
+                            openNewTab: buttonStyle.openNewTab,
+                        },
+                    },
+                },
+            ],
+        },
+    ];
+    return Object.assign(Object.assign(Object.assign({ type: cta_banner_type !== null && cta_banner_type !== void 0 ? cta_banner_type : 'single-image', layout: layout !== null && layout !== void 0 ? layout : 'image_overlay_content', layoutPosition: (_o = content_setting === null || content_setting === void 0 ? void 0 : content_setting.position) !== null && _o !== void 0 ? _o : 'left_banner', fixSizeBanner: Boolean(fix_size_banner), listing }, (sharedPopupSetting && Object.assign({ popupSetting: sharedPopupSetting }, (sharedPopupSetting.buttons && {
+        popupButtons: sharedPopupSetting.buttons,
+    })))), (advanced_settings && { advancedSettings: advanced_settings })), (popup_display_button && { popupDisplayButton: popup_display_button }));
+};
+const formatCTABannerTypeMultiSession = (data) => {
+    var _a, _b, _c, _d;
+    if (!data) {
+        return {
+            type: 'multiple-image',
+            layout: 'image_overlay_button',
+            gridLayout: 'layout_4_block',
+            shortReelLayout: false,
+            fixSizeBanner: false,
+            applyCarousel: false,
+            layoutKeyPillars: false,
+            expandAllCategories: false,
+            listing: [],
+        };
+    }
+    const { cta_banner_type, layout_key_pillars, layout, video_layout, short_reel_layout, fix_size_banner, apply_carousel, expand_all_categories, list_banners, color_list_banner, open_new_tab, popup_setting, advanced_settings, } = data;
+    const layoutKeyPillars = Boolean(layout_key_pillars);
+    const { layout: resolvedLayout, gridLayout } = resolveCtaBannerLayoutFromApi(layout, video_layout);
+    const defaultColor = {
+        title: (_a = color_list_banner === null || color_list_banner === void 0 ? void 0 : color_list_banner.title_color) !== null && _a !== void 0 ? _a : '',
+        description: (_b = color_list_banner === null || color_list_banner === void 0 ? void 0 : color_list_banner.description_color) !== null && _b !== void 0 ? _b : '',
+        button: (_c = color_list_banner === null || color_list_banner === void 0 ? void 0 : color_list_banner.button_color) !== null && _c !== void 0 ? _c : '',
+        gradient: (_d = color_list_banner === null || color_list_banner === void 0 ? void 0 : color_list_banner.gradient_button) !== null && _d !== void 0 ? _d : '',
+    };
+    const sharedPopupSetting = popup_setting
+        ? formatCtaBannerNestedPopupSetting(popup_setting, defaultColor.description)
+        : undefined;
+    const isSessionPopupMode = Boolean(sharedPopupSetting) &&
+        isCtaBannerMultiplePopupMode(advanced_settings);
+    const listingByLayout = layoutKeyPillars
+        ? list_banners !== null && list_banners !== void 0 ? list_banners : []
+        : [{ banners: list_banners }];
+    const listing = listingByLayout.map((groupBanner) => {
+        var _a, _b;
+        const isKeyPillar = layoutKeyPillars && 'key_pillars' in groupBanner;
+        const keyPillarData = isKeyPillar
+            ? (_a = groupBanner.key_pillars) !== null && _a !== void 0 ? _a : null
+            : null;
+        const banners = (_b = (isKeyPillar
+            ? groupBanner.banners
+            : list_banners)) !== null && _b !== void 0 ? _b : [];
+        return {
+            keyPillars: {
+                name: (keyPillarData === null || keyPillarData === void 0 ? void 0 : keyPillarData.name) || '',
+                slug: (keyPillarData === null || keyPillarData === void 0 ? void 0 : keyPillarData.slug) || '',
+            },
+            banners: banners.map((banner) => {
+                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+                const setting = banner.banner_setting;
+                const desktop = normalizeApiString(banner.desktop);
+                const mobile = normalizeApiString(banner.mobile);
+                const isPopupMode = Boolean((setting === null || setting === void 0 ? void 0 : setting.button_text) && isSessionPopupMode);
+                const popupSecondaryButton = formatCtaBannerPopupActionButton((_a = setting === null || setting === void 0 ? void 0 : setting.popup_buttons) === null || _a === void 0 ? void 0 : _a.first_button, {
+                    backgroundColor: defaultColor.button,
+                    backgroundGradient: defaultColor.gradient,
+                    openNewTab: true,
+                });
+                const popupPrimaryButton = formatCtaBannerPopupActionButton((_b = setting === null || setting === void 0 ? void 0 : setting.popup_buttons) === null || _b === void 0 ? void 0 : _b.second_button, {
+                    backgroundColor: defaultColor.button,
+                    backgroundGradient: defaultColor.gradient,
+                    openNewTab: true,
+                });
+                if (isPopupMode) {
+                    return Object.assign(Object.assign({ desktop,
+                        mobile, titleColor: defaultColor.title, title: (_c = setting === null || setting === void 0 ? void 0 : setting.title) !== null && _c !== void 0 ? _c : '', descriptionColor: defaultColor.description, description: (_d = setting === null || setting === void 0 ? void 0 : setting.description) !== null && _d !== void 0 ? _d : '' }, ((popupSecondaryButton || popupPrimaryButton) && {
+                        popupButtons: Object.assign(Object.assign({}, (popupSecondaryButton && {
+                            secondary: popupSecondaryButton,
+                        })), (popupPrimaryButton && { primary: popupPrimaryButton })),
+                    })), { buttons: {
+                            primary: {
+                                backgroundColor: defaultColor.button,
+                                backgroundGradient: defaultColor.gradient,
+                                title: (_e = setting === null || setting === void 0 ? void 0 : setting.button_text) !== null && _e !== void 0 ? _e : '',
+                                url: '',
+                                openNewTab: false,
+                                embedYoutube: false,
+                                youtubeLink: '',
+                            },
+                        } });
+                }
+                return {
+                    desktop,
+                    mobile,
+                    titleColor: defaultColor.title,
+                    title: (_f = setting === null || setting === void 0 ? void 0 : setting.title) !== null && _f !== void 0 ? _f : '',
+                    descriptionColor: defaultColor.description,
+                    description: (_g = setting === null || setting === void 0 ? void 0 : setting.description) !== null && _g !== void 0 ? _g : '',
+                    buttons: {
+                        primary: {
+                            backgroundColor: defaultColor.button,
+                            backgroundGradient: defaultColor.gradient,
+                            title: (_h = setting === null || setting === void 0 ? void 0 : setting.button_text) !== null && _h !== void 0 ? _h : '',
+                            url: (_j = setting === null || setting === void 0 ? void 0 : setting.button_link) !== null && _j !== void 0 ? _j : '',
+                            openNewTab: Boolean(open_new_tab),
+                            embedYoutube: Boolean(setting === null || setting === void 0 ? void 0 : setting.embed_youtube),
+                            youtubeLink: (_k = setting === null || setting === void 0 ? void 0 : setting.youtube_link) !== null && _k !== void 0 ? _k : '',
+                        },
+                    },
+                };
+            }),
+        };
+    });
+    return Object.assign(Object.assign({ type: cta_banner_type !== null && cta_banner_type !== void 0 ? cta_banner_type : 'multiple-image', layout: resolvedLayout, gridLayout, shortReelLayout: Boolean(short_reel_layout), fixSizeBanner: Boolean(fix_size_banner), applyCarousel: Boolean(apply_carousel), layoutKeyPillars, expandAllCategories: Boolean(expand_all_categories), listing }, (sharedPopupSetting && { popupSetting: sharedPopupSetting })), (advanced_settings && { advancedSettings: advanced_settings }));
+};
+const formatCTABanner = formatCTABannerTypeMultiSession;
+const formatCTABannerSession = (data) => {
+    return Object.assign(Object.assign({}, formatCommonProps(data)), (data.cta_banner_type === 'single-image'
+        ? formatCTABannerTypeSingleSession(data)
+        : formatCTABannerTypeMultiSession(data)));
+};
+
 const formatHelloWellnessFeatureImage = (data) => ({
     image: (data === null || data === void 0 ? void 0 : data.image) || '',
     header: (data === null || data === void 0 ? void 0 : data.header) || '',
     description: (data === null || data === void 0 ? void 0 : data.description) || '',
     redirectLink: (data === null || data === void 0 ? void 0 : data.redirect_link) || '',
 });
+const formatHelloWellnessSectionArticle = (data) => {
+    var _a, _b;
+    if (!(data === null || data === void 0 ? void 0 : data.display_type))
+        return undefined;
+    if (data.display_type === 'feature_image') {
+        return {
+            displayType: 'feature_image',
+            featureImages: ((_a = data.feature_images) === null || _a === void 0 ? void 0 : _a.map((item) => {
+                var _a, _b;
+                return ({
+                    image: (item === null || item === void 0 ? void 0 : item.image) || '',
+                    header: ((_a = item === null || item === void 0 ? void 0 : item.content) === null || _a === void 0 ? void 0 : _a.title) || '',
+                    description: ((_b = item === null || item === void 0 ? void 0 : item.content) === null || _b === void 0 ? void 0 : _b.description) || '',
+                    redirectLink: (item === null || item === void 0 ? void 0 : item.redirect_link) || '',
+                    openNewTab: Boolean(item === null || item === void 0 ? void 0 : item.open_new_tab),
+                });
+            })) || [],
+        };
+    }
+    return {
+        displayType: 'article_list',
+        articleList: ((_b = data.article_list) === null || _b === void 0 ? void 0 : _b.map((article) => formatArticle(article))) || [],
+    };
+};
 const formatHelloWellnessPinCategoryItem = (item) => {
     if (!item)
         return null;
@@ -2792,36 +3071,45 @@ const formatHelloWellnessPinCategoryItem = (item) => {
     return null;
 };
 const formatHelloWellnessSettings = (settings) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3;
     if (!settings)
         return {};
     return {
+        hideAdvertisements: (_a = settings.hide_advertisements) !== null && _a !== void 0 ? _a : true,
         menu: {
             spotlightMenu: {
-                banner: ((_b = (_a = settings.menu) === null || _a === void 0 ? void 0 : _a['spotlight-menu']) === null || _b === void 0 ? void 0 : _b.banner) || '',
-                url: ((_d = (_c = settings.menu) === null || _c === void 0 ? void 0 : _c['spotlight-menu']) === null || _d === void 0 ? void 0 : _d.url) || '',
+                banner: ((_c = (_b = settings.menu) === null || _b === void 0 ? void 0 : _b['spotlight-menu']) === null || _c === void 0 ? void 0 : _c.banner) || '',
+                url: ((_e = (_d = settings.menu) === null || _d === void 0 ? void 0 : _d['spotlight-menu']) === null || _e === void 0 ? void 0 : _e.url) || '',
             },
             videoMenu: {
-                videoUrl: ((_f = (_e = settings.menu) === null || _e === void 0 ? void 0 : _e.video_menu) === null || _f === void 0 ? void 0 : _f.video_url) || '',
-                thumbnail: typeof ((_h = (_g = settings.menu) === null || _g === void 0 ? void 0 : _g.video_menu) === null || _h === void 0 ? void 0 : _h.thumbnail_video) === 'string'
+                videoUrl: ((_g = (_f = settings.menu) === null || _f === void 0 ? void 0 : _f.video_menu) === null || _g === void 0 ? void 0 : _g.video_url) || '',
+                thumbnail: typeof ((_j = (_h = settings.menu) === null || _h === void 0 ? void 0 : _h.video_menu) === null || _j === void 0 ? void 0 : _j.thumbnail_video) === 'string'
                     ? settings.menu.video_menu.thumbnail_video
                     : '',
-                title: ((_k = (_j = settings.menu) === null || _j === void 0 ? void 0 : _j.video_menu) === null || _k === void 0 ? void 0 : _k.title) || '',
+                title: ((_l = (_k = settings.menu) === null || _k === void 0 ? void 0 : _k.video_menu) === null || _l === void 0 ? void 0 : _l.title) || '',
             },
         },
         helloWellnessCategory: {
-            icon: ((_l = settings.hello_wellness_category) === null || _l === void 0 ? void 0 : _l.icon) || '',
-            categoryName: ((_m = settings.hello_wellness_category) === null || _m === void 0 ? void 0 : _m.category_name) || '',
-        },
-        landingPage: {
-            bannerDesktop: ((_o = settings.landing_page) === null || _o === void 0 ? void 0 : _o.banner_desktop) || '',
-            bannerMobile: ((_p = settings.landing_page) === null || _p === void 0 ? void 0 : _p.banner_mobile) || '',
-            headerForCategoriesList: ((_q = settings.landing_page) === null || _q === void 0 ? void 0 : _q.header_for_categories_list) || '',
-            categories: ((_s = (_r = settings.landing_page) === null || _r === void 0 ? void 0 : _r.category) === null || _s === void 0 ? void 0 : _s.map((category) => formatCategory(category))) || [],
+            icon: ((_m = settings.hello_wellness_category) === null || _m === void 0 ? void 0 : _m.icon) || '',
+            categoryName: ((_o = settings.hello_wellness_category) === null || _o === void 0 ? void 0 : _o.category_name) || '',
         },
+        landingPage: Object.assign(Object.assign(Object.assign({ bannerDesktop: ((_p = settings.landing_page) === null || _p === void 0 ? void 0 : _p.banner_desktop) || '', bannerMobile: ((_q = settings.landing_page) === null || _q === void 0 ? void 0 : _q.banner_mobile) || '', icon: ((_r = settings.landing_page) === null || _r === void 0 ? void 0 : _r.icon) || '', pageName: ((_s = settings.landing_page) === null || _s === void 0 ? void 0 : _s.page_name) || '', pageDescription: ((_t = settings.landing_page) === null || _t === void 0 ? void 0 : _t.page_description) || '', enableSectionBanner: Boolean((_u = settings.landing_page) === null || _u === void 0 ? void 0 : _u.enable_section_banner) }, (((_v = settings.landing_page) === null || _v === void 0 ? void 0 : _v.section_banner) && {
+            sectionBanner: Object.assign(Object.assign({}, (settings.landing_page.section_banner.cta_banner_type ===
+                'single-image'
+                ? formatCTABannerTypeSingleSession(settings.landing_page.section_banner)
+                : formatCTABannerTypeMultiSession(settings.landing_page.section_banner))), { title: settings.landing_page.section_banner.title || '', description: settings.landing_page.section_banner.description || '', backgroundColor: settings.landing_page.section_banner.background_color || '' }),
+        })), { sectionCategory: {
+                headerForCategoriesList: ((_x = (_w = settings.landing_page) === null || _w === void 0 ? void 0 : _w.section_category) === null || _x === void 0 ? void 0 : _x.header_for_categories_list) ||
+                    '',
+                categories: ((_0 = (_z = (_y = settings.landing_page) === null || _y === void 0 ? void 0 : _y.section_category) === null || _z === void 0 ? void 0 : _z.category) === null || _0 === void 0 ? void 0 : _0.map((category) => formatCategory(category))) || [],
+            } }), (() => {
+            var _a;
+            const sectionArticle = formatHelloWellnessSectionArticle((_a = settings.landing_page) === null || _a === void 0 ? void 0 : _a.section_article);
+            return sectionArticle ? { sectionArticle } : {};
+        })()),
         pinArticleForEachCategory: {
-            sponsorLogo: ((_t = settings.pin_article_for_each_category) === null || _t === void 0 ? void 0 : _t.sponsor_logo) || '',
-            listCategories: ((_v = (_u = settings.pin_article_for_each_category) === null || _u === void 0 ? void 0 : _u.list_categories) === null || _v === void 0 ? void 0 : _v.map(formatHelloWellnessPinCategoryItem).filter(Boolean)) || [],
+            sponsorLogo: ((_1 = settings.pin_article_for_each_category) === null || _1 === void 0 ? void 0 : _1.sponsor_logo) || '',
+            listCategories: ((_3 = (_2 = settings.pin_article_for_each_category) === null || _2 === void 0 ? void 0 : _2.list_categories) === null || _3 === void 0 ? void 0 : _3.map(formatHelloWellnessPinCategoryItem).filter(Boolean)) || [],
         },
     };
 };
@@ -3122,7 +3410,7 @@ const NavigationV2 = (props) => {
         React__default.createElement(_NavigationV2, Object.assign({}, propsWithDefaultValues))));
 };
 const getNavMenuContent = (locale) => __awaiter(void 0, void 0, void 0, function* () {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
     const res = {};
     const isMarryBaby = locale === 'vi-VN_MB';
     const customLang = locale === 'tl-PH' ? 'lang=fil' : '';
@@ -3193,7 +3481,7 @@ const getNavMenuContent = (locale) => __awaiter(void 0, void 0, void 0, function
         const hospitals = getSettledValue(hospitalsResult);
         res.care = {
             items: ((_x = (_w = (_v = (_u = specialties === null || specialties === void 0 ? void 0 : specialties._data) === null || _u === void 0 ? void 0 : _u.setting_menu) === null || _v === void 0 ? void 0 : _v.menu_specialty) === null || _w === void 0 ? void 0 : _w.map) === null || _x === void 0 ? void 0 : _x.call(_w, formatSpecialties)) || [],
-            spotlights: ((_0 = (_z = (_y = hospitals === null || hospitals === void 0 ? void 0 : hospitals._data.setting_menu) === null || _y === void 0 ? void 0 : _y.menu_hospital) === null || _z === void 0 ? void 0 : _z.map) === null || _0 === void 0 ? void 0 : _0.call(_z, formatHospital)) ||
+            spotlights: ((_1 = (_0 = (_z = (_y = hospitals === null || hospitals === void 0 ? void 0 : hospitals._data) === null || _y === void 0 ? void 0 : _y.setting_menu) === null || _z === void 0 ? void 0 : _z.menu_hospital) === null || _0 === void 0 ? void 0 : _0.map) === null || _1 === void 0 ? void 0 : _1.call(_0, formatHospital)) ||
                 [],
         };
     }
@@ -3203,4 +3491,4 @@ const getNavMenuContentWithCache = (locale) => __awaiter(void 0, void 0, void 0,
     return (yield getDataWithCache('nav-menu-content', () => getNavMenuContent(locale || 'en-PH'), (data) => { var _a, _b; return !!((_b = (_a = data === null || data === void 0 ? void 0 : data.categories) === null || _a === void 0 ? void 0 : _a.items) === null || _b === void 0 ? void 0 : _b.length); })) || {};
 });
 
-export { HamburgerWhite as H, NavigationV2 as N, StarPair as S, getNavMenuContentWithCache as a, formatHelloWellnessSettings as b, HHG_SEARCH_BACK_KEY as c, formatHelloWellness as f, getNavMenuContent as g };
+export { HamburgerWhite as H, NavigationV2 as N, StarPair as S, getNavMenuContentWithCache as a, formatHelloWellnessSettings as b, formatCTABannerTypeSingleSession as c, formatCTABannerTypeMultiSession as d, formatCTABanner as e, formatHelloWellness as f, getNavMenuContent as g, formatCTABannerSession as h, HHG_SEARCH_BACK_KEY as i, resolveCtaBannerLayoutFromApi as r };

package/build/esm/{index-ba9e9af0.js → index-e68541e3.js}

@@ -1,24 +1,24 @@
-import { _ as __rest } from './tslib.es6-93aa8f12.js';
+import { a as __rest } from './tslib.es6-e8301414.js';
 import React__default, { createContext, useContext } from 'react';
 import { createStyles, rem, useMantineTheme, clsx } from '@mantine/core';
 import { useForm, isNotEmpty } from '@mantine/form';
-import { I as Input } from './index-b748bcd6.js';
-import { D as DatePicker } from './index-eca82644.js';
-import { T as Text } from './index-6580ebec.js';
-import './index-49eaac83.js';
+import { I as Input } from './index-a253b69f.js';
+import { D as DatePicker } from './index-9e8b1261.js';
+import { T as Text } from './index-cd8deb84.js';
+import './index-a85fa1ec.js';
 import { theme } from './miscTheme.js';
-import './index-920b0729.js';
-import './index.styles-62e88e3e.js';
-import { u as useTranslations } from './index-fad85dbc.js';
+import './index-c8b57f1a.js';
+import './index.styles-2efb7b19.js';
+import { u as useTranslations } from './index-386bd963.js';
 import '@mantine/hooks';
-import './index-31c848ae.js';
-import './utils-13f5d721.js';
-import './index-a3b71d67.js';
-import { C as CardWrapperContext } from './context-81dc9510.js';
-import { I as INPUT_RANGE } from './constants-bc991d23.js';
-import { H as HealthToolFormWrapper } from './index-10cb83ab.js';
-import { G as GenderOptionControl } from './index-9882c986.js';
-import { L as LOCALE } from './Locale-67fb4e9b.js';
+import './index-cf08696e.js';
+import './utils-180e09c3.js';
+import './index-00e60ff4.js';
+import { C as CardWrapperContext } from './context-e6c9c1a1.js';
+import { I as INPUT_RANGE } from './constants-b200aa75.js';
+import { H as HealthToolFormWrapper } from './index-4a255be5.js';
+import { G as GenderOptionControl } from './index-0bbab17a.js';
+import { L as LOCALE } from './Locale-574fe0ae.js';
 import { CalendarMB } from '@hhgtech/icons/other';
 
 const BabyGrowthFormContext = createContext({});

package/build/esm/{index-7952f6ba.js → index-e9fc31e1.js}

@@ -1,21 +1,21 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-93aa8f12.js';
+import { a as __rest, _ as __awaiter } from './tslib.es6-e8301414.js';
 import * as React from 'react';
 import React__default, { useMemo, useEffect, useRef, useContext, useState } from 'react';
 import { User } from '@hhgtech/icons/core';
-import { S as Spinner } from './Spinner-193e7588.js';
-import { A as Avatar } from './index-b748bcd6.js';
-import { B as Button } from './index-49eaac83.js';
-import { T as Text } from './index-6580ebec.js';
-import { u as useTranslations } from './index-fad85dbc.js';
-import { C as CommonGAssets } from './index-578f906d.js';
+import { S as Spinner } from './Spinner-626842d5.js';
+import { A as Avatar } from './index-a253b69f.js';
+import { B as Button } from './index-a85fa1ec.js';
+import { T as Text } from './index-cd8deb84.js';
+import { u as useTranslations } from './index-386bd963.js';
+import { C as CommonGAssets } from './index-5f582eb1.js';
 import { theme } from './miscTheme.js';
 import styled from '@emotion/styled';
-import { M as MediaQueries } from './utils-13f5d721.js';
+import { M as MediaQueries } from './utils-180e09c3.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
 import classNames from 'classnames';
-import { C as CARE_LOCALES, d as CARE_BOOKING_LOCALES, c as LOCALE_HAS_COMMUNITY_SITE, E as ECOM_LOCALES, V as VIDEO_LOCALES, H as HAS_CLINITY_DOWNLOAD_SITE, e as LOCALE_HAS_CART_CARE_SITE } from './index-20de1094.js';
-import { d as domainLocalesMarryBaby } from './utils-aa4cf4f2.js';
-import { g as getCurrentBaseUrl, a as getCurrentSsoUrl, b as getTogetherApiDomain, c as getDiscoverApiDomain } from './normalizeLink-e6cdb3d0.js';
+import { C as CARE_LOCALES, d as CARE_BOOKING_LOCALES, a as LOCALE_HAS_COMMUNITY_SITE, E as ECOM_LOCALES, V as VIDEO_LOCALES, H as HAS_CLINITY_DOWNLOAD_SITE, e as LOCALE_HAS_CART_CARE_SITE } from './index-0418d8ce.js';
+import { d as domainLocalesMarryBaby } from './utils-d33b75d9.js';
+import { g as getCurrentBaseUrl, a as getCurrentSsoUrl, b as getTogetherApiDomain, c as getDiscoverApiDomain } from './normalizeLink-c74e4594.js';
 import { domainLocales } from './constantsDomainLocales.js';
 import { ProfileNavigation } from './profileNavigation.js';
 import { NavigationLogoutPopup } from './navigationLogoutPopup.js';

package/build/esm/{index-0cbaad13.js → index-eaf45062.js}

@@ -1,8 +1,8 @@
-import { _ as __rest } from './tslib.es6-93aa8f12.js';
+import { a as __rest } from './tslib.es6-e8301414.js';
 import React__default from 'react';
 import { MantineProvider as MantineProvider$1 } from '@mantine/core';
-import { u as useMantineLocale, g as getMantineThemeOverride, N as NotificationsHandler } from './index-31c848ae.js';
-import { C as CustomStylesType, T as TemplateProvider } from './index-920b0729.js';
+import { u as useMantineLocale, g as getMantineThemeOverride, N as NotificationsHandler } from './index-cf08696e.js';
+import { C as CustomStylesType, T as TemplateProvider } from './index-c8b57f1a.js';
 
 const MantineProvider = (_a) => {
     var { children, locale, template = 'hb', isNotifications = true, customStyleType = CustomStylesType.NONE } = _a, props = __rest(_a, ["children", "locale", "template", "isNotifications", "customStyleType"]);

package/build/esm/{index-9a46039e.js → index-ed47932b.js}

@@ -1,5 +1,5 @@
 import React__default, { useState, useEffect } from 'react';
-import { B as Button } from './index-49eaac83.js';
+import { B as Button } from './index-a85fa1ec.js';
 import styled from '@emotion/styled';
 
 const StyledContainer = styled.div `

package/build/esm/{index-269dd8f8.js → index-f18c5b60.js}

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import React__default, { useState, useCallback, useMemo, useEffect } from 'react';
-import { _ as __rest } from './tslib.es6-93aa8f12.js';
+import { a as __rest } from './tslib.es6-e8301414.js';
 import { clsx } from '@mantine/core';
 import { Drawer } from 'vaul';
 import styled from '@emotion/styled';
-import { Z as ZINDEX_SSO } from './index-20de1094.js';
+import { c as ZINDEX_SSO } from './index-0418d8ce.js';
 
 /* eslint-disable prettier/prettier */
 const Close = (props) => (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "currentColor" }, props),

package/build/esm/{index-79847772.js → index-fa92e865.js}

@@ -1,11 +1,11 @@
-import { _ as __rest } from './tslib.es6-93aa8f12.js';
+import { a as __rest } from './tslib.es6-e8301414.js';
 import React__default from 'react';
 import { clsx, Modal } from '@mantine/core';
-import { D as DrawerComponent, u as useDrawerDrag } from './index-269dd8f8.js';
+import { D as DrawerComponent, u as useDrawerDrag } from './index-f18c5b60.js';
 import { Drawer } from 'vaul';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { Z as ZINDEX_SSO } from './index-20de1094.js';
+import { c as ZINDEX_SSO } from './index-0418d8ce.js';
 
 styled(DrawerComponent) `
   /* max-height: 100vh;