@hhgtech/hhg-components 1.29.500-beta-9 → 1.29.500-beta-10

package/build/index-8a756da2.js

@@ -0,0 +1,253 @@
+'use strict';
+
+var tslib_es6 = require('./tslib.es6-714cb8a9.js');
+var React = require('react');
+var reactHookForm = require('react-hook-form');
+var useHealthToolCache = require('./useHealthToolCache-31f25f39.js');
+var constants = require('./constants-2747b802.js');
+var core = require('@mantine/core');
+var index$2 = require('./index-cb736d4d.js');
+var index$3 = require('./index-a0fec7e6.js');
+require('@mantine/dates');
+require('./index-3abd018e.js');
+require('./index-591e35ce.js');
+require('./index-2c968a63.js');
+require('./index-f091f440.js');
+var index$4 = require('./index-ebfbd780.js');
+require('./index-29ae9f83.js');
+require('./index-9f274013.js');
+require('./index.styles-3cd8dfb5.js');
+var index = require('./index-f1ecf8cd.js');
+require('@mantine/hooks');
+require('./utils-90d97728.js');
+require('./index-ccd59c12.js');
+var index$1 = require('./index-c482bde7.js');
+var context = require('./context-ef7cd567.js');
+var Locale = require('./Locale-7aec2363.js');
+var constantsDomainLocales = require('./constantsDomainLocales.js');
+var embeddedHeathToolCards_helpers = require('./embeddedHeathToolCards_helpers.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const BmiFormContext = React.createContext({});
+
+const DefaultForm = (props) => {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const { t, locale } = index.useTranslations();
+    const { classes: cardWrapperClasses = {} } = React.useContext(context.CardWrapperContext);
+    const { control, bmiGenerated, isTouched, linkTool, submitProps, withAdditionalQuestion, classes: formWrapperClasses = {}, } = React.useContext(BmiFormContext);
+    const radioStyle = {
+        body: {
+            alignItems: 'center',
+        },
+    };
+    return (React__default["default"].createElement(index$1.HealthToolFormWrapper, Object.assign({ formLayout: "default" }, props),
+        React__default["default"].createElement(core.Grid, { gutter: 4, px: 16 },
+            React__default["default"].createElement(core.Grid.Col, { span: 12 },
+                React__default["default"].createElement(reactHookForm.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["default"].createElement(index$2.GenderOptionControl, { error: isTouched ? error === null || error === void 0 ? void 0 : error.message : '', onChange: onChange }));
+                    } })),
+            React__default["default"].createElement(core.Grid.Col, { span: 12 },
+                React__default["default"].createElement(reactHookForm.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["default"].createElement(index$3.Input.Number, { label: React__default["default"].createElement(index$4.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["default"].createElement(core.Grid.Col, { span: 12 },
+                React__default["default"].createElement(core.Grid, { gutter: 8 },
+                    React__default["default"].createElement(core.Grid.Col, { span: 6 },
+                        React__default["default"].createElement(reactHookForm.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["default"].createElement(index$3.Input.Number, { label: React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold" }, t('bmi.heightInput')), rightSection: t('bmi.heightInput.desc'), placeholder: t('tools.inputPlaceholder', {
+                                        content: locale === 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["default"].createElement(core.Grid.Col, { span: 6 },
+                        React__default["default"].createElement(reactHookForm.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["default"].createElement(index$3.Input.Number, { label: React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold" }, t('bmi.weightInput')), rightSection: t('bmi.weightInput.desc'), placeholder: t('tools.inputPlaceholder', {
+                                        content: locale === 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["default"].createElement(React__default["default"].Fragment, null,
+            React__default["default"].createElement(core.Grid, { gutter: 4, px: 16 },
+                React__default["default"].createElement(core.Grid.Col, null,
+                    React__default["default"].createElement(reactHookForm.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["default"].createElement(index$3.Radio.Group, { name: name, value: value, onChange: onChange, sx: { flex: 1 }, label: React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold", span: true }, t('bmi.question.weightLossSupport')), size: "lg", error: isTouched ? React__default["default"].createElement(index$3.ErrorLabel, { label: error === null || error === void 0 ? void 0 : error.message }) : '' },
+                                React__default["default"].createElement(core.Flex, { gap: "lg" },
+                                    React__default["default"].createElement(index$3.Radio, { size: "sm", value: "1", label: React__default["default"].createElement(index$4.Text, { size: "p2" }, t('switchBtn.yes')), styles: radioStyle }),
+                                    React__default["default"].createElement(index$3.Radio, { size: "sm", value: "0", label: React__default["default"].createElement(index$4.Text, { size: "p2" }, t('switchBtn.no')), styles: radioStyle }))));
+                        } })),
+                React__default["default"].createElement(core.Grid.Col, null,
+                    React__default["default"].createElement(reactHookForm.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["default"].createElement(index$3.Radio.Group, { name: name, value: value, onChange: onChange, sx: { flex: 1 }, label: React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold", span: true }, t('bmi.question.glp1Awareness')), size: "lg", description: locale !== Locale.LOCALE.Malaysia && (React__default["default"].createElement(index$4.Text, { style: { fontSize: '10px' }, span: true }, t('bmi.question.glp1Awareness.desc'))), error: isTouched ? React__default["default"].createElement(index$3.ErrorLabel, { label: error === null || error === void 0 ? void 0 : error.message }) : '' },
+                                React__default["default"].createElement(core.Flex, { gap: "lg" },
+                                    React__default["default"].createElement(index$3.Radio, { size: "sm", value: "1", label: React__default["default"].createElement(index$4.Text, { size: "p2" }, t('switchBtn.yes')), styles: radioStyle }),
+                                    React__default["default"].createElement(index$3.Radio, { size: "sm", value: "0", label: React__default["default"].createElement(index$4.Text, { size: "p2" }, t('switchBtn.no')), styles: radioStyle }))));
+                        } }))),
+            React__default["default"].createElement(core.Box, { className: core.clsx(formWrapperClasses.newsletterBlock, cardWrapperClasses.newsletterBlock) },
+                React__default["default"].createElement(core.Grid, { gutter: 8, px: 16, py: 12 },
+                    React__default["default"].createElement(core.Grid.Col, null,
+                        React__default["default"].createElement(reactHookForm.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 = tslib_es6.__rest(_b, ["value", "onChange", "name"]);
+                                return (React__default["default"].createElement(index$3.Checkbox, Object.assign({ size: "sm", label: React__default["default"].createElement(index$4.Text, { size: "p2" }, t('bmi.newsletter.label')), onChange: (e) => onChange(e.currentTarget.checked), name: name, checked: !!value }, field)));
+                            } })),
+                    React__default["default"].createElement(core.Grid.Col, null,
+                        React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ className: "bmi-btn bmi--btn-submit", dataEventCategory: "Health Tool", dataEventAction: "BMI", dataEventLabel: `https://${constantsDomainLocales.domainLocales[locale]}/${linkTool}`, type: "submit", fullWidth: true }, submitProps), t('bmi.submit'))))))) : (React__default["default"].createElement(core.Box, { px: 16, sx: { paddingBottom: 8 } },
+            React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ className: "bmi-btn bmi--btn-submit", dataEventCategory: "Health Tool", dataEventAction: "BMI", dataEventLabel: `https://${constantsDomainLocales.domainLocales[locale]}/${linkTool}`, type: "submit", fullWidth: true }, submitProps), t('bmi.submit'))))));
+};
+
+var useStyles = core.createStyles((theme) => {
+    return {
+        newsletterBlock: {
+            backgroundColor: theme.colors.neutral[0],
+            borderBottomLeftRadius: 'inherit',
+            borderBottomRightRadius: 'inherit',
+            '.bmi-btn': {
+                marginTop: 0,
+            },
+        },
+        inputRightSection: {
+            fontSize: core.rem(13),
+            lineHeight: core.rem(24),
+            color: theme.colors.gray[4],
+            justifyContent: 'flex-end',
+            paddingRight: 8,
+        },
+    };
+});
+
+const InlineForm = (props) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
+    const { t, locale } = index.useTranslations();
+    const { control, bmiGenerated, isTouched, linkTool, submitProps, withAdditionalQuestion, } = React.useContext(BmiFormContext);
+    const { classes: wrapperClasses = {}, variant: cardWrapperVariant } = React.useContext(context.CardWrapperContext);
+    const { classes: formWrapperClasses = {} } = React.useContext(BmiFormContext);
+    return (React__default["default"].createElement(index$1.HealthToolFormWrapper, Object.assign({ formLayout: "inline" }, props),
+        React__default["default"].createElement(reactHookForm.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["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+                    React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('tools.selectGender'), width: 'none', errorMess: isTouched && (error === null || error === void 0 ? void 0 : error.message) },
+                        React__default["default"].createElement(index$2.GenderOptionControl, { type: "radio", hideLabel: true, error: isTouched ? React__default["default"].createElement(React__default["default"].Fragment, null) : '', onChange: onChange }))));
+            } }),
+        React__default["default"].createElement(reactHookForm.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["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+                    React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('bmi.ageInput'), errorMess: isTouched && (error === null || error === void 0 ? void 0 : error.message) },
+                        React__default["default"].createElement(index$3.Input.Number, { placeholder: t('tools.inputPlaceholder', {
+                                content: '25',
+                            }), name: name, value: value, onChange: onChange, error: isTouched && (error === null || error === void 0 ? void 0 : error.message) ? React__default["default"].createElement(React__default["default"].Fragment, null) : '', min: 0, rightSection: React__default["default"].createElement(index$1.HealthToolFormWrapper.Unit, null, t('tools.yearsOld')), styles: () => ({
+                                rightSection: {
+                                    width: 'auto',
+                                },
+                            }) }))));
+            } }),
+        React__default["default"].createElement(reactHookForm.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["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+                    React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('bmi.heightInput'), errorMess: isTouched && (error === null || error === void 0 ? void 0 : error.message) },
+                        React__default["default"].createElement(index$3.Input.Number, { placeholder: t('tools.inputPlaceholder', {
+                                content: locale === Locale.LOCALE.Myanmar ? 6 : 170,
+                            }), name: name, value: value, onChange: onChange, min: 0, error: isTouched && (error === null || error === void 0 ? void 0 : error.message) ? React__default["default"].createElement(React__default["default"].Fragment, null) : '', rightSection: React__default["default"].createElement(index$1.HealthToolFormWrapper.Unit, null, t('bmi.heightInput.desc')) }))));
+            } }),
+        React__default["default"].createElement(reactHookForm.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["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+                    React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('bmi.weightInput'), errorMess: isTouched && (error === null || error === void 0 ? void 0 : error.message) },
+                        React__default["default"].createElement(index$3.Input.Number, { placeholder: t('tools.inputPlaceholder', {
+                                content: locale === Locale.LOCALE.Myanmar ? 130 : 60,
+                            }), name: name, value: value, onChange: onChange, error: isTouched && (error === null || error === void 0 ? void 0 : error.message) ? React__default["default"].createElement(React__default["default"].Fragment, null) : '', precision: 1, min: 0, rightSection: React__default["default"].createElement(index$1.HealthToolFormWrapper.Unit, null, t('bmi.weightInput.desc')) }))));
+            } }),
+        withAdditionalQuestion ? (React__default["default"].createElement(React__default["default"].Fragment, null,
+            React__default["default"].createElement(reactHookForm.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["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+                        React__default["default"].createElement(index$3.Radio.Group, { name: name, value: value, onChange: onChange, sx: { flex: 1 }, label: React__default["default"].createElement(index$4.Text, { size: "s4", weight: "semiBold", span: true }, t('bmi.question.weightLossSupport')), size: "lg" },
+                            React__default["default"].createElement(core.Flex, { gap: "lg", sx: { paddingTop: core.rem(8) } },
+                                React__default["default"].createElement(index$3.Radio, { size: "sm", value: "1", label: t('switchBtn.yes') }),
+                                React__default["default"].createElement(index$3.Radio, { size: "sm", value: "0", label: t('switchBtn.no') }))),
+                        isTouched && (error === null || error === void 0 ? void 0 : error.message) && (React__default["default"].createElement(index$3.ErrorLabel, { label: error.message, textProps: {
+                                size: 'p4',
+                            }, sx: { marginTop: 6 } }))));
+                } }),
+            React__default["default"].createElement(reactHookForm.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["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+                        React__default["default"].createElement(index$3.Radio.Group, { name: name, value: value, onChange: onChange, sx: { flex: 1 }, label: React__default["default"].createElement(index$4.Text, { size: "s4", weight: "semiBold", span: true }, t('bmi.question.glp1Awareness')), size: "lg", description: locale !== Locale.LOCALE.Malaysia && (React__default["default"].createElement(index$4.Text, { style: { fontSize: '10px' }, span: true }, t('bmi.question.glp1Awareness.desc'))) },
+                            React__default["default"].createElement(core.Flex, { gap: "lg", sx: { paddingTop: core.rem(8) } },
+                                React__default["default"].createElement(index$3.Radio, { size: "sm", value: "1", label: t('switchBtn.yes') }),
+                                React__default["default"].createElement(index$3.Radio, { size: "sm", value: "0", label: t('switchBtn.no') }))),
+                        isTouched && (error === null || error === void 0 ? void 0 : error.message) && (React__default["default"].createElement(index$3.ErrorLabel, { label: error.message, textProps: {
+                                size: 'p4',
+                            }, sx: { marginTop: 6 } }))));
+                } }),
+            cardWrapperVariant === 'gray' || cardWrapperVariant === 'violet' ? (React__default["default"].createElement(React__default["default"].Fragment, null,
+                React__default["default"].createElement(reactHookForm.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 = tslib_es6.__rest(_b, ["value", "onChange", "name"]);
+                        return (React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+                            React__default["default"].createElement(index$3.Checkbox, Object.assign({ size: "sm", label: React__default["default"].createElement(index$4.Text, { size: "p3" }, t('bmi.newsletter.label')), onChange: (e) => onChange(e.currentTarget.checked), name: name, checked: !!value }, field))));
+                    } }),
+                React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, { className: core.clsx(wrapperClasses.submitWrapper) },
+                    React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ className: core.clsx('bmi-btn bmi--btn-submit', wrapperClasses.submitBtn), dataEventCategory: "Health Tool", dataEventAction: "BMI", dataEventLabel: `https://${constantsDomainLocales.domainLocales[locale]}/${linkTool}`, type: "submit" }, submitProps), t('bmi.submit'))))) : (React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, { py: 16, className: core.clsx(formWrapperClasses.newsletterBlock, wrapperClasses.newsletterBlock) },
+                React__default["default"].createElement(core.Stack, { spacing: 16 },
+                    React__default["default"].createElement(reactHookForm.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 = tslib_es6.__rest(_b, ["value", "onChange", "name"]);
+                            return (React__default["default"].createElement(index$3.Checkbox, Object.assign({ size: "sm", label: React__default["default"].createElement(index$4.Text, { size: "p3" }, t('bmi.newsletter.label')), onChange: (e) => onChange(e.currentTarget.checked), name: name, checked: !!value }, field)));
+                        } }),
+                    React__default["default"].createElement(core.Box, { className: core.clsx(wrapperClasses.submitWrapper) },
+                        React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ className: core.clsx('bmi-btn bmi--btn-submit', wrapperClasses.submitBtn), dataEventCategory: "Health Tool", dataEventAction: "BMI", dataEventLabel: `https://${constantsDomainLocales.domainLocales[locale]}/${linkTool}`, type: "submit" }, submitProps), t('bmi.submit')))))))) : (React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, { className: core.clsx(wrapperClasses.submitWrapper) },
+            React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ className: "bmi-btn bmi--btn-submit", dataEventCategory: "Health Tool", dataEventAction: "BMI", dataEventLabel: `https://${constantsDomainLocales.domainLocales[locale]}/${linkTool}`, type: "submit" }, submitProps), t('bmi.submit'))))));
+};
+
+const BmiForm = (_a) => {
+    var { value: valueProps, onChange: onChangeProps, onSubmit: onSubmitProps, bmiGenerated, bmiUnit, formLayout = 'default', submitProps, withAdditionalQuestion } = _a, rest = tslib_es6.__rest(_a, ["value", "onChange", "onSubmit", "bmiGenerated", "bmiUnit", "formLayout", "submitProps", "withAdditionalQuestion"]);
+    const { classes } = useStyles(undefined, { name: 'BmiForm' });
+    const [isTouched, setIsTouched] = React.useState(false);
+    const { control, handleSubmit, setValue, watch } = reactHookForm.useForm({
+        defaultValues: {
+            question1: undefined,
+            question2: undefined,
+            newsletter: true,
+        },
+    });
+    const data = watch();
+    const { locale } = index.useTranslations();
+    const { getHealthToolLink } = useHealthToolCache.useHealthToolsCache(locale);
+    const linkTool = React.useMemo(() => getHealthToolLink(constants.HEALTH_TOOL_TYPE.OVULATION), [getHealthToolLink]);
+    const onValid = (data) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
+        const height = bmiUnit.heightConvert(data.height);
+        const weight = bmiUnit.weightConvert(data.weight);
+        const submitValue = Object.assign(Object.assign({}, data), { height,
+            weight, bmi: embeddedHeathToolCards_helpers.getBmi({ height, weight }) });
+        onInValid();
+        onSubmitProps && onSubmitProps(submitValue);
+    });
+    const onInValid = () => {
+        setIsTouched(true);
+    };
+    React.useEffect(() => {
+        Object.keys(valueProps || {}).forEach((k) => {
+            const key = k;
+            setValue(key, valueProps === null || valueProps === void 0 ? void 0 : valueProps[key], {
+                shouldTouch: false,
+                shouldDirty: false,
+                shouldValidate: false,
+            });
+        });
+    }, [valueProps]);
+    React.useEffect(() => {
+        onChangeProps && onChangeProps(data);
+    }, [data]);
+    const commonProps = Object.assign({ onSubmit: handleSubmit(onValid, onInValid) }, rest);
+    return (React__default["default"].createElement(BmiFormContext.Provider, { value: {
+            control,
+            bmiGenerated,
+            isTouched,
+            linkTool,
+            submitProps,
+            withAdditionalQuestion,
+            classes,
+        } }, formLayout === 'inline' ? (React__default["default"].createElement(InlineForm, Object.assign({}, commonProps))) : (React__default["default"].createElement(DefaultForm, Object.assign({}, commonProps)))));
+};
+
+exports.BmiForm = BmiForm;

