@hhgtech/hhg-components 1.29.419-beta-1 → 1.29.419-beta-2

package/build/esm/lead.js

@@ -1,57 +1,57 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-54c227c4.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-63503aab.js';
 import React__default, { createContext, useMemo, useEffect, useRef, useState, useContext, useCallback, forwardRef, useImperativeHandle, memo, useLayoutEffect } from 'react';
-import { createStyles, Box, useMantineTheme, Button as Button$1, Autocomplete, clsx, Input as Input$1, Checkbox as Checkbox$1, Radio as Radio$1, Select as Select$1, Flex, TextInput, NumberInput as NumberInput$1, Portal, Transition, Overlay } from '@mantine/core';
+import { createStyles, Box, useMantineTheme, Button as Button$1, Autocomplete, clsx, Input as Input$1, Checkbox as Checkbox$1, Radio as Radio$1, Select as Select$1, Flex, TextInput, NumberInput as NumberInput$1, rem, Portal, Transition, Overlay } from '@mantine/core';
 import debounce from 'lodash/debounce';
 import { createFormContext, useForm } from '@mantine/form';
 import dayjs from 'dayjs';
-import { B as BEARER_TOKEN_COOKIE } from './index-9f2df5e3.js';
+import { B as BEARER_TOKEN_COOKIE } from './index-9cfd234c.js';
 import { getCookie, setCookie } from './miscCookieHelper.js';
-import { u as useTranslations } from './index-564e9a8d.js';
-import { T as TranslationsContext } from './translationsContext-f3d56104.js';
-import { M as MediaQueries, b as getWrapperDomWithSelector, a as getPopupWrapperDom } from './utils-ce6dad59.js';
-import { T as Text } from './index-e24c7f31.js';
-import { S as Select, d as Checkbox, I as Input, R as Radio, P as Phone, N as NumberInput, O as OTP } from './index-9485507e.js';
-import { D as DatePicker } from './index-5469d13f.js';
-import { B as Button } from './index-2d6a701d.js';
-import './index.styles-7fd25fc3.js';
+import { u as useTranslations } from './index-60c99ce8.js';
+import { T as TranslationsContext } from './translationsContext-3873db9a.js';
+import { M as MediaQueries, b as getWrapperDomWithSelector, a as getPopupWrapperDom } from './utils-da66e349.js';
+import { T as Text } from './index-5e7f0f03.js';
+import { S as Select, d as Checkbox, I as Input, R as Radio, P as Phone, N as NumberInput, O as OTP } from './index-b6d973dd.js';
+import { D as DatePicker } from './index-b82d0972.js';
+import { B as Button } from './index-66276a9c.js';
+import './index.styles-48ae711d.js';
 import { useIntersection, useClickOutside } from '@mantine/hooks';
-import './index-e2c81cdc.js';
-import { G as GlobalTextStyleNew, C as CustomStylesType } from './text-9556acd7.js';
-import './index-cdc909e2.js';
-import { M as MAPPED_LOCALE } from './utils-1c5f9f28.js';
+import './index-a4324037.js';
+import { G as GlobalTextStyleNew, C as CustomStylesType, F as FontWeight } from './text-f42660ed.js';
+import './index-44efbc04.js';
+import { M as MAPPED_LOCALE } from './utils-403cc8e3.js';
 import { DateInput } from '@mantine/dates';
-import { L as LOCALE_SPECS, Z as ZINDEX_SSO, I as ISO_FORMAT } from './index-78fe08df.js';
-import { C as COMMON_DATE_TRANSLATE_KEY } from './index-95a9f864.js';
-import './index-b8d0efc2.js';
-import { u as usePlacesAutocomplete, G as GOOGLE_API_KEY } from './usePlacesAutocomplete-97751620.js';
-import { H as Heading$1 } from './index-0bad6b36.js';
-import { t as translationsMap$1 } from './translationsProvider-29762575.js';
-import { L as LOCALE } from './Locale-5e840eb9.js';
+import { L as LOCALE_SPECS, Z as ZINDEX_SSO, I as ISO_FORMAT } from './index-6e677190.js';
+import { C as COMMON_DATE_TRANSLATE_KEY } from './index-eac00c0c.js';
+import './index-0ec41385.js';
+import { u as usePlacesAutocomplete, G as GOOGLE_API_KEY } from './usePlacesAutocomplete-9245a16f.js';
+import { H as Heading$1 } from './index-52d89854.js';
+import { t as translationsMap$1 } from './translationsProvider-1c96459a.js';
+import { L as LOCALE } from './Locale-3e4b8c38.js';
 import { v1 } from 'uuid';
 import { domainLocales } from './constantsDomainLocales.js';
 import { parsePhoneNumber } from 'react-phone-number-input';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
 import { css } from '@emotion/react';
-import { T as TogetherComponentGlobalContext } from './utils-21099ca6.js';
-import { M as MantineProvider } from './index-6a3d20c1.js';
-import { i as isVideo } from './index-10628007.js';
-import { u as useScreenSize } from './index-f27e8f3a.js';
+import { T as TogetherComponentGlobalContext } from './utils-091dc0aa.js';
+import { M as MantineProvider } from './index-b21f3d25.js';
+import { i as isVideo } from './index-6624341d.js';
+import { u as useScreenSize } from './index-0711a88b.js';
 import { motion } from 'framer-motion';
 import { createPortal } from 'react-dom';
 import { ChevronDown } from '@hhgtech/icons/arrow';
 import { MapPin } from '@hhgtech/icons/core';
