@hhgtech/hhg-components 1.29.514 → 1.29.515-beta-2

package/build/esm/{index-2ad4786e.js → index-8eed913e.js}

@@ -1,11 +1,11 @@
 import React__default, { useState, useEffect } from 'react';
-import { L as LOCALE } from './Locale-badbf0b1.js';
-import { C as CommonGAssets } from './index-297608e7.js';
+import { L as LOCALE } from './Locale-7f8862a8.js';
+import { C as CommonGAssets } from './index-e00dd638.js';
 import styled from '@emotion/styled';
-import { M as MediaQueries } from './utils-0a49e28d.js';
-import { L as LogoIcon } from './logoIcon-b565171a.js';
-import './index-4a067ff0.js';
-import { I as ImageWrap } from './index-97d43783.js';
+import { M as MediaQueries } from './utils-3d8f157a.js';
+import { L as LogoIcon } from './logoIcon-a8965a18.js';
+import './index-da803306.js';
+import { I as ImageWrap } from './index-deb3791b.js';
 
 const StyledLogo = styled.div `
   position: relative;

package/build/esm/{index-122879f6.js → index-92134f90.js}

@@ -2,15 +2,24 @@ import * as React from 'react';
 import React__default from 'react';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { T as Text } from './index-11ebe681.js';
+import { T as Text } from './index-bc0dac1a.js';
 import classNames from 'classnames';
-import { I as ImageWrap } from './index-97d43783.js';
-import { T as Text$1 } from './index-7055f29e.js';
+import { I as ImageWrap } from './index-deb3791b.js';
+import { T as Text$1 } from './index-31fb253f.js';
 
 /* eslint-disable prettier/prettier */
 const ArrowRightBlue = (props) => (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 6 10", fill: "none" }, props),
     React.createElement("path", { d: "M1 9L5 5L1 1", stroke: "#2D87F3", strokeWidth: 1.75, strokeLinecap: "round", strokeLinejoin: "round" })));
 
+/* eslint-disable prettier/prettier */
+const Clinic = (props) => (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 20 20", fill: "none" }, props),
+    React.createElement("path", { d: "M4.89646 16.9996H2.96549C2.43225 16.9996 2 16.5674 2 16.0341V12.6549C2 12.1217 2.43225 11.6895 2.96549 11.6895H4.89646", stroke: "#8C8C8C", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
+    React.createElement("path", { d: "M15.0342 11.6895H16.9652C17.4984 11.6895 17.9306 12.1217 17.9306 12.6549V16.0341C17.9306 16.5674 17.4984 16.9996 16.9652 16.9996H15.0342", stroke: "#8C8C8C", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
+    React.createElement("path", { d: "M5.86197 3H14.0686C14.6015 3 15.0341 3.43263 15.0341 3.96549V16.9995H4.89648V3.96549C4.89648 3.43263 5.32912 3 5.86197 3Z", stroke: "#8C8C8C", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
+    React.createElement("path", { d: "M11.172 13.6206H8.7583V16.9998H11.172V13.6206Z", stroke: "#8C8C8C", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
+    React.createElement("path", { d: "M9.96533 9.99996V5.65527", stroke: "#8C8C8C", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
+    React.createElement("path", { d: "M12.1377 7.82764H7.79297", stroke: "#8C8C8C", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" })));
+
 const StyledInsuranceList = styled.ul `
   display: grid;
   grid-gap: 16px;
@@ -99,15 +108,6 @@ const PaymentList = ({ payments, className, isName = true, isMobile = false, })
         isName && React__default.createElement("div", { className: "txt-caption-1" }, payment.name))))));
 };
 
-/* eslint-disable prettier/prettier */
-const Clinic = (props) => (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 20 20", fill: "none" }, props),
-    React.createElement("path", { d: "M4.89646 16.9996H2.96549C2.43225 16.9996 2 16.5674 2 16.0341V12.6549C2 12.1217 2.43225 11.6895 2.96549 11.6895H4.89646", stroke: "currentColor", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
-    React.createElement("path", { d: "M15.0342 11.6895H16.9652C17.4984 11.6895 17.9306 12.1217 17.9306 12.6549V16.0341C17.9306 16.5674 17.4984 16.9996 16.9652 16.9996H15.0342", stroke: "currentColor", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
-    React.createElement("path", { d: "M5.86197 3H14.0686C14.6015 3 15.0341 3.43263 15.0341 3.96549V16.9995H4.89648V3.96549C4.89648 3.43263 5.32912 3 5.86197 3Z", stroke: "currentColor", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
-    React.createElement("path", { d: "M11.172 13.6206H8.7583V16.9998H11.172V13.6206Z", stroke: "currentColor", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
-    React.createElement("path", { d: "M9.96533 9.99996V5.65527", stroke: "currentColor", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
-    React.createElement("path", { d: "M12.1377 7.82764H7.79297", stroke: "currentColor", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" })));
-
 const StyledContainer = styled.div `
   display: flex;
   gap: 8px;

package/build/esm/{index-abd07cc5.js → index-94d6fe4a.js}

@@ -1,12 +1,12 @@
 import React__default, { useState, useEffect, useContext, useRef } from 'react';
-import { H as Heading } from './index-c831693a.js';
-import { M as MediaQueries, t as toggleNoScroll } from './utils-0a49e28d.js';
-import { u as useTranslations } from './index-8c265f04.js';
-import { T as TogetherComponentGlobalContext } from './utils-5d371d7d.js';
+import { H as Heading } from './index-a0e1aed1.js';
+import { M as MediaQueries, t as toggleNoScroll } from './utils-3d8f157a.js';
+import { u as useTranslations } from './index-bdd0d5dc.js';
+import { T as TogetherComponentGlobalContext } from './utils-73652e24.js';
 import { Portal } from '@mantine/core';
-import { T as Text } from './index-7055f29e.js';
+import { T as Text } from './index-31fb253f.js';
 import styled from '@emotion/styled';
-import { _ as __rest } from './tslib.es6-16f01fac.js';
+import { _ as __rest } from './tslib.es6-2f182153.js';
 import { theme } from './miscTheme.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
 

package/build/esm/{index-5a5b26ad.js → index-99a3fda3.js}

@@ -1,26 +1,26 @@
-import { _ as __rest } from './tslib.es6-16f01fac.js';
+import { _ as __rest } from './tslib.es6-2f182153.js';
 import React__default, { createContext, useContext, useMemo, forwardRef, useState } from 'react';
 import { useMantineTheme, clsx, Group, Flex, Tooltip, Box } from '@mantine/core';
 import { format } from 'date-fns';
-import { L as LastPeriod } from './LastPeriod-a9bb98b2.js';
-import { L as LOCALE } from './Locale-badbf0b1.js';
+import { L as LastPeriod } from './LastPeriod-1d3fb167.js';
+import { L as LOCALE } from './Locale-7f8862a8.js';
 import { useForm, isNotEmpty } from '@mantine/form';
 import dayjs from 'dayjs';
-import { R as Radio, I as Input, S as Select } from './index-5c2a08a7.js';
-import { D as DatePicker } from './index-fa38204f.js';
-import { T as Text } from './index-7055f29e.js';
-import './index-8794bd57.js';
-import './index-3abf0785.js';
-import './index.styles-55449bb8.js';
-import { u as useTranslations } from './index-8c265f04.js';
+import { R as Radio, I as Input, S as Select } from './index-cf2ab22a.js';
+import { D as DatePicker } from './index-f1192632.js';
+import { T as Text } from './index-31fb253f.js';
+import './index-74d7e6ec.js';
+import './index-521ca503.js';
+import './index.styles-90331358.js';
+import { u as useTranslations } from './index-bdd0d5dc.js';
 import '@mantine/hooks';
-import './index-126b7528.js';
-import './utils-0a49e28d.js';
-import './index-41a6bcc7.js';
-import { H as HealthToolFormWrapper } from './index-1bf3b5b1.js';
+import './index-75029227.js';
+import './utils-3d8f157a.js';
+import './index-35894931.js';
+import { H as HealthToolFormWrapper } from './index-dcfe196e.js';
 import { CalendarMB } from '@hhgtech/icons/other';
-import { C as CardWrapperContext } from './context-8f6c5cc3.js';
-import { Q as QUERY_HEALTH_TOOL, A as API_DATE_FORMAT$1 } from './index-a229fca5.js';
+import { C as CardWrapperContext } from './context-5e8d5851.js';
+import { Q as QUERY_HEALTH_TOOL, A as API_DATE_FORMAT$1 } from './index-279b70a7.js';
 import { theme } from './miscTheme.js';
 
 const ConceptionDate = (_a) => {

package/build/esm/{index-c831693a.js → index-a0e1aed1.js}

@@ -1,7 +1,7 @@
-import { _ as __rest } from './tslib.es6-16f01fac.js';
+import { _ as __rest } from './tslib.es6-2f182153.js';
 import React__default from 'react';
 import { useMantineTheme } from '@mantine/core';
-import { T as Text } from './index-7055f29e.js';
+import { T as Text } from './index-31fb253f.js';
 
 /**
  * @deprecated Consider to use import { Title } from '@mantine/core'

package/build/esm/{index-3627b164.js → index-a136b5aa.js}

@@ -1,56 +1,60 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-16f01fac.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-2f182153.js';
 import * as React from 'react';
 import React__default, { useContext, useState, useCallback, useEffect, useMemo, useRef } from 'react';
-import { i as isInternalLink, V as VideoItem, S as SiteWideBanner, L as LanguageSwitcher } from './SiteWideBanner-a7114d0f.js';
-import { 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-a229fca5.js';
-import { e as normalizeLink, n as normalizeLinkSlash, g as getCurrentBaseUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain, d as getCareApiDomain } from './normalizeLink-4acb9445.js';
-import { f as formatCommunity, a as formatPost } from './dataTransform-ce226808.js';
+import { i as isInternalLink, V as VideoItem, S as SiteWideBanner, L as LanguageSwitcher } from './SiteWideBanner-d6ad3fde.js';
+import { 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-279b70a7.js';
+import { e as normalizeLink, n as normalizeLinkSlash, g as getCurrentBaseUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain, d as getCareApiDomain } from './normalizeLink-824fe14a.js';
+import { f as formatCommunity, a as formatPost } from './dataTransform-94d3bd02.js';
 import { Close, Logo } from '@hhgtech/icons/core';
-import './translationsContext-f47c7a98.js';
+import './translationsContext-42064b12.js';
 import styled from '@emotion/styled';
-import { I as Input } from './index-5c2a08a7.js';
+import { I as Input } from './index-cf2ab22a.js';
 import { theme } from './miscTheme.js';
-import { a as NavigationContext, u as useCSSFocusPopupHelper, N as NavigationProfileButton, b as NavigationProvider } from './index-9a0cd477.js';
+import { a as NavigationContext, u as useCSSFocusPopupHelper, N as NavigationProfileButton, b as NavigationProvider } from './index-c3facfcf.js';
 import { ArrowRight, ChatAi } from '@hhgtech/icons/other';
 import { createStyles, Box, Indicator, useMantineTheme, clsx } from '@mantine/core';
-import { L as Logo$1 } from './index-2ad4786e.js';
+import { L as Logo$1 } from './index-8eed913e.js';
 import throttle from 'lodash/throttle';
 import '@mantine/dates';
-import { V as VideoType } from './index-4a067ff0.js';
-import { C as CommonGAssets } from './index-297608e7.js';
-import './index-126b7528.js';
-import { T as Text } from './index-7055f29e.js';
-import { B as Button } from './index-8794bd57.js';
-import './index-3abf0785.js';
-import './index.styles-55449bb8.js';
+import { V as VideoType } from './index-da803306.js';
+import { C as CommonGAssets } from './index-e00dd638.js';
+import './index-75029227.js';
+import { T as Text } from './index-31fb253f.js';
+import { B as Button } from './index-74d7e6ec.js';
+import './index-521ca503.js';
+import './index.styles-90331358.js';
 import '@mantine/hooks';
-import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-0a49e28d.js';
-import './index-41a6bcc7.js';
-import { L as LOCALISED_SLUGS } from './constants-1b8ec518.js';
-import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-04943e2b.js';
-import { I as Indicator$1 } from './index-64e355fc.js';
-import { u as useTranslations } from './index-8c265f04.js';
-import { u as useIsInit } from './useIsInit-15a7f46d.js';
-import { L as LOCALIZED_SLUGS } from './constants-f43e83fe.js';
+import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-3d8f157a.js';
+import './index-35894931.js';
+import { L as LOCALISED_SLUGS, C as CARE_BASE_PATH } from './constants-36a631be.js';
+import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-786fa52c.js';
+import { L as LOCALISED_SLUGS$1 } from './constants-84429199.js';
+import { I as Indicator$1 } from './index-673b27e9.js';
+import { u as useTranslations } from './index-bdd0d5dc.js';
+import { u as useIsInit, a as useCartCareService } from './useCartCareService-c356d742.js';
+import { L as LOCALIZED_SLUGS } from './constants-a4e148ac.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
-import { B as Button$1 } from './index-316d8e13.js';
-import { H as Heading } from './index-c831693a.js';
-import { a as getCareSearchUrl, h as hexToRgb, r as rgbToHsb, b as hsbToRgb, Z as Z_INDEX, f as formatCategory, c as formatSpotlightsList, d as checkAvailableSpotlight, e as formatHealthTool, i as formatVideoItem, j as formatSpecialties, k as formatHospital } from './utils-2b9e0cc4.js';
-import { C as Container } from './index-8c06a8ac.js';
+import { B as Button$1 } from './index-d9ae59c9.js';
+import { H as Heading } from './index-a0e1aed1.js';
+import { a as getCareSearchUrl, h as hexToRgb, r as rgbToHsb, b as hsbToRgb, Z as Z_INDEX, f as formatCategory, c as formatSpotlightsList, d as checkAvailableSpotlight, e as formatHealthTool, i as formatVideoItem, j as formatSpecialties, k as formatHospital } from './utils-5516c0ad.js';
+import { C as Container } from './index-198930cb.js';
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
-import { U as UserAvatar } from './index-5cc25575.js';
-import { L as LOCALE } from './Locale-badbf0b1.js';
+import { U as UserAvatar } from './index-549a5d57.js';
+import { C as CartCareButton } from './index-a43301fb.js';
+import { L as LOCALE } from './Locale-7f8862a8.js';
 import debounce from 'lodash/debounce';
 import { domainLocales } from './constantsDomainLocales.js';
-import { g as getDataWithCache } from './core-e6b6b37b.js';
+import { g as getDataWithCache } from './core-c534f183.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" }),
-    React.createElement("path", { d: "M4 7H20", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
-    React.createElement("path", { d: "M4 17H20", stroke: "white", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })));
+/* eslint-disable prettier/prettier */
+const HamburgerWhite = (props) => (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "none" }, props),
+    React.createElement("path", { d: "M4 12H20", stroke: "white", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round" }),
+    React.createElement("path", { d: "M4 7H20", stroke: "white", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round" }),
+    React.createElement("path", { d: "M4 17H20", stroke: "white", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round" })));
 
-const StarPair = (props) => (React.createElement("svg", Object.assign({ width: "22", height: "28", viewBox: "0 0 22 28", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
+/* eslint-disable prettier/prettier */
+const StarPair = (props) => (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 22 28", fill: "none" }, props),
     React.createElement("path", { d: "M6.35278 10.7516C6.42759 10.976 6.63881 11.1279 6.87534 11.1279C7.11187 11.1279 7.322 10.976 7.39791 10.7516C7.68947 9.87691 8.37585 9.19053 9.25054 8.89896C9.47497 8.82415 9.62679 8.61403 9.62679 8.3775C9.62679 8.14097 9.47497 7.93084 9.25054 7.85603C8.37585 7.56446 7.68947 6.87809 7.39791 6.00339C7.24719 5.55453 6.5046 5.55453 6.35388 6.00339C6.06231 6.87809 5.37594 7.56446 4.50125 7.85603C4.27682 7.93084 4.125 8.14097 4.125 8.3775C4.125 8.61403 4.27682 8.82415 4.50125 8.89896C5.37565 9.19043 6.06193 9.87699 6.35278 10.7516Z", fill: "#2743AD" }),
     React.createElement("path", { d: "M20.1723 14.3286L18.5342 13.6789C16.821 12.9995 15.4655 11.6411 14.7897 9.92641L14.1396 8.27697C13.9232 7.72994 13.0262 7.72994 12.8097 8.27697L12.1597 9.92641C11.4839 11.6411 10.1284 12.9995 8.41517 13.6789L6.77705 14.3286C6.5044 14.4367 6.32422 14.7016 6.32422 14.9952C6.32422 15.2888 6.50345 15.5537 6.77705 15.6618L8.41517 16.3115C10.1284 16.991 11.4839 18.3494 12.1597 20.064L12.8097 21.7135C12.9175 21.987 13.1815 22.1668 13.4742 22.1668C13.7669 22.1668 14.031 21.987 14.1387 21.7135L14.7888 20.064C15.4646 18.3494 16.8201 16.991 18.5333 16.3115L20.1714 15.6618C20.444 15.5537 20.6242 15.2888 20.6242 14.9952C20.6242 14.7016 20.4459 14.4367 20.1723 14.3286Z", fill: "#2743AD" })));
 
@@ -1895,6 +1899,19 @@ const StyledHeaderWrapper = styled.div `
     }
 
     .profile-nav-group {
+      margin-left: 12px;
+      gap: 24px;
+
+      ${MediaQueries.pcDown} {
+        margin-left: 16px;
+        gap: 16px;
+      }
+
+      ${MediaQueries.mbDown} {
+        margin-left: 0;
+        gap: 16px;
+      }
+
       .login-btn {
         border-radius: 28px;
         border-color: rgba(255, 255, 255, 0.2);
@@ -1905,6 +1922,16 @@ const StyledHeaderWrapper = styled.div `
       }
     }
 
+    .hhgcomp-navigation-itemnav-headeritem {
+      gap: 2px;
+      ${MediaQueries.pcUp} {
+        padding: 0 12px;
+      }
+      ${MediaQueries.pcDown} {
+        padding: 0 6px;
+      }
+    }
+
     .mobile-close-icon {
       path {
         stroke: ${theme.colors.white};
@@ -2143,7 +2170,7 @@ const StyleButtonAiChat = styled(Button) `
 `;
 
 const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent, subHead, projectType, customClasses, }) => {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e;
     const { siteType, isMobile = false, locale, sitewideBanner, sitewideBannerData, 
     // sitewideBannerShown = true,
     sitewideSite = 'discover', sponsorComponent, isHomepage = false, 
@@ -2152,7 +2179,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
     // ssrMenuContent: { categories, healthTools, care, together },
     configs: { statics, 
     // enableNavCareBooking,
-    enableSearchBar, enableNavChatbotAi, enableNavClinityDownload, enableAppIntroPage,
+    enableSearchBar, enableNavChatbotAi, enableNavClinityDownload, enableAppIntroPage, enableNavCartCare,
     // enableNavVideo,
     // enableNavCare,
     // enableProfileMyHealth,
@@ -2169,6 +2196,9 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
     const scrollY = useRef(47);
     const headerRef = useRef(null);
     const collapsedMenu = useRef(false);
+    const { getHref } = useCartCareService();
+    const cartBaseUrl = `${getCurrentBaseUrl(locale)}/${CARE_BASE_PATH}/${(_a = LOCALISED_SLUGS$1[locale]) === null || _a === void 0 ? void 0 : _a.CART}/`;
+    const cartHref = getHref();
     const goToLogin = () => {
         if (IS_SSOV2_ENABLED(locale))
             return triggerLogin();
@@ -2178,7 +2208,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
             : currentLocation;
     };
     const logoType = siteType === 'helloSites'
-        ? (_a = LOCALE_SPECS[locale]) === null || _a === void 0 ? void 0 : _a.LOGO_TYPE
+        ? (_b = LOCALE_SPECS[locale]) === null || _b === void 0 ? void 0 : _b.LOGO_TYPE
         : siteType;
     const isBrowser = typeof window !== 'undefined';
     const scrolling = useCallback(throttle(() => {
@@ -2236,11 +2266,12 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
                         : true), originalMenuItems: menuItems, className: customClasses.navMenu })),
                 React__default.createElement(StyledProfileNavGroup, { className: "profile-nav-group" },
                     languageMenu,
+                    enableNavCartCare && winCashBackTheme && (React__default.createElement(CartCareButton, { href: cartHref !== null && cartHref !== void 0 ? cartHref : cartBaseUrl, count: cartHref ? 1 : 0 })),
                     enableNavChatbotAi && (React__default.createElement(Box, { component: "a", href: `${getCurrentBaseUrl(locale)}/ai-doctor`, "data-event-category": "Chatbot AI", "data-event-action": "Open", "data-event-label": "Hamburger Navigation", className: "ai-doctor-nav-item" },
-                        React__default.createElement(StyleButtonAiChat, { variant: "tertiary", leftIcon: React__default.createElement(ChatAi, { size: 18, color: "#2F8AF2" }), size: "md", className: "ai-doctor-btn" }, (_b = LOCALE_SPECS[locale]) === null || _b === void 0 ? void 0 :
-                            _b.SITE_NAME,
+                        React__default.createElement(StyleButtonAiChat, { variant: "tertiary", leftIcon: React__default.createElement(ChatAi, { size: 18, color: "#2F8AF2" }), size: "md", className: "ai-doctor-btn" }, (_c = LOCALE_SPECS[locale]) === null || _c === void 0 ? void 0 :
+                            _c.SITE_NAME,
                             " AI"))),
-                    enableNavClinityDownload && (React__default.createElement(Box, { component: "a", href: `${(_c = STATIC_PAGES[locale]) === null || _c === void 0 ? void 0 : _c.CLINITY_DOWNLOAD_LINK}`, target: "_blank", "data-event-category": "Hamburger Navigation", "data-event-action": "Download Clinity", "data-event-label": `${(_d = STATIC_PAGES[locale]) === null || _d === void 0 ? void 0 : _d.CLINITY_DOWNLOAD_LINK}`, "data-cart-menu": true },
+                    enableNavClinityDownload && (React__default.createElement(Box, { component: "a", href: `${(_d = STATIC_PAGES[locale]) === null || _d === void 0 ? void 0 : _d.CLINITY_DOWNLOAD_LINK}`, target: "_blank", "data-event-category": "Hamburger Navigation", "data-event-action": "Download Clinity", "data-event-label": `${(_e = STATIC_PAGES[locale]) === null || _e === void 0 ? void 0 : _e.CLINITY_DOWNLOAD_LINK}`, "data-cart-menu": true },
                         React__default.createElement("img", { src: CommonGAssets.getAssetPath('clinity-download.png'), alt: "Clinity", className: "clinity-logo", style: { display: 'block' } }))),
                     slot,
                     React__default.createElement(NavigationProfileButton, { userInfo: userInfo, siteType: siteType, onLoginClick: onLoginClick || goToLogin, 

package/build/esm/index-a43301fb.js

@@ -0,0 +1,103 @@
+import * as React from 'react';
+import React__default from 'react';
+import classNames from 'classnames';
+import styled from '@emotion/styled';
+import { Box } from '@mantine/core';
+import { M as MediaQueries } from './utils-3d8f157a.js';
+import { theme } from './miscTheme.js';
+import { u as useTranslations } from './index-bdd0d5dc.js';
+import { T as Text } from './index-31fb253f.js';
+
+/* eslint-disable prettier/prettier */
+const ShoppingCartCare = (props) => (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 20 20", fill: "none" }, props),
+    React.createElement("path", { d: "M1.94434 1.94434L3.44545 2.31989C3.88211 2.42878 4.20989 2.791 4.27545 3.23656L5.55656 11.9454", stroke: "currentColor", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
+    React.createElement("path", { d: "M16.9444 14.7218H4.99997C4.23331 14.7218 3.61108 14.0996 3.61108 13.3329C3.61108 12.5662 4.23331 11.944 4.99997 11.944H14.4766C14.9544 11.944 15.38 11.6385 15.5311 11.184L17.0122 6.73957C17.2522 6.01957 16.7166 5.27734 15.9578 5.27734H4.57553", stroke: "currentColor", strokeWidth: 1.2, strokeLinecap: "round", strokeLinejoin: "round" }),
+    React.createElement("path", { d: "M4.16648 18.8891C4.93354 18.8891 5.55537 18.2673 5.55537 17.5002C5.55537 16.7332 4.93354 16.1113 4.16648 16.1113C3.39941 16.1113 2.77759 16.7332 2.77759 17.5002C2.77759 18.2673 3.39941 18.8891 4.16648 18.8891Z", fill: "currentColor" }),
+    React.createElement("path", { d: "M15.8332 18.8891C16.6003 18.8891 17.2221 18.2673 17.2221 17.5002C17.2221 16.7332 16.6003 16.1113 15.8332 16.1113C15.0662 16.1113 14.4443 16.7332 14.4443 17.5002C14.4443 18.2673 15.0662 18.8891 15.8332 18.8891Z", fill: "currentColor" })));
+
+const StyledCartCareBox = styled(Box) `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  border: 1px solid #ffffff33;
+  position: relative;
+  flex-shrink: 0;
+  cursor: pointer;
+
+  /* Desktop: Square layout */
+  border-radius: 28px;
+  max-height: 40px;
+  padding: 9px 1rem;
+  background-color: inherit;
+  white-space: nowrap;
+
+  .cart-care-icon {
+    width: 20px;
+    height: 20px;
+    color: ${theme.colors.white};
+    flex-shrink: 0;
+  }
+
+  .cart-care-button-text {
+    display: block;
+    font-size: 14px;
+    font-weight: 500;
+    line-height: 22px;
+  }
+
+  /* Mobile: Circle layout */
+  ${MediaQueries.mbDown} {
+    border-radius: 100%;
+    aspect-ratio: 1/1;
+    width: 32px;
+    height: 32px;
+    padding: auto;
+    background-color: ${theme.colors.white};
+    max-height: none;
+    padding: 0;
+
+    .cart-care-icon {
+      width: 20px;
+      height: 20px;
+      color: ${theme.colors.blue900};
+      flex-shrink: 0;
+    }
+
+    .cart-care-button-text {
+      display: none;
+    }
+  }
+`;
+const StyledCartCareButtonCount = styled(Box) `
+  min-width: 20px;
+  min-height: 20px;
+  aspect-ratio: 1/1;
+  border-radius: 100%;
+  background-color: ${theme.colors.red500};
+  color: ${theme.colors.white};
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  position: absolute;
+  top: -4px;
+  right: -4px;
+  ${MediaQueries.mbDown} {
+    top: -8px;
+    right: -8px;
+  }
+`;
+
+const CartCareButton = (props) => {
+    const { count = 0, href, classes, boxProps, anchorProps, tracking } = props;
+    const { t } = useTranslations();
+    return (React__default.createElement("a", Object.assign({ className: classNames('cart-care-button'), href: href, "data-testid": "cart-care-button", "data-event-category": "Hamburger Navigation", "data-event-action": "Cart Click", "data-event-label": href }, tracking, anchorProps),
+        React__default.createElement(StyledCartCareBox, Object.assign({ className: classNames('cart-care-button-box', classes === null || classes === void 0 ? void 0 : classes.box) }, boxProps),
+            React__default.createElement(ShoppingCartCare, { className: "cart-care-icon" }),
+            React__default.createElement(Text, { size: "label1", color: theme.colors.white, fw: 500, className: "cart-care-button-text" }, t('navigation.button.cartCareService')),
+            count > 0 && (React__default.createElement(StyledCartCareButtonCount, { className: classNames('cart-care-button-count-box', classes === null || classes === void 0 ? void 0 : classes.count) },
+                React__default.createElement(Text, { size: count > 99 ? 'label2' : 'c1', color: theme.colors.white, fw: 600, className: "cart-care-button-count-text" }, count > 99 ? '99+' : count))))));
+};
+
+export { CartCareButton as C, ShoppingCartCare as S };

package/build/esm/{index-2586b623.js → index-a974c141.js}

@@ -1,23 +1,23 @@
-import { _ as __rest } from './tslib.es6-16f01fac.js';
+import { _ as __rest } from './tslib.es6-2f182153.js';
 import React__default, { useContext } from 'react';
 import { createStyles, rem, useMantineTheme, Box, Flex, ScrollArea } from '@mantine/core';
 import { Warning } from '@hhgtech/icons/core';
 import { RedCross } from '@hhgtech/icons/other';
-import './index-5c2a08a7.js';
+import './index-cf2ab22a.js';
 import '@mantine/dates';
-import './index-a229fca5.js';
-import './index-4a067ff0.js';
-import './index-297608e7.js';
-import './index-126b7528.js';
-import { T as Text } from './index-7055f29e.js';
-import './index-8794bd57.js';
-import { F as FontWeight, T as TemplateProvider, C as CustomStylesType } from './index-3abf0785.js';
-import './index.styles-55449bb8.js';
-import { u as useTranslations } from './index-8c265f04.js';
+import './index-279b70a7.js';
+import './index-da803306.js';
+import './index-e00dd638.js';
+import './index-75029227.js';
+import { T as Text } from './index-31fb253f.js';
+import './index-74d7e6ec.js';
+import { F as FontWeight, T as TemplateProvider, C as CustomStylesType } from './index-521ca503.js';
+import './index.styles-90331358.js';
+import { u as useTranslations } from './index-bdd0d5dc.js';
 import '@mantine/hooks';
-import { M as MediaQueries } from './utils-0a49e28d.js';
-import './index-41a6bcc7.js';
-import { C as CardWrapperContext } from './context-8f6c5cc3.js';
+import { M as MediaQueries } from './utils-3d8f157a.js';
+import './index-35894931.js';
+import { C as CardWrapperContext } from './context-5e8d5851.js';
 
 const StyledIconContainerClass = 'hhgcomp-toolbanner-iconcontainer';
 const StyledInnerClass = 'hhgcomp-toolbanner-inner';

package/build/esm/{index-dc58f5a8.js → index-ab81c97d.js}

@@ -1,27 +1,27 @@
 import React__default, { useState, useMemo, useContext, useEffect, createContext, useRef } from 'react';
-import { B as Button } from './index-316d8e13.js';
-import { H as Heading } from './index-c831693a.js';
-import { T as Text } from './index-7055f29e.js';
-import { c as safeEncodeURI, M as MediaQueries, t as toggleNoScroll, a as getPopupWrapperDom } from './utils-0a49e28d.js';
+import { B as Button } from './index-d9ae59c9.js';
+import { H as Heading } from './index-a0e1aed1.js';
+import { T as Text } from './index-31fb253f.js';
+import { c as safeEncodeURI, M as MediaQueries, t as toggleNoScroll, a as getPopupWrapperDom } from './utils-3d8f157a.js';
 import * as ReactDOM from 'react-dom';
-import { b as callApiWithAuth, e as getApiPath, T as TogetherComponentGlobalContext } from './utils-5d371d7d.js';
+import { b as callApiWithAuth, e as getApiPath, T as TogetherComponentGlobalContext } from './utils-73652e24.js';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { a as __awaiter } from './tslib.es6-16f01fac.js';
-import { I as Input } from './index-820b556f.js';
-import { u as useTranslations } from './index-8c265f04.js';
-import { e as formatComment } from './dataTransform-ce226808.js';
-import { M as MAX_IMAGE_UPLOADS, a as DEFAULT_AVATAR_IMG } from './constants-d206ec65.js';
+import { a as __awaiter } from './tslib.es6-2f182153.js';
+import { I as Input } from './index-4febec5e.js';
+import { u as useTranslations } from './index-bdd0d5dc.js';
+import { e as formatComment } from './dataTransform-94d3bd02.js';
+import { M as MAX_IMAGE_UPLOADS, a as DEFAULT_AVATAR_IMG } from './constants-84429199.js';
 import { PATHS } from './togetherApiPaths.js';
-import { j as removeBannedWordWrapper, i as getMentionIdsFromString, k as encodePostContent, u as uploadAndGetSrc } from './post-32be810f.js';
-import { C as CardLink } from './index-dc6e1961.js';
-import { L as Loading } from './index-307a5c05.js';
-import { U as UserAvatar } from './index-5cc25575.js';
-import { R as RichTextEditor } from './editor-b1321133.js';
+import { j as removeBannedWordWrapper, i as getMentionIdsFromString, k as encodePostContent, u as uploadAndGetSrc } from './post-f429663d.js';
+import { C as CardLink } from './index-dd83857f.js';
+import { L as Loading } from './index-de8d2c0d.js';
+import { U as UserAvatar } from './index-549a5d57.js';
+import { R as RichTextEditor } from './editor-5724e4bd.js';
 import { Portal } from '@mantine/core';
 import { FullScreen } from '@hhgtech/icons/other';
-import { P as Popup } from './index-24518bd9.js';
-import { C as CloseIcon } from './index-abd07cc5.js';
+import { P as Popup } from './index-d2d80c1f.js';
+import { C as CloseIcon } from './index-94d6fe4a.js';
 import { ShareBox } from './togetherShareBox.js';
 
 const useImagePicker = (imageFilesProp, onImageFilesChange) => {

package/build/esm/{index-0b71820c.js → index-b07f7c6c.js}

@@ -1,28 +1,28 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-16f01fac.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-2f182153.js';
 import React__default, { createContext, useState, useContext, useMemo, useEffect } from 'react';
 import { Controller, useForm } from 'react-hook-form';
-import { u as useHealthToolsCache } from './useHealthToolCache-92efbde3.js';
-import { H as HEALTH_TOOL_TYPE } from './constants-d206ec65.js';
+import { u as useHealthToolsCache } from './useHealthToolCache-a14db11d.js';
+import { H as HEALTH_TOOL_TYPE } from './constants-84429199.js';
 import { createStyles, Flex, Box, Grid, clsx, rem, Stack } from '@mantine/core';
-import { d as Checkbox, R as Radio, I as Input, e as ErrorLabel } from './index-5c2a08a7.js';
+import { d as Checkbox, R as Radio, I as Input, e as ErrorLabel } from './index-cf2ab22a.js';
 import '@mantine/dates';
-import './index-a229fca5.js';
-import './index-4a067ff0.js';
-import './index-297608e7.js';
-import './index-126b7528.js';
-import { T as Text } from './index-7055f29e.js';
-import './index-8794bd57.js';
-import { T as TemplateProvider, C as CustomStylesType } from './index-3abf0785.js';
-import './index.styles-55449bb8.js';
-import { u as useTranslations } from './index-8c265f04.js';
+import './index-279b70a7.js';
+import './index-da803306.js';
+import './index-e00dd638.js';
+import './index-75029227.js';
+import { T as Text } from './index-31fb253f.js';
+import './index-74d7e6ec.js';
+import { T as TemplateProvider, C as CustomStylesType } from './index-521ca503.js';
+import './index.styles-90331358.js';
+import { u as useTranslations } from './index-bdd0d5dc.js';
 import '@mantine/hooks';
-import './utils-0a49e28d.js';
-import './index-41a6bcc7.js';
-import { H as HealthToolFormWrapper } from './index-1bf3b5b1.js';
-import { C as CardWrapperContext } from './context-8f6c5cc3.js';
-import { G as GenderOptionControl } from './index-30dffb79.js';
+import './utils-3d8f157a.js';
+import './index-35894931.js';
+import { H as HealthToolFormWrapper } from './index-dcfe196e.js';
+import { C as CardWrapperContext } from './context-5e8d5851.js';
+import { G as GenderOptionControl } from './index-14097f6f.js';
 import '@hhgtech/icons/other';
-import { L as LOCALE } from './Locale-badbf0b1.js';
+import { L as LOCALE } from './Locale-7f8862a8.js';
 import { domainLocales } from './constantsDomainLocales.js';
 import { getBmi } from './embeddedHeathToolCards_helpers.js';
 

package/build/esm/{index-0643152f.js → index-bb31013f.js}

@@ -1,21 +1,21 @@
-import { _ as __rest } from './tslib.es6-16f01fac.js';
+import { _ as __rest } from './tslib.es6-2f182153.js';
 import React__default, { createContext, useContext } from 'react';
 import { createStyles, rem, clsx, useMantineTheme } from '@mantine/core';
 import { useForm, isNotEmpty } from '@mantine/form';
-import { L as LastPeriod } from './LastPeriod-a9bb98b2.js';
-import { I as Input } from './index-5c2a08a7.js';
-import { D as DatePicker } from './index-fa38204f.js';
-import { T as Text } from './index-7055f29e.js';
-import './index-8794bd57.js';
-import './index-3abf0785.js';
-import './index.styles-55449bb8.js';
-import { u as useTranslations } from './index-8c265f04.js';
+import { L as LastPeriod } from './LastPeriod-1d3fb167.js';
+import { I as Input } from './index-cf2ab22a.js';
+import { D as DatePicker } from './index-f1192632.js';
+import { T as Text } from './index-31fb253f.js';
+import './index-74d7e6ec.js';
+import './index-521ca503.js';
+import './index.styles-90331358.js';
+import { u as useTranslations } from './index-bdd0d5dc.js';
 import '@mantine/hooks';
-import './index-126b7528.js';
-import './utils-0a49e28d.js';
-import './index-41a6bcc7.js';
-import { C as CardWrapperContext } from './context-8f6c5cc3.js';
-import { H as HealthToolFormWrapper } from './index-1bf3b5b1.js';
+import './index-75029227.js';
+import './utils-3d8f157a.js';
+import './index-35894931.js';
+import { C as CardWrapperContext } from './context-5e8d5851.js';
+import { H as HealthToolFormWrapper } from './index-dcfe196e.js';
 import { CalendarMB } from '@hhgtech/icons/other';
 
 const AvoidPregnancy = (_a) => {