@hhgtech/hhg-components 1.29.407 → 1.29.409-beta-1

package/build/lead.js

@@ -2,56 +2,56 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-4c6c8eb6.js');
+var tslib_es6 = require('./tslib.es6-165ebcff.js');
 var React = require('react');
 var core = require('@mantine/core');
 var debounce = require('lodash/debounce');
 var form = require('@mantine/form');
 var dayjs = require('dayjs');
-var index = require('./index-d5099a67.js');
+var index = require('./index-b4b87e94.js');
 var miscCookieHelper = require('./miscCookieHelper.js');
-var index$1 = require('./index-e35dc0da.js');
-var translationsContext = require('./translationsContext-678d593a.js');
-var utils$1 = require('./utils-901ab40e.js');
-var index$2 = require('./index-85588d21.js');
-var index$3 = require('./index-9195f57f.js');
-var index$5 = require('./index-62376260.js');
-var index$4 = require('./index-193b3c6f.js');
-require('./index.styles-a9b79120.js');
+var index$1 = require('./index-9f027559.js');
+var translationsContext = require('./translationsContext-88048ff8.js');
+var utils$1 = require('./utils-cf2bddb7.js');
+var index$2 = require('./index-d379c3df.js');
+var index$3 = require('./index-124ab833.js');
+var index$5 = require('./index-e6a8ef94.js');
+var index$4 = require('./index-8957507a.js');
+require('./index.styles-00890d3d.js');
 var hooks = require('@mantine/hooks');
-require('./useMantineLocale-bfe79d12.js');
-var index$9 = require('./index-9591c495.js');
-require('./index-2cca60e1.js');
-var index$7 = require('./index-1dda0894.js');
-require('./other-9f6773be.js');
-require('./index-6d92f306.js');
-var utils = require('./utils-8beef391.js');
+require('./useMantineLocale-7e1240db.js');
+var index$9 = require('./index-77a434f2.js');
+require('./index-a4b3ce47.js');
+var index$7 = require('./index-e0c30948.js');
+require('./other-3212de62.js');
+require('./index-fe4eb90c.js');
+var utils = require('./utils-a1d2533b.js');
 var dates = require('@mantine/dates');
-var usePlacesAutocomplete = require('./usePlacesAutocomplete-b2dcc6e5.js');
-var index$6 = require('./index-c0ae03fe.js');
-var translationsProvider = require('./translationsProvider-f14ffcbf.js');
-var Locale = require('./Locale-77fad212.js');
+var usePlacesAutocomplete = require('./usePlacesAutocomplete-4cee8d93.js');
+var index$6 = require('./index-1bc56aaa.js');
+var translationsProvider = require('./translationsProvider-4708dced.js');
+var Locale = require('./Locale-e1131cbf.js');
 var uuid = require('uuid');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 var PhoneInputBase = require('react-phone-number-input');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
 var react = require('@emotion/react');
-var togetherComponentGlobalContext = require('./utils-43d6aad2.js');
-var index$8 = require('./index-278d22d4.js');
-var useScreenSize = require('./useScreenSize-bda826ea.js');
+var togetherComponentGlobalContext = require('./utils-942c70d1.js');
+var index$8 = require('./index-3c788cf0.js');
+var useScreenSize = require('./useScreenSize-47323369.js');
 var framerMotion = require('framer-motion');
 var ReactDOM = require('react-dom');
-var index$a = require('./index-2e9dbd95.js');
-var InputDate = require('./InputDate-9cf239a2.js');
-var index$b = require('./index-9960f5de.js');
-var Close = require('./Close-34c7f1fa.js');
+var index$a = require('./index-260b0436.js');
+var InputDate = require('./InputDate-8b125326.js');
+var index$b = require('./index-fb9cac3d.js');
+var Close = require('./Close-950bebd5.js');
 require('./constantsIsProduction.js');
-require('./normalizeLink-ff95ece1.js');
+require('./normalizeLink-e2be4604.js');
 require('@hhgtech/icons/other');
 require('@mantine/carousel');
 require('classnames');
-require('./useUniqueId-73e84d75.js');
+require('./useUniqueId-5ece0fae.js');
 require('./constantsSite.js');
 require('@hhgtech/icons/core');
 require('@mantine/notifications');