-import { I as InputDate } from './InputDate-fec94e39.js';
-import { D as DrawerComponent } from './index-7d04c0c0.js';
-import { C as Close } from './Close-6964f421.js';
+import { I as InputDate } from './InputDate-73f8c532.js';
+import { D as DrawerComponent } from './index-077aa484.js';
+import { C as Close } from './Close-c3b0bcd4.js';
 import './constantsIsProduction.js';
-import './normalizeLink-ee918625.js';
+import './normalizeLink-37631875.js';
 import '@hhgtech/icons/other';
 import '@mantine/carousel';
 import 'classnames';
-import './useUniqueId-b76ebd23.js';
+import './useUniqueId-fae959f7.js';
 import './constantsSite.js';
-import './shared-306f242d.js';
+import './shared-3c7d70e1.js';
 import '@mantine/notifications';
 import 'date-fns/locale';
 import './constantsRiskScreener.js';
@@ -67,11 +67,11 @@ import './i18n-values/vi-VN.js';
 import './i18n-values/vi-VN_MB.js';
 import './i18n-values/zh-SG.js';
 import './i18n-values/zh-TW.js';
-import './index-b5f1922a.js';
+import './index-4a6c38f3.js';
 import 'slugify';
 import 'string-format';
 import './togetherApiPaths.js';
-import './constants-378b36a6.js';
+import './constants-9af9897b.js';
 import 'vaul';
 
 const LeadGenComponentContext = createContext({});
@@ -144,7 +144,7 @@ const leadGenFieldRequired = (blocks) => {
         if (name === LEADGEN_BLOCK.TncBlock && id && required) {
             return `TNC-${id}`;
         }
-        if (required) {
+        if (required && typeof data['newtab'] === 'undefined') {
             return value;
         }
         return;
@@ -2654,7 +2654,6 @@ const StyledLeadGenSubscriptionBox = styled.div `
         margin-left: 8px;
         width: auto;
         min-height: 56px;
-        font-size: 16px;
       }
     }
   }
@@ -3076,6 +3075,7 @@ styled.div `
 const TextField = (props) => {
     const { shrink: shrinkProps, onChangeShrink, children, className } = props, restProps = __rest(props, ["shrink", "onChangeShrink", "children", "className"]);
     const [shrink, setShrink] = useState(shrinkProps);
+    const [hasIcon, setHasIcon] = useState(false);
     useEffect(() => {
         setShrink(shrinkProps);
     }, [shrinkProps]);
@@ -3084,11 +3084,13 @@ const TextField = (props) => {
             shrink,
             setShrink,
             onChangeShrink,
+            hasIcon,
+            setHasIcon,
         } }, restProps),
         React__default.createElement(StyledTextFieldContainer, Object.assign({ shrink: shrink, className: clsx(className, 'textField', { textField_shrink: !!shrink }) }, restProps), children)));
 };
 const TextFieldControl = (props) => {
-    const { shrink, shrinkProps, onChangeShrink, setShrink } = useContext(TextFieldContext);
+    const { shrink, shrinkProps, onChangeShrink, setShrink, hasIcon } = useContext(TextFieldContext);
     const { children } = props;
     const containerRef = useClickOutside(() => {
         if (shrinkProps) {
@@ -3123,11 +3125,16 @@ const TextFieldControl = (props) => {
     useEffect(() => {
         setShrink(shrinkProps);
     }, [shrinkProps]);
-    return (React__default.createElement("div", { ref: containerRef, onClick: onClick, className: "textField_wrapper" }, typeof children === 'function' ? children(!!shrink) : children));
+    return (React__default.createElement(Box, { ref: containerRef, onClick: onClick, className: "textField_wrapper" }, typeof children === 'function'
+        ? children({ shrink: !!shrink, hasIcon })
+        : children));
 };
 const TextFieldIcon = ({ Icon }) => {
-    const { shrink } = useContext(TextFieldContext);
+    const { shrink, setHasIcon } = useContext(TextFieldContext);
     const theme = useMantineTheme();
+    useEffect(() => {
+        Icon && setHasIcon(true);
+    }, []);
     return Icon ? (React__default.createElement(Icon, { className: `icon ${!!shrink ? 'shrink' : ''}`, shrink: shrink, size: 24, color: theme.colors.gray[9] })) : null;
 };
 TextField.Control = TextFieldControl;
@@ -3198,9 +3205,11 @@ const LeadGenForm = forwardRef((props, ref) => {
             switch (blockName) {
                 case LEADGEN_BLOCK.TextBlock: {
                     return (React__default.createElement(TextField, { key: reactKey, shrink: !!value, className: "leadgen-form_input" },
-                        React__default.createElement(TextField.Control, null, (shrink) => (React__default.createElement(TextInput, Object.assign({ name: name, spellCheck: false, withAsterisk: required, label: React__default.createElement(Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), placeholder: " ", inputWrapperOrder: LEADGEN_ORDER_INPUT_WRAPPER, type: "text", "data-control": "text" }, formInputProps, { error: error && (React__default.createElement(Flex, { align: 'center', gap: 4 },
+                        React__default.createElement(TextField.Control, null, ({ shrink }) => (React__default.createElement(TextInput, Object.assign({ name: name, spellCheck: false, withAsterisk: required, label: React__default.createElement(Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), placeholder: " ", inputWrapperOrder: LEADGEN_ORDER_INPUT_WRAPPER, type: "text", "data-control": "text" }, formInputProps, { error: error && (React__default.createElement(Flex, { align: 'center', gap: 4 },
                                 React__default.createElement(ErrorIcon, { size: 12 }),
-                                React__default.createElement(Text, { size: "c1", variant: "error" }, error))) }))))));
+                                React__default.createElement(Text, { size: "c1", variant: "error" }, error))), styles: (theme) => ({
+                                input: Object.assign(Object.assign({}, GlobalTextStyleNew(theme)[CustomStylesType.LEADGEN].p2), { color: theme.colors.gray[9], fontWeight: FontWeight.halfBold }),
+                            }) }))))));
                 }
                 case LEADGEN_BLOCK.NumberBlock: {
                     return (React__default.createElement(TextField, { key: reactKey, shrink: !!value, className: "leadgen-form_input" },
@@ -3221,7 +3230,7 @@ const LeadGenForm = forwardRef((props, ref) => {
                     return (React__default.createElement(TextField, { key: reactKey, shrink: !!value, className: clsx('leadgen-form_input', {
                             'leadgen-form_field_error': !!error,
                         }) },
-                        React__default.createElement(TextField.Control, null, (shrink) => (React__default.createElement(Input$1.Wrapper, { withAsterisk: required, "data-invalid": !!error, label: React__default.createElement(Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), inputWrapperOrder: [
+                        React__default.createElement(TextField.Control, null, ({ shrink }) => (React__default.createElement(Input$1.Wrapper, { withAsterisk: required, "data-invalid": !!error, label: React__default.createElement(Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), inputWrapperOrder: [
                                 'label',
                                 'input',
                                 'description',
@@ -3229,7 +3238,9 @@ const LeadGenForm = forwardRef((props, ref) => {
                             ], error: error && (React__default.createElement(Flex, { align: 'center', gap: 4 },
                                 React__default.createElement(ErrorIcon, { size: 12 }),
                                 React__default.createElement(Text, { size: "c1", variant: "error" }, error))) },
-                            React__default.createElement("div", { className: "mantine-Input-wrapper" },
+                            React__default.createElement(Box, { className: "mantine-Input-wrapper", sx: (theme) => ({
+                                    '.PhoneInput .PhoneInputInput': Object.assign(Object.assign({}, GlobalTextStyleNew(theme)[CustomStylesType.LEADGEN].p2), { color: theme.colors.gray[9], fontWeight: FontWeight.halfBold }),
+                                }) },
                                 React__default.createElement(Phone, Object.assign({ className: `mantine-Input-input ${classes.p2}`, name: name, spellCheck: false, placeholder: " ", defaultCountry: (locale
                                         ? MAPPED_LOCALE[locale] || 'VN'
                                         : 'VN'), type: "text", "data-control": "tel" }, formInputProps))))))));
@@ -3326,7 +3337,7 @@ const LeadGenSubscriptionBoxA = (props) => {
             imageComp),
         React__default.createElement(StyledLeadGenSubscriptionBoxBody, { className: "leadgen-subscription_box_body" },
             React__default.createElement(LeadGenForm, { ref: formRef, form: form, rules: rules, blocks: blocks, locale: locale, onFinish: onFinish, className: "leadgen-subscription_box_form" }),
-            React__default.createElement(Button$1, { disabled: loading, loading: loading, variant: "filled", size: "lg", onClick: () => {
+            React__default.createElement(Button, { disabled: loading, loading: loading, size: "lg", onClick: () => {
                     formRef.current.submit();
                 }, className: "leadgen-btn leadgen-btn_action", fullWidth: true }, submitText))));
 };
@@ -4162,8 +4173,8 @@ const ThankyouPopup = ({ title, titleAlign, subtitle, subtitleAlign, link, linkN
                     objectFit: 'cover',
                     aspectRatio: `${imageWidth}/${imageHeight}`,
                 }, loading: "lazy" }),
-            title && (React__default.createElement("h1", { className: `le-thankyou-title le-text-align-${titleAlign}` }, title)),
-            subtitle && (React__default.createElement("p", { className: `le-thankyou-subtitle le-text-align-${subtitleAlign}` }, subtitle.split('\n').map((text, idx, list) => {
+            title && (React__default.createElement(Text, { size: "h4", weight: "semiBold", variant: "primary", as: "h3", className: `le-thankyou-title le-text-align-${titleAlign}` }, title)),
+            subtitle && (React__default.createElement(Text, { size: "p2", variant: "secondary", className: `le-thankyou-subtitle le-text-align-${subtitleAlign}` }, subtitle.split('\n').map((text, idx, list) => {
                 const isShowBr = idx < list.length - 1;
                 return (React__default.createElement(React__default.Fragment, null,
                     text,
@@ -4323,9 +4334,9 @@ const SubtitleBlock = ({ children, align, }) => (React__default.createElement("p
 
 const TitleBlock = ({ children, align, }) => (React__default.createElement("h2", { className: `lead-modal__title ${'le-text-align-' + (align || '')} ${LEAD_CLASS}` }, children));
 
-const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, }) => {
+const LightboxFields = ({ listBlockAdded, popupId, locale, hasSubmitBtn, isSubmitLoading, disabledButtonSubmit, }) => {
     const { t } = useTranslations();
-    const { classes } = useTextStyles();
+    const { setRedirectUrl } = useContext(LeadGenContext$1);
     const form = useLeadFormContext();
     const formValues = form.values;
     const labelTuples = useMemo(() => {
@@ -4346,7 +4357,7 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                 return (React__default.createElement(SubtitleBlock, { key: index, align: align }, value));
             case 'TextBlock':
                 return (React__default.createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
-                    React__default.createElement(TextField.Control, null, (shrink) => (React__default.createElement(TextInput, Object.assign({ withAsterisk: required, spellCheck: false, type: "text", placeholder: " ", 
+                    React__default.createElement(TextField.Control, null, ({ shrink }) => (React__default.createElement(TextInput, Object.assign({ withAsterisk: required, spellCheck: false, type: "text", placeholder: " ", 
                         // className="lead-modal__form-control leadgen-form_field"
                         // onChangeRaw={(e) => inputOnChange('text', e)}
                         label: React__default.createElement(Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), "data-control": "text", "data-lead-control": name, "data-is-required": required, inputWrapperOrder: [
@@ -4356,10 +4367,13 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                             'error',
                         ] }, form.getInputProps(value), { name: value, error: form.errors[value] && (React__default.createElement(Flex, { align: 'center', gap: 4 },
                             React__default.createElement(ErrorIcon, { size: 12 }),
-                            React__default.createElement(Text, { size: "c1", variant: "error" }, form.errors[value]))) }))))));
+                            React__default.createElement(Text, { size: "c1", variant: "error" }, form.errors[value]))), styles: (theme) => ({
+                            input: Object.assign(Object.assign({}, GlobalTextStyleNew(theme)[CustomStylesType.LEADGEN]
+                                .p2), { color: theme.colors.gray[9], fontWeight: FontWeight.halfBold }),
+                        }) }))))));
             case 'NumberBlock':
                 return (React__default.createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
-                    React__default.createElement(TextField.Control, null, (shrink) => (React__default.createElement(NumberInput$1, Object.assign({ withAsterisk: required, spellCheck: false, type: "number", placeholder: " ", 
+                    React__default.createElement(TextField.Control, null, ({ shrink }) => (React__default.createElement(NumberInput$1, Object.assign({ withAsterisk: required, spellCheck: false, type: "number", placeholder: " ", 
                         // className="lead-modal__form-control leadgen-form_field"
                         // onChange={(e) => inputOnChange('number', e)}
                         label: React__default.createElement(Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), "data-control": "number", "data-lead-control": name, "data-is-required": required, name: value, inputWrapperOrder: [
@@ -4369,10 +4383,13 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                             'error',
                         ] }, form.getInputProps(value), { error: form.errors[value] && (React__default.createElement(Flex, { align: 'center', gap: 4 },
                             React__default.createElement(ErrorIcon, { size: 12 }),
-                            React__default.createElement(Text, { size: "c1", variant: "error" }, form.errors[value]))) }))))));
+                            React__default.createElement(Text, { size: "c1", variant: "error" }, form.errors[value]))), styles: (theme) => ({
+                            input: Object.assign(Object.assign({}, GlobalTextStyleNew(theme)[CustomStylesType.LEADGEN]
+                                .p2), { color: theme.colors.gray[9], fontWeight: FontWeight.halfBold }),
+                        }) }))))));
             case 'EmailBlock':
                 return (React__default.createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
-                    React__default.createElement(TextField.Control, null, (shrink) => (React__default.createElement(TextInput, Object.assign({ withAsterisk: required, spellCheck: false, 
+                    React__default.createElement(TextField.Control, null, ({ shrink }) => (React__default.createElement(TextInput, Object.assign({ withAsterisk: required, spellCheck: false, 
                         // type="email"
                         placeholder: " ", 
                         // className="lead-modal__form-control leadgen-form_field"
@@ -4384,8 +4401,8 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                         ] }, form.getInputProps(value), { error: form.errors[value] && (React__default.createElement(Flex, { align: 'center', gap: 4 },
                             React__default.createElement(ErrorIcon, { size: 12 }),
                             React__default.createElement(Text, { size: "c1", variant: "error" }, form.errors[value]))), styles: (theme) => ({
-                            input: GlobalTextStyleNew(theme)[CustomStylesType.LEADGEN]
-                                .p2,
+                            input: Object.assign(Object.assign({}, GlobalTextStyleNew(theme)[CustomStylesType.LEADGEN]
+                                .p2), { color: theme.colors.gray[9], fontWeight: FontWeight.halfBold }),
                         }) }))))));
             case 'PhoneOtpBlock':
             case 'WhatsappOtpBlock':
@@ -4396,7 +4413,7 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                 return (React__default.createElement(TextField, { key: index, shrink: !!formValue, className: clsx('lead-modal__form-control leadgen-form_field', {
                         'leadgen-form_field_error': !!error,
                     }) },
-                    React__default.createElement(TextField.Control, null, (shrink) => (React__default.createElement(Input$1.Wrapper, { size: "md", withAsterisk: required, label: React__default.createElement(Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), "data-invalid": !!error, labelProps: { htmlFor: htmlForId }, inputWrapperOrder: [
+                    React__default.createElement(TextField.Control, null, ({ shrink }) => (React__default.createElement(Input$1.Wrapper, { size: "md", withAsterisk: required, label: React__default.createElement(Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), "data-invalid": !!error, labelProps: { htmlFor: htmlForId }, inputWrapperOrder: [
                             'label',
                             'input',
                             'description',
@@ -4404,8 +4421,10 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                         ], error: form.errors[value] && (React__default.createElement(Flex, { align: 'center', gap: 4 },
                             React__default.createElement(ErrorIcon, { size: 12 }),
                             React__default.createElement(Text, { size: "c1", variant: "error" }, form.errors[value]))) },
-                        React__default.createElement("div", { className: "mantine-Input-wrapper" },
-                            React__default.createElement(Phone, Object.assign({ className: `mantine-Input-input ${classes.p2}`, name: value, spellCheck: false, type: "tel", placeholder: " ", 
+                        React__default.createElement(Box, { className: "mantine-Input-wrapper", sx: (theme) => ({
+                                '.PhoneInput .PhoneInputInput': Object.assign(Object.assign({}, GlobalTextStyleNew(theme)[CustomStylesType.LEADGEN].p2), { color: theme.colors.gray[9], fontWeight: FontWeight.halfBold }),
+                            }) },
+                            React__default.createElement(Phone, Object.assign({ className: `mantine-Input-input`, name: value, spellCheck: false, type: "tel", placeholder: " ", 
                                 // onBlur={(e) => inputOnBlur('tel', e)}
                                 id: htmlForId, defaultCountry: (locale
                                     ? MAPPED_LOCALE[locale] || 'VN'
@@ -4413,14 +4432,19 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
             }
             case 'LocationBlock': {
                 return (React__default.createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
-                    React__default.createElement(TextField.Control, null, (shrink) => (React__default.createElement(GoogleLocationBlock, Object.assign({ withAsterisk: required, name: value, placeholder: " ", label: React__default.createElement(Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), "data-control": "text", "data-lead-control": name, "data-is-required": required, locale: locale, inputWrapperOrder: [
+                    React__default.createElement(TextField.Control, null, ({ shrink, hasIcon }) => (React__default.createElement(GoogleLocationBlock, Object.assign({ withAsterisk: required, name: value, placeholder: " ", label: React__default.createElement(Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), "data-control": "text", "data-lead-control": name, "data-is-required": required, locale: locale, inputWrapperOrder: [
                             'label',
                             'input',
                             'description',
                             'error',
                         ] }, form.getInputProps(value), { error: form.errors[value] && (React__default.createElement(Flex, { align: 'center', gap: 4 },
                             React__default.createElement(ErrorIcon, { size: 12 }),
-                            React__default.createElement(Text, { size: "c1", variant: "error" }, form.errors[value]))) })))),
+                            React__default.createElement(Text, { size: "c1", variant: "error" }, form.errors[value]))), styles: (theme) => ({
+                            input: Object.assign(Object.assign(Object.assign({}, GlobalTextStyleNew(theme)[CustomStylesType.LEADGEN]
+                                .p2), { color: theme.colors.gray[9], fontWeight: FontWeight.halfBold }), (hasIcon && {
+                                paddingRight: `${rem(28)} !important`,
+                            })),
+                        }) })))),
                     React__default.createElement(TextField.Icon, { Icon: MapPin })));
             }
             case 'DateBlock': {
@@ -4432,11 +4456,20 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
             }
             case 'LinkButtonBlock':
                 return (React__default.createElement("div", { key: index },
-                    React__default.createElement("a", { target: newtab ? 'blank' : 'parrent', href: url, style: { textDecoration: 'none' } },
-                        React__default.createElement(Button, { type: "button", size: "md", className: `lead-modal__btn ${LEAD_CLASS}`, onClick: () => {
-                                onClose === null || onClose === void 0 ? void 0 : onClose();
-                                onOtherSubmit === null || onOtherSubmit === void 0 ? void 0 : onOtherSubmit();
-                            } }, value))));
+                    React__default.createElement(Button, Object.assign({ type: hasSubmitBtn ? 'button' : 'submit', size: "md", className: `lead-modal__btn ${LEAD_CLASS}` }, (!hasSubmitBtn && {
+                        loading: isSubmitLoading,
+                        disabled: disabledButtonSubmit,
+                    }), { onClick: () => {
+                            if (hasSubmitBtn) {
+                                window.open(url, newtab ? '_blank' : undefined);
+                            }
+                            else {
+                                setRedirectUrl({
+                                    url,
+                                    target: newtab ? '_blank' : undefined,
+                                });
+                            }
+                        } }), value)));
             case 'CheckboxBlock':
                 return (React__default.createElement(ChoiceField, { className: "leadgen-form_checkbox", key: index },
                     isSendMailChimp && (React__default.createElement("div", { style: {
@@ -4451,7 +4484,9 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                             gap: 8,
                         }, inputWrapperOrder: ['label', 'input', 'description', 'error'], inputContainer: (children) => {
                             return (React__default.createElement("div", { className: "leadgen-choiceContainer" }, children));
-                        } }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default.createElement(Checkbox, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "checkbox", "data-lead-control": name, "data-is-required": required }))))));
+                        } }, form.getInputProps(value), { error: form.errors[value] && (React__default.createElement(Flex, { align: 'center', gap: 4 },
+                            React__default.createElement(ErrorIcon, { size: 12 }),
+                            React__default.createElement(Text, { size: "c1", variant: "error" }, form.errors[value]))) }), listQuestion.map((l, _index) => (React__default.createElement(Checkbox, { name: value, key: _index, value: l.value, label: React__default.createElement(Text, { size: "p2", variant: "primary" }, l.placeholder), "data-control": "checkbox", "data-lead-control": name, "data-is-required": required }))))));
             case 'RadioBlock':
                 return (React__default.createElement(ChoiceField, { className: "leadgen-form_radio", key: index },
                     isSendMailChimp && (React__default.createElement(Input$1, { type: "hidden", name: value + '-mailchimp', value: isSendMailChimp })),
@@ -4459,10 +4494,12 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                         // className="lead-modal__form-control leadgen-form_field"
                         label: React__default.createElement(Text, { size: "p2", variant: "primary" }, label), size: "md", inputWrapperOrder: ['label', 'input', 'description', 'error'], inputContainer: (children) => {
                             return (React__default.createElement("div", { className: "leadgen-choiceContainer" }, children));
-                        } }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default.createElement(Radio, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "radio", "data-lead-control": name, "data-is-required": required }))))));
+                        } }, form.getInputProps(value), { error: form.errors[value] && (React__default.createElement(Flex, { align: 'center', gap: 4 },
+                            React__default.createElement(ErrorIcon, { size: 12 }),
+                            React__default.createElement(Text, { size: "c1", variant: "error" }, form.errors[value]))) }), listQuestion.map((l, _index) => (React__default.createElement(Radio, { name: value, key: _index, value: l.value, label: React__default.createElement(Text, { size: "p2", variant: "primary" }, l.placeholder), "data-control": "radio", "data-lead-control": name, "data-is-required": required }))))));
             case 'DropdownBlock':
                 return (React__default.createElement(TextField, { shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field DropdownBlock", key: index },
-                    React__default.createElement(TextField.Control, null, (shrink) => (React__default.createElement(React__default.Fragment, null,
+                    React__default.createElement(TextField.Control, null, ({ shrink }) => (React__default.createElement(React__default.Fragment, null,
                         React__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.createElement(Select
                         // className="lead-modal__form-control leadgen-form_field"
@@ -4471,7 +4508,10 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                             label: React__default.createElement(Text, { size: shrink ? 'p3' : 'p2', variant: "secondary", weight: "halfBold" }, label), placeholder: " ", searchable: true, withAsterisk: required, name: value, data: listQuestion.map((l) => ({
                                 value: l.value,
                                 label: l.placeholder,
-                            })), nothingFound: React__default.createElement(NoData, null), rightSection: React__default.createElement(TextField.Icon, { Icon: ChevronDown }), styles: {
+                            })), nothingFound: React__default.createElement(NoData, null), rightSection: React__default.createElement(TextField.Icon, { Icon: ChevronDown }), styles: (theme) => ({
+                                wrapper: {
+                                    input: Object.assign(Object.assign({}, GlobalTextStyleNew(theme)[CustomStylesType.LEADGEN].p2), { color: theme.colors.gray[9], fontWeight: FontWeight.halfBold }),
+                                },
                                 item: {
                                     paddingBlock: 12,
                                     paddingInline: 10,
@@ -4492,13 +4532,15 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                                         paddingInline: 0,
                                     },
                                 },
-                            }, maxDropdownHeight: 192 }, form.getInputProps(value), { error: form.errors[value] && (React__default.createElement(Flex, { align: 'center', gap: 4 },
+                            }), maxDropdownHeight: 192 }, form.getInputProps(value), { error: form.errors[value] && (React__default.createElement(Flex, { align: 'center', gap: 4 },
                                 React__default.createElement(ErrorIcon, { size: 12 }),
                                 React__default.createElement(Text, { size: "c1", variant: "error" }, form.errors[value]))) })))))));
             case 'TncBlock':
                 const _d = form.getInputProps(`TNC-${id}`), { error } = _d, tncInputProps = __rest(_d, ["error"]);
                 return (React__default.createElement(ChoiceField, { className: "leadgen-form_checkbox", key: id },
-                    React__default.createElement(Input$1.Wrapper, { error: error },
+                    React__default.createElement(Input$1.Wrapper, { error: error && (React__default.createElement(Flex, { align: 'center', gap: 4 },
+                            React__default.createElement(ErrorIcon, { size: 12 }),
+                            React__default.createElement(Text, { size: "c1", variant: "error" }, error))) },
                         React__default.createElement(Checkbox, Object.assign({ name: 'TNC-' + id, label: React__default.createElement(Text, { as: "span", size: "c1", variant: "secondary", dangerouslySetInnerHTML: { __html: data.valueHTML }, styles: (theme) => ({
                                     root: {
                                         a: {
@@ -5084,7 +5126,7 @@ const LightboxLayout = ({ popupId, extraFields, onClose: onCloseProp, onOtherSub
         React__default.createElement("form", { ref: formRef, className: "leadgen-form", onFocus: onFocus, onSubmit: middlewareOnSubmit },
             React__default.createElement(FormContainer, { title: title, titleAlign: titleAlign, description: description, descriptionAlign: descriptionAlign, header: headerInsideFormContainer && PopupHeader, footer: hasForm ? ButtonSubmit : ButtonLink, "data-hidden-form": !hasForm },
                 React__default.createElement("div", { className: "leadgen-form_inner" },
-                    React__default.createElement(LightboxFields, { listBlockAdded: listBlockAdded, popupId: popupId, locale: locale, onClose: onClose, onOtherSubmit: onOtherSubmit })))),
+                    React__default.createElement(LightboxFields, { listBlockAdded: listBlockAdded, popupId: popupId, locale: locale, onClose: onClose, onOtherSubmit: onOtherSubmit, hasSubmitBtn: Boolean(ButtonSubmit), isSubmitLoading: isSubmitLoading, disabledButtonSubmit: disabledButtonSubmit })))),
         React__default.createElement("div", { style: {
                 height: `${bottomSpacing}px`,
                 width: '100%',
@@ -5465,6 +5507,7 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, primaryColor
     const [action, setAction] = useState('');
     const [showThankyou, setShowThankyou] = useState(null);
     const [showEmpty, setShowEmpty] = useState(false);
+    const [redirectUrl, setRedirectUrl] = useState();
     const currentLayout = useMemo(() => showCampaign === null || showCampaign === void 0 ? void 0 : showCampaign.extra_fields.currentLayout, [showCampaign === null || showCampaign === void 0 ? void 0 : showCampaign.extra_fields.currentLayout]);
     useEffect(() => {
         if (forceCampaign) {
@@ -5707,6 +5750,10 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, primaryColor
                 }),
         ]);
         onSubmitProps === null || onSubmitProps === void 0 ? void 0 : onSubmitProps(formDataObj);
+        if (redirectUrl === null || redirectUrl === void 0 ? void 0 : redirectUrl.url) {
+            window.open(redirectUrl === null || redirectUrl === void 0 ? void 0 : redirectUrl.url, (redirectUrl === null || redirectUrl === void 0 ? void 0 : redirectUrl.target) || '_self');
+            onClose();
+        }
         if ((showCampaign === null || showCampaign === void 0 ? void 0 : showCampaign.extra_fields.popupShowThankYou) == 'notshow') {
             onClose();
             document.body.classList.remove('noscroll');
@@ -5795,6 +5842,8 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, primaryColor
             siteDomain,
             siteId,
             locale,
+            redirectUrl,
+            setRedirectUrl,
         } },
         React__default.createElement(TranslationsContext.Provider, { value: { locale, values: getTranslations(locale) } },
             React__default.createElement(MantineProvider, { locale: locale, customStyleType: CustomStylesType.LEADGEN }, children ? (React__default.createElement(Component, { campaign: showCampaign, onSubmit: onSubmit, onClose: onClose, showThankyou: showThankyou, setShowThankyou: setShowThankyou, locale: locale, showEmpty: showEmpty, setShowEmpty: setShowEmpty, userInfo: userInfo }, children)) : (React__default.createElement(Portal, { target: getPopupWrapperDom() },

package/build/esm/{logoIcon-ed7518ac.js → logoIcon-881e75a9.js}

@@ -1,6 +1,6 @@
 import React__default, { memo, useMemo } from 'react';
-import { C as CommonGAssets } from './index-b8d0efc2.js';
-import { I as ImageWrap } from './index-f27e8f3a.js';
+import { C as CommonGAssets } from './index-0ec41385.js';
+import { I as ImageWrap } from './index-0711a88b.js';
 
 const _LogoIcon = ({ type, width, height }) => {
     const data = useMemo(() => {

package/build/esm/mantine.js

@@ -1,44 +1,44 @@
-import { g as StyledTextArea, D as DEBOUNCED_TIME, h as StyledSliderWrapper, i as StyledSlider } from './index-9485507e.js';
-export { j as Accordion, A as Anchor, b as AspectRatio, a as Avatar, B as Breadcrumbs, k as Carousel, c as CentralCarousel, d as Checkbox, e as ChipButton, I as Input, O as OTP, P as Phone, m as Popover, R as Radio, S as Select, l as emotionCache } from './index-9485507e.js';
-export { D as DatePicker } from './index-5469d13f.js';
-export { T as Text } from './index-e24c7f31.js';
-import { B as Button } from './index-2d6a701d.js';
-export { B as Button } from './index-2d6a701d.js';
-export { I as Indicator } from './index-6a2ca5f4.js';
+import { g as StyledTextArea, D as DEBOUNCED_TIME, h as StyledSliderWrapper, i as StyledSlider } from './index-b6d973dd.js';
+export { j as Accordion, A as Anchor, b as AspectRatio, a as Avatar, B as Breadcrumbs, k as Carousel, c as CentralCarousel, d as Checkbox, e as ChipButton, I as Input, O as OTP, P as Phone, m as Popover, R as Radio, S as Select, l as emotionCache } from './index-b6d973dd.js';
+export { D as DatePicker } from './index-b82d0972.js';
+export { T as Text } from './index-5e7f0f03.js';
+import { B as Button } from './index-66276a9c.js';
+export { B as Button } from './index-66276a9c.js';
+export { I as Indicator } from './index-b4b97054.js';
 import React__default, { useState, useEffect } from 'react';
-export { M as Modal } from './index-29f75d77.js';
-import { _ as __rest } from './tslib.es6-54c227c4.js';
+export { M as Modal } from './index-e4fa2bc8.js';
+import { _ as __rest } from './tslib.es6-63503aab.js';
 import { Badge as Badge$1, LoadingOverlay as LoadingOverlay$1, clsx, Title, Text, Button as Button$1 } from '@mantine/core';
 import { theme } from './miscTheme.js';
-export { S as Spoiler } from './index-a3991831.js';
+export { S as Spoiler } from './index-c11e7684.js';
 import { useDebouncedValue } from '@mantine/hooks';
-export { S as Switch } from './index-391c3659.js';
-export { M as MantineProvider } from './index-6a3d20c1.js';
-export { M as MAPPED_LOCALE, a as getHeadingStyles, g as getMantineThemeOverride, s as showNotification, t as themeColors, u as useMantineLocale } from './index-e2c81cdc.js';
-export { C as CustomStylesType, F as FontWeight } from './text-9556acd7.js';
-export { T as Tabs } from './index-cdc909e2.js';
+export { S as Switch } from './index-45d227b8.js';
+export { M as MantineProvider } from './index-b21f3d25.js';
+export { M as MAPPED_LOCALE, a as getHeadingStyles, g as getMantineThemeOverride, s as showNotification, t as themeColors, u as useMantineLocale } from './index-a4324037.js';
+export { C as CustomStylesType, F as FontWeight } from './text-f42660ed.js';
+export { T as Tabs } from './index-44efbc04.js';
 import '@hhgtech/icons/other';
-import './index-b8d0efc2.js';
+import './index-0ec41385.js';
 import './constantsDomainLocales.js';
-import './Locale-5e840eb9.js';
+import './Locale-3e4b8c38.js';
 import './constantsIsProduction.js';
-import './index-f27e8f3a.js';
-import './utils-ce6dad59.js';
+import './index-0711a88b.js';
+import './utils-da66e349.js';
 import '@emotion/styled';
 import '@mantine/carousel';
 import 'classnames';
-import './useUniqueId-b76ebd23.js';
+import './useUniqueId-fae959f7.js';
 import './constantsSite.js';
-import './index-95a9f864.js';
+import './index-eac00c0c.js';
 import '@hhgtech/icons/core';
 import '@mantine/dates';
-import './index-78fe08df.js';
+import './index-6e677190.js';
 import 'date-fns/locale';
 import './constantsRiskScreener.js';
-import './shared-306f242d.js';
-import './index.styles-7fd25fc3.js';
-import './index-564e9a8d.js';
-import './translationsContext-f3d56104.js';
+import './shared-3c7d70e1.js';
+import './index.styles-48ae711d.js';
+import './index-60c99ce8.js';
+import './translationsContext-3873db9a.js';
 import 'dayjs';
 import '@mantine/notifications';
 

package/build/esm/misc.js

@@ -1,37 +1,37 @@
-export { a as ageGenerate, c as convertLocalizedStringToNumber, f as formatPhoneNumber, l as localizeNumberFormat } from './localizeNumberFormat-3e0bd7c2.js';
-export { h as fadeIn, a as slideInDown, b as slideInLeft, c as slideInRight, s as slideInUp, e as slideOutDown, f as slideOutLeft, g as slideOutRight, d as slideOutUp } from './animation-abff79e1.js';
+export { a as ageGenerate, c as convertLocalizedStringToNumber, f as formatPhoneNumber, l as localizeNumberFormat } from './localizeNumberFormat-d409c1be.js';
+export { h as fadeIn, a as slideInDown, b as slideInLeft, c as slideInRight, s as slideInUp, e as slideOutDown, f as slideOutLeft, g as slideOutRight, d as slideOutUp } from './animation-c174f460.js';
 export { deleteCookie, getCookie, setCookie } from './miscCookieHelper.js';
 import 'react';
 import '@mantine/core';
-import './index-e2c81cdc.js';
-import './text-9556acd7.js';
-export { a as abbreviateNumber } from './number-fc88fb8e.js';
-export { d as getCareApiDomain, g as getCurrentBaseUrl, a as getCurrentSsoUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain } from './normalizeLink-ee918625.js';
+import './index-a4324037.js';
+import './text-f42660ed.js';
+export { a as abbreviateNumber } from './number-54efc519.js';
+export { d as getCareApiDomain, g as getCurrentBaseUrl, a as getCurrentSsoUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain } from './normalizeLink-37631875.js';
 export { MBTheme, theme } from './miscTheme.js';
-export { B as Breakpoints, M as MediaQueries, S as Screens, d as convertDay, f as formatUrlWithPageParam, g as getBoundariesFromMediaQueryKey, a as getPopupWrapperDom, b as getWrapperDomWithSelector, m as makeParams, c as safeEncodeURI, s as startCase, t as toggleNoScroll } from './utils-ce6dad59.js';
+export { B as Breakpoints, M as MediaQueries, S as Screens, d as convertDay, f as formatUrlWithPageParam, g as getBoundariesFromMediaQueryKey, a as getPopupWrapperDom, b as getWrapperDomWithSelector, m as makeParams, c as safeEncodeURI, s as startCase, t as toggleNoScroll } from './utils-da66e349.js';
 export { formatHealthTool, getDynamicHealthTool, getDynamicHealthToolWithCache } from './miscGetDynamicHealthTool.js';
 export { getSocialList } from './miscGetSocialList.js';
 export { ScreenSizeContext, ScreenSizeContextProvider, getWindowSizeGroups } from './miscScreenSizeContext.js';
-export { f as formatPill } from './dataTransform-2068d763.js';
+export { f as formatPill } from './dataTransform-9748fec6.js';
 import 'dayjs';
 import 'react-phone-number-input';
 import '@emotion/react';
-import './tslib.es6-54c227c4.js';
-import './index-95a9f864.js';
-import './Locale-5e840eb9.js';
+import './tslib.es6-63503aab.js';
+import './index-eac00c0c.js';
+import './Locale-3e4b8c38.js';
 import '@mantine/notifications';
-import './index-78fe08df.js';
+import './index-6e677190.js';
 import 'date-fns/locale';
 import './constantsSite.js';
 import './constantsDomainLocales.js';
 import './constantsRiskScreener.js';
 import './constantsIsProduction.js';
-import './index-b8d0efc2.js';
-import './shared-306f242d.js';
-import './core-8a2d6088.js';
-import './WhatsApp-a0cd9c13.js';
-import './index-539fd016.js';
-import './index-b5f1922a.js';
+import './index-0ec41385.js';
+import './shared-3c7d70e1.js';
+import './core-f2059138.js';
+import './WhatsApp-327a6af4.js';
+import './index-5982a911.js';
+import './index-4a6c38f3.js';
 import 'js-cookie';
 import 'uuid';
 import 'lodash/throttle';

package/build/esm/miscGetDynamicHealthTool.js

@@ -1,8 +1,8 @@
-import { a as __awaiter } from './tslib.es6-54c227c4.js';
-import { e as normalizeLinkSlash, c as getDiscoverApiDomain } from './normalizeLink-ee918625.js';
-import { g as getDataWithCache } from './core-8a2d6088.js';
+import { a as __awaiter } from './tslib.es6-63503aab.js';
+import { e as normalizeLinkSlash, c as getDiscoverApiDomain } from './normalizeLink-37631875.js';
+import { g as getDataWithCache } from './core-f2059138.js';
 import './constantsDomainLocales.js';
-import './Locale-5e840eb9.js';
+import './Locale-3e4b8c38.js';
 import './constantsIsProduction.js';
 
 const formatHealthTool = (healthTool, locale) => {