package/build/{index-8381eded.js → index-93a42da8.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-var index$1 = require('./index-95571511.js');
-var index$2 = require('./index-01e79c0b.js');
-var index = require('./index-e00b40d5.js');
+var index$1 = require('./index-fb5c5220.js');
+var index$2 = require('./index-3abd018e.js');
+var index = require('./index-591e35ce.js');
 var Cookies = require('js-cookie');
 var uuid = require('uuid');
 var constantsIsProduction = require('./constantsIsProduction.js');

package/build/{index-493a1828.js → index-9775e993.js}

@@ -1,11 +1,11 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-321f73c9.js');
+var tslib_es6 = require('./tslib.es6-714cb8a9.js');
 var React = require('react');
 var core = require('@mantine/core');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
-var utils = require('./utils-e4cd2bef.js');
+var utils = require('./utils-90d97728.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-87f9757a.js → index-9986170c.js}

@@ -1,9 +1,9 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-321f73c9.js');
+var tslib_es6 = require('./tslib.es6-714cb8a9.js');
 var React = require('react');
 var core = require('@mantine/core');
-var index = require('./index-390f46e0.js');
+var index = require('./index-ebfbd780.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-969a9e5d.js → index-9ac92d53.js}

@@ -1,10 +1,10 @@
 'use strict';
 
 var React = require('react');
-var useScrollbarSize = require('./useScrollbarSize-61d98db6.js');
+var useScrollbarSize = require('./useScrollbarSize-13e2cc25.js');
 var ReactDOM = require('react-dom');
 var styled = require('@emotion/styled');
-var utils = require('./utils-e4cd2bef.js');
+var utils = require('./utils-90d97728.js');
 var miscDefaultClassWrapper = require('./miscDefaultClassWrapper.js');
 var miscTheme = require('./miscTheme.js');
 

package/build/{index-2906a899.js → index-a0fec7e6.js}

@@ -1,26 +1,25 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-321f73c9.js');
+var tslib_es6 = require('./tslib.es6-714cb8a9.js');
 var React = require('react');
 var other = require('@hhgtech/icons/other');
 var core = require('@mantine/core');
 var hooks = require('@mantine/hooks');
-var index$1 = require('./index-fc646808.js');
-var index = require('./index-dfb7a2bc.js');
-var index$3 = require('./index-38321771.js');
+var index$1 = require('./index-2c968a63.js');
+var index = require('./index-9f274013.js');
+var index$3 = require('./index-49cde047.js');
 var styled = require('@emotion/styled');
 var carousel = require('@mantine/carousel');
-var index$2 = require('./index-390f46e0.js');
-var index$4 = require('./index-4ce2d652.js');
+var index$2 = require('./index-ebfbd780.js');
+var index$4 = require('./index-f091f440.js');
 var miscTheme = require('./miscTheme.js');
-var shared = require('./shared-c5d33cd8.js');
 var classNames = require('classnames');
 var uuid = require('uuid');
-var useUniqueId = require('./useUniqueId-81ff17fc.js');
+var useUniqueId = require('./useUniqueId-05b9a5d0.js');
 var constantsSite = require('./constantsSite.js');
 var react = require('@emotion/react');
 var core$1 = require('@hhgtech/icons/core');
-var index$5 = require('./index-1b7800fb.js');
+var index$5 = require('./index-29ae9f83.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -348,96 +347,16 @@ const FileInput = (props) => {
     return React__namespace["default"].createElement(core.FileInput, Object.assign({ size: "md" }, props));
 };
 
-const sizeMap = {
-    lg: {
-        height: 48,
-        fontSize: core.rem(16),
-        lineHeight: '24px',
-    },
-    md: {
-        height: 40,
-        fontSize: core.rem(14),
-        lineHeight: '22px',
-    },
-    sm: {
-        height: 32,
-        fontSize: core.rem(14),
-        lineHeight: '22px',
-    },
-    xs: {
-        height: 32,
-        fontSize: core.rem(13),
-        lineHeight: core.rem(20),
-        letterSpacing: '-0.3px',
-    },
-};
-var useStyles$1 = core.createStyles((theme, { variantStyle, size, }) => {
+var useStyles$1 = core.createStyles((theme, { variantStyle }) => {
     const isLeadgenStyle = variantStyle === index.CustomStylesType.LEADGEN;
-    const base = sizeMap[size] || {};
-    const leadgenPatch = isLeadgenStyle
-        ? size === 'sm'
-            ? { height: 36, fontSize: core.rem(13), letterSpacing: '-0.3px' }
-            : { fontSize: core.rem(15), letterSpacing: '-0.3px' }
-        : {};
-    // const commonStyle = {
-    //   fontSize: rem(15),
-    //   lineHeight: rem(24),
-    //   letterSpacing: '-0.3px',
-    //   color: theme.colors.gray[4],
-    // }
+    const commonStyle = {
+        fontSize: core.rem(15),
+        lineHeight: core.rem(24),
+        letterSpacing: '-0.3px',
+        color: theme.colors.gray[4],
+    };
     return {
-        input: {
-            border: `1px solid ${theme.colors.gray[2]}`,
-            transition: `all ${shared.ANIMATION_DURATION} ease-in-out`,
-            ['&:not(.mantine-Textarea-input)']: Object.assign(Object.assign({ minHeight: 'unset' }, base), leadgenPatch),
-            '&:hover': {
-                border: `1px solid ${theme.fn.primaryColor()}`,
-                // boxShadow: `0 0 2px 2px ${theme.colors.primary200}`,
-            },
-            '&:focus': {
-                boxShadow: `0px 0px 0px 2px ${theme.colors[theme.primaryColor][2]}`,
-            },
-            '&[data-invalid="true"]': {
-                border: `1px solid ${theme.colors.red600}`,
-                color: '#000',
-            },
-            // ...(isLeadgenStyle && {
-            //   ...commonStyle,
-            //   color: '#111111',
-            //   paddingLeft: 16,
-            //   paddingRight: 16,
-            //   '&::placeholder': {
-            //     ...commonStyle,
-            //     color: theme.colors.gray[4],
-            //   },
-            // }),
-        },
-        rightSection: Object.assign({ color: theme.colors.gray[4] }, (() => {
-            switch (size) {
-                case 'lg':
-                    return Object.assign({ fontSize: core.rem(16) }, (isLeadgenStyle && {
-                        fontSize: core.rem(15),
-                    }));
-                case 'md':
-                    return Object.assign({ fontSize: core.rem(14) }, (isLeadgenStyle && {
-                        fontSize: core.rem(15),
-                        letterSpacing: '-0.3px',
-                    }));
-                case 'sm':
-                    return Object.assign({ height: 32, fontSize: core.rem(14), lineHeight: '22px' }, (isLeadgenStyle && {
-                        height: 36,
-                        fontSize: core.rem(13),
-                        letterSpacing: '-0.3px',
-                    }));
-                case 'xs':
-                    return {
-                        height: 32,
-                        lineHeight: core.rem(20),
-                        fontSize: core.rem(13),
-                        letterSpacing: '-0.3px',
-                    };
-            }
-        })()),
+        input: Object.assign({}, (isLeadgenStyle && Object.assign(Object.assign({}, commonStyle), { color: '#111111', paddingLeft: 16, paddingRight: 16, '&::placeholder': Object.assign(Object.assign({}, commonStyle), { color: theme.colors.gray[4] }) }))),
     };
 });
 
@@ -448,25 +367,20 @@ const emotionCache = core.createEmotionCache({
 });
 
 const NumberInput = (_a) => {
-    var { value: _value, onChange: _onChange, size = 'md', styles, classNames } = _a, props = tslib_es6.__rest(_a, ["value", "onChange", "size", "styles", "classNames"]);
+    var { value: _value, onChange: _onChange } = _a, props = tslib_es6.__rest(_a, ["value", "onChange"]);
     const [value, setValue] = React.useState(_value);
     const [debounced] = hooks.useDebouncedValue(value, DEBOUNCED_TIME);
-    const variantStyle = index.useTemplateVariant();
-    const { classes } = useStyles$1({ variantStyle, size }, { name: 'MantineInput', styles, classNames });
     React.useEffect(() => {
         _onChange === null || _onChange === void 0 ? void 0 : _onChange(debounced);
     }, [debounced]);
     React.useEffect(() => {
         setValue(_value);
     }, [_value]);
-    return (React__namespace["default"].createElement(core.NumberInput, Object.assign({ stepHoldDelay: 500, stepHoldInterval: (t) => Math.max(1000 / Math.pow(t, 2), 25), onChange: setValue, hideControls: true, min: 0, formatter: (value) => {
+    return (React__namespace["default"].createElement(core.NumberInput, Object.assign({ size: "md", stepHoldDelay: 500, stepHoldInterval: (t) => Math.max(1000 / Math.pow(t, 2), 25), onChange: setValue, hideControls: true, min: 0, formatter: (value) => {
             if (Number(value) === 0)
                 return value;
             return value || '';
-        }, removeTrailingZeros: true, value: value }, props, { size: size, classNames: {
-            input: classes.input,
-            rightSection: classes.rightSection,
-        } })));
+        }, removeTrailingZeros: true, value: value }, props)));
 };
 
 const EyeVisible = index$1.CommonGAssets.getAssetPath('EyeVisible.svg');
@@ -860,9 +774,9 @@ FloatingLabelControl.Control = FloatingLabelControlControl;
 FloatingLabelControl.Icon = FloatingLabelControlIcon;
 
 const InputWrapper = React.forwardRef((_a, ref) => {
-    var { label, value: _value, onChange: _onChange, onChangeRaw, maxLength, withFloatingLabel, styles, error, size = 'md' } = _a, props = tslib_es6.__rest(_a, ["label", "value", "onChange", "onChangeRaw", "maxLength", "withFloatingLabel", "styles", "error", "size"]);
+    var { label, value: _value, onChange: _onChange, onChangeRaw, maxLength, withFloatingLabel, styles, error } = _a, props = tslib_es6.__rest(_a, ["label", "value", "onChange", "onChangeRaw", "maxLength", "withFloatingLabel", "styles", "error"]);
     const variantStyle = index.useTemplateVariant();
-    const { classes } = useStyles$1({ variantStyle, size }, { name: 'MantineInput', styles });
+    const { classes } = useStyles$1({ variantStyle }, { name: 'MantineInput', styles });
     const [value, setValue] = React.useState(_value || '');
     const [debounced] = hooks.useDebouncedValue(value, DEBOUNCED_TIME);
     React.useEffect(() => {
@@ -873,9 +787,7 @@ const InputWrapper = React.forwardRef((_a, ref) => {
     }, [_value]);
     const commonProps = Object.assign(Object.assign({ classNames: {
             input: classes.input,
-            rightSection: classes.rightSection,
-        }, ref,
-        size, onChange: (event) => {
+        }, ref, size: 'md', onChange: (event) => {
             if (typeof maxLength === 'number' &&
                 event.currentTarget.value.length > maxLength) {
                 return;
@@ -887,11 +799,15 @@ const InputWrapper = React.forwardRef((_a, ref) => {
         error }, props), { maxLength, className: `input-control ${(props === null || props === void 0 ? void 0 : props.className) || ''}` });
     if (withFloatingLabel) {
         return (React__namespace["default"].createElement(FloatingLabelControl, { shrink: !!value },
-            React__namespace["default"].createElement(FloatingLabelControl.Control, null, ({ shrink }) => (React__namespace["default"].createElement(core.TextInput, Object.assign({}, commonProps, { error: error && React__namespace["default"].createElement(ErrorLabel, { label: String(error) }), inputWrapperOrder: ['label', 'input', 'description', 'error'], label: React__namespace["default"].createElement(index$2.Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), styles: (theme) => ({
+            React__namespace["default"].createElement(FloatingLabelControl.Control, null, ({ shrink }) => (React__namespace["default"].createElement(core.TextInput, Object.assign({}, commonProps, { classNames: {
+                    input: classes.input,
+                }, error: error && React__namespace["default"].createElement(ErrorLabel, { label: String(error) }), inputWrapperOrder: ['label', 'input', 'description', 'error'], label: React__namespace["default"].createElement(index$2.Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), styles: (theme) => ({
                     input: Object.assign(Object.assign({}, index.GlobalTextStyleNew(theme)[index.CustomStylesType.LEADGEN].p2), { color: theme.colors.gray[9], fontWeight: index.FontWeight.halfBold }),
                 }) }))))));
     }
-    return React__namespace["default"].createElement(core.TextInput, Object.assign({}, commonProps));
+    return (React__namespace["default"].createElement(core.TextInput, Object.assign({}, commonProps, { classNames: {
+            input: classes.input,
+        } })));
 });
 const Input = InputWrapper;
 Input.File = FileInput;

package/build/{index-4cd78b0b.js → index-a9af8fce.js}

@@ -1,14 +1,14 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-321f73c9.js');
+var tslib_es6 = require('./tslib.es6-714cb8a9.js');
 var React = require('react');
-var index = require('./index-db93505d.js');
+var index = require('./index-f1ecf8cd.js');
 var core = require('@mantine/core');
-var paths = require('./paths-818ff2cf.js');
-var constants = require('./constants-665c375d.js');
-var index$1 = require('./index-1b7800fb.js');
-require('./index-01e79c0b.js');
-var togetherComponentGlobalContext = require('./utils-8b6dd0c4.js');
+var paths = require('./paths-35a68135.js');
+var constants = require('./constants-5dba82fb.js');
+var index$1 = require('./index-29ae9f83.js');
+require('./index-3abd018e.js');
+var togetherComponentGlobalContext = require('./utils-fbab8787.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 var constantsIsProduction = require('./constantsIsProduction.js');
 

package/build/{index-c73f057f.js → index-aa5168e1.js}

@@ -2,7 +2,7 @@
 
 var React = require('react');
 var styled = require('@emotion/styled');
-var index = require('./index-493a1828.js');
+var index = require('./index-9775e993.js');
 var miscTheme = require('./miscTheme.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-3c5034dd.js → index-b4dfab42.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-321f73c9.js');
+var tslib_es6 = require('./tslib.es6-714cb8a9.js');
 var React = require('react');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');

package/build/{index-a7ffd40f.js → index-b5025dd1.js}

@@ -1,28 +1,28 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-321f73c9.js');
+var tslib_es6 = require('./tslib.es6-714cb8a9.js');
 var React = require('react');
 var core = require('@mantine/core');
 var form = require('@mantine/form');
-var useHealthToolCache = require('./useHealthToolCache-7657d6ab.js');
-var index = require('./index-db93505d.js');
-var constants$1 = require('./constants-bfd5b250.js');
-var index$2 = require('./index-2906a899.js');
+var useHealthToolCache = require('./useHealthToolCache-31f25f39.js');
+var index = require('./index-f1ecf8cd.js');
+var constants$1 = require('./constants-2747b802.js');
+var index$2 = require('./index-a0fec7e6.js');
 require('@mantine/dates');
-require('./index-01e79c0b.js');
-require('./index-e00b40d5.js');
-require('./index-fc646808.js');
-require('./index-4ce2d652.js');
-var index$3 = require('./index-390f46e0.js');
-require('./index-1b7800fb.js');
-require('./index-dfb7a2bc.js');
-require('./index.styles-b57a5542.js');
+require('./index-3abd018e.js');
+require('./index-591e35ce.js');
+require('./index-2c968a63.js');
+require('./index-f091f440.js');
+var index$3 = require('./index-ebfbd780.js');
+require('./index-29ae9f83.js');
+require('./index-9f274013.js');
+require('./index.styles-3cd8dfb5.js');
 require('@mantine/hooks');
-require('./utils-e4cd2bef.js');
-require('./index-e96adbd1.js');
-var context = require('./context-2cebcbc4.js');
-var index$1 = require('./index-7a030110.js');
-var constants = require('./constants-f0b1c360.js');
+require('./utils-90d97728.js');
+require('./index-ccd59c12.js');
+var context = require('./context-ef7cd567.js');
+var index$1 = require('./index-c482bde7.js');
+var constants = require('./constants-f440b29e.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }