@hhgtech/hhg-components 1.29.497-beta-3 → 1.29.498

package/build/esm/{index-bdaae415.js → index-a080a0fb.js}

@@ -1,27 +1,27 @@
 import React__default, { useState, useMemo, useContext, useEffect, createContext, useRef } from 'react';
-import { B as Button } from './index-5d597bf6.js';
-import { H as Heading } from './index-a698f514.js';
-import { T as Text } from './index-a7cf2464.js';
-import { c as safeEncodeURI, M as MediaQueries, t as toggleNoScroll, a as getPopupWrapperDom } from './utils-49e46daf.js';
+import { B as Button } from './index-9bf109b8.js';
+import { H as Heading } from './index-3addb19f.js';
+import { T as Text } from './index-9181155e.js';
+import { c as safeEncodeURI, M as MediaQueries, t as toggleNoScroll, a as getPopupWrapperDom } from './utils-9da52e63.js';
 import * as ReactDOM from 'react-dom';
-import { b as callApiWithAuth, e as getApiPath, T as TogetherComponentGlobalContext } from './utils-0208dff1.js';
+import { b as callApiWithAuth, e as getApiPath, T as TogetherComponentGlobalContext } from './utils-ffe8c9cf.js';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { a as __awaiter } from './tslib.es6-9a691ffd.js';
-import { I as Input } from './index-960472d2.js';
-import { u as useTranslations } from './index-993eaa2f.js';
-import { e as formatComment } from './dataTransform-6d9d7542.js';
-import { M as MAX_IMAGE_UPLOADS, a as DEFAULT_AVATAR_IMG } from './constants-201bf7b0.js';
+import { a as __awaiter } from './tslib.es6-4c2b392a.js';
+import { I as Input } from './index-8051135e.js';
+import { u as useTranslations } from './index-a6593fc5.js';
+import { e as formatComment } from './dataTransform-c567e3d6.js';
+import { M as MAX_IMAGE_UPLOADS, a as DEFAULT_AVATAR_IMG } from './constants-a9f0b321.js';
 import { PATHS } from './togetherApiPaths.js';
-import { j as removeBannedWordWrapper, i as getMentionIdsFromString, k as encodePostContent, u as uploadAndGetSrc } from './post-e336c803.js';
-import { C as CardLink } from './index-18639567.js';
-import { L as Loading } from './index-f2bd6d0a.js';
-import { U as UserAvatar } from './index-e62d839f.js';
-import { R as RichTextEditor } from './editor-c62e4b64.js';
+import { j as removeBannedWordWrapper, i as getMentionIdsFromString, k as encodePostContent, u as uploadAndGetSrc } from './post-b7fe45c2.js';
+import { C as CardLink } from './index-c807ff34.js';
+import { L as Loading } from './index-326acba7.js';
+import { U as UserAvatar } from './index-eda8f4c9.js';
+import { R as RichTextEditor } from './editor-630516cf.js';
 import { Portal } from '@mantine/core';
 import { FullScreen } from '@hhgtech/icons/other';
-import { P as Popup } from './index-5449069c.js';
-import { C as CloseIcon } from './index-84ed58fb.js';
+import { P as Popup } from './index-ce4a3f25.js';
+import { C as CloseIcon } from './index-b09f44ec.js';
 import { ShareBox } from './togetherShareBox.js';
 
 const useImagePicker = (imageFilesProp, onImageFilesChange) => {

package/build/esm/{index-8cf41b25.js → index-a4b6228d.js}

@@ -1,9 +1,9 @@
-import { _ as __rest } from './tslib.es6-9a691ffd.js';
+import { _ as __rest } from './tslib.es6-4c2b392a.js';
 import React__default, { useRef, useState, useEffect } from 'react';
 import { ArrowLeft, ArrowRight } from '@hhgtech/icons/other';
 import { createStyles, rem, Tabs as Tabs$1, ScrollArea } from '@mantine/core';
-import { B as Button } from './index-447d6e38.js';
-import { T as Text } from './index-a7cf2464.js';
+import { B as Button } from './index-dbe7d116.js';
+import { T as Text } from './index-9181155e.js';
 
 var useStyles = createStyles((theme, params) => {
     const { variant } = params;

package/build/esm/{index-993eaa2f.js → index-a6593fc5.js}

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useContext, useMemo } from 'react';
-import { T as TranslationsContext } from './translationsContext-3a596a57.js';
+import { T as TranslationsContext } from './translationsContext-ec597c09.js';
 
 // SRC: https://github.com/berezh/react-string-format
 function format(text, params) {

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

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

package/build/esm/{index-1dd79000.js → index-a9cae9f8.js}

@@ -1,11 +1,11 @@
 import React__default, { useRef, useEffect } from 'react';
 import { Portal } from '@mantine/core';
-import { t as toggleNoScroll } from './utils-49e46daf.js';
+import { t as toggleNoScroll } from './utils-9da52e63.js';
 import { css } from '@emotion/react';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { s as slideInUp, e as slideOutDown, b as slideInLeft, f as slideOutLeft, c as slideInRight, g as slideOutRight, a as slideInDown, d as slideOutUp } from './animation-cb9c805b.js';
-import { T as Text } from './index-a7cf2464.js';
+import { s as slideInUp, e as slideOutDown, b as slideInLeft, f as slideOutLeft, c as slideInRight, g as slideOutRight, a as slideInDown, d as slideOutUp } from './animation-8c67ea62.js';
+import { T as Text } from './index-9181155e.js';
 
 const DURATION = '600ms';
 const generateStyleBasedOnPlacement = (placement, open) => {

package/build/esm/{index-1cdc4174.js → index-aab829b3.js}

@@ -1,8 +1,8 @@
-import { _ as __rest } from './tslib.es6-9a691ffd.js';
+import { _ as __rest } from './tslib.es6-4c2b392a.js';
 import React__default from 'react';
 import { Textarea } from '@mantine/core';
-import { u as useStyles } from './index-1e5a523f.js';
-import { u as useTemplateVariant } from './index-06a878ad.js';
+import { u as useStyles } from './index-03963d37.js';
+import { u as useTemplateVariant } from './index-3770342b.js';
 
 const TextArea = (_a) => {
     var { styles } = _a, props = __rest(_a, ["styles"]);

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

@@ -1,12 +1,12 @@
 import React__default, { useState, useEffect, useContext, useRef } from 'react';
-import { H as Heading } from './index-a698f514.js';
-import { M as MediaQueries, t as toggleNoScroll } from './utils-49e46daf.js';
-import { u as useTranslations } from './index-993eaa2f.js';
-import { T as TogetherComponentGlobalContext } from './utils-0208dff1.js';
+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 { Portal } from '@mantine/core';
-import { T as Text } from './index-a7cf2464.js';
+import { T as Text } from './index-9181155e.js';
 import styled from '@emotion/styled';
-import { _ as __rest } from './tslib.es6-9a691ffd.js';
+import { _ as __rest } from './tslib.es6-4c2b392a.js';
 import { theme } from './miscTheme.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
 

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

@@ -1,28 +1,28 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-9a691ffd.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-4c2b392a.js';
 import React__default, { createContext, useContext, useState, useMemo, useEffect } from 'react';
 import { Controller, useForm } from 'react-hook-form';
-import { u as useHealthToolsCache } from './useHealthToolCache-09b48b94.js';
-import { H as HEALTH_TOOL_TYPE } from './constants-201bf7b0.js';
-import { Grid, Flex, Box, clsx, createStyles, rem, Stack } from '@mantine/core';
-import { G as GenderOptionControl } from './index-d2fe41fa.js';
-import { I as Input, R as Radio, c as ErrorLabel, d as Checkbox } from './index-1e5a523f.js';
+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 '@mantine/dates';
-import './index-7083909c.js';
-import './index-5426e58c.js';
-import './index-293b08f2.js';
-import './index-e9951450.js';
-import { T as Text } from './index-a7cf2464.js';
-import './index-447d6e38.js';
+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-06a878ad.js';
-import './index.styles-81c4d6bc.js';
-import { u as useTranslations } from './index-993eaa2f.js';
+import './index-3770342b.js';
+import './index.styles-f9403cd8.js';
+import { u as useTranslations } from './index-a6593fc5.js';
 import '@mantine/hooks';
-import './utils-49e46daf.js';
-import './index-8cf41b25.js';
-import { H as HealthToolFormWrapper } from './index-dc085c8d.js';
-import { C as CardWrapperContext } from './context-79aba0ce.js';
-import { L as LOCALE } from './Locale-b7741771.js';
+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 { domainLocales } from './constantsDomainLocales.js';
 import { getBmi } from './embeddedHeathToolCards_helpers.js';
 
@@ -34,71 +34,70 @@ const DefaultForm = (props) => {
     const { classes: cardWrapperClasses = {} } = useContext(CardWrapperContext);
     const { control, bmiGenerated, isTouched, linkTool, submitProps, withAdditionalQuestion, classes: formWrapperClasses = {}, } = useContext(BmiFormContext);
     return (React__default.createElement(HealthToolFormWrapper, Object.assign({ formLayout: "default" }, props),
-        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: "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.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: "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: "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(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: "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(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: "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(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: "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" },
-                                    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, 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" },
-                                    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(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: "p3" }, 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(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, { 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'))))));
 };
 
 var useStyles = createStyles((theme) => {
     return {
         newsletterBlock: {
             backgroundColor: theme.colors.neutral[0],
+            padding: `${rem(16)} 0`,
             borderBottomLeftRadius: 'inherit',
             borderBottomRightRadius: 'inherit',
             '.bmi-btn': {
@@ -173,7 +172,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, { py: 16, 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, { 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-8d4f08a2.js → index-bbb9701a.js}

@@ -1,35 +1,35 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-9a691ffd.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-4c2b392a.js';
 import React__default, { useState, useContext, useMemo, useRef, useCallback, useEffect, createContext } from 'react';
 import dayjs from 'dayjs';
-import { T as Tabs } from './index-8cf41b25.js';
-import { L as Loading } from './index-1182c631.js';
-import { a as formatPost, f as formatCommunity, g as formatArticle } from './dataTransform-6d9d7542.js';
+import { T as Tabs } from './index-a4b6228d.js';
+import { L as Loading } from './index-6b5a6af7.js';
+import { a as formatPost, f as formatCommunity, g as formatArticle } from './dataTransform-c567e3d6.js';
 import { PATHS } from './togetherApiPaths.js';
-import { T as TogetherComponentGlobalContext, c as callApi, e as getApiPath, b as callApiWithAuth } from './utils-0208dff1.js';
+import { T as TogetherComponentGlobalContext, c as callApi, e as getApiPath, b as callApiWithAuth } from './utils-ffe8c9cf.js';
 import { Plus } from '@hhgtech/icons/core';
 import { createStyles, Anchor, Accordion, Flex, useMantineTheme } from '@mantine/core';
-import { C as CommonGAssets } from './index-293b08f2.js';
-import { I as ImageWrap } from './index-9a281f88.js';
-import { P as PopupExpert, d as CardAuthor, C as CardAuthor$1 } from './index-466220ea.js';
-import { S as SocialType } from './index-5426e58c.js';
-import { u as useTranslations } from './index-993eaa2f.js';
+import { C as CommonGAssets } from './index-957ad8bc.js';
+import { I as ImageWrap } from './index-09da7cf5.js';
+import { P as PopupExpert, d as CardAuthor, C as CardAuthor$1 } from './index-8b095b02.js';
+import { S as SocialType } from './index-633b28cc.js';
+import { u as useTranslations } from './index-a6593fc5.js';
 import { theme } from './miscTheme.js';
 import { CrossLogo, ArrowDown } from '@hhgtech/icons/other';
-import { a as Anchor$1 } from './index-1e5a523f.js';
+import { a as Anchor$1 } from './index-03963d37.js';
 import '@mantine/dates';
-import './index-7083909c.js';
-import './index-e9951450.js';
-import { T as Text } from './index-a7cf2464.js';
-import { B as Button } from './index-447d6e38.js';
-import './index-06a878ad.js';
-import './index.styles-81c4d6bc.js';
+import './index-2d6472a6.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 '@mantine/hooks';
-import './utils-49e46daf.js';
+import './utils-9da52e63.js';
 import styled from '@emotion/styled';
 import { useTogetherAuthRequiredAction } from './useTogetherAuthRequiredAction.js';
-import { d as decodeMention, b as decodePostUrl } from './post-e336c803.js';
-import { B as Button$1 } from './index-5d597bf6.js';
-import './translationsContext-3a596a57.js';
+import { d as decodeMention, b as decodePostUrl } from './post-b7fe45c2.js';
+import { B as Button$1 } from './index-9bf109b8.js';
+import './translationsContext-ec597c09.js';
 
 const StyledPostContent = styled.div `
   padding: 0.5rem 1rem 1rem;

package/build/esm/{index-8a0f3518.js → index-c06c86b3.js}

@@ -1,18 +1,18 @@
 import React__default, { useState, useMemo } from 'react';
-import { F as Flag } from './index-1e5a523f.js';
+import { F as Flag } from './index-03963d37.js';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { T as Text } from './index-a7cf2464.js';
-import { C as CommonGAssets } from './index-293b08f2.js';
-import { _ as __rest } from './tslib.es6-9a691ffd.js';
-import { a as ZINDEX_HEADER, e as VIDEO_DETAIL_TEMP_STORAGE } from './index-7083909c.js';
-import { V as VideoType } from './index-5426e58c.js';
+import { T as Text } from './index-9181155e.js';
+import { C as CommonGAssets } from './index-957ad8bc.js';
+import { _ as __rest } from './tslib.es6-4c2b392a.js';
+import { a as ZINDEX_HEADER, e as VIDEO_DETAIL_TEMP_STORAGE } from './index-2d6472a6.js';
+import { V as VideoType } from './index-633b28cc.js';
 import { createStyles, Stack, Box, AspectRatio, getStylesRef, rem, Flex } from '@mantine/core';
-import { a as abbreviateNumber } from './number-e574311d.js';
-import { u as useTranslations } from './index-993eaa2f.js';
+import { a as abbreviateNumber } from './number-6f22ec5a.js';
+import { u as useTranslations } from './index-a6593fc5.js';
 import { useOs } from '@mantine/hooks';
-import { M as Modal } from './index-f6aa0466.js';
-import { S as SocialLinkPreview } from './index-3fa60c3f.js';
+import { M as Modal } from './index-19f3e770.js';
+import { S as SocialLinkPreview } from './index-e319e84e.js';
 import { domainLocales } from './constantsDomainLocales.js';
 
 const ALLOW_DOMAIN_URL = [

package/build/esm/{index-18639567.js → index-c807ff34.js}

@@ -1,12 +1,12 @@
-import { a as __awaiter } from './tslib.es6-9a691ffd.js';
+import { a as __awaiter } from './tslib.es6-4c2b392a.js';
 import React__default, { useContext, useState, useRef, useEffect } from 'react';
 import { useMantineTheme } from '@mantine/core';
-import { H as Heading } from './index-a698f514.js';
-import { T as Text } from './index-a7cf2464.js';
-import { T as TogetherComponentGlobalContext, c as callApi, e as getApiPath } from './utils-0208dff1.js';
+import { H as Heading } from './index-3addb19f.js';
+import { T as Text } from './index-9181155e.js';
+import { T as TogetherComponentGlobalContext, c as callApi, e as getApiPath } from './utils-ffe8c9cf.js';
 import styled from '@emotion/styled';
 import { PATHS } from './togetherApiPaths.js';
-import { D as DEFAULT_IMG } from './constants-201bf7b0.js';
+import { D as DEFAULT_IMG } from './constants-a9f0b321.js';
 
 const StyledCardLink = styled.div `
   .link-info-container {

package/build/esm/{index-5449069c.js → index-ce4a3f25.js}

@@ -1,6 +1,6 @@
 import React__default from 'react';
 import styled from '@emotion/styled';
-import { M as MediaQueries } from './utils-49e46daf.js';
+import { M as MediaQueries } from './utils-9da52e63.js';
 import { theme } from './miscTheme.js';
 
 const StyledPopup = styled.div `

package/build/esm/{index-0068d464.js → index-cf09d09f.js}

@@ -1,20 +1,20 @@
 import * as React from 'react';
 import React__default, { useState, useRef, createContext, useEffect, Fragment, forwardRef, useMemo, useCallback } from 'react';
-import { T as Text } from './index-a7cf2464.js';
+import { T as Text } from './index-9181155e.js';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { M as MediaQueries } from './utils-49e46daf.js';
+import { M as MediaQueries } from './utils-9da52e63.js';
 import { Collapse, rem, clsx } from '@mantine/core';
 import { useDisclosure } from '@mantine/hooks';
-import { S as ShapedArrowDown } from './index-dcd96fe6.js';
-import { R as Radio$1 } from './index-1e5a523f.js';
-import { _ as __rest, a as __awaiter } from './tslib.es6-9a691ffd.js';
-import { T as Text$1 } from './index-2f3e37f6.js';
+import { S as ShapedArrowDown } from './index-39757e83.js';
+import { R as Radio$1 } from './index-03963d37.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-4c2b392a.js';
+import { T as Text$1 } from './index-e06a7c13.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
 import flattenChildren from 'react-keyed-flatten-children';
-import { H as Heading } from './index-a698f514.js';
-import { C as Close } from './Close-de09c96b.js';
-import { u as useTranslations } from './index-993eaa2f.js';
+import { H as Heading } from './index-3addb19f.js';
+import { C as Close } from './Close-6db34fea.js';
+import { u as useTranslations } from './index-a6593fc5.js';
 import { Carousel } from '@mantine/carousel';
 
 var styles = {"alert":"CHw-fZZ","content":"_03U6VRS","close":"EO828Vv"};

package/build/esm/{index-4f361b29.js → index-d21d8696.js}

@@ -1,6 +1,6 @@
-import { c as cookie } from './index-6c13bc0f.js';
-import { B as BEARER_TOKEN_COOKIE } from './index-7083909c.js';
-import { N as NodeIntentType } from './index-5426e58c.js';
+import { c as cookie } from './index-d589b8b4.js';
+import { B as BEARER_TOKEN_COOKIE } from './index-2d6472a6.js';
+import { N as NodeIntentType } from './index-633b28cc.js';
 import Cookies from 'js-cookie';
 import { v4 } from 'uuid';
 import { isProduction } from './constantsIsProduction.js';

package/build/esm/{index-8c615f94.js → index-d48cbe53.js}

@@ -1,12 +1,12 @@
-import { _ as __rest } from './tslib.es6-9a691ffd.js';
+import { _ as __rest } from './tslib.es6-4c2b392a.js';
 import React__default from 'react';
 import { useMantineTheme, Image } from '@mantine/core';
 import { DatePickerInput } from '@mantine/dates';
-import { I as ISO_FORMAT } from './index-7083909c.js';
-import './index-5426e58c.js';
-import { C as CommonGAssets } from './index-293b08f2.js';
-import { M as MAPPED_LOCALE } from './index-e9951450.js';
-import { L as LOCALE } from './Locale-b7741771.js';
+import { I as ISO_FORMAT } from './index-2d6472a6.js';
+import './index-633b28cc.js';
+import { C as CommonGAssets } from './index-957ad8bc.js';
+import { M as MAPPED_LOCALE } from './index-6187b3e5.js';
+import { L as LOCALE } from './Locale-0e687ff5.js';
 
 // Omit<MantineDatePickerInputProps, 'value'>
 const DatePicker = (_a) => {

package/build/esm/{index-d2fe41fa.js → index-d55d080a.js}

@@ -1,24 +1,23 @@
-import { _ as __rest } from './tslib.es6-9a691ffd.js';
+import { _ as __rest } from './tslib.es6-4c2b392a.js';
 import React__default, { useState, useRef, useMemo, useEffect } from 'react';
 import { BabyBoyMB, BabyGirlMB } from '@hhgtech/icons/other';
 import { createStyles, rem, Box, Flex } from '@mantine/core';
-import { R as Radio } from './index-1e5a523f.js';
+import { R as Radio } from './index-03963d37.js';
 import '@mantine/dates';
-import './index-7083909c.js';
-import './index-5426e58c.js';
-import { C as CommonGAssets } from './index-293b08f2.js';
-import './index-e9951450.js';
-import { T as Text } from './index-a7cf2464.js';
-import './index-447d6e38.js';
-import './index-06a878ad.js';
-import './index.styles-81c4d6bc.js';
-import { u as useTranslations } from './index-993eaa2f.js';
+import './index-2d6472a6.js';
+import './index-633b28cc.js';
+import { C as CommonGAssets } from './index-957ad8bc.js';
+import './index-6187b3e5.js';
+import { T as Text } from './index-9181155e.js';
+import './index-dbe7d116.js';
+import './index-3770342b.js';
+import './index.styles-f9403cd8.js';
+import { u as useTranslations } from './index-a6593fc5.js';
 import '@mantine/hooks';
-import './utils-49e46daf.js';
-import './index-8cf41b25.js';
+import './utils-9da52e63.js';
+import './index-a4b6228d.js';
 
-var useStyles = createStyles((theme, { type, color }) => {
-    var _a;
+var useStyles = createStyles((theme, { type }) => {
     const isMarryBaby = theme.other.template === 'mb';
     return {
         root: {},
@@ -35,7 +34,7 @@ var useStyles = createStyles((theme, { type, color }) => {
                 width: '50%',
                 '&[data-checked="true"]': {
                     '.mantine-Radio-label': {
-                        borderColor: ((_a = theme.colors[color]) === null || _a === void 0 ? void 0 : _a[6]) || theme.fn.primaryColor(),
+                        borderColor: theme.fn.primaryColor(),
                     },
                 },
             }
@@ -79,12 +78,12 @@ var useStyles = createStyles((theme, { type, color }) => {
 });
 
 const GenderOptionControl = (_a) => {
-    var { label, availableValue: availableValueInit, styles, color, isBaby, genderValue = {
+    var { label, availableValue: availableValueInit, styles, isBaby, genderValue = {
         male: 'male',
         female: 'female',
-    }, type = 'button', hideLabel } = _a, radioProps = __rest(_a, ["label", "availableValue", "styles", "color", "isBaby", "genderValue", "type", "hideLabel"]);
+    }, type = 'button', hideLabel } = _a, radioProps = __rest(_a, ["label", "availableValue", "styles", "isBaby", "genderValue", "type", "hideLabel"]);
     const { t } = useTranslations();
-    const { classes, cx, theme } = useStyles({ type, color }, {
+    const { classes, cx, theme } = useStyles({ type }, {
         name: 'GenderOptionControl',
         styles,
     });

package/build/esm/{index-447d6e38.js → index-dbe7d116.js}

@@ -1,8 +1,8 @@
-import { _ as __rest } from './tslib.es6-9a691ffd.js';
+import { _ as __rest } from './tslib.es6-4c2b392a.js';
 import React__default, { forwardRef } from 'react';
 import { createStyles, getStylesRef, useMantineTheme, Button as Button$1 } from '@mantine/core';
-import { A as ANIMATION_DURATION } from './shared-4ef3921b.js';
-import { C as CustomStylesType, F as FontWeight, u as useTemplateVariant } from './index-06a878ad.js';
+import { A as ANIMATION_DURATION } from './shared-93e28ff6.js';
+import { C as CustomStylesType, F as FontWeight, u as useTemplateVariant } from './index-3770342b.js';
 
 var useStyles = createStyles((_theme, _params) => {
     var _a, _b, _c, _d, _e, _f;