@@ -69,11 +69,11 @@ require('./i18n-values/vi-VN.js');
 require('./i18n-values/vi-VN_MB.js');
 require('./i18n-values/zh-SG.js');
 require('./i18n-values/zh-TW.js');
-require('./index-286ce15a.js');
+require('./index-59b92dd8.js');
 require('slugify');
 require('string-format');
 require('./togetherApiPaths.js');
-require('./constants-c825c14b.js');
+require('./constants-e444bcdc.js');
 require('vaul');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -1024,15 +1024,15 @@ const Fields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, style
             case 'TextBlock':
                 return (React__default["default"].createElement(index$3.Input, Object.assign({ key: index, withAsterisk: required, spellCheck: false, type: "text", placeholder: placeholder, className: cx('leadgen-control', classes.control), 
                     // onChangeRaw={(e) => inputOnChange('text', e)}
-                    label: placeholder, "data-control": "text", "data-lead-control": name, name: value }, form.getInputProps(value))));
+                    label: placeholder, "data-control": "text", "data-lead-control": name, "data-is-required": required, name: value }, form.getInputProps(value))));
             case 'NumberBlock':
                 return (React__default["default"].createElement(index$3.NumberInput, Object.assign({ key: index, withAsterisk: required, spellCheck: false, type: "number", placeholder: placeholder, className: cx('leadgen-control', classes.control), 
                     // onChange={(e) => inputOnChange('number', e)}
-                    label: placeholder, "data-control": "number", "data-lead-control": name, name: value }, form.getInputProps(value))));
+                    label: placeholder, "data-control": "number", "data-lead-control": name, "data-is-required": required, name: value }, form.getInputProps(value))));
             case 'EmailBlock':
                 return (React__default["default"].createElement(index$3.Input, Object.assign({ key: index, withAsterisk: required, spellCheck: false, 
                     // type="email"
-                    placeholder: placeholder, className: cx('leadgen-control', classes.control), label: placeholder, "data-control": "email", "data-lead-control": name, name: value }, form.getInputProps(value))));
+                    placeholder: placeholder, className: cx('leadgen-control', classes.control), label: placeholder, "data-control": "email", "data-lead-control": name, "data-is-required": required, name: value }, form.getInputProps(value))));
             case 'PhoneOtpBlock':
             case 'WhatsappOtpBlock':
             case 'ZaloOtpBlock':
@@ -1047,14 +1047,14 @@ const Fields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, style
                             form.setFieldValue(value, v);
                         }, 
                         // onBlur={(e) => inputOnBlur('tel', e)}
