UNPKG

@hhgtech/hhg-components

Version:
104 lines (94 loc) • 8.12 kB
'use strict'; var tslib_es6 = require('./tslib.es6-af09a0ba.js'); var React = require('react'); var core = require('@mantine/core'); var form = require('@mantine/form'); require('./index-3424862e.js'); var index$3 = require('./index-2558f624.js'); var index$4 = require('./index-d4ad3f79.js'); require('./index-515469d0.js'); require('./index-04864074.js'); require('./index.styles-5f6a7ac0.js'); var index = require('./index-2b476eb9.js'); require('@mantine/hooks'); require('./index-4d838fd2.js'); require('./utils-5e3a8440.js'); require('./index-a985d53b.js'); var context = require('./context-c8d07963.js'); var index$1 = require('./index-4aa0b39e.js'); var index$2 = require('./index-84429a30.js'); var other = require('@hhgtech/icons/other'); function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; } var React__default = /*#__PURE__*/_interopDefault(React); const BabyVaccineFormContext = React.createContext({}); const DefaultLayout = (_a) => { var props = tslib_es6.__rest(_a, []); const { t } = index.useTranslations(); const { currentUrl, submitProps, form } = React.useContext(BabyVaccineFormContext); const { classes: wrapperClasses = {} } = React.useContext(context.CardWrapperContext); return (React__default["default"].createElement(index$1.HealthToolFormWrapper, Object.assign({ formLayout: "default" }, props), React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null, React__default["default"].createElement(index$2.GenderOptionControl, Object.assign({ isBaby: true }, form.getInputProps('gender')))), React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null, React__default["default"].createElement(index$3.DatePicker, Object.assign({ label: React__default["default"].createElement(index$4.Text, { size: "p2", weight: "semiBold" }, t('babyGrowth.input.birthday')), placeholder: 'DD/MM/YYYY', popoverProps: { withinPortal: true, }, maxDate: new Date() }, form.getInputProps('age')))), React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, { className: wrapperClasses.submitWrapper }, React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ type: "submit", className: core.clsx('due-date-calculate-button', wrapperClasses.submitBtn), dataEventCategory: "Health Tool", dataEventAction: "Vaccination Tool", dataEventLabel: currentUrl }, submitProps), t('dueDatePage.lastPeriod.calculate'))))); }; const InlineLayout = (_a) => { var props = tslib_es6.__rest(_a, []); const { t } = index.useTranslations(); const { currentUrl, submitProps, form } = React.useContext(BabyVaccineFormContext); const { classes: wrapperClasses = {} } = React.useContext(context.CardWrapperContext); return (React__default["default"].createElement(index$1.HealthToolFormWrapper, Object.assign({ formLayout: "inline" }, props), React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null, React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('tools.selectBabyGender'), width: 'none' }, React__default["default"].createElement(index$2.GenderOptionControl, Object.assign({ isBaby: true, hideLabel: true, type: "radio" }, form.getInputProps('gender')))), 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$3.DatePicker, Object.assign({ placeholder: 'DD/MM/YYYY', popoverProps: { withinPortal: true, }, maxDate: new Date() }, form.getInputProps('age'), { error: null }))), form.errors.age && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.age))), React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, { className: wrapperClasses.submitWrapper }, React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ type: "submit", className: core.clsx('due-date-calculate-button', wrapperClasses.submitBtn), dataEventCategory: "Health Tool", dataEventAction: "Vaccination Tool", dataEventLabel: currentUrl }, submitProps), t('dueDatePage.lastPeriod.calculate'))))); }; const MbLayout = (_a) => { var props = tslib_es6.__rest(_a, []); const { t } = index.useTranslations(); const { currentUrl, submitProps, form } = React.useContext(BabyVaccineFormContext); return (React__default["default"].createElement(index$1.HealthToolFormWrapper, Object.assign({ formLayout: "default" }, props), React__default["default"].createElement(index$1.HealthToolFormWrapper.Control, null, React__default["default"].createElement(index$2.GenderOptionControl, Object.assign({ isBaby: true }, 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$1.HealthToolFormWrapper.BorderBoxControl, { label: t('babyGrowth.input.birthday'), rightSection: React__default["default"].createElement(other.CalendarMB, null) }, React__default["default"].createElement(index$3.DatePicker, Object.assign({ placeholder: 'DD/MM/YYYY', popoverProps: { withinPortal: true, }, maxDate: new Date(), rightSection: null }, form.getInputProps('age'), { error: null }))), form.errors.age && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.age))), React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ type: "submit", className: "due-date-calculate-button", dataEventCategory: "Health Tool", dataEventAction: "Vaccination Tool", dataEventLabel: currentUrl }, submitProps), t('dueDatePage.lastPeriod.calculate')))); }; var OvulationCalculatorType; (function (OvulationCalculatorType) { OvulationCalculatorType[OvulationCalculatorType["trackPeriod"] = 0] = "trackPeriod"; OvulationCalculatorType[OvulationCalculatorType["conceive"] = 1] = "conceive"; OvulationCalculatorType[OvulationCalculatorType["avoidPregnancy"] = 2] = "avoidPregnancy"; })(OvulationCalculatorType || (OvulationCalculatorType = {})); const BabyVaccineForm = (_a) => { var { formLayout = 'default', submitProps, currentUrl, onSubmit } = _a, props = tslib_es6.__rest(_a, ["formLayout", "submitProps", "currentUrl", "onSubmit"]); const { t } = index.useTranslations(); const theme = core.useMantineTheme(); const isMarryBaby = theme.other.template === 'mb'; const form$1 = form.useForm({ validate: { gender: form.isNotEmpty(t('validation.error.requiredField')), age: form.isNotEmpty(t('validation.error.requiredField')), }, }); const commonProps = Object.assign({ onSubmit: form$1.onSubmit(onSubmit) }, props); return (React__default["default"].createElement(BabyVaccineFormContext.Provider, { value: { submitProps, currentUrl, form: form$1 } }, formLayout === 'inline' ? (React__default["default"].createElement(InlineLayout, Object.assign({}, commonProps))) : isMarryBaby ? (React__default["default"].createElement(MbLayout, Object.assign({ formLayout: formLayout }, commonProps))) : (React__default["default"].createElement(DefaultLayout, Object.assign({}, commonProps))))); }; exports.BabyVaccineForm = BabyVaccineForm;