@hhgtech/hhg-components 1.29.498 → 1.29.500

package/build/esm/{index-b2cc41bc.js → index-9b41fd2e.js}

@@ -1,28 +1,27 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-4c2b392a.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-b5ec78ee.js';
 import React__default, { createContext, useContext, useState, useMemo, useEffect } from 'react';
 import { Controller, useForm } from 'react-hook-form';
-import { u as useHealthToolsCache } from './useHealthToolCache-80317b15.js';
-import { H as HEALTH_TOOL_TYPE } from './constants-a9f0b321.js';
-import { Flex, rem, Stack, clsx, createStyles, Box } from '@mantine/core';
-import { G as GenderOptionControl } from './index-d55d080a.js';
-import { I as Input, R as Radio, c as ErrorLabel, d as Checkbox } from './index-03963d37.js';
+import { u as useHealthToolsCache } from './useHealthToolCache-fc75e31d.js';
+import { H as HEALTH_TOOL_TYPE } from './constants-4e5e59b6.js';
+import { Grid, Flex, Box, clsx, createStyles, rem, Stack } from '@mantine/core';
+import { G as GenderOptionControl } from './index-cb736573.js';
+import { I as Input, R as Radio, c as ErrorLabel, d as Checkbox } from './index-14a92066.js';
 import '@mantine/dates';
-import './index-2d6472a6.js';
-import './index-633b28cc.js';
-import './index-957ad8bc.js';
-import './index-6187b3e5.js';
-import { T as Text } from './index-9181155e.js';
-import './index-dbe7d116.js';
-import { theme } from './miscTheme.js';
-import './index-3770342b.js';
-import './index.styles-f9403cd8.js';
-import { u as useTranslations } from './index-a6593fc5.js';
+import './index-99b321ef.js';
+import './index-abd28b8a.js';
+import './index-d8f59b87.js';
+import './index-7aedbf1b.js';
+import { T as Text } from './index-a9b01bfd.js';
+import './index-845a806a.js';
+import './index-9b31987c.js';
+import './index.styles-2575877c.js';
+import { u as useTranslations } from './index-880a8911.js';
 import '@mantine/hooks';
-import './utils-9da52e63.js';
-import './index-a4b6228d.js';
-import { H as HealthToolFormWrapper } from './index-35e5fb79.js';
-import { C as CardWrapperContext } from './context-06e735a2.js';
-import { L as LOCALE } from './Locale-0e687ff5.js';
+import './utils-c5a1f614.js';
+import './index-269b0fd2.js';
+import { H as HealthToolFormWrapper } from './index-8e2cee8d.js';
+import { C as CardWrapperContext } from './context-ccc8129d.js';
+import { L as LOCALE } from './Locale-c0ccb529.js';
 import { domainLocales } from './constantsDomainLocales.js';
 import { getBmi } from './embeddedHeathToolCards_helpers.js';
 
@@ -33,77 +32,88 @@ const DefaultForm = (props) => {
     const { t, locale } = useTranslations();
     const { classes: cardWrapperClasses = {} } = useContext(CardWrapperContext);
     const { control, bmiGenerated, isTouched, linkTool, submitProps, withAdditionalQuestion, classes: formWrapperClasses = {}, } = useContext(BmiFormContext);
+    const radioStyle = {
+        body: {
+            alignItems: 'center',
+        },
+    };
     return (React__default.createElement(HealthToolFormWrapper, Object.assign({ formLayout: "default" }, props),
-        React__default.createElement(HealthToolFormWrapper.FormRow, null,
-            React__default.createElement(Controller, { name: "gender", control: control, rules: (_a = bmiGenerated.gender) === null || _a === void 0 ? void 0 : _a.rule, render: ({ field: { onChange }, fieldState: { error } }) => {
-                    return (React__default.createElement(GenderOptionControl, { error: isTouched ? error === null || error === void 0 ? void 0 : error.message : '', onChange: onChange }));
-                } })),
-        React__default.createElement(HealthToolFormWrapper.FormRow, null,
-            React__default.createElement(Controller, { name: "age", control: control, rules: (_b = bmiGenerated.age) === null || _b === void 0 ? void 0 : _b.rule, render: ({ field: { name, value, onChange }, fieldState: { error }, }) => {
-                    return (React__default.createElement(Input.Number, { label: React__default.createElement(Text, { size: "s4", weight: "semiBold", color: theme.colors.gray600 },
-                            t('bmi.ageInput'),
-                            ' ',
-                            React__default.createElement(Text, { size: "s4", weight: "semiBold", color: theme.colors.gray300, as: "span" }, t('bmi.ageInput.desc'))), placeholder: t('tools.inputPlaceholder', {
-                            content: '25',
-                        }), name: name, value: value, onChange: onChange, error: isTouched ? error === null || error === void 0 ? void 0 : error.message : '', min: 0 }));
-                } })),
-        React__default.createElement(HealthToolFormWrapper.FormRow, null,
-            React__default.createElement(Controller, { name: "height", control: control, rules: (_c = bmiGenerated.height) === null || _c === void 0 ? void 0 : _c.rule, render: ({ field: { name, value, onChange }, fieldState: { error }, }) => {
-                    return (React__default.createElement(Input.Number, { label: React__default.createElement(Text, { size: "s4", weight: "semiBold", color: theme.colors.gray600 },
-                            t('bmi.heightInput'),
-                            ' ',
-                            React__default.createElement(Text, { size: "s4", weight: "semiBold", color: theme.colors.gray300, as: "span" }, t('bmi.heightInput.desc'))), placeholder: t('tools.inputPlaceholder', {
-                            content: locale === LOCALE.Myanmar ? 6 : 170,
-                        }), name: name, value: value, onChange: onChange, error: isTouched ? error === null || error === void 0 ? void 0 : error.message : '', min: 0 }));
-                } })),
-        React__default.createElement(HealthToolFormWrapper.FormRow, null,
-            React__default.createElement(Controller, { name: "weight", control: control, rules: (_d = bmiGenerated.weight) === null || _d === void 0 ? void 0 : _d.rule, render: ({ field: { name, value, onChange }, fieldState: { error }, }) => {
-                    return (React__default.createElement(Input.Number, { label: React__default.createElement(Text, { size: "s4", weight: "semiBold", color: theme.colors.gray600 },
-                            t('bmi.weightInput'),
-                            ' ',
-                            React__default.createElement(Text, { size: "s4", weight: "semiBold", color: theme.colors.gray300, as: "span" }, t('bmi.weightInput.desc'))), placeholder: t('tools.inputPlaceholder', {
-                            content: locale === LOCALE.Myanmar ? 130 : 60,
-                        }), name: name, value: value, onChange: onChange, error: isTouched ? error === null || error === void 0 ? void 0 : error.message : '', precision: 1, min: 0 }));
-                } })),
-        withAdditionalQuestion ? (React__default.createElement(React__default.Fragment, null,
-            React__default.createElement(HealthToolFormWrapper.FormRow, null,
-                React__default.createElement(Controller, { name: "question1", control: control, rules: (_e = bmiGenerated.question1) === null || _e === void 0 ? void 0 : _e.rule, render: ({ field: { value, onChange, name }, fieldState: { error }, }) => {
-                        return (React__default.createElement(Radio.Group, { name: name, value: value, onChange: onChange, sx: { flex: 1 }, label: React__default.createElement(Text, { size: "s4", weight: "semiBold", span: true }, t('bmi.question.weightLossSupport')), size: "lg", error: isTouched ? React__default.createElement(ErrorLabel, { label: error === null || error === void 0 ? void 0 : error.message }) : '' },
-                            React__default.createElement(Flex, { gap: "lg", sx: { paddingTop: rem(8) } },
-                                React__default.createElement(Radio, { size: "sm", value: "1", label: t('switchBtn.yes') }),
-                                React__default.createElement(Radio, { size: "sm", value: "0", label: t('switchBtn.no') }))));
+        React__default.createElement(Grid, { gutter: 4, px: 16 },
+            React__default.createElement(Grid.Col, { span: 12 },
+                React__default.createElement(Controller, { name: "gender", control: control, rules: (_a = bmiGenerated.gender) === null || _a === void 0 ? void 0 : _a.rule, render: ({ field: { onChange }, fieldState: { error } }) => {
+                        return (React__default.createElement(GenderOptionControl, { error: isTouched ? error === null || error === void 0 ? void 0 : error.message : '', onChange: onChange }));
                     } })),
-            React__default.createElement(HealthToolFormWrapper.FormRow, null,
-                React__default.createElement(Controller, { name: "question2", control: control, rules: (_f = bmiGenerated.question2) === null || _f === void 0 ? void 0 : _f.rule, render: ({ field: { name, value, onChange }, fieldState: { error }, }) => {
-                        return (React__default.createElement(Radio.Group, { name: name, value: value, onChange: onChange, sx: { flex: 1 }, label: React__default.createElement(Text, { size: "s4", weight: "semiBold", span: true }, t('bmi.question.glp1Awareness')), size: "lg", description: locale !== LOCALE.Malaysia && (React__default.createElement(Text, { style: { fontSize: '10px' }, span: true }, t('bmi.question.glp1Awareness.desc'))), error: isTouched ? React__default.createElement(ErrorLabel, { label: error === null || error === void 0 ? void 0 : error.message }) : '' },
-                            React__default.createElement(Flex, { gap: "lg", sx: { paddingTop: rem(8) } },
-                                React__default.createElement(Radio, { size: "sm", value: "1", label: t('switchBtn.yes') }),
-                                React__default.createElement(Radio, { size: "sm", value: "0", label: t('switchBtn.no') }))));
+            React__default.createElement(Grid.Col, { span: 12 },
+                React__default.createElement(Controller, { name: "age", control: control, rules: (_b = bmiGenerated.age) === null || _b === void 0 ? void 0 : _b.rule, render: ({ field: { name, value, onChange }, fieldState: { error }, }) => {
+                        return (React__default.createElement(Input.Number, { label: React__default.createElement(Text, { size: "p2", weight: "semiBold" }, t('bmi.ageInput')), placeholder: t('tools.inputPlaceholder', {
+                                content: '25',
+                            }), name: name, value: value, onChange: onChange, error: isTouched ? error === null || error === void 0 ? void 0 : error.message : '', min: 0, rightSection: t('bmi.ageInput.desc'), classNames: {
+                                rightSection: formWrapperClasses.inputRightSection,
+                            } }));
                     } })),
-            React__default.createElement(HealthToolFormWrapper.FormRow, { sx: { paddingLeft: 0, paddingRight: 0 } },
-                React__default.createElement(Stack, { className: clsx(formWrapperClasses.newsletterBlock, cardWrapperClasses.newsletterBlock), spacing: 16, sx: {
-                        paddingLeft: 16,
-                        paddingRight: 16,
-                    } },
-                    React__default.createElement(Controller, { name: "newsletter", control: control, rules: (_g = bmiGenerated.newsletter) === null || _g === void 0 ? void 0 : _g.rule, render: (_a) => {
-                            var _b = _a.field, { value, onChange, name } = _b, field = __rest(_b, ["value", "onChange", "name"]);
-                            return (React__default.createElement(Checkbox, Object.assign({ size: "sm", label: React__default.createElement(Text, { size: "p3" }, t('bmi.newsletter.label')), onChange: (e) => onChange(e.currentTarget.checked), name: name, checked: !!value }, field)));
-                        } }),
-                    React__default.createElement(HealthToolFormWrapper.Submit, Object.assign({ className: "bmi-btn bmi--btn-submit", dataEventCategory: "Health Tool", dataEventAction: "BMI", dataEventLabel: `https://${domainLocales[locale]}/${linkTool}`, type: "submit" }, submitProps), t('bmi.submit')))))) : (React__default.createElement(HealthToolFormWrapper.FormRow, null,
-            React__default.createElement(HealthToolFormWrapper.Submit, Object.assign({ className: "bmi-btn bmi--btn-submit", dataEventCategory: "Health Tool", dataEventAction: "BMI", dataEventLabel: `https://${domainLocales[locale]}/${linkTool}`, type: "submit" }, submitProps), t('bmi.submit'))))));
+            React__default.createElement(Grid.Col, { span: 12 },
+                React__default.createElement(Grid, { gutter: 8 },
+                    React__default.createElement(Grid.Col, { span: 6 },
+                        React__default.createElement(Controller, { name: "height", control: control, rules: (_c = bmiGenerated.height) === null || _c === void 0 ? void 0 : _c.rule, render: ({ field: { name, value, onChange }, fieldState: { error }, }) => {
+                                return (React__default.createElement(Input.Number, { label: React__default.createElement(Text, { size: "p2", weight: "semiBold" }, t('bmi.heightInput')), rightSection: t('bmi.heightInput.desc'), placeholder: t('tools.inputPlaceholder', {
+                                        content: locale === LOCALE.Myanmar ? 6 : 170,
+                                    }), name: name, value: value, onChange: onChange, error: isTouched ? error === null || error === void 0 ? void 0 : error.message : '', min: 0, classNames: {
+                                        rightSection: formWrapperClasses.inputRightSection,
+                                    } }));
+                            } })),
+                    React__default.createElement(Grid.Col, { span: 6 },
+                        React__default.createElement(Controller, { name: "weight", control: control, rules: (_d = bmiGenerated.weight) === null || _d === void 0 ? void 0 : _d.rule, render: ({ field: { name, value, onChange }, fieldState: { error }, }) => {
+                                return (React__default.createElement(Input.Number, { label: React__default.createElement(Text, { size: "p2", weight: "semiBold" }, t('bmi.weightInput')), rightSection: t('bmi.weightInput.desc'), placeholder: t('tools.inputPlaceholder', {
+                                        content: locale === LOCALE.Myanmar ? 130 : 60,
+                                    }), name: name, value: value, onChange: onChange, error: isTouched ? error === null || error === void 0 ? void 0 : error.message : '', precision: 1, min: 0, classNames: {
+                                        rightSection: formWrapperClasses.inputRightSection,
+                                    } }));
+                            } }))))),
+        withAdditionalQuestion ? (React__default.createElement(React__default.Fragment, null,
+            React__default.createElement(Grid, { gutter: 4, px: 16 },
+                React__default.createElement(Grid.Col, null,
+                    React__default.createElement(Controller, { name: "question1", control: control, rules: (_e = bmiGenerated.question1) === null || _e === void 0 ? void 0 : _e.rule, render: ({ field: { value, onChange, name }, fieldState: { error }, }) => {
+                            return (React__default.createElement(Radio.Group, { name: name, value: value, onChange: onChange, sx: { flex: 1 }, label: React__default.createElement(Text, { size: "p2", weight: "semiBold", span: true }, t('bmi.question.weightLossSupport')), size: "lg", error: isTouched ? React__default.createElement(ErrorLabel, { label: error === null || error === void 0 ? void 0 : error.message }) : '' },
+                                React__default.createElement(Flex, { gap: "lg" },
+                                    React__default.createElement(Radio, { size: "sm", value: "1", label: React__default.createElement(Text, { size: "p2" }, t('switchBtn.yes')), styles: radioStyle }),
+                                    React__default.createElement(Radio, { size: "sm", value: "0", label: React__default.createElement(Text, { size: "p2" }, t('switchBtn.no')), styles: radioStyle }))));
+                        } })),
+                React__default.createElement(Grid.Col, null,
+                    React__default.createElement(Controller, { name: "question2", control: control, rules: (_f = bmiGenerated.question2) === null || _f === void 0 ? void 0 : _f.rule, render: ({ field: { name, value, onChange }, fieldState: { error }, }) => {
+                            return (React__default.createElement(Radio.Group, { name: name, value: value, onChange: onChange, sx: { flex: 1 }, label: React__default.createElement(Text, { size: "p2", weight: "semiBold", span: true }, t('bmi.question.glp1Awareness')), size: "lg", description: locale !== LOCALE.Malaysia && (React__default.createElement(Text, { style: { fontSize: '10px' }, span: true }, t('bmi.question.glp1Awareness.desc'))), error: isTouched ? React__default.createElement(ErrorLabel, { label: error === null || error === void 0 ? void 0 : error.message }) : '' },
+                                React__default.createElement(Flex, { gap: "lg" },
+                                    React__default.createElement(Radio, { size: "sm", value: "1", label: React__default.createElement(Text, { size: "p2" }, t('switchBtn.yes')), styles: radioStyle }),
+                                    React__default.createElement(Radio, { size: "sm", value: "0", label: React__default.createElement(Text, { size: "p2" }, t('switchBtn.no')), styles: radioStyle }))));
+                        } }))),
+            React__default.createElement(Box, { className: clsx(formWrapperClasses.newsletterBlock, cardWrapperClasses.newsletterBlock) },
+                React__default.createElement(Grid, { gutter: 8, px: 16, py: 12 },
+                    React__default.createElement(Grid.Col, null,
+                        React__default.createElement(Controller, { name: "newsletter", control: control, rules: (_g = bmiGenerated.newsletter) === null || _g === void 0 ? void 0 : _g.rule, render: (_a) => {
+                                var _b = _a.field, { value, onChange, name } = _b, field = __rest(_b, ["value", "onChange", "name"]);
+                                return (React__default.createElement(Checkbox, Object.assign({ size: "sm", label: React__default.createElement(Text, { size: "p2" }, t('bmi.newsletter.label')), onChange: (e) => onChange(e.currentTarget.checked), name: name, checked: !!value }, field)));
+                            } })),
+                    React__default.createElement(Grid.Col, null,
+                        React__default.createElement(HealthToolFormWrapper.Submit, Object.assign({ className: "bmi-btn bmi--btn-submit", dataEventCategory: "Health Tool", dataEventAction: "BMI", dataEventLabel: `https://${domainLocales[locale]}/${linkTool}`, type: "submit", fullWidth: true }, submitProps), t('bmi.submit'))))))) : (React__default.createElement(Box, { px: 16, sx: { paddingBottom: 8 } },
+            React__default.createElement(HealthToolFormWrapper.Submit, Object.assign({ className: "bmi-btn bmi--btn-submit", dataEventCategory: "Health Tool", dataEventAction: "BMI", dataEventLabel: `https://${domainLocales[locale]}/${linkTool}`, type: "submit", fullWidth: true }, submitProps), t('bmi.submit'))))));
 };
 
 var useStyles = createStyles((theme) => {
     return {
         newsletterBlock: {
             backgroundColor: theme.colors.neutral[0],
-            padding: `${rem(16)} 0`,
             borderBottomLeftRadius: 'inherit',
             borderBottomRightRadius: 'inherit',
             '.bmi-btn': {
                 marginTop: 0,
             },
         },
+        inputRightSection: {
+            fontSize: rem(13),
+            lineHeight: rem(24),
+            color: theme.colors.gray[4],
+            justifyContent: 'flex-end',
+            paddingRight: 8,
+        },
     };
 });
 
@@ -172,7 +182,7 @@ const InlineForm = (props) => {
                             React__default.createElement(Checkbox, Object.assign({ size: "sm", label: React__default.createElement(Text, { size: "p3" }, t('bmi.newsletter.label')), onChange: (e) => onChange(e.currentTarget.checked), name: name, checked: !!value }, field))));
                     } }),
                 React__default.createElement(HealthToolFormWrapper.FormRow, { className: clsx(wrapperClasses.submitWrapper) },
-                    React__default.createElement(HealthToolFormWrapper.Submit, Object.assign({ className: clsx('bmi-btn bmi--btn-submit', wrapperClasses.submitBtn), dataEventCategory: "Health Tool", dataEventAction: "BMI", dataEventLabel: `https://${domainLocales[locale]}/${linkTool}`, type: "submit" }, submitProps), t('bmi.submit'))))) : (React__default.createElement(HealthToolFormWrapper.FormRow, { className: clsx(formWrapperClasses.newsletterBlock, wrapperClasses.newsletterBlock) },
+                    React__default.createElement(HealthToolFormWrapper.Submit, Object.assign({ className: clsx('bmi-btn bmi--btn-submit', wrapperClasses.submitBtn), dataEventCategory: "Health Tool", dataEventAction: "BMI", dataEventLabel: `https://${domainLocales[locale]}/${linkTool}`, type: "submit" }, submitProps), t('bmi.submit'))))) : (React__default.createElement(HealthToolFormWrapper.FormRow, { py: 16, className: clsx(formWrapperClasses.newsletterBlock, wrapperClasses.newsletterBlock) },
                 React__default.createElement(Stack, { spacing: 16 },
                     React__default.createElement(Controller, { name: "newsletter", control: control, rules: (_h = bmiGenerated.newsletter) === null || _h === void 0 ? void 0 : _h.rule, render: (_a) => {
                             var _b = _a.field, { value, onChange, name } = _b, field = __rest(_b, ["value", "onChange", "name"]);

package/build/esm/{index-9451b322.js → index-9bb674d4.js}

@@ -1,49 +1,49 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-4c2b392a.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-b5ec78ee.js';
 import * as React from 'react';
 import React__default, { useContext, useState, useCallback, useEffect, useMemo, useRef } from 'react';
-import { i as isInternalLink, V as VideoItem, L as LanguageSwitcher } from './index-c06c86b3.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-2d6472a6.js';
-import { e as normalizeLink, n as normalizeLinkSlash, g as getCurrentBaseUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain, d as getCareApiDomain } from './normalizeLink-4e7809ca.js';
-import { f as formatCommunity, a as formatPost } from './dataTransform-c567e3d6.js';
+import { i as isInternalLink, V as VideoItem, L as LanguageSwitcher } from './index-78ddd518.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-99b321ef.js';
+import { e as normalizeLink, n as normalizeLinkSlash, g as getCurrentBaseUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain, d as getCareApiDomain } from './normalizeLink-8b659745.js';
+import { f as formatCommunity, a as formatPost } from './dataTransform-39c36fce.js';
 import { Close, Logo } from '@hhgtech/icons/core';
-import './translationsContext-ec597c09.js';
+import './translationsContext-eaa23cd9.js';
 import styled from '@emotion/styled';
-import { I as Input } from './index-03963d37.js';
+import { I as Input } from './index-14a92066.js';
 import { theme } from './miscTheme.js';
-import { a as NavigationContext, u as useCSSFocusPopupHelper, N as NavigationProfileButton, b as NavigationProvider } from './index-8d7f1f71.js';
+import { a as NavigationContext, u as useCSSFocusPopupHelper, N as NavigationProfileButton, b as NavigationProvider } from './index-26899a76.js';
 import { ArrowRight, ChatAi } from '@hhgtech/icons/other';
 import { createStyles, Box, Indicator, useMantineTheme, clsx } from '@mantine/core';
-import { L as Logo$1 } from './index-81fbf719.js';
+import { L as Logo$1 } from './index-7d44c495.js';
 import throttle from 'lodash/throttle';
 import '@mantine/dates';
-import { V as VideoType } from './index-633b28cc.js';
-import { C as CommonGAssets } from './index-957ad8bc.js';
-import './index-6187b3e5.js';
-import { T as Text } from './index-9181155e.js';
-import { B as Button } from './index-dbe7d116.js';
-import './index-3770342b.js';
-import './index.styles-f9403cd8.js';
+import { V as VideoType } from './index-abd28b8a.js';
+import { C as CommonGAssets } from './index-d8f59b87.js';
+import './index-7aedbf1b.js';
+import { T as Text } from './index-a9b01bfd.js';
+import { B as Button } from './index-845a806a.js';
+import './index-9b31987c.js';
+import './index.styles-2575877c.js';
 import '@mantine/hooks';
-import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-9da52e63.js';
-import './index-a4b6228d.js';
-import { L as LOCALISED_SLUGS } from './constants-4c2763d4.js';
-import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-aa9aa06b.js';
-import { I as Indicator$1 } from './index-a66798d9.js';
-import { u as useTranslations } from './index-a6593fc5.js';
-import { u as useIsInit } from './useIsInit-19f924c2.js';
-import { L as LOCALIZED_SLUGS } from './constants-3db9e07a.js';
+import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-c5a1f614.js';
+import './index-269b0fd2.js';
+import { L as LOCALISED_SLUGS } from './constants-c921e4e9.js';
+import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-03a17277.js';
+import { I as Indicator$1 } from './index-ada0ea4d.js';
+import { u as useTranslations } from './index-880a8911.js';
+import { u as useIsInit } from './useIsInit-2d45731e.js';
+import { L as LOCALIZED_SLUGS } from './constants-37409c31.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
-import { B as Button$1 } from './index-9bf109b8.js';
-import { H as Heading } from './index-3addb19f.js';
+import { B as Button$1 } from './index-d1f910f8.js';
+import { H as Heading } from './index-1794d957.js';
 import formatString from 'string-format';
 import { domainLocales } from './constantsDomainLocales.js';
-import { C as Container } from './index-beb3ccde.js';
+import { C as Container } from './index-1b2a663b.js';
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
-import { U as UserAvatar } from './index-eda8f4c9.js';
-import { L as LOCALE } from './Locale-0e687ff5.js';
+import { U as UserAvatar } from './index-1efce269.js';
+import { L as LOCALE } from './Locale-c0ccb529.js';
 import debounce from 'lodash/debounce';
-import { g as getDataWithCache } from './core-9caa0114.js';
+import { g as getDataWithCache } from './core-210535dc.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" }),
@@ -1074,6 +1074,7 @@ const StyledImageCard$2 = styled.div `
   ${MediaQueries.tdDown} {
     width: 72px;
     padding-top: 100px;
+    flex-shrink: 0;
   }
 `;
 const StyledButton = styled.a `

package/build/esm/{index-e06a7c13.js → index-a0bcbe6a.js}

@@ -1,20 +1,20 @@
-import { _ as __rest } from './tslib.es6-4c2b392a.js';
+import { _ as __rest } from './tslib.es6-b5ec78ee.js';
 import React__default from 'react';
-import './index-03963d37.js';
+import './index-14a92066.js';
 import '@mantine/core';
 import '@mantine/dates';
-import './index-2d6472a6.js';
-import './index-633b28cc.js';
-import './index-957ad8bc.js';
-import './index-6187b3e5.js';
-import { T as Text$1 } from './index-9181155e.js';
-import './index-dbe7d116.js';
-import './index-3770342b.js';
-import './index.styles-f9403cd8.js';
-import './translationsContext-ec597c09.js';
+import './index-99b321ef.js';
+import './index-abd28b8a.js';
+import './index-d8f59b87.js';
+import './index-7aedbf1b.js';
+import { T as Text$1 } from './index-a9b01bfd.js';
+import './index-845a806a.js';
+import './index-9b31987c.js';
+import './index.styles-2575877c.js';
+import './translationsContext-eaa23cd9.js';
 import '@mantine/hooks';
-import './utils-9da52e63.js';
-import './index-a4b6228d.js';
+import './utils-c5a1f614.js';
+import './index-269b0fd2.js';
 
 /**
  * @deprecated Consider to use import { Text } from '@hhgtech/hhg-components/mantine'

package/build/esm/{index-37f48821.js → index-a110d74d.js}

@@ -1,34 +1,34 @@
 import * as React from 'react';
 import React__default, { useMemo, useState, useEffect, useRef, createContext, useContext } from 'react';
-import { u as useTranslations } from './index-a6593fc5.js';
+import { u as useTranslations } from './index-880a8911.js';
 import { getCookie } from './miscCookieHelper.js';
-import { C as CommonGAssets } from './index-957ad8bc.js';
-import { n as normalizeLinkSlash, e as normalizeLink } from './normalizeLink-4e7809ca.js';
+import { C as CommonGAssets } from './index-d8f59b87.js';
+import { n as normalizeLinkSlash, e as normalizeLink } from './normalizeLink-8b659745.js';
 import { theme } from './miscTheme.js';
-import { A as Avatar, I as IconWrapper, D as DistanceTag, a as DrawerBottom, S as ShapedArrowDown } from './index-39757e83.js';
-import { b as getTogetherUserPostsApiPath } from './index-9451b322.js';
-import { B as Button } from './index-9bf109b8.js';
-import { w as workingDays } from './types-a88ea33c.js';
+import { A as Avatar, I as IconWrapper, D as DistanceTag, a as DrawerBottom, S as ShapedArrowDown } from './index-c99d7c3b.js';
+import { b as getTogetherUserPostsApiPath } from './index-9bb674d4.js';
+import { B as Button } from './index-d1f910f8.js';
+import { w as workingDays } from './types-ebfc69f4.js';
 import styled from '@emotion/styled';
-import { M as MediaQueries } from './utils-9da52e63.js';
+import { M as MediaQueries } from './utils-c5a1f614.js';
 import { rem, clsx, Flex, Box } from '@mantine/core';
 import { LoadScript, GoogleMap, Marker } from '@react-google-maps/api';
 import classNames from 'classnames';
-import { b as basePath, Z as ZINDEX_SSO } from './index-2d6472a6.js';
-import { L as LOCALISED_SLUGS } from './constants-a9f0b321.js';
-import { T as Text } from './index-e06a7c13.js';
-import { f as formatPhoneNumber } from './localizeNumberFormat-ecd8859f.js';
-import { a as __awaiter } from './tslib.es6-4c2b392a.js';
+import { b as basePath, Z as ZINDEX_SSO } from './index-99b321ef.js';
+import { L as LOCALISED_SLUGS } from './constants-4e5e59b6.js';
+import { T as Text } from './index-a0bcbe6a.js';
+import { f as formatPhoneNumber } from './localizeNumberFormat-5480968d.js';
+import { a as __awaiter } from './tslib.es6-b5ec78ee.js';
 import { useDisclosure } from '@mantine/hooks';
-import { u as useTextStyles, T as TextField } from './index-74f5cc07.js';
+import { u as useTextStyles, T as TextField } from './index-77f9649d.js';
 import { parsePhoneNumber } from 'react-phone-number-input';
-import { P as Phone, I as Input, E as ErrorIcon } from './index-03963d37.js';
-import { G as GlobalTextStyleNew, C as CustomStylesType, F as FontWeight } from './index-3770342b.js';
-import { B as Button$1 } from './index-dbe7d116.js';
-import { M as MAPPED_LOCALE } from './index-6187b3e5.js';
-import { T as Text$1 } from './index-9181155e.js';
-import { I as ImageWrap } from './index-09da7cf5.js';
-import { I as InsuranceList, P as PaymentList, A as ArrowRightBlue, a as DoctorInfoExpertise, D as DoctorExpertiseItem, C as Clinic } from './index-f1e54630.js';
+import { P as Phone, I as Input, E as ErrorIcon } from './index-14a92066.js';
+import { G as GlobalTextStyleNew, C as CustomStylesType, F as FontWeight } from './index-9b31987c.js';
+import { B as Button$1 } from './index-845a806a.js';
+import { M as MAPPED_LOCALE } from './index-7aedbf1b.js';
+import { T as Text$1 } from './index-a9b01bfd.js';
+import { I as ImageWrap } from './index-d1f1934d.js';
+import { I as InsuranceList, P as PaymentList, A as ArrowRightBlue, a as DoctorInfoExpertise, D as DoctorExpertiseItem, C as Clinic } from './index-f4cfa393.js';
 
 /* eslint-disable prettier/prettier */
 const Check = (props) => (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 81 80", fill: "none" }, props),
@@ -1425,12 +1425,12 @@ const TextSpanStyled = styled.span `
 `;
 
 const ArticleDetailCard = (props) => {
-    const { article, doctor, className, style, handleClick } = props;
+    const { article, doctor, className, style, handleClick, altText } = props;
     const { articleType, articleTitle, articleTypeColor, image, defaultImage } = article || {};
     const { doctorName, doctorAvatar, defaultDoctorAvatar } = doctor || {};
     const { t } = useTranslations();
     return (React__default.createElement(ArticleCardStyled, { className: className, style: style, onClick: handleClick },
-        React__default.createElement(ImageWrap, { alt: articleTitle || 'article-image', src: image || defaultImage, style: {
+        React__default.createElement(ImageWrap, { alt: altText || articleTitle || 'article-image', src: image || defaultImage, style: {
                 width: '100%',
                 height: rem(143.5),
                 objectFit: 'cover',

package/build/esm/{index-9181155e.js → index-a9b01bfd.js}

@@ -1,7 +1,7 @@
-import { _ as __rest } from './tslib.es6-4c2b392a.js';
+import { _ as __rest } from './tslib.es6-b5ec78ee.js';
 import React__default, { forwardRef } from 'react';
 import { createStyles, useMantineTheme, Text as Text$1 } from '@mantine/core';
-import { a as GlobalTextStyle, C as CustomStylesType, F as FontWeight, u as useTemplateVariant } from './index-3770342b.js';
+import { a as GlobalTextStyle, C as CustomStylesType, F as FontWeight, u as useTemplateVariant } from './index-9b31987c.js';
 
 var useStyles = createStyles((theme, _params) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;

package/build/esm/{index-8051135e.js → index-aad9135a.js}

@@ -1,9 +1,9 @@
-import { _ as __rest } from './tslib.es6-4c2b392a.js';
+import { _ as __rest } from './tslib.es6-b5ec78ee.js';
 import React__default, { useMemo } from 'react';
 import { useMantineTheme } from '@mantine/core';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { M as MediaQueries } from './utils-9da52e63.js';
+import { M as MediaQueries } from './utils-c5a1f614.js';
 
 const StyledInput = styled.div `
   position: relative;

package/build/esm/{index-633b28cc.js → index-abd28b8a.js}

@@ -1,4 +1,4 @@
-import { L as LOCALE } from './Locale-0e687ff5.js';
+import { L as LOCALE } from './Locale-c0ccb529.js';
 
 var Gender;
 (function (Gender) {

package/build/esm/{index-27351d40.js → index-ad3d163c.js}

@@ -1,41 +1,41 @@
 import React__default, { createContext, useContext, useMemo, useCallback, useState, useEffect, forwardRef, useRef } from 'react';
 import { rem, Container, createStyles, Box, Stack, Flex, AspectRatio, ScrollArea, Chip, Group, Badge, MultiSelect, Stepper } from '@mantine/core';
-import { C as CommonGAssets } from './index-957ad8bc.js';
-import { b as callApiWithAuth, e as getApiPath, T as TogetherComponentGlobalContext, f as getPremiumApiPath, h as getWebsiteUrlApi, i as getSsoApiPath } from './utils-ffe8c9cf.js';
-import { G as GA_TOKEN_COOKIE } from './index-2d6472a6.js';
-import { H as HEALTH_TOOL_TYPE, a as HEALTH_TOOL_DEFAULT_IMG } from './healthTools-029b1e3b.js';
+import { C as CommonGAssets } from './index-d8f59b87.js';
+import { b as callApiWithAuth, e as getApiPath, T as TogetherComponentGlobalContext, f as getPremiumApiPath, h as getWebsiteUrlApi, i as getSsoApiPath } from './utils-832ec2d2.js';
+import { G as GA_TOKEN_COOKIE } from './index-99b321ef.js';
+import { H as HEALTH_TOOL_TYPE, a as HEALTH_TOOL_DEFAULT_IMG } from './healthTools-57e9fcee.js';
 import { RISK_SCREENER_NAME, RISK_SCREENER_SLUG } from './constantsRiskScreener.js';
-import { _ as __rest, a as __awaiter } from './tslib.es6-4c2b392a.js';
-import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-aa9aa06b.js';
-import { I as ImageWrap } from './index-09da7cf5.js';
-import { g as getCurrentBaseUrl, a as getCurrentSsoUrl } from './normalizeLink-4e7809ca.js';
-import { u as useTranslations } from './index-a6593fc5.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-b5ec78ee.js';
+import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-03a17277.js';
+import { I as ImageWrap } from './index-d1f1934d.js';
+import { g as getCurrentBaseUrl, a as getCurrentSsoUrl } from './normalizeLink-8b659745.js';
+import { u as useTranslations } from './index-880a8911.js';
 import { useForm, isNotEmpty } from '@mantine/form';
-import { d as Checkbox, f as ChipButton, I as Input, b as AspectRatio$1 } from './index-03963d37.js';
+import { d as Checkbox, f as ChipButton, I as Input, b as AspectRatio$1 } from './index-14a92066.js';
 import '@mantine/dates';
-import './index-633b28cc.js';
-import { t as themeColors } from './index-6187b3e5.js';
-import { T as Text } from './index-9181155e.js';
-import { B as Button } from './index-dbe7d116.js';
-import './index-3770342b.js';
-import './index.styles-f9403cd8.js';
+import './index-abd28b8a.js';
+import { t as themeColors } from './index-7aedbf1b.js';
+import { T as Text } from './index-a9b01bfd.js';
+import { B as Button } from './index-845a806a.js';
+import './index-9b31987c.js';
+import './index.styles-2575877c.js';
 import { useViewportSize } from '@mantine/hooks';
-import './utils-9da52e63.js';
-import './index-a4b6228d.js';
+import './utils-c5a1f614.js';
+import './index-269b0fd2.js';
 import { PATHS as PATHS$2 } from './togetherApiPaths.js';
-import './translationsContext-ec597c09.js';
-import { H as Heading } from './index-3addb19f.js';
-import { u as useHealthToolsCache } from './useHealthToolCache-80317b15.js';
-import { I as Icon } from './index-a01edf7c.js';
+import './translationsContext-eaa23cd9.js';
+import { H as Heading } from './index-1794d957.js';
+import { u as useHealthToolsCache } from './useHealthToolCache-fc75e31d.js';
+import { I as Icon } from './index-e6da1de2.js';
 import { domainLocales } from './constantsDomainLocales.js';
 import { isProduction } from './constantsIsProduction.js';
 import { Close, Plus } from '@hhgtech/icons/core';
-import { i as isVideo } from './index-87f59fcb.js';
-import { M as Modal } from './index-19f3e770.js';
+import { i as isVideo } from './index-c66a920c.js';
+import { M as Modal } from './index-4d21425c.js';
 import Cookies from 'js-cookie';
 import flatten from 'lodash/flatten';
 import uniqBy from 'lodash/uniqBy';
-import { L as LOCALE } from './Locale-0e687ff5.js';
+import { L as LOCALE } from './Locale-c0ccb529.js';
 
 const PREFER_TOPICS = [
     {

package/build/esm/{index-a66798d9.js → index-ada0ea4d.js}

@@ -1,4 +1,4 @@
-import { _ as __rest } from './tslib.es6-4c2b392a.js';
+import { _ as __rest } from './tslib.es6-b5ec78ee.js';
 import React__default from 'react';
 import { Indicator as Indicator$1 } from '@mantine/core';
 import { theme } from './miscTheme.js';

package/build/esm/{index-b09f44ec.js → index-b21833b7.js}

@@ -1,12 +1,12 @@
 import React__default, { useState, useEffect, useContext, useRef } from 'react';
-import { H as Heading } from './index-3addb19f.js';
-import { M as MediaQueries, t as toggleNoScroll } from './utils-9da52e63.js';
-import { u as useTranslations } from './index-a6593fc5.js';
-import { T as TogetherComponentGlobalContext } from './utils-ffe8c9cf.js';
+import { H as Heading } from './index-1794d957.js';
+import { M as MediaQueries, t as toggleNoScroll } from './utils-c5a1f614.js';
+import { u as useTranslations } from './index-880a8911.js';
+import { T as TogetherComponentGlobalContext } from './utils-832ec2d2.js';
 import { Portal } from '@mantine/core';
-import { T as Text } from './index-9181155e.js';
+import { T as Text } from './index-a9b01bfd.js';
 import styled from '@emotion/styled';
-import { _ as __rest } from './tslib.es6-4c2b392a.js';
+import { _ as __rest } from './tslib.es6-b5ec78ee.js';
 import { theme } from './miscTheme.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';