-                        id: id, defaultCountry: (locale ? utils.MAPPED_LOCALE[locale] || 'VN' : 'VN'), "data-control": "tel", "data-lead-control": name })));
+                        id: id, defaultCountry: (locale ? utils.MAPPED_LOCALE[locale] || 'VN' : 'VN'), "data-control": "tel", "data-lead-control": name, "data-is-required": required })));
             }
             case 'LocationBlock': {
                 return (React__default["default"].createElement(LocationBlock, { key: index, name: value, placeholder: placeholder, locale: locale, required: required }));
             }
             case 'DateBlock':
                 return (React__default["default"].createElement(React__default["default"].Fragment, null,
-                    React__default["default"].createElement(index$5.DatePicker, Object.assign({ withAsterisk: required, key: index, type: "default", name: value, placeholder: placeholder, className: cx('leadgen-control', classes.control), label: placeholder, "data-control": "date", "data-lead-control": name, popoverProps: popoverProps }, form.getInputProps(value))),
+                    React__default["default"].createElement(index$5.DatePicker, Object.assign({ withAsterisk: required, key: index, type: "default", name: value, placeholder: placeholder, className: cx('leadgen-control', classes.control), label: placeholder, "data-control": "date", "data-lead-control": name, "data-is-required": required, popoverProps: popoverProps }, form.getInputProps(value))),
                     React__default["default"].createElement("input", { type: "hidden", name: value, "data-control": "date" })));
             case 'LinkButtonBlock':
                 return (React__default["default"].createElement("div", { key: index },
@@ -1072,14 +1072,14 @@ const Fields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, style
                             display: 'flex',
                             flexDirection: 'column',
                             gap: 8,
-                        } }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$3.Checkbox, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "checkbox", "data-lead-control": name }))))));
+                        } }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$3.Checkbox, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "checkbox", "data-lead-control": name, "data-is-required": required }))))));
             case 'RadioBlock':
                 return (React__default["default"].createElement(React__default["default"].Fragment, null,
                     isSendMailChimp && (React__default["default"].createElement(index$3.Input, { type: "hidden", name: value + '-mailchimp', value: isSendMailChimp })),
-                    React__default["default"].createElement(index$3.Radio.Group, Object.assign({ withAsterisk: required, className: cx('leadgen-control', classes.control), key: index, label: placeholder, size: "md" }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$3.Radio, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "radio", "data-lead-control": name }))))));
+                    React__default["default"].createElement(index$3.Radio.Group, Object.assign({ withAsterisk: required, className: cx('leadgen-control', classes.control), key: index, label: placeholder, size: "md" }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$3.Radio, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "radio", "data-lead-control": name, "data-is-required": required }))))));
             case 'DropdownBlock':
                 return (React__default["default"].createElement(React__default["default"].Fragment, null,
-                    React__default["default"].createElement("div", { style: { display: 'none' }, "data-extra": true, "data-name": value, "data-control": 'dropdown', "data-lead-control": name }),
+                    React__default["default"].createElement("div", { style: { display: 'none' }, "data-extra": true, "data-name": value, "data-control": 'dropdown', "data-lead-control": name, "data-is-required": required }),
                     React__default["default"].createElement(index$3.Select, Object.assign({ key: index, className: cx('leadgen-control', classes.control), label: placeholder, withAsterisk: required, name: value, data: listQuestion.map((l) => ({
                             value: l.value,
                             label: l.placeholder,
@@ -1087,7 +1087,7 @@ const Fields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, style
             case 'TncBlock':
                 const tncInputProps = form.getInputProps('TNC-' + b.id);
                 return (React__default["default"].createElement(React__default["default"].Fragment, null,
-                    React__default["default"].createElement(index$3.Checkbox, Object.assign({ name: 'TNC-' + b.id, key: b.id, label: React__default["default"].createElement("p", { className: "lead-modal__tnc-link", dangerouslySetInnerHTML: { __html: data.valueHTML } }), className: "tnc-block", "data-control": "checkbox", "data-lead-control": name }, tncInputProps, { error: tncInputProps.error ? tncInputProps.error : undefined }))));
+                    React__default["default"].createElement(index$3.Checkbox, Object.assign({ name: 'TNC-' + b.id, key: b.id, label: React__default["default"].createElement("p", { className: "lead-modal__tnc-link", dangerouslySetInnerHTML: { __html: data.valueHTML } }), className: "tnc-block", "data-control": "checkbox", "data-lead-control": name, "data-is-required": required }, tncInputProps, { error: tncInputProps.error ? tncInputProps.error : undefined }))));
         }
         return null;
     })));
@@ -3563,6 +3563,35 @@ const FloatingLayout = ({ popupId, url, title, urlText, titleAlign, subtitle, su
                     React__default["default"].createElement(CloseButton, { onClose: onClose, containerClassName: "close-button-top-right" }))))));
 };
 
+const useViewportDimensions = () => {
+    const dimensionsRef = React.useRef({ width: 0, height: 0 });
+    const [dimensions, setDimensions] = React.useState(() => ({
+        width: window.screen.availWidth,
+        height: window.screen.availHeight,
+    }));
+    React.useEffect(() => {
+        var _a;
+        function visualViewport(e) {
+            if (dimensionsRef.current.width === e.target.width &&
+                dimensionsRef.current.height === e.target.height) {
+                return;
+            }
+            const newDimensions = {
+                width: e.target.width,
+                height: e.target.height,
+            };
+            dimensionsRef.current = newDimensions;
+            setDimensions(newDimensions);
+        }
+        (_a = window.visualViewport) === null || _a === void 0 ? void 0 : _a.addEventListener('resize', visualViewport);
+        return () => {
+            var _a;
+            (_a = window.visualViewport) === null || _a === void 0 ? void 0 : _a.removeEventListener('resize', visualViewport);
+        };
+    }, []);
+    return React.useMemo(() => (Object.assign({}, dimensions)), [dimensions.height, dimensions.width]);
+};
+
 function isMac() {
     return testPlatform(/^Mac/);
 }
