@hhgtech/hhg-components 1.29.499 → 1.29.500

package/build/{index-5b68de26.js → index-684152f8.js}

@@ -1,28 +1,28 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-ebbd9505.js');
+var tslib_es6 = require('./tslib.es6-7c7d06ab.js');
 var React = require('react');
 var core = require('@mantine/core');
 var dateFns = require('date-fns');
-var LastPeriod = require('./LastPeriod-dee40583.js');
-var Locale = require('./Locale-4f8c0874.js');
+var LastPeriod = require('./LastPeriod-88d82546.js');
+var Locale = require('./Locale-a4854278.js');
 var form = require('@mantine/form');
 var dayjs = require('dayjs');
-var index$4 = require('./index-0cf05697.js');
-var index$2 = require('./index-3b584311.js');
-var index$5 = require('./index-0781219e.js');
-require('./index-b0cf70f2.js');
-require('./index-358695c8.js');
-require('./index.styles-afd04f10.js');
-var index = require('./index-dde6d0e2.js');
+var index$5 = require('./index-248ff166.js');
+var index$2 = require('./index-afe5b4d7.js');
+var index$3 = require('./index-51229c6c.js');
+require('./index-fef96902.js');
+require('./index-ebaf2c19.js');
+require('./index.styles-2fc37e7a.js');
+var index = require('./index-6c650ac4.js');
 require('@mantine/hooks');
-require('./index-68040d4f.js');
-require('./utils-53bab473.js');
-require('./index-f2faadcf.js');
-var index$1 = require('./index-9edd3345.js');
+require('./index-65bc602a.js');
+require('./utils-053ed913.js');
+require('./index-93151a6e.js');
+var index$1 = require('./index-0cb74f84.js');
 var other = require('@hhgtech/icons/other');
-var context = require('./context-a40dc8d5.js');
-var index$3 = require('./index-65a18ef8.js');
+var context = require('./context-60530f29.js');
+var index$4 = require('./index-03e1d5fd.js');
 var miscTheme = require('./miscTheme.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -255,7 +255,7 @@ const DefaultLayout$4 = () => {
     const { t } = index.useTranslations();
     const { form } = React.useContext(ConceptionFormContext);
     return (React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-        React__default["default"].createElement(index$2.DatePicker, Object.assign({ label: t('dueDatePage.lastPeriod.lastPeriodLabel') }, form.getInputProps('lastPeriodDate'), { popoverProps: {
+        React__default["default"].createElement(index$2.DatePicker, Object.assign({ label: React__default["default"].createElement(index$3.Text, { size: "p2", weight: "semiBold" }, t('dueDatePage.lastPeriod.lastPeriodLabel')) }, form.getInputProps('lastPeriodDate'), { popoverProps: {
                 withinPortal: true,
             }, maxDate: new Date() }))));
 };
@@ -294,9 +294,9 @@ const ConceptionForm = ({}) => {
         onSubmit: form$1.onSubmit((values) => {
             const { lastPeriodDate } = values;
             const redirectLink = [
-                `${index$3.QUERY_HEALTH_TOOL.type}=${DueDateCalculatorType.conception}`,
-                `${index$3.QUERY_HEALTH_TOOL.startDate}=${dayjs__default["default"](lastPeriodDate).format(index$3.API_DATE_FORMAT)}`,
-                `${index$3.QUERY_HEALTH_TOOL.additional}= `,
+                `${index$4.QUERY_HEALTH_TOOL.type}=${DueDateCalculatorType.conception}`,
+                `${index$4.QUERY_HEALTH_TOOL.startDate}=${dayjs__default["default"](lastPeriodDate).format(index$4.API_DATE_FORMAT)}`,
+                `${index$4.QUERY_HEALTH_TOOL.additional}= `,
             ].join('&');
             onSubmit(getDueDateConception(lastPeriodDate), redirectLink);
         }),
@@ -314,7 +314,7 @@ const DefaultLayout$3 = () => {
     const { t } = index.useTranslations();
     const { form } = React.useContext(IUIFormContext);
     return (React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-        React__default["default"].createElement(index$2.DatePicker, Object.assign({ label: t('dueDatePage.date_of_IUI_procedure') }, form.getInputProps('dateOfIUIProcedure'), { popoverProps: {
+        React__default["default"].createElement(index$2.DatePicker, Object.assign({ label: React__default["default"].createElement(index$3.Text, { size: "p2", weight: "semiBold" }, t('dueDatePage.date_of_IUI_procedure')) }, form.getInputProps('dateOfIUIProcedure'), { popoverProps: {
                 withinPortal: true,
             }, maxDate: new Date() }))));
 };
@@ -352,9 +352,9 @@ const IUIForm = ({}) => {
         onSubmit: form$1.onSubmit((values) => {
             const { dateOfIUIProcedure } = values;
             const redirectLink = [
-                `${index$3.QUERY_HEALTH_TOOL.type}=${DueDateCalculatorType.IUI}`,
-                `${index$3.QUERY_HEALTH_TOOL.startDate}=${dayjs__default["default"](dateOfIUIProcedure).format(index$3.API_DATE_FORMAT)}`,
-                `${index$3.QUERY_HEALTH_TOOL.additional}= `,
+                `${index$4.QUERY_HEALTH_TOOL.type}=${DueDateCalculatorType.IUI}`,
+                `${index$4.QUERY_HEALTH_TOOL.startDate}=${dayjs__default["default"](dateOfIUIProcedure).format(index$4.API_DATE_FORMAT)}`,
+                `${index$4.QUERY_HEALTH_TOOL.additional}= `,
             ].join('&');
             onSubmit(getDueDateIUI(dateOfIUIProcedure), redirectLink);
         }),
@@ -373,12 +373,12 @@ const DefaultLayout$2 = () => {
     const { form, transferDateOptions } = React.useContext(IVFFormContext);
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index$2.DatePicker, Object.assign({ label: t('dueDatePage.ivf.transferDate') }, form.getInputProps('IVFDate'), { popoverProps: {
+            React__default["default"].createElement(index$2.DatePicker, Object.assign({ label: React__default["default"].createElement(index$3.Text, { size: "p2", weight: "semiBold" }, t('dueDatePage.ivf.transferDate')) }, form.getInputProps('IVFDate'), { popoverProps: {
                     withinPortal: true,
                 }, maxDate: new Date() }))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index$4.Radio.Group, Object.assign({}, form.getInputProps('dayTransfer')),
-                React__default["default"].createElement(core.Group, null, transferDateOptions.map((i, idx) => (React__default["default"].createElement(index$4.Radio, { key: idx, value: i.value, label: i.label }))))))));
+            React__default["default"].createElement(index$5.Radio.Group, Object.assign({}, form.getInputProps('dayTransfer')),
+                React__default["default"].createElement(core.Group, null, transferDateOptions.map((i, idx) => (React__default["default"].createElement(index$5.Radio, { key: idx, value: i.value, label: i.label }))))))));
 };
 
 const InlineLayout$2 = () => {
@@ -392,8 +392,8 @@ const InlineLayout$2 = () => {
                     }, maxDate: new Date() })))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
             React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { width: 'none' },
-                React__default["default"].createElement(index$4.Radio.Group, Object.assign({}, form.getInputProps('dayTransfer')),
-                    React__default["default"].createElement(core.Group, null, transferDateOptions.map((i, idx) => (React__default["default"].createElement(index$4.Radio, { key: idx, value: i.value, label: i.label })))))))));
+                React__default["default"].createElement(index$5.Radio.Group, Object.assign({}, form.getInputProps('dayTransfer')),
+                    React__default["default"].createElement(core.Group, null, transferDateOptions.map((i, idx) => (React__default["default"].createElement(index$5.Radio, { key: idx, value: i.value, label: i.label })))))))));
 };
 
 const MbLayout$2 = () => {
@@ -404,8 +404,8 @@ const MbLayout$2 = () => {
             React__default["default"].createElement(index$2.DatePicker, Object.assign({}, form.getInputProps('IVFDate'), { popoverProps: {
                     withinPortal: true,
                 }, maxDate: new Date(), rightSection: null }))),
-        React__default["default"].createElement(index$4.Radio.Group, Object.assign({}, form.getInputProps('dayTransfer')),
-            React__default["default"].createElement(core.Group, null, transferDateOptions.map((i, idx) => (React__default["default"].createElement(index$4.Radio, { key: idx, value: i.value, label: i.label })))))));
+        React__default["default"].createElement(index$5.Radio.Group, Object.assign({}, form.getInputProps('dayTransfer')),
+            React__default["default"].createElement(core.Group, null, transferDateOptions.map((i, idx) => (React__default["default"].createElement(index$5.Radio, { key: idx, value: i.value, label: i.label })))))));
 };
 
 const IVFForm = ({}) => {
@@ -439,9 +439,9 @@ const IVFForm = ({}) => {
             const { IVFDate } = values;
             const dayTransfer = Number(values.dayTransfer);
             const redirectLink = [
-                `${index$3.QUERY_HEALTH_TOOL.type}=${DueDateCalculatorType.IVF}`,
-                `${index$3.QUERY_HEALTH_TOOL.startDate}=${dayjs__default["default"](IVFDate).format(index$3.API_DATE_FORMAT)}`,
-                `${index$3.QUERY_HEALTH_TOOL.additional}=${dayTransfer}`,
+                `${index$4.QUERY_HEALTH_TOOL.type}=${DueDateCalculatorType.IVF}`,
+                `${index$4.QUERY_HEALTH_TOOL.startDate}=${dayjs__default["default"](IVFDate).format(index$4.API_DATE_FORMAT)}`,
+                `${index$4.QUERY_HEALTH_TOOL.additional}=${dayTransfer}`,
             ].join('&');
             onSubmit(getDueDateIVF(IVFDate, Number(dayTransfer)), redirectLink);
         }),
@@ -464,12 +464,12 @@ const DefaultLayout$1 = () => {
     })), []);
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index$2.DatePicker, Object.assign({ label: t('dueDatePage.lastPeriod.lastPeriodLabel') }, form.getInputProps('lastPeriodDate'), { popoverProps: {
+            React__default["default"].createElement(index$2.DatePicker, Object.assign({ label: React__default["default"].createElement(index$3.Text, { size: "p2", weight: "semiBold" }, t('dueDatePage.lastPeriod.lastPeriodLabel')) }, form.getInputProps('lastPeriodDate'), { popoverProps: {
                     withinPortal: true,
                 }, maxDate: new Date() }))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index$4.Input.Wrapper, { label: t('dueDatePage.lastPeriod.periodLengthLabel') },
-                React__default["default"].createElement(index$4.Select, Object.assign({ placeholder: t('tools.inputPlaceholder', {
+            React__default["default"].createElement(index$5.Input.Wrapper, { label: React__default["default"].createElement(index$3.Text, { size: "p2", weight: "semiBold" }, t('dueDatePage.lastPeriod.periodLengthLabel')) },
+                React__default["default"].createElement(index$5.Select, Object.assign({ placeholder: t('tools.inputPlaceholder', {
                         content: t('dueDatePage.daysText', { number: 30 }),
                     }), data: periodLengthDropDownOptions, withinPortal: true }, form.getInputProps('periodLength')))))));
 };
@@ -489,7 +489,7 @@ const InlineLayout$1 = () => {
                     }, maxDate: new Date() })))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
             React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('dueDatePage.lastPeriod.periodLengthLabel'), width: 300 },
-                React__default["default"].createElement(index$4.Select, Object.assign({ placeholder: t('tools.inputPlaceholder', {
+                React__default["default"].createElement(index$5.Select, Object.assign({ placeholder: t('tools.inputPlaceholder', {
                         content: t('dueDatePage.daysText', { number: 30 }),
                     }), data: periodLengthDropDownOptions }, form.getInputProps('periodLength'), { error: null, withinPortal: true })))),
         form.errors.periodLength && (React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
@@ -505,7 +505,7 @@ const MbLayout$1 = () => {
                     withinPortal: true,
                 }, maxDate: new Date() }))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderBoxControl, { label: t('dueDatePage.lastPeriod.periodLengthLabel'), rightSection: t('ovulationPage.dayUnit') },
-            React__default["default"].createElement(index$4.Input.Number, Object.assign({ min: 20, max: 40, placeholder: t('tools.inputPlaceholder', {
+            React__default["default"].createElement(index$5.Input.Number, Object.assign({ min: 20, max: 40, placeholder: t('tools.inputPlaceholder', {
                     content: '30',
                 }) }, form.getInputProps('periodLength')))),
         form.errors.periodLength && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.periodLength))));
@@ -529,9 +529,9 @@ const LastPeriodForm = ({}) => {
         onSubmit: form$1.onSubmit((values) => {
             const { periodLength, lastPeriodDate } = values;
             const redirectLink = [
-                `${index$3.QUERY_HEALTH_TOOL.type}=${DueDateCalculatorType.lastPeriod}`,
-                `${index$3.QUERY_HEALTH_TOOL.startDate}=${dayjs__default["default"](lastPeriodDate).format(index$3.API_DATE_FORMAT)}`,
-                `${index$3.QUERY_HEALTH_TOOL.additional}=${periodLength}`,
+                `${index$4.QUERY_HEALTH_TOOL.type}=${DueDateCalculatorType.lastPeriod}`,
+                `${index$4.QUERY_HEALTH_TOOL.startDate}=${dayjs__default["default"](lastPeriodDate).format(index$4.API_DATE_FORMAT)}`,
+                `${index$4.QUERY_HEALTH_TOOL.additional}=${periodLength}`,
             ].join('&');
             onSubmit(getDueDateLastPeriod(lastPeriodDate, periodLength), redirectLink);
         }),
@@ -555,30 +555,30 @@ const Info = (_a) => {
 const DefaultLayout = () => {
     const { t } = index.useTranslations();
     const { form } = React.useContext(UltrasoundFormContext);
-    const rightSection = (React__default["default"].createElement(index$5.Text, { size: "p4", color: miscTheme.theme.colors.gray400 }, "mm"));
+    const rightSection = (React__default["default"].createElement(index$3.Text, { size: "p4", color: miscTheme.theme.colors.gray400 }, "mm"));
     const inputPropsCRL = form.getInputProps('ultrasoundCRL');
     const inputPropsMSD = form.getInputProps('ultrasoundMSD');
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index$2.DatePicker, Object.assign({ label: t('dueDatePage.date_of_ultrasound') }, form.getInputProps('dateOfUltrasound'), { popoverProps: {
+            React__default["default"].createElement(index$2.DatePicker, Object.assign({ label: React__default["default"].createElement(index$3.Text, { size: "p2", weight: "semiBold" }, t('dueDatePage.date_of_ultrasound')) }, form.getInputProps('dateOfUltrasound'), { popoverProps: {
                     withinPortal: true,
                 }, maxDate: new Date() }))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
             React__default["default"].createElement(core.Flex, { align: "center", gap: 4, mb: 4 },
-                React__default["default"].createElement(index$5.Text, { as: "label", size: "s4" }, t('dueDatePage.validation.one_is_required')),
+                React__default["default"].createElement(index$3.Text, { size: "p2", weight: "semiBold" }, t('dueDatePage.validation.one_is_required')),
                 React__default["default"].createElement(core.Tooltip, { withinPortal: true, withArrow: true, width: 300, multiline: true, label: t('dueDatePage.ultrasound.tooltip') },
                     React__default["default"].createElement(core.Flex, null,
                         React__default["default"].createElement(Info, { size: 16 })))),
             React__default["default"].createElement(core.Flex, { gap: 8 },
-                React__default["default"].createElement(index$4.Input, Object.assign({ placeholder: "CRL", sx: { flex: 1 }, rightSection: rightSection, type: "number", min: 0, step: 0.01 }, inputPropsCRL, { errorProps: { sx: { display: 'none' } } })),
-                React__default["default"].createElement(index$4.Input, Object.assign({ placeholder: "MSD", sx: { flex: 1 }, rightSection: rightSection, type: "number", min: 0, step: 0.01 }, inputPropsMSD, { errorProps: { sx: { display: 'none' } } }))),
-            (form.errors.ultrasoundCRL || form.errors.ultrasoundMSD) && (React__default["default"].createElement(index$5.Text, { size: "p4", color: miscTheme.theme.colors.red500 }, form.errors.ultrasoundCRL || form.errors.ultrasoundMSD)))));
+                React__default["default"].createElement(index$5.Input, Object.assign({ placeholder: "CRL", sx: { flex: 1 }, rightSection: rightSection, type: "number", min: 0, step: 0.01 }, inputPropsCRL, { errorProps: { sx: { display: 'none' } } })),
+                React__default["default"].createElement(index$5.Input, Object.assign({ placeholder: "MSD", sx: { flex: 1 }, rightSection: rightSection, type: "number", min: 0, step: 0.01 }, inputPropsMSD, { errorProps: { sx: { display: 'none' } } }))),
+            (form.errors.ultrasoundCRL || form.errors.ultrasoundMSD) && (React__default["default"].createElement(index$3.Text, { size: "p4", color: miscTheme.theme.colors.red500 }, form.errors.ultrasoundCRL || form.errors.ultrasoundMSD)))));
 };
 
 const InlineLayout = () => {
     const { t } = index.useTranslations();
     const { form } = React.useContext(UltrasoundFormContext);
-    const rightSection = (React__default["default"].createElement(index$5.Text, { size: "p4", color: miscTheme.theme.colors.gray400 }, "mm"));
+    const rightSection = (React__default["default"].createElement(index$3.Text, { size: "p4", color: miscTheme.theme.colors.gray400 }, "mm"));
     const inputPropsCRL = form.getInputProps('ultrasoundCRL');
     const inputPropsMSD = form.getInputProps('ultrasoundMSD');
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
@@ -595,8 +595,8 @@ const InlineLayout = () => {
                             React__default["default"].createElement(Info, { size: 16 })))) },
                 React__default["default"].createElement(core.Box, null,
                     React__default["default"].createElement(core.Flex, { gap: 8 },
-                        React__default["default"].createElement(index$4.Input, Object.assign({ placeholder: "CRL", sx: { flex: 1 }, rightSection: rightSection, type: "number", min: 0, step: 0.01 }, inputPropsCRL, { errorProps: { sx: { display: 'none' } } })),
-                        React__default["default"].createElement(index$4.Input, Object.assign({ placeholder: "MSD", sx: { flex: 1 }, rightSection: rightSection, type: "number", min: 0, step: 0.01 }, inputPropsMSD, { errorProps: { sx: { display: 'none' } } }))))),
+                        React__default["default"].createElement(index$5.Input, Object.assign({ placeholder: "CRL", sx: { flex: 1 }, rightSection: rightSection, type: "number", min: 0, step: 0.01 }, inputPropsCRL, { errorProps: { sx: { display: 'none' } } })),
+                        React__default["default"].createElement(index$5.Input, Object.assign({ placeholder: "MSD", sx: { flex: 1 }, rightSection: rightSection, type: "number", min: 0, step: 0.01 }, inputPropsMSD, { errorProps: { sx: { display: 'none' } } }))))),
             (form.errors.ultrasoundCRL || form.errors.ultrasoundMSD) && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.ultrasoundCRL || form.errors.ultrasoundMSD)))));
 };
 
@@ -647,9 +647,9 @@ const UltrasoundForm = ({}) => {
             const { dateOfUltrasound, ultrasoundCRL, ultrasoundMSD } = values;
             const additionalInfo = `${ultrasoundCRL}|${ultrasoundMSD}`;
             const redirectLink = [
-                `${index$3.QUERY_HEALTH_TOOL.type}=${DueDateCalculatorType.ultrasound}`,
-                `${index$3.QUERY_HEALTH_TOOL.startDate}=${dayjs__default["default"](dateOfUltrasound).format(index$3.API_DATE_FORMAT)}`,
-                `${index$3.QUERY_HEALTH_TOOL.additional}=${additionalInfo}`,
+                `${index$4.QUERY_HEALTH_TOOL.type}=${DueDateCalculatorType.ultrasound}`,
+                `${index$4.QUERY_HEALTH_TOOL.startDate}=${dayjs__default["default"](dateOfUltrasound).format(index$4.API_DATE_FORMAT)}`,
+                `${index$4.QUERY_HEALTH_TOOL.additional}=${additionalInfo}`,
             ].join('&');
             onSubmit(getDueDateUltrasound(dateOfUltrasound, additionalInfo), redirectLink);
         }),
@@ -703,7 +703,7 @@ const SelectMethodItem = React.forwardRef((_a, ref) => {
             },
         }, className: "" }, rest),
         icon,
-        React__default["default"].createElement(index$5.Text, { size: "p4" }, label)));
+        React__default["default"].createElement(index$3.Text, { size: "p4" }, label)));
 });
 const DueDateForm = (_a) => {
     var { locale, formLayout = 'default', submitProps, currentUrl, isMobile, onSubmit } = _a, props = tslib_es6.__rest(_a, ["locale", "formLayout", "submitProps", "currentUrl", "isMobile", "onSubmit"]);
@@ -732,9 +732,9 @@ const DueDateForm = (_a) => {
         React__default["default"].createElement(index$1.HealthToolFormWrapper, Object.assign({ component: "div", formLayout: formLayout }, props),
             formLayout === 'default' ? (React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
                 React__default["default"].createElement(index$1.HealthToolFormWrapper.Control, null,
-                    React__default["default"].createElement(index$4.Select, { label: t('dueDatePage.calculationMethod'), value: String(calculatorType), data: calculatingMethods, itemComponent: SelectMethodItem, onChange: (v) => setCalculatorType(Number(v)), icon: selectedMethod === null || selectedMethod === void 0 ? void 0 : selectedMethod.icon })))) : (React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-                React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('dueDatePage.calculationMethod'), width: 300 },
-                    React__default["default"].createElement(index$4.Select, { value: String(calculatorType), data: calculatingMethods, itemComponent: SelectMethodItem, onChange: (v) => setCalculatorType(Number(v)) })))),
+                    React__default["default"].createElement(index$5.Select, { label: React__default["default"].createElement(index$3.Text, { size: "p2", weight: "semiBold" }, t('dueDatePage.calculationMethod')), value: String(calculatorType), data: calculatingMethods, itemComponent: SelectMethodItem, onChange: (v) => setCalculatorType(Number(v)), icon: selectedMethod === null || selectedMethod === void 0 ? void 0 : selectedMethod.icon })))) : (React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+                React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: React__default["default"].createElement(index$3.Text, { size: "p2", weight: "semiBold" }, t('dueDatePage.calculationMethod')), width: 300 },
+                    React__default["default"].createElement(index$5.Select, { value: String(calculatorType), data: calculatingMethods, itemComponent: SelectMethodItem, onChange: (v) => setCalculatorType(Number(v)) })))),
             React__default["default"].createElement(FormSwitcher, null))));
 };
 

package/build/{index-505a9dd0.js → index-689496bd.js}

@@ -1,8 +1,8 @@
 'use strict';
 
 var React = require('react');
-var index = require('./index-dde6d0e2.js');
-var index$1 = require('./index-69c08b9d.js');
+var index = require('./index-6c650ac4.js');
+var index$1 = require('./index-3e3c4e5c.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-f86c1758.js → index-6b3023a4.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index = require('./index-b0cf70f2.js');
+var index = require('./index-fef96902.js');
 var styled = require('@emotion/styled');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-dde6d0e2.js → index-6c650ac4.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var translationsContext = require('./translationsContext-339473e6.js');
+var translationsContext = require('./translationsContext-a5de37cf.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/build/{index-ce814d2c.js → index-7223368d.js}

@@ -1,8 +1,8 @@
 'use strict';
 
 var core = require('@mantine/core');
-var index$1 = require('./index-358695c8.js');
-var tslib_es6 = require('./tslib.es6-ebbd9505.js');
+var index$1 = require('./index-ebaf2c19.js');
+var tslib_es6 = require('./tslib.es6-7c7d06ab.js');
 var React = require('react');
 var hooks = require('@mantine/hooks');
 var react = require('@emotion/react');

package/build/{index-31908e9d.js → index-789d20a1.js}

@@ -2,24 +2,24 @@
 
 var React = require('react');
 var styled = require('@emotion/styled');
-var utils = require('./utils-53bab473.js');
+var utils = require('./utils-053ed913.js');
 var miscTheme = require('./miscTheme.js');
-var tslib_es6 = require('./tslib.es6-ebbd9505.js');
-var index = require('./index-1fb5da39.js');
-var index$1 = require('./index-0cf05697.js');
+var tslib_es6 = require('./tslib.es6-7c7d06ab.js');
+var index = require('./index-51161bde.js');
+var index$1 = require('./index-248ff166.js');
 require('@mantine/core');
 require('@mantine/dates');
-require('./index-65a18ef8.js');
-require('./index-1132d3eb.js');
-require('./index-bca13d95.js');
-require('./index-68040d4f.js');
-require('./index-0781219e.js');
-require('./index-b0cf70f2.js');
-require('./index-358695c8.js');
-require('./index.styles-afd04f10.js');
-require('./translationsContext-339473e6.js');
+require('./index-03e1d5fd.js');
+require('./index-1d68a820.js');
+require('./index-25007710.js');
+require('./index-65bc602a.js');
+require('./index-51229c6c.js');
+require('./index-fef96902.js');
+require('./index-ebaf2c19.js');
+require('./index.styles-2fc37e7a.js');
+require('./translationsContext-a5de37cf.js');
 require('@mantine/hooks');
-require('./index-f2faadcf.js');
+require('./index-93151a6e.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-5f30fd5e.js → index-79544fc5.js}

@@ -1,25 +1,26 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-ebbd9505.js');
+var tslib_es6 = require('./tslib.es6-7c7d06ab.js');
 var React = require('react');
 var core = require('@mantine/core');
 var form = require('@mantine/form');
-var index$3 = require('./index-0cf05697.js');
-var index$4 = require('./index-3b584311.js');
-var index$5 = require('./index-0781219e.js');
-require('./index-b0cf70f2.js');
-require('./index-358695c8.js');
-require('./index.styles-afd04f10.js');
-var index = require('./index-dde6d0e2.js');
+var index$3 = require('./index-248ff166.js');
+var index$5 = require('./index-afe5b4d7.js');
+var index$4 = require('./index-51229c6c.js');
+require('./index-fef96902.js');
+var miscTheme = require('./miscTheme.js');
+require('./index-ebaf2c19.js');
+require('./index.styles-2fc37e7a.js');
+var index = require('./index-6c650ac4.js');
 require('@mantine/hooks');
-require('./index-68040d4f.js');
-require('./utils-53bab473.js');
-require('./index-f2faadcf.js');
-var context = require('./context-a40dc8d5.js');
-var constants = require('./constants-b681b617.js');
-var index$1 = require('./index-9edd3345.js');
-var index$2 = require('./index-7f33513d.js');
-var Locale = require('./Locale-4f8c0874.js');
+require('./index-65bc602a.js');
+require('./utils-053ed913.js');
+require('./index-93151a6e.js');
+var context = require('./context-60530f29.js');
+var constants = require('./constants-63e847d3.js');
+var index$1 = require('./index-0cb74f84.js');
+var index$2 = require('./index-1240e733.js');
+var Locale = require('./Locale-a4854278.js');
 var other = require('@hhgtech/icons/other');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -28,25 +29,10 @@ var React__default = /*#__PURE__*/_interopDefault(React);
 
 const BabyGrowthFormContext = React.createContext({});
 
-var useStyles$1 = core.createStyles((theme) => {
-    return {
-        unit: {
-            color: theme.colors.gray[4],
-            fontWeight: 'normal',
-        },
-    };
-});
-
-const DefaultForm = (_a) => {
-    var { styles, classNames } = _a, props = tslib_es6.__rest(_a, ["styles", "classNames"]);
+const DefaultForm = (props) => {
     const { t, locale } = index.useTranslations();
     const { classes: wrapperClasses = {} } = React.useContext(context.CardWrapperContext);
     const { form, currentUrl, submitProps } = React.useContext(BabyGrowthFormContext);
-    const { classes } = useStyles$1(undefined, {
-        name: 'BabyGrowthForm__DefaultForm',
-        styles,
-        classNames,
-    });
     const commonDateProps = {
         placeholder: 'DD/MM/YYYY',
         popoverProps: {
@@ -62,46 +48,37 @@ const DefaultForm = (_a) => {
                     } }, form.getInputProps('gender'), { error: null }))),
             form.errors.gender && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.gender))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index$3.Input.Wrapper, { label: t('babyGrowth.input.birthday') },
-                React__default["default"].createElement(index$4.DatePicker, Object.assign({}, commonDateProps, { maxDate: new Date() }, form.getInputProps('birthday'), { error: null, onChange: (v) => {
+            React__default["default"].createElement(index$3.Input.Wrapper, { label: React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold" }, t('babyGrowth.input.birthday')) },
+                React__default["default"].createElement(index$5.DatePicker, Object.assign({}, commonDateProps, { maxDate: new Date() }, form.getInputProps('birthday'), { error: null, onChange: (v) => {
                         v && form.validateField('measurementDate');
                         form.getInputProps('birthday').onChange(v);
                     } }))),
             form.errors.birthday && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.birthday))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index$3.Input.Number, Object.assign({ label: React__default["default"].createElement(React__default["default"].Fragment, null,
+            React__default["default"].createElement(index$3.Input.Number, Object.assign({ label: React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold" },
                     t('babyGrowth.height'),
-                    React__default["default"].createElement("span", { className: classes.unit },
-                        "(",
-                        t('babyGrowth.cm'),
-                        ")")) }, form.getInputProps('height'), { placeholder: t('babyGrowth.height'), min: constants.INPUT_RANGE.height.min, max: constants.INPUT_RANGE.height.max, onChange: (v) => {
+                    React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold", color: miscTheme.theme.colors.gray300, as: "span" }, ` (${t('babyGrowth.cm')})`)) }, form.getInputProps('height'), { placeholder: t('babyGrowth.height'), min: constants.INPUT_RANGE.height.min, max: constants.INPUT_RANGE.height.max, onChange: (v) => {
                     form.setFieldValue('height', v);
                     form.setFieldValue('checkMesureVal', !form.values.checkMesureVal);
                 } }))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index$3.Input.Number, Object.assign({ label: React__default["default"].createElement(React__default["default"].Fragment, null,
+            React__default["default"].createElement(index$3.Input.Number, Object.assign({ label: React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold" },
                     t('babyGrowth.weight'),
-                    React__default["default"].createElement("span", { className: classes.unit },
-                        "(",
-                        t('babyGrowth.kg'),
-                        ")")) }, form.getInputProps('weight'), { placeholder: t('babyGrowth.weight'), min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max, onChange: (v) => {
+                    React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold", color: miscTheme.theme.colors.gray300, as: "span" }, ` (${t('babyGrowth.kg')})`)) }, form.getInputProps('weight'), { placeholder: t('babyGrowth.weight'), min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max, onChange: (v) => {
                     form.setFieldValue('weight', v);
                     form.setFieldValue('checkMesureVal', !form.values.checkMesureVal);
                 } }))),
         locale !== Locale.LOCALE.Vietnam && (React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index$3.Input.Number, Object.assign({ label: React__default["default"].createElement(React__default["default"].Fragment, null,
+            React__default["default"].createElement(index$3.Input.Number, Object.assign({ label: React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold" },
                     t('babyGrowth.head'),
-                    React__default["default"].createElement("span", { className: classes.unit },
-                        "(",
-                        t('babyGrowth.cm'),
-                        ")")) }, form.getInputProps('head'), { placeholder: t('babyGrowth.head'), onChange: (v) => {
+                    React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold", color: miscTheme.theme.colors.gray300, as: "span" }, ` (${t('babyGrowth.cm')})`)) }, form.getInputProps('head'), { placeholder: t('babyGrowth.head'), onChange: (v) => {
                     form.setFieldValue('head', v);
                     form.setFieldValue('checkMesureVal', !form.values.checkMesureVal);
                 } })))),
         form.errors.checkMesureVal && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.checkMesureVal)),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index$3.Input.Wrapper, { label: t('babyGrowth.input.measurementDate') },
-                React__default["default"].createElement(index$4.DatePicker, Object.assign({}, commonDateProps, { defaultValue: new Date() }, form.getInputProps('measurementDate'), { maxDate: new Date(), error: null }))),
+            React__default["default"].createElement(index$3.Input.Wrapper, { label: React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold" }, t('babyGrowth.input.measurementDate')) },
+                React__default["default"].createElement(index$5.DatePicker, Object.assign({}, commonDateProps, { defaultValue: new Date() }, form.getInputProps('measurementDate'), { maxDate: new Date(), error: null }))),
             form.errors.measurementDate && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.measurementDate))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, { className: wrapperClasses.submitWrapper },
             React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ className: wrapperClasses.submitBtn, type: "submit", "data-event-category": "Health Tool", "data-event-action": "Baby Growth", "data-event-label": currentUrl }, submitProps), t('babyGrowth.input.submit')))));
@@ -186,7 +163,7 @@ const InlineForm = (_a) => {
             form.errors.gender && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.gender))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
             React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('babyGrowth.input.birthday') },
-                React__default["default"].createElement(index$4.DatePicker, Object.assign({}, commonDateProps, { maxDate: new Date() }, form.getInputProps('birthday'), { error: null, onChange: (v) => {
+                React__default["default"].createElement(index$5.DatePicker, Object.assign({}, commonDateProps, { maxDate: new Date() }, form.getInputProps('birthday'), { error: null, onChange: (v) => {
                         v && form.validateField('measurementDate');
                         form.getInputProps('birthday').onChange(v);
                     } }))),
@@ -199,7 +176,7 @@ const InlineForm = (_a) => {
                         },
                     },
                 } },
-                React__default["default"].createElement(index$5.Text, { size: "p3" },
+                React__default["default"].createElement(index$4.Text, { size: "p3" },
                     React__default["default"].createElement("span", { className: classes.bmiVal }, form.getInputProps('height').value &&
                         form.getInputProps('weight').value &&
                         bmiCalculate(Number(form.getInputProps('height').value), Number(form.getInputProps('weight').value))),
@@ -222,7 +199,7 @@ const InlineForm = (_a) => {
             form.errors.checkMesureVal && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.checkMesureVal))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
             React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('babyGrowth.input.measurementDate') },
-                React__default["default"].createElement(index$4.DatePicker, Object.assign({}, commonDateProps, { maxDate: new Date() }, form.getInputProps('measurementDate'), { error: null }))),
+                React__default["default"].createElement(index$5.DatePicker, Object.assign({}, commonDateProps, { maxDate: new Date() }, form.getInputProps('measurementDate'), { error: null }))),
             form.errors.measurementDate && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.measurementDate))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, { className: wrapperClasses.submitWrapper },
             React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ type: "submit", "data-event-category": "Health Tool", "data-event-action": "Baby Growth", "data-event-label": currentUrl, className: core.clsx(classes.submitBtn, wrapperClasses.submitBtn) }, submitProps), t('babyGrowth.input.submit')))));
@@ -247,7 +224,7 @@ const MbLayout = (_a) => {
                     } }, form.getInputProps('gender'), { error: null }))),
             form.errors.gender && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.gender))),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderBoxControl, { label: t('babyGrowth.input.birthday'), rightSection: React__default["default"].createElement(other.CalendarMB, null) },
-            React__default["default"].createElement(index$4.DatePicker, Object.assign({}, commonDateProps, { maxDate: new Date() }, form.getInputProps('birthday'), { error: null, rightSection: null, onChange: (v) => {
+            React__default["default"].createElement(index$5.DatePicker, Object.assign({}, commonDateProps, { maxDate: new Date() }, form.getInputProps('birthday'), { error: null, rightSection: null, onChange: (v) => {
                     v && form.validateField('measurementDate');
                     form.getInputProps('birthday').onChange(v);
                 } }))),
@@ -278,7 +255,7 @@ const MbLayout = (_a) => {
         form.errors.checkMesureVal && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.checkMesureVal)),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderBoxControl, { label: t('babyGrowth.input.measurementDate'), rightSection: React__default["default"].createElement(other.CalendarMB, null) },
             React__default["default"].createElement(index$3.Input.Wrapper, null,
-                React__default["default"].createElement(index$4.DatePicker, Object.assign({}, commonDateProps, { defaultValue: new Date() }, form.getInputProps('measurementDate'), { maxDate: new Date(), rightSection: null, error: null })))),
+                React__default["default"].createElement(index$5.DatePicker, Object.assign({}, commonDateProps, { defaultValue: new Date() }, form.getInputProps('measurementDate'), { maxDate: new Date(), rightSection: null, error: null })))),
         form.errors.measurementDate && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.measurementDate)),
         React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ type: "submit", "data-event-category": "Health Tool", "data-event-action": "Baby Growth", "data-event-label": currentUrl }, submitProps), t('babyGrowth.input.submit'))));
 };

package/build/{index-ec20f28b.js → index-7dca6243.js}

@@ -1,22 +1,22 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-ebbd9505.js');
+var tslib_es6 = require('./tslib.es6-7c7d06ab.js');
 var React = require('react');
-require('./index-0cf05697.js');
+require('./index-248ff166.js');
 require('@mantine/core');
 require('@mantine/dates');
-require('./index-65a18ef8.js');
-require('./index-1132d3eb.js');
-require('./index-bca13d95.js');
-require('./index-68040d4f.js');
-var index = require('./index-0781219e.js');
-require('./index-b0cf70f2.js');
-require('./index-358695c8.js');
-require('./index.styles-afd04f10.js');
-require('./translationsContext-339473e6.js');
+require('./index-03e1d5fd.js');
+require('./index-1d68a820.js');
+require('./index-25007710.js');
+require('./index-65bc602a.js');
+var index = require('./index-51229c6c.js');
+require('./index-fef96902.js');
+require('./index-ebaf2c19.js');
+require('./index.styles-2fc37e7a.js');
+require('./translationsContext-a5de37cf.js');
 require('@mantine/hooks');
-require('./utils-53bab473.js');
-require('./index-f2faadcf.js');
+require('./utils-053ed913.js');
+require('./index-93151a6e.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-e170231e.js → index-8474f1a3.js}

@@ -1,8 +1,8 @@
 'use strict';
 
 var React = require('react');
-var index$1 = require('./index-69c08b9d.js');
-var index = require('./index-dde6d0e2.js');
+var index$1 = require('./index-3e3c4e5c.js');
+var index = require('./index-6c650ac4.js');
 var react = require('@emotion/react');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');