@@ -3838,35 +3867,6 @@ function isInput(target) {
         (target instanceof HTMLElement && target.isContentEditable));
 }
 
-const useViewportDimensions = () => {
-    const dimensionsRef = React.useRef({ width: 0, height: 0 });
-    const [dimensions, setDimensions] = React.useState(() => ({
-        width: window.screen.availWidth,
-        height: window.screen.availHeight,
-    }));
-    React.useEffect(() => {
-        var _a;
-        function visualViewport(e) {
-            if (dimensionsRef.current.width === e.target.width &&
-                dimensionsRef.current.height === e.target.height) {
-                return;
-            }
-            const newDimensions = {
-                width: e.target.width,
-                height: e.target.height,
-            };
-            dimensionsRef.current = newDimensions;
-            setDimensions(newDimensions);
-        }
-        (_a = window.visualViewport) === null || _a === void 0 ? void 0 : _a.addEventListener('resize', visualViewport);
-        return () => {
-            var _a;
-            (_a = window.visualViewport) === null || _a === void 0 ? void 0 : _a.removeEventListener('resize', visualViewport);
-        };
-    }, []);
-    return React.useMemo(() => (Object.assign({}, dimensions)), [dimensions.height, dimensions.width]);
-};
-
 const StyledLeadGenLightBoxBFooter = styled__default["default"].div `
   padding-top: calc(var(--spacing-y, 20px) * 8 / 20);
   padding-inline: var(--spacing-x, 20px);
@@ -4603,20 +4603,20 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                     React__default["default"].createElement(core.TextInput, Object.assign({ withAsterisk: required, spellCheck: false, type: "text", placeholder: " ", 
                         // className="lead-modal__form-control leadgen-form_field"
                         // onChangeRaw={(e) => inputOnChange('text', e)}
-                        label: label, "data-control": "text", "data-lead-control": 'TextBlock', inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value), { name: value }))));
+                        label: label, "data-control": "text", "data-lead-control": name, "data-is-required": required, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value), { name: value }))));
             case 'NumberBlock':
                 return (React__default["default"].createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
                     React__default["default"].createElement(core.NumberInput, Object.assign({ withAsterisk: required, spellCheck: false, type: "number", placeholder: " ", 
                         // className="lead-modal__form-control leadgen-form_field"
                         // onChange={(e) => inputOnChange('number', e)}
-                        label: label, "data-control": "number", "data-lead-control": name, name: value, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value)))));
+                        label: label, "data-control": "number", "data-lead-control": name, "data-is-required": required, name: value, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value)))));
             case 'EmailBlock':
                 return (React__default["default"].createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
                     React__default["default"].createElement(core.TextInput, Object.assign({ withAsterisk: required, spellCheck: false, 
                         // type="email"
                         placeholder: " ", 
                         // className="lead-modal__form-control leadgen-form_field"
-                        label: label, "data-control": "email", "data-lead-control": name, name: value, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value)))));
+                        label: label, "data-control": "email", "data-lead-control": name, "data-is-required": required, name: value, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value)))));
             case 'PhoneOtpBlock':
             case 'WhatsappOtpBlock':
             case 'ZaloOtpBlock':
@@ -4630,16 +4630,16 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                         React__default["default"].createElement("div", { className: "mantine-Input-wrapper" },
                             React__default["default"].createElement(index$3.Phone, Object.assign({ className: "mantine-Input-input", name: value, spellCheck: false, type: "tel", placeholder: " ", 
                                 // onBlur={(e) => inputOnBlur('tel', e)}
-                                id: htmlForId, defaultCountry: (locale ? utils.MAPPED_LOCALE[locale] || 'VN' : 'VN'), "data-control": "tel", "data-lead-control": name }, formPhoneInputWrapper))))));
+                                id: htmlForId, defaultCountry: (locale ? utils.MAPPED_LOCALE[locale] || 'VN' : 'VN'), "data-control": "tel", "data-lead-control": name, "data-is-required": required }, formPhoneInputWrapper))))));
             }
             case 'LocationBlock': {
                 return (React__default["default"].createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
-                    React__default["default"].createElement(GoogleLocationBlock, Object.assign({ withAsterisk: required, name: value, placeholder: " ", label: label, "data-control": "text", "data-lead-control": name, locale: locale, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value)))));
+                    React__default["default"].createElement(GoogleLocationBlock, Object.assign({ withAsterisk: required, name: value, placeholder: " ", label: label, "data-control": "text", "data-lead-control": name, "data-is-required": required, locale: locale, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value)))));
             }
             case 'DateBlock': {
                 const _c = form.getInputProps(value), { error } = _c, formInputProps = tslib_es6.__rest(_c, ["error"]);
                 return (React__default["default"].createElement(core.Input.Wrapper, { key: index, size: "md", withAsterisk: required, label: label, "data-invalid": !!error, inputWrapperOrder: ['label', 'input', 'description', 'error'], error: error, className: "lead-modal__form-control leadgen-form_field" },
-                    React__default["default"].createElement(InputDate.InputDate, Object.assign({ name: value, error: Boolean(error), locale: locale, "data-extra": true, "data-name": value, "data-control": "date", "data-lead-control": name, className: "leadgen-form_field_date", labelTuples: labelTuples }, formInputProps))));
+                    React__default["default"].createElement(InputDate.InputDate, Object.assign({ name: value, error: Boolean(error), locale: locale, "data-extra": true, "data-name": value, "data-control": "date", "data-lead-control": name, "data-is-required": required, className: "leadgen-form_field_date", labelTuples: labelTuples }, formInputProps))));
             }
             case 'LinkButtonBlock':
                 return (React__default["default"].createElement("div", { key: index },
@@ -4662,7 +4662,7 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                             gap: 8,
                         }, inputWrapperOrder: ['label', 'input', 'description', 'error'], inputContainer: (children) => {
                             return (React__default["default"].createElement("div", { className: "leadgen-choiceContainer" }, children));
-                        } }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$3.Checkbox, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "checkbox", "data-lead-control": name }))))));
+                        } }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$3.Checkbox, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "checkbox", "data-lead-control": name, "data-is-required": required }))))));
             case 'RadioBlock':
                 return (React__default["default"].createElement(ChoiceField, { className: "leadgen-form_radio", key: index },
                     isSendMailChimp && (React__default["default"].createElement(core.Input, { type: "hidden", name: value + '-mailchimp', value: isSendMailChimp })),
@@ -4670,10 +4670,10 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                         // className="lead-modal__form-control leadgen-form_field"
                         label: label, size: "md", inputWrapperOrder: ['label', 'input', 'description', 'error'], inputContainer: (children) => {
                             return (React__default["default"].createElement("div", { className: "leadgen-choiceContainer" }, children));
-                        } }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$3.Radio, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "radio", "data-lead-control": name }))))));
+                        } }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$3.Radio, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "radio", "data-lead-control": name, "data-is-required": required }))))));
             case 'DropdownBlock':
                 return (React__default["default"].createElement(TextField, { shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field DropdownBlock", key: index },
-                    React__default["default"].createElement("div", { style: { display: 'none' }, "data-extra": true, "data-name": value, "data-control": 'dropdown', "data-lead-control": name }),
+                    React__default["default"].createElement("div", { style: { display: 'none' }, "data-extra": true, "data-name": value, "data-control": 'dropdown', "data-lead-control": name, "data-is-required": required }),
                     React__default["default"].createElement(index$3.Select
                     // className="lead-modal__form-control leadgen-form_field"
                     , Object.assign({ 
@@ -4707,7 +4707,7 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                 const _d = form.getInputProps(`TNC-${id}`), { error } = _d, tncInputProps = tslib_es6.__rest(_d, ["error"]);
                 return (React__default["default"].createElement(ChoiceField, { className: "leadgen-form_checkbox", key: id },
                     React__default["default"].createElement(core.Input.Wrapper, { error: error },
-                        React__default["default"].createElement(index$3.Checkbox, Object.assign({ name: 'TNC-' + id, label: React__default["default"].createElement("p", { className: "lead-modal__tnc-link", dangerouslySetInnerHTML: { __html: data.valueHTML } }), className: "tnc-block", "data-control": "checkbox", "data-lead-control": name }, tncInputProps)))));
+                        React__default["default"].createElement(index$3.Checkbox, Object.assign({ name: 'TNC-' + id, label: React__default["default"].createElement("p", { className: "lead-modal__tnc-link", dangerouslySetInnerHTML: { __html: data.valueHTML } }), className: "tnc-block", "data-control": "checkbox", "data-lead-control": name, "data-is-required": required }, tncInputProps)))));
         }
         return null;
     })));
@@ -4982,7 +4982,7 @@ const LightboxLayout = ({ popupId, extraFields, onClose: onCloseProp, onOtherSub
         }
     };
     const { height } = useViewportDimensions();
-    usePreventScroll();
+    // usePreventScroll()
     const formActiveTime = React.useRef(0);
     const textBlocks = JSON.parse(extraFields.textBlocks);
     const listBlockAdded = JSON.parse(extraFields.listBlockAdded);
@@ -5069,47 +5069,8 @@ const LightboxLayout = ({ popupId, extraFields, onClose: onCloseProp, onOtherSub
         return false;
     }, [...listBlockAddedRequired.map((k) => form.values[k])]);
     const onFocus = (e) => {
-        e.preventDefault();
-        function scrollIntoView() {
-            const $Input = e.target;
-            const $TextField = $Input.closest('.leadgen-form_field');
-            const scrollIntoView = {
-                block: 'center',
-                behavior: 'auto',
-            };
-            if ($TextField.classList.contains('DropdownBlock')) {
-                scrollIntoView.block = 'start';
-                const tfOffsetTop = ($TextField === null || $TextField === void 0 ? void 0 : $TextField.offsetTop) || 0;
-                const tfHeight = $TextField.clientHeight;
-                const $ScrollableElement = getParentScroll($TextField);
-                if ($ScrollableElement) {
-                    // https://hhgdev.atlassian.net/browse/EL-682
-                    const scrollHeight = $ScrollableElement.scrollHeight;
-                    if (scrollHeight - (tfOffsetTop + tfHeight) < 192) {
-                        scrollIntoView.block = 'end';
-                    }
-                }
-            }
-            if (isMobile) {
-                window.scrollTo(0, 0);
-            }
-            $TextField.scrollIntoView(scrollIntoView);
-        }
-        let time = 0;
-        function requestFrame(timestamp) {
-            if (time === 0) {
-                time = timestamp;
-            }
-            if (timestamp - time <= 250) {
-                requestAnimationFrame(requestFrame);
-            }
-            else {
-                scrollIntoView();
-            }
-        }
-        if (isMobile) {
-            requestAnimationFrame(requestFrame);
-        }
+        // EL-926 Temporary turn off handling focus form on mobile to fix scrolling bug on lightbox A
+        return false;
     };
     const middlewareOnSubmit = (e) => {
         e.preventDefault();
@@ -5518,7 +5479,7 @@ const formatFormData = (currentForm, formData) => {
     return Object.keys(formData)
         .filter((key) => !!formData[key])
         .map((name) => {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e, _f;
         const value = String(formData[name]);
         const control = ((_a = currentForm
             .querySelector(`*[name="${name}"][data-control]`)) === null || _a === void 0 ? void 0 : _a.getAttribute('data-control')) ||
@@ -5530,6 +5491,11 @@ const formatFormData = (currentForm, formData) => {
             ((_d = currentForm
                 .querySelector(`*[data-extra][data-name="${name}"]`)) === null || _d === void 0 ? void 0 : _d.getAttribute('data-lead-control')) ||
             'text';
+        const isRequired = Boolean(((_e = currentForm
+            .querySelector(`*[name="${name}"][data-is-required]`)) === null || _e === void 0 ? void 0 : _e.getAttribute('data-is-required')) ||
+            ((_f = currentForm
+                .querySelector(`*[data-extra][data-name="${name}"]`)) === null || _f === void 0 ? void 0 : _f.getAttribute('data-is-required')) ||
+            'text');
         const formatedValue = control === 'tel'
             ? window.intlTelInputUtils
                 .formatNumber(String(value), LEAD_LOCALE === null || LEAD_LOCALE === void 0 ? void 0 : LEAD_LOCALE.countryCodeNumber, numberFormatType)
@@ -5542,6 +5508,7 @@ const formatFormData = (currentForm, formData) => {
             value: formatedValue,
             control,
             leadControl,
+            isRequired,
             // is_sent_mailchimp: currentForm.querySelector(
             //   `div[data-name="${i.name}-mailchimp"]`,
             // )
@@ -5572,6 +5539,7 @@ const formatTrackingData = (params) => {
                     field_name: control.key,
                     component_type: curLeadControl,
                     value: control.value,
+                    is_required: control.isRequired,
                 };
             }
         })
@@ -5581,6 +5549,7 @@ const formatTrackingData = (params) => {
                 return {
                     field_name: item.data.value,
                     component_type: item.name,
+                    is_required: item.isRequired,
                 };
             }
         })

package/build/{logoIcon-da4cf6d1.js → logoIcon-c659be92.js}

@@ -1,8 +1,8 @@
 'use strict';
 
 var React = require('react');
-var index = require('./index-2cca60e1.js');
-var useScreenSize = require('./useScreenSize-bda826ea.js');
+var index = require('./index-a4b3ce47.js');
+var useScreenSize = require('./useScreenSize-47323369.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/mantine.js

@@ -2,43 +2,43 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./index-9195f57f.js');
-var index$1 = require('./index-62376260.js');
-var index$2 = require('./index-85588d21.js');
-var index$3 = require('./index-193b3c6f.js');
-var index$4 = require('./index-bb7a6a78.js');
+var index = require('./index-124ab833.js');
+var index$1 = require('./index-e6a8ef94.js');
+var index$2 = require('./index-d379c3df.js');
+var index$3 = require('./index-8957507a.js');
+var index$4 = require('./index-d3de7cb2.js');
 var React = require('react');
-var index$5 = require('./index-50f12883.js');
-var tslib_es6 = require('./tslib.es6-4c6c8eb6.js');
+var index$5 = require('./index-bbe50153.js');
+var tslib_es6 = require('./tslib.es6-165ebcff.js');
 var core = require('@mantine/core');
 var miscTheme = require('./miscTheme.js');
-var index$6 = require('./index-781768d9.js');
+var index$6 = require('./index-4cef7eef.js');
 var hooks = require('@mantine/hooks');
-var index$7 = require('./index-2f875a80.js');
-var useMantineLocale = require('./useMantineLocale-bfe79d12.js');
-var other = require('./other-9f6773be.js');
-var index$8 = require('./index-6d92f306.js');
+var index$7 = require('./index-209bdded.js');
+var useMantineLocale = require('./useMantineLocale-7e1240db.js');
+var other = require('./other-3212de62.js');
+var index$8 = require('./index-fe4eb90c.js');
 require('@hhgtech/icons/other');
-require('./index-2cca60e1.js');
+require('./index-a4b3ce47.js');
 require('./constantsDomainLocales.js');
-require('./Locale-77fad212.js');
+require('./Locale-e1131cbf.js');
 require('./constantsIsProduction.js');
-require('./useScreenSize-bda826ea.js');
+require('./useScreenSize-47323369.js');
 require('@emotion/styled');
-require('./utils-901ab40e.js');
+require('./utils-cf2bddb7.js');
 require('@mantine/carousel');
-require('./index-9591c495.js');
-require('./index-1dda0894.js');
+require('./index-77a434f2.js');
+require('./index-e0c30948.js');
 require('date-fns/locale');
 require('./constantsSite.js');
 require('./constantsRiskScreener.js');
 require('classnames');
-require('./useUniqueId-73e84d75.js');
+require('./useUniqueId-5ece0fae.js');
 require('@hhgtech/icons/core');
 require('@mantine/dates');
-require('./index.styles-a9b79120.js');
-require('./index-e35dc0da.js');
-require('./translationsContext-678d593a.js');
+require('./index.styles-00890d3d.js');
+require('./index-9f027559.js');
+require('./translationsContext-88048ff8.js');
 require('@mantine/notifications');
 require('dayjs');
 

package/build/misc.js

@@ -2,38 +2,38 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var localizeNumberFormat = require('./localizeNumberFormat-3cdce5aa.js');
-var animation = require('./animation-e277556d.js');
+var localizeNumberFormat = require('./localizeNumberFormat-4b53b11b.js');
+var animation = require('./animation-90274782.js');
 var miscCookieHelper = require('./miscCookieHelper.js');
 require('react');
 require('@mantine/core');
-require('./useMantineLocale-bfe79d12.js');
-require('./index-9591c495.js');
-require('./index-2cca60e1.js');
+require('./useMantineLocale-7e1240db.js');
+require('./index-77a434f2.js');
+require('./index-a4b3ce47.js');
 var miscTheme = require('./miscTheme.js');
-var utils = require('./utils-901ab40e.js');
-require('./index-1dda0894.js');
-var number = require('./number-318c6835.js');
-var normalizeLink = require('./normalizeLink-ff95ece1.js');
+var utils = require('./utils-cf2bddb7.js');
+require('./index-e0c30948.js');
+var number = require('./number-6b0ab5f1.js');
+var normalizeLink = require('./normalizeLink-e2be4604.js');
 var miscGetDynamicHealthTool = require('./miscGetDynamicHealthTool.js');
 var miscGetSocialList = require('./miscGetSocialList.js');
 var miscScreenSizeContext = require('./miscScreenSizeContext.js');
-var dataTransform = require('./dataTransform-34095576.js');
+var dataTransform = require('./dataTransform-bdcdb76c.js');
 require('dayjs');
 require('@emotion/react');
-require('./tslib.es6-4c6c8eb6.js');
+require('./tslib.es6-165ebcff.js');
 require('@mantine/notifications');
-require('./other-9f6773be.js');
-require('./Locale-77fad212.js');
+require('./other-3212de62.js');
+require('./Locale-e1131cbf.js');
 require('./constantsDomainLocales.js');
 require('./constantsIsProduction.js');
 require('date-fns/locale');
 require('./constantsSite.js');
 require('./constantsRiskScreener.js');
-require('./core-dfe56c84.js');
-require('./WhatsApp-19563388.js');
-require('./index-e99444f9.js');
-require('./index-286ce15a.js');
+require('./core-46d14736.js');
+require('./WhatsApp-4c914158.js');
+require('./index-a405b1d5.js');
+require('./index-59b92dd8.js');
 require('js-cookie');
 require('uuid');
 require('lodash/throttle');

package/build/miscGetDynamicHealthTool.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-4c6c8eb6.js');
-var normalizeLink = require('./normalizeLink-ff95ece1.js');
-var core = require('./core-dfe56c84.js');
+var tslib_es6 = require('./tslib.es6-165ebcff.js');
+var normalizeLink = require('./normalizeLink-e2be4604.js');
+var core = require('./core-46d14736.js');
 require('./constantsDomainLocales.js');
-require('./Locale-77fad212.js');
+require('./Locale-e1131cbf.js');
 require('./constantsIsProduction.js');
 
 const formatHealthTool = (healthTool, locale) => {

package/build/miscGetSocialList.js

@@ -3,14 +3,14 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var tslib_es6 = require('./tslib.es6-4c6c8eb6.js');
-var WhatsApp = require('./WhatsApp-19563388.js');
-var index = require('./index-9591c495.js');
-var index$2 = require('./index-e99444f9.js');
-var index$1 = require('./index-2cca60e1.js');
-var Locale = require('./Locale-77fad212.js');
-require('./index-286ce15a.js');
-require('./index-1dda0894.js');
+var tslib_es6 = require('./tslib.es6-165ebcff.js');
+var WhatsApp = require('./WhatsApp-4c914158.js');
+var index = require('./index-77a434f2.js');
+var index$2 = require('./index-a405b1d5.js');
+var index$1 = require('./index-a4b3ce47.js');
+var Locale = require('./Locale-e1131cbf.js');
+require('./index-59b92dd8.js');
+require('./index-e0c30948.js');
 require('date-fns/locale');
 require('./constantsSite.js');
 require('./constantsDomainLocales.js');

package/build/miscScreenSizeContext.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var throttle = require('lodash/throttle');
-var utils = require('./utils-901ab40e.js');
+var utils = require('./utils-cf2bddb7.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }