@hhgtech/hhg-components 1.29.343 → 1.29.344-beta-1

package/build/esm/lead/newLeadPopup.d.ts

@@ -1,6 +1,6 @@
 import React, { Dispatch, SetStateAction } from 'react';
-import { LOCALE } from "../interfaces/types";
-export declare const NewLeadPopup: ({ campaign, action, onSubmit, onClose, showThankyou, locale, showEmpty, setShowEmpty, }: {
+import { LOCALE, UserInfo } from "../interfaces/types";
+export declare const NewLeadPopup: ({ campaign, action, onSubmit, onClose, showThankyou, locale, showEmpty, setShowEmpty, userInfo, }: {
     campaign: any;
     action?: string;
     onSubmit?: (currentForm: HTMLFormElement, values?: Record<string, any>, categoryLevel?: number, categoryData?: {
@@ -23,4 +23,5 @@ export declare const NewLeadPopup: ({ campaign, action, onSubmit, onClose, showT
     locale?: LOCALE;
     showEmpty?: boolean;
     setShowEmpty?: Dispatch<SetStateAction<boolean>>;
+    userInfo?: UserInfo | null;
 }) => React.JSX.Element;

package/build/esm/lead.js

@@ -1,44 +1,44 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-69e90f6a.js';
-import React__default, { createContext, useEffect, useMemo, useRef, useState, useContext, useCallback } from 'react';
+import { _ as __rest, a as __awaiter } from './tslib.es6-46bc9308.js';
+import React__default, { createContext, useMemo, useEffect, useRef, useState, useContext, useCallback } from 'react';
 import { createStyles, Box, Autocomplete, clsx, Input as Input$1, TextInput, NumberInput as NumberInput$1, Button as Button$2, Portal, Transition, Overlay } from '@mantine/core';
 import dayjs from 'dayjs';
 import debounce from 'lodash/debounce';
 import { createFormContext } from '@mantine/form';
-import { u as useTranslations } from './index-edd98830.js';
-import { T as Text } from './index-c587e0f0.js';
-import { S as Select, d as Checkbox, I as Input, R as Radio, P as Phone, N as NumberInput } from './index-2e41ac6b.js';
-import { D as DatePicker } from './index-b0c80fc5.js';
-import { M as MAPPED_LOCALE } from './utils-063d5573.js';
+import { u as useTranslations } from './index-17ac735f.js';
+import { T as TranslationsContext } from './translationsContext-a4d5ef98.js';
+import { getCookie, setCookie } from './miscCookieHelper.js';
+import { b as getWrapperDomWithSelector, a as getPopupWrapperDom } from './utils-2ed3ab9a.js';
+import { T as Text } from './index-53acd19b.js';
+import { S as Select, d as Checkbox, I as Input, R as Radio, P as Phone, N as NumberInput } from './index-60383232.js';
+import { D as DatePicker } from './index-d38d6cf1.js';
+import { M as MAPPED_LOCALE } from './utils-965d1297.js';
 import '@mantine/dates';
-import { Z as ZINDEX_SSO } from './index-ac444850.js';
-import './index-067e0be1.js';
-import { C as CommonGAssets } from './index-3a4052c7.js';
-import './useMantineLocale-19c891e6.js';
-import { B as Button$1 } from './index-fd8aa171.js';
-import './index.styles-0fb6722d.js';
-import { T as TranslationsContext } from './translationsContext-1afbf924.js';
+import { Z as ZINDEX_SSO } from './index-27b94427.js';
+import './index-926b6794.js';
+import { C as CommonGAssets } from './index-830c091f.js';
+import './useMantineLocale-850125d6.js';
+import { B as Button$1 } from './index-eb828ee9.js';
+import './index.styles-96f9e18e.js';
 import { useClickOutside } from '@mantine/hooks';
-import { b as getWrapperDomWithSelector, a as getPopupWrapperDom } from './utils-fd96839b.js';
-import './other-6ba313a1.js';
-import './index-8a426614.js';
-import { u as usePlacesAutocomplete, G as GOOGLE_API_KEY } from './usePlacesAutocomplete-8c4362e3.js';
-import { B as Button } from './index-67fadae7.js';
-import { H as Heading$1 } from './index-9c2c33dc.js';
+import './other-7fd66ceb.js';
+import './index-d8cbd450.js';
+import { u as usePlacesAutocomplete, G as GOOGLE_API_KEY } from './usePlacesAutocomplete-e19b097d.js';
+import { B as Button } from './index-f9976aa8.js';
+import { H as Heading$1 } from './index-7cf499e2.js';
 import { v1 } from 'uuid';
-import { i as isVideo } from './index-521a997e.js';
-import { D as DrawerComponent } from './index-36914dd0.js';
-import { u as useScreenSize } from './useScreenSize-fdb63765.js';
+import { i as isVideo } from './index-9df99a81.js';
+import { D as DrawerComponent } from './index-5226c12f.js';
+import { u as useScreenSize } from './useScreenSize-501097b1.js';
 import { createPortal } from 'react-dom';
 import { css } from '@emotion/react';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { getCookie, setCookie } from './miscCookieHelper.js';
-import { C as Close } from './Close-e79a04cc.js';
+import { C as Close } from './Close-4d730645.js';
 import '@hhgtech/icons/other';
 import '@mantine/carousel';
-import './Locale-2342195e.js';
+import './Locale-4b56a605.js';
 import 'classnames';
-import './useUniqueId-8ea18781.js';
+import './useUniqueId-924f27a7.js';
 import './constantsSite.js';
 import '@hhgtech/icons/core';
 import 'date-fns/locale';
@@ -135,6 +135,42 @@ const LEAD_TIMEZONE_DATA = {
     9: 'Asia/Manila', // Philippines / Filipinos Site
 };
 
+const SSO_MAP_LEAD = ['name', 'email', 'birthday', 'phone', 'gender'];
+const mappingSSOToLead = (userInfoProps) => {
+    try {
+        const { id, area_code } = userInfoProps;
+        if (!userInfoProps || !id) {
+            return;
+        }
+        const user = {};
+        for (const ssoKey of SSO_MAP_LEAD) {
+            if (ssoKey in userInfoProps &&
+                typeof (userInfoProps === null || userInfoProps === void 0 ? void 0 : userInfoProps[ssoKey]) !== 'undefined') {
+                const initValue = userInfoProps[ssoKey];
+                if (ssoKey === 'birthday') {
+                    const dob = dayjs(initValue, 'YYYY-MM-DD', true);
+                    if (dob.isValid()) {
+                        user.birthday = dob;
+                    }
+                }
+                else if (ssoKey === 'gender') {
+                    user.gender = initValue.toString();
+                }
+                else if (ssoKey === 'phone' && typeof area_code !== 'undefined') {
+                    user.phone = area_code + initValue;
+                }
+                else {
+                    user[ssoKey] = initValue;
+                }
+            }
+        }
+        return Object.values(user).length ? user : undefined;
+    }
+    catch (error) {
+        return;
+    }
+};
+
 class Store {
     constructor() {
         this.apiLeadUrl = 'https://dev.leadgen.hellobacsi.com/';
@@ -353,8 +389,9 @@ const clearCacheUsedEmailOrPhone = () => {
 
 // You can give context variables any name
 const [LeadFormProvider$1, useLeadFormContext$1, useLeadForm$1] = createFormContext();
-const useLeadFormConfig$1 = ({ listBlockAdded = [], validatingPhoneRef, validatingEmailRef, campaignId, campaign_subot_id = [], }) => {
+const useLeadFormConfig$1 = ({ listBlockAdded = [], validatingPhoneRef, validatingEmailRef, campaignId, campaign_subot_id = [], userInfo: userInfoProps, }) => {
     const { t } = useTranslations();
+    const initialValues = useMemo(() => mappingSSOToLead(userInfoProps), [userInfoProps === null || userInfoProps === void 0 ? void 0 : userInfoProps.id]);
     useEffect(() => {
         if (!window.intlTelInputUtils) {
             require('intl-tel-input/build/js/utils');
@@ -514,13 +551,14 @@ const useLeadFormConfig$1 = ({ listBlockAdded = [], validatingPhoneRef, validati
         validateInputOnChange: true,
         clearInputErrorOnChange: true,
         validate: validateObj,
+        initialValues,
     });
     const formRef = useRef(form);
     formRef.current = form;
     return { form, validateObj };
 };
 
-const Component = ({ campaign, onClose: onCloseProp, onOtherSubmit, onSubmit, showThankyou, setShowThankyou, locale, children, showEmpty, setShowEmpty, }) => {
+const Component = ({ campaign, onClose: onCloseProp, onOtherSubmit, onSubmit, showThankyou, setShowThankyou, locale, children, showEmpty, setShowEmpty, userInfo, }) => {
     var _a, _b;
     const extraFields = campaign.extra_fields;
     const campaignId = campaign.id;
@@ -538,6 +576,7 @@ const Component = ({ campaign, onClose: onCloseProp, onOtherSubmit, onSubmit, sh
         validatingEmailRef,
         campaignId,
         campaign_subot_id,
+        userInfo,
     });
     const [showOtpPhone, setShowOtpPhone] = useState(null);
     const [formRef, setFormRef] = useState(null);
@@ -1547,8 +1586,9 @@ const GoogleLocation = (props) => {
 
 // You can give context variables any name
 const [LeadFormProvider, useLeadFormContext, useLeadForm] = createFormContext();
-const useLeadFormConfig = ({ listBlockAdded = [], validatingPhoneRef, validatingEmailRef, campaignId, campaign_subot_id = [], }) => {
+const useLeadFormConfig = ({ listBlockAdded = [], validatingPhoneRef, validatingEmailRef, campaignId, campaign_subot_id = [], userInfo: userInfoProps, }) => {
     const { t } = useTranslations();
+    const initialValues = useMemo(() => mappingSSOToLead(userInfoProps), [userInfoProps === null || userInfoProps === void 0 ? void 0 : userInfoProps.id]);
     const validateObj = useMemo(() => {
         const InputBlocks = [
             'TextBlock',
@@ -1704,6 +1744,7 @@ const useLeadFormConfig = ({ listBlockAdded = [], validatingPhoneRef, validating
         validateInputOnChange: true,
         clearInputErrorOnChange: true,
         validate: validateObj,
+        initialValues,
     });
     const formRef = useRef(form);
     formRef.current = form;
@@ -2053,7 +2094,7 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
     const formValues = form.values;
     return (React__default.createElement(React__default.Fragment, null, listBlockAdded.map((b, index) => {
         var _a;
-        const { name = '', data = {} } = b || {};
+        const { name = '', data = {}, id } = b || {};
         const { placeholder, value, align, listQuestion, isSendMailChimp = false, newtab, url, } = data;
         const required = (_a = data.required) !== null && _a !== void 0 ? _a : true;
         const formValue = (formValues === null || formValues === void 0 ? void 0 : formValues[value]) || null;
@@ -2063,20 +2104,20 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
             case 'SubtitleBlock':
                 return (React__default.createElement(SubtitleBlock, { key: index, align: align }, value));
             case 'TextBlock':
-                return (React__default.createElement(TextField, { shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
-                    React__default.createElement(TextInput, Object.assign({ key: index, withAsterisk: required, spellCheck: false, type: "text", placeholder: placeholder, 
+                return (React__default.createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
+                    React__default.createElement(TextInput, Object.assign({ withAsterisk: required, spellCheck: false, type: "text", placeholder: placeholder, 
                         // className="lead-modal__form-control leadgen-form_field"
                         // onChangeRaw={(e) => inputOnChange('text', e)}
                         label: placeholder, "data-control": "text", name: value, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value)))));
             case 'NumberBlock':
-                return (React__default.createElement(TextField, { shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
-                    React__default.createElement(NumberInput$1, Object.assign({ key: index, withAsterisk: required, spellCheck: false, type: "number", placeholder: placeholder, 
+                return (React__default.createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
+                    React__default.createElement(NumberInput$1, Object.assign({ withAsterisk: required, spellCheck: false, type: "number", placeholder: placeholder, 
                         // className="lead-modal__form-control leadgen-form_field"
                         // onChange={(e) => inputOnChange('number', e)}
                         label: placeholder, "data-control": "number", name: value, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value)))));
             case 'EmailBlock':
-                return (React__default.createElement(TextField, { shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
-                    React__default.createElement(TextInput, Object.assign({ key: index, withAsterisk: required, spellCheck: false, 
+                return (React__default.createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
+                    React__default.createElement(TextInput, Object.assign({ withAsterisk: required, spellCheck: false, 
                         // type="email"
                         placeholder: placeholder, 
                         // className="lead-modal__form-control leadgen-form_field"
@@ -2085,28 +2126,24 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
             case 'WhatsappOtpBlock':
             case 'ZaloOtpBlock':
             case 'PhoneBlock': {
-                const id = popupId + '-' + value + '-' + index;
+                const htmlForId = popupId + '-' + value + '-' + index;
                 const _b = form.getInputProps(value), { error } = _b, formPhoneInputWrapper = __rest(_b, ["error"]);
-                return (React__default.createElement(TextField, { shrink: !!formValue, className: clsx('lead-modal__form-control leadgen-form_field', {
+                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(Input$1.Wrapper, Object.assign({ size: "md", withAsterisk: required, key: index, label: placeholder, "data-invalid": !!error, labelProps: {
-                            htmlFor: id,
-                        }, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, formPhoneInputWrapper, { error: error }),
+                    React__default.createElement(Input$1.Wrapper, { size: "md", withAsterisk: required, label: placeholder, "data-invalid": !!error, labelProps: { htmlFor: htmlForId }, inputWrapperOrder: ['label', 'input', 'description', 'error'], error: error },
                         React__default.createElement("div", { className: "mantine-Input-wrapper" },
-                            React__default.createElement(Phone, { className: "mantine-Input-input", name: value, spellCheck: false, type: "tel", placeholder: placeholder, onChange: (v) => {
-                                    form.setFieldValue(value, v);
-                                }, 
+                            React__default.createElement(Phone, Object.assign({ className: "mantine-Input-input", name: value, spellCheck: false, type: "tel", placeholder: placeholder, 
                                 // onBlur={(e) => inputOnBlur('tel', e)}
-                                id: id, defaultCountry: (locale ? MAPPED_LOCALE[locale] || 'VN' : 'VN'), "data-control": "tel" })))));
+                                id: htmlForId, defaultCountry: (locale ? MAPPED_LOCALE[locale] || 'VN' : 'VN'), "data-control": "tel" }, formPhoneInputWrapper))))));
             }
             case 'LocationBlock': {
-                return (React__default.createElement(TextField, { shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
-                    React__default.createElement(GoogleLocation, Object.assign({ withAsterisk: required, key: index, name: value, placeholder: placeholder, label: placeholder, "data-control": "text", locale: locale, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value)))));
+                return (React__default.createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
+                    React__default.createElement(GoogleLocation, Object.assign({ withAsterisk: required, name: value, placeholder: placeholder, label: placeholder, "data-control": "text", locale: locale, inputWrapperOrder: ['label', 'input', 'description', 'error'] }, form.getInputProps(value)))));
             }
             case 'DateBlock':
-                return (React__default.createElement(TextField, { shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
-                    React__default.createElement(DatePicker, Object.assign({ clearable: true, withAsterisk: required, key: index, type: "default", name: value, placeholder: placeholder, label: placeholder, inputWrapperOrder: ['label', 'input', 'description', 'error'], inputContainer: (children) => {
+                return (React__default.createElement(TextField, { key: index, shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
+                    React__default.createElement(DatePicker, Object.assign({ clearable: true, withAsterisk: required, type: "default", name: value, placeholder: placeholder, label: placeholder, inputWrapperOrder: ['label', 'input', 'description', 'error'], inputContainer: (children) => {
                             return (React__default.createElement(React__default.Fragment, null,
                                 children,
                                 React__default.createElement("input", { type: "hidden", "data-control": "date", name: value, value: formValue })));
@@ -2119,13 +2156,13 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                                 onOtherSubmit === null || onOtherSubmit === void 0 ? void 0 : onOtherSubmit();
                             } }, value))));
             case 'CheckboxBlock':
-                return (React__default.createElement(ChoiceField, { className: "leadgen-form_checkbox" },
+                return (React__default.createElement(ChoiceField, { className: "leadgen-form_checkbox", key: index },
                     isSendMailChimp && (React__default.createElement("div", { style: {
                             display: 'none',
                         }, "data-name": value + '-mailchimp' })),
                     React__default.createElement(Checkbox.Group, Object.assign({ withAsterisk: required, 
                         // className="lead-modal__form-control leadgen-form_field"
-                        key: index, label: placeholder, size: "md", sx: {
+                        label: placeholder, size: "md", sx: {
                             display: 'flex',
                             flexDirection: 'column',
                             flexWrap: 'wrap',
@@ -2134,27 +2171,29 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                             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" }))))));
             case 'RadioBlock':
-                return (React__default.createElement(ChoiceField, { className: "leadgen-form_radio" },
+                return (React__default.createElement(ChoiceField, { className: "leadgen-form_radio", key: index },
                     isSendMailChimp && (React__default.createElement(Input$1, { type: "hidden", name: value + '-mailchimp', value: isSendMailChimp })),
                     React__default.createElement(Radio.Group, Object.assign({ withAsterisk: required, 
                         // className="lead-modal__form-control leadgen-form_field"
-                        key: index, label: placeholder, size: "md", inputWrapperOrder: ['label', 'input', 'description', 'error'], inputContainer: (children) => {
+                        label: placeholder, 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" }))))));
             case 'DropdownBlock':
-                return (React__default.createElement(TextField, { shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field" },
+                return (React__default.createElement(TextField, { shrink: !!formValue, className: "lead-modal__form-control leadgen-form_field", key: index },
                     React__default.createElement("div", { style: { display: 'none' }, "data-extra": true, "data-name": value, "data-control": 'dropdown' }),
-                    React__default.createElement(Select, Object.assign({ key: index, 
+                    React__default.createElement(Select
+                    // className="lead-modal__form-control leadgen-form_field"
+                    , Object.assign({ 
                         // className="lead-modal__form-control leadgen-form_field"
                         label: placeholder, placeholder: placeholder, withAsterisk: required, name: value, data: listQuestion.map((l) => ({
                             value: l.value,
                             label: l.placeholder,
                         })) }, form.getInputProps(value)))));
             case 'TncBlock':
-                const _c = form.getInputProps(`TNC-${b.id}`), { error } = _c, tncInputProps = __rest(_c, ["error"]);
-                return (React__default.createElement(ChoiceField, { className: "leadgen-form_checkbox" },
+                const _c = form.getInputProps(`TNC-${id}`), { error } = _c, tncInputProps = __rest(_c, ["error"]);
+                return (React__default.createElement(ChoiceField, { className: "leadgen-form_checkbox", key: id },
                     React__default.createElement(Input$1.Wrapper, { error: error },
-                        React__default.createElement(Checkbox, Object.assign({ name: 'TNC-' + b.id, key: b.id, label: React__default.createElement("p", { className: "lead-modal__tnc-link", dangerouslySetInnerHTML: { __html: data.valueHTML } }), className: "tnc-block", "data-control": "checkbox" }, tncInputProps)))));
+                        React__default.createElement(Checkbox, Object.assign({ name: 'TNC-' + id, label: React__default.createElement("p", { className: "lead-modal__tnc-link", dangerouslySetInnerHTML: { __html: data.valueHTML } }), className: "tnc-block", "data-control": "checkbox" }, tncInputProps)))));
         }
         return null;
     })));
@@ -2298,7 +2337,7 @@ const EmptyIcon = (props) => {
 // image: campaignShow.image
 // imageDestkop: campaignShow.image_desktop
 const LEADGEN_LIMIT_LIGHTBOXB = 6;
-const LightboxLayout = ({ popupId, extraFields, onClose: onCloseProp, onOtherSubmit, imageMobile, imageDesktop, imageOverlayMobile, imageOverlayDesktop, imageBackground, currentLayout, title, onSubmit, showThankyou, campaignId, campaign_subot_id, locale, showEmpty, setShowEmpty, }) => {
+const LightboxLayout = ({ popupId, extraFields, onClose: onCloseProp, onOtherSubmit, imageMobile, imageDesktop, imageOverlayMobile, imageOverlayDesktop, imageBackground, currentLayout, title, onSubmit, showThankyou, campaignId, campaign_subot_id, locale, showEmpty, setShowEmpty, userInfo, }) => {
     var _a, _b, _c;
     const { t } = useTranslations();
     const { isMobile } = useScreenSize();
@@ -2366,6 +2405,7 @@ const LightboxLayout = ({ popupId, extraFields, onClose: onCloseProp, onOtherSub
         validatingEmailRef,
         campaignId,
         campaign_subot_id,
+        userInfo,
     });
     const middlewareOnSubmit = (e) => {
         e.preventDefault();
@@ -3006,7 +3046,7 @@ function getCategoryLevel(t = 'Xin chao {{category_2}} extra') {
         return null;
     }
 }
-const NewLeadPopup = ({ campaign, action, onSubmit, onClose, showThankyou, locale, showEmpty, setShowEmpty, }) => {
+const NewLeadPopup = ({ campaign, action, onSubmit, onClose, showThankyou, locale, showEmpty, setShowEmpty, userInfo, }) => {
     var _a, _b;
     const { apiUrl, siteDomain } = useContext(LeadGenContext);
     useEffect(() => {
@@ -3125,7 +3165,7 @@ const NewLeadPopup = ({ campaign, action, onSubmit, onClose, showThankyou, local
         currentLayout == 'Fullscreen' ||
         currentLayout == 'Sidebar' ||
         currentLayout == 'Slider') {
-        return (React__default.createElement(LightboxLayout, { popupId: popupIdRef.current, extraFields: extra_fields, onClose: onClose, onOtherSubmit: onOtherSubmit, imageMobile: image, imageDesktop: image_desktop, imageBackground: image_background, currentLayout: currentLayout, title: titleText, onSubmit: (form, values) => onSubmit(form, values, categoryLevel, categoryData), key: currentLayout, imageOverlayDesktop: image_overlay_desktop, imageOverlayMobile: image_overlay_mobile, showThankyou: showThankyou, campaignId: campaign.id, campaign_subot_id: campaign.bot_id || [], locale: locale, showEmpty: showEmpty, setShowEmpty: setShowEmpty }));
+        return (React__default.createElement(LightboxLayout, { popupId: popupIdRef.current, extraFields: extra_fields, onClose: onClose, onOtherSubmit: onOtherSubmit, imageMobile: image, imageDesktop: image_desktop, imageBackground: image_background, currentLayout: currentLayout, title: titleText, onSubmit: (form, values) => onSubmit(form, values, categoryLevel, categoryData), key: currentLayout, imageOverlayDesktop: image_overlay_desktop, imageOverlayMobile: image_overlay_mobile, showThankyou: showThankyou, campaignId: campaign.id, campaign_subot_id: campaign.bot_id || [], locale: locale, showEmpty: showEmpty, setShowEmpty: setShowEmpty, userInfo: userInfo }));
     }
     else if (currentLayout.includes('Skin')) {
         return (React__default.createElement(SkinLayout, { popupId: popupIdRef.current, link: actionBlocks.linkButtonBlock.data.url, linkNewTab: !!actionBlocks.linkButtonBlock.data.newtab, linkText: actionBlocks.linkButtonBlock.data.value, onClose: onClose, onOtherSubmit: onOtherSubmit, imageMobile: image, imageDesktop: image_desktop, currentLayout: currentLayout }));
@@ -3134,7 +3174,7 @@ const NewLeadPopup = ({ campaign, action, onSubmit, onClose, showThankyou, local
 };
 
 // mount css
-const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, apiSubotUrl, DEBUG_URL, forceCampaign, children, extraPayloadValues = [], excludeExitRulesHandler, }) => {
+const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, apiSubotUrl, DEBUG_URL, forceCampaign, children, extraPayloadValues = [], excludeExitRulesHandler, userInfo, }) => {
     var _a;
     const scrollEventHandlerRef = useRef();
     const leadStartTimeRef = useRef(Date.now());
@@ -3402,7 +3442,7 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, apiSubotUrl,
         }
     }, [showCampaign]);
     return (React__default.createElement(LeadGenContext.Provider, { value: { apiUrl, siteDomain, siteId, locale } },
-        React__default.createElement(TranslationsContext.Provider, { value: { locale, values: getTranslations(locale) } }, children ? (React__default.createElement(Component, { campaign: showCampaign, onSubmit: onSubmit, onClose: onClose, showThankyou: showThankyou, setShowThankyou: setShowThankyou, locale: locale, showEmpty: showEmpty, setShowEmpty: setShowEmpty }, children)) : (React__default.createElement(Portal, { target: getPopupWrapperDom() },
+        React__default.createElement(TranslationsContext.Provider, { value: { locale, values: getTranslations(locale) } }, 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() },
             React__default.createElement(Box, { sx: { position: 'fixed', zIndex: ZINDEX_SSO - 9e6 } },
                 React__default.createElement(Transition, { mounted: Boolean(((_a = showCampaign === null || showCampaign === void 0 ? void 0 : showCampaign.extra_fields) === null || _a === void 0 ? void 0 : _a.popupVersion) === '2.1'), transition: "fade", duration: 600, timingFunction: "ease" }, (styles) => {
                     var _a;
@@ -3410,7 +3450,7 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, apiSubotUrl,
                         !!showCampaign.extra_fields.currentLayout &&
                             !showCampaign.extra_fields.currentLayout.includes('Inline') &&
                             !showCampaign.extra_fields.currentLayout.includes('Sidebar') && (React__default.createElement(Overlay, { color: "#000", opacity: 0.6, center: true, zIndex: 400, pos: 'fixed', onClick: () => onClose() })),
-                        React__default.createElement(NewLeadPopup, { campaign: showCampaign, action: action, onSubmit: onSubmit, onClose: onClose, showThankyou: showThankyou, locale: locale, showEmpty: showEmpty, setShowEmpty: setShowEmpty })))));
+                        React__default.createElement(NewLeadPopup, { campaign: showCampaign, action: action, onSubmit: onSubmit, onClose: onClose, showThankyou: showThankyou, locale: locale, showEmpty: showEmpty, setShowEmpty: setShowEmpty, userInfo: userInfo })))));
                 })))))));
 };
 const LeadGen = _LeadGen;

package/build/esm/{logoIcon-5f337c82.js → logoIcon-0508f2cd.js}

@@ -1,6 +1,6 @@
 import React__default, { memo, useMemo } from 'react';
-import { C as CommonGAssets } from './index-3a4052c7.js';
-import { I as ImageWrap } from './useScreenSize-fdb63765.js';
+import { C as CommonGAssets } from './index-830c091f.js';
+import { I as ImageWrap } from './useScreenSize-501097b1.js';
 
 const _LogoIcon = ({ type, width, height }) => {
     const data = useMemo(() => {

package/build/esm/mantine.js

@@ -1,43 +1,43 @@
-import { g as getMantineThemeOverride, h as StyledTextArea, D as DEBOUNCED_TIME, i as StyledSliderWrapper, j as StyledSlider } from './index-2e41ac6b.js';
-export { k as Accordion, A as Anchor, b as AspectRatio, a as Avatar, B as Breadcrumbs, l as Carousel, c as CentralCarousel, d as Checkbox, e as ChipButton, I as Input, O as OTP, P as Phone, n as Popover, R as Radio, S as Select, m as emotionCache, g as getMantineThemeOverride, t as themeColors } from './index-2e41ac6b.js';
-export { D as DatePicker } from './index-b0c80fc5.js';
-export { T as Text } from './index-c587e0f0.js';
-import { B as Button } from './index-fd8aa171.js';
-export { B as Button } from './index-fd8aa171.js';
-export { I as Indicator } from './index-2d69c8bb.js';
+import { g as getMantineThemeOverride, h as StyledTextArea, D as DEBOUNCED_TIME, i as StyledSliderWrapper, j as StyledSlider } from './index-60383232.js';
+export { k as Accordion, A as Anchor, b as AspectRatio, a as Avatar, B as Breadcrumbs, l as Carousel, c as CentralCarousel, d as Checkbox, e as ChipButton, I as Input, O as OTP, P as Phone, n as Popover, R as Radio, S as Select, m as emotionCache, g as getMantineThemeOverride, t as themeColors } from './index-60383232.js';
+export { D as DatePicker } from './index-d38d6cf1.js';
+export { T as Text } from './index-53acd19b.js';
+import { B as Button } from './index-eb828ee9.js';
+export { B as Button } from './index-eb828ee9.js';
+export { I as Indicator } from './index-fde759ed.js';
 import React__default, { useState, useEffect } from 'react';
-export { M as Modal } from './index-85708071.js';
-import { _ as __rest } from './tslib.es6-69e90f6a.js';
+export { M as Modal } from './index-7f61ef44.js';
+import { _ as __rest } from './tslib.es6-46bc9308.js';
 import { MantineProvider as MantineProvider$1, 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-91a2eccf.js';
+export { S as Spoiler } from './index-08ee45be.js';
 import { useDebouncedValue } from '@mantine/hooks';
-export { S as Switch } from './index-b05b9d7a.js';
-import { u as useMantineLocale, N as NotificationsHandler } from './useMantineLocale-19c891e6.js';
-export { M as MAPPED_LOCALE, g as getHeadingStyles, s as showNotification, u as useMantineLocale } from './useMantineLocale-19c891e6.js';
-export { O as OTHER_THEME_CONFIG } from './other-6ba313a1.js';
-export { T as Tabs } from './index-8a426614.js';
+export { S as Switch } from './index-88de98db.js';
+import { u as useMantineLocale, N as NotificationsHandler } from './useMantineLocale-850125d6.js';
+export { M as MAPPED_LOCALE, g as getHeadingStyles, s as showNotification, u as useMantineLocale } from './useMantineLocale-850125d6.js';
+export { O as OTHER_THEME_CONFIG } from './other-7fd66ceb.js';
+export { T as Tabs } from './index-d8cbd450.js';
 import '@hhgtech/icons/other';
-import './index-3a4052c7.js';
+import './index-830c091f.js';
 import './constantsDomainLocales.js';
-import './Locale-2342195e.js';
+import './Locale-4b56a605.js';
 import './constantsIsProduction.js';
-import './useScreenSize-fdb63765.js';
+import './useScreenSize-501097b1.js';
 import '@emotion/styled';
-import './utils-fd96839b.js';
+import './utils-2ed3ab9a.js';
 import '@mantine/carousel';
-import './index-067e0be1.js';
-import './index-ac444850.js';
+import './index-926b6794.js';
+import './index-27b94427.js';
 import 'date-fns/locale';
 import './constantsSite.js';
 import './constantsRiskScreener.js';
 import 'classnames';
-import './useUniqueId-8ea18781.js';
+import './useUniqueId-924f27a7.js';
 import '@hhgtech/icons/core';
 import '@mantine/dates';
-import './index.styles-0fb6722d.js';
-import './index-edd98830.js';
-import './translationsContext-1afbf924.js';
+import './index.styles-96f9e18e.js';
+import './index-17ac735f.js';
+import './translationsContext-a4d5ef98.js';
 import '@mantine/notifications';
 import 'dayjs';
 

package/build/esm/misc.js

@@ -1,34 +1,34 @@
-export { a as ageGenerate, c as convertLocalizedStringToNumber, l as localizeNumberFormat } from './localizeNumberFormat-3ab8c369.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-6e0cbd64.js';
+export { a as ageGenerate, c as convertLocalizedStringToNumber, l as localizeNumberFormat } from './localizeNumberFormat-18165d09.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-ff53f61f.js';
 export { deleteCookie, getCookie, setCookie } from './miscCookieHelper.js';
 import 'react';
 import '@mantine/core';
-import './useMantineLocale-19c891e6.js';
-import './index-067e0be1.js';
-import './index-3a4052c7.js';
+import './useMantineLocale-850125d6.js';
+import './index-926b6794.js';
+import './index-830c091f.js';
 export { MBTheme, theme } from './miscTheme.js';
-export { B as Breakpoints, M as MediaQueries, S as Screens, 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-fd96839b.js';
-import './index-ac444850.js';
-export { a as abbreviateNumber, f as formatPill } from './dataTransform-35e0f5ef.js';
-export { d as getCareApiDomain, g as getCurrentBaseUrl, a as getCurrentSsoUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain } from './normalizeLink-cd53b9d6.js';
+export { B as Breakpoints, M as MediaQueries, S as Screens, 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-2ed3ab9a.js';
+import './index-27b94427.js';
+export { a as abbreviateNumber, f as formatPill } from './dataTransform-a0f97659.js';
+export { d as getCareApiDomain, g as getCurrentBaseUrl, a as getCurrentSsoUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain } from './normalizeLink-283fcb7b.js';
 export { formatHealthTool, getDynamicHealthTool, getDynamicHealthToolWithCache } from './miscGetDynamicHealthTool.js';
 export { getSocialList } from './miscGetSocialList.js';
 export { ScreenSizeContext, ScreenSizeContextProvider, getWindowSizeGroups } from './miscScreenSizeContext.js';
 import 'dayjs';
 import '@emotion/react';
-import './tslib.es6-69e90f6a.js';
+import './tslib.es6-46bc9308.js';
 import '@mantine/notifications';
-import './other-6ba313a1.js';
-import './Locale-2342195e.js';
+import './other-7fd66ceb.js';
+import './Locale-4b56a605.js';
 import './constantsDomainLocales.js';
 import './constantsIsProduction.js';
 import 'date-fns/locale';
 import './constantsSite.js';
 import './constantsRiskScreener.js';
-import './core-938ff907.js';
-import './WhatsApp-0d9155f4.js';
-import './index-8591b22e.js';
-import './index-bb8e1155.js';
+import './core-5d8fdea3.js';
+import './WhatsApp-5fc19684.js';
+import './index-95f4797b.js';
+import './index-0161dbda.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-69e90f6a.js';
-import { e as normalizeLinkSlash, c as getDiscoverApiDomain } from './normalizeLink-cd53b9d6.js';
-import { g as getDataWithCache } from './core-938ff907.js';
+import { a as __awaiter } from './tslib.es6-46bc9308.js';
+import { e as normalizeLinkSlash, c as getDiscoverApiDomain } from './normalizeLink-283fcb7b.js';
+import { g as getDataWithCache } from './core-5d8fdea3.js';
 import './constantsDomainLocales.js';
-import './Locale-2342195e.js';
+import './Locale-4b56a605.js';
 import './constantsIsProduction.js';
 
 const formatHealthTool = (healthTool, locale) => {

package/build/esm/miscGetSocialList.js

@@ -1,12 +1,12 @@
 import React__default from 'react';
-import { _ as __rest } from './tslib.es6-69e90f6a.js';
-import { W as WhatsApp, I as Instagram } from './WhatsApp-0d9155f4.js';
-import { S as SocialType } from './index-067e0be1.js';
-import { g as getHelloSitesUrl } from './index-8591b22e.js';
-import { C as CommonGAssets } from './index-3a4052c7.js';
-import { L as LOCALE } from './Locale-2342195e.js';
-import './index-bb8e1155.js';
-import './index-ac444850.js';
+import { _ as __rest } from './tslib.es6-46bc9308.js';
+import { W as WhatsApp, I as Instagram } from './WhatsApp-5fc19684.js';
+import { S as SocialType } from './index-926b6794.js';
+import { g as getHelloSitesUrl } from './index-95f4797b.js';
+import { C as CommonGAssets } from './index-830c091f.js';
+import { L as LOCALE } from './Locale-4b56a605.js';
+import './index-0161dbda.js';
+import './index-27b94427.js';
 import 'date-fns/locale';
 import './constantsSite.js';
 import './constantsDomainLocales.js';

package/build/esm/miscScreenSizeContext.js

@@ -1,6 +1,6 @@
 import React__default, { createContext, useState, useEffect, useMemo } from 'react';
 import throttle from 'lodash/throttle';
-import { B as Breakpoints } from './utils-fd96839b.js';
+import { B as Breakpoints } from './utils-2ed3ab9a.js';
 
 const ScreenSizeContext = createContext({
     isInit: true,

package/build/esm/mobileBottomNavigation.js

@@ -1,13 +1,13 @@
-import { _ as __rest } from './tslib.es6-69e90f6a.js';
+import { _ as __rest } from './tslib.es6-46bc9308.js';
 import React__default from 'react';
-import { M as MobileBottomNavigationIcon, S as StyledMobileBottomNavigation } from './MobileBottomNavigationIcon-8944ece4.js';
-import './index-c587e0f0.js';
+import { M as MobileBottomNavigationIcon, S as StyledMobileBottomNavigation } from './MobileBottomNavigationIcon-8c3f5567.js';
+import './index-53acd19b.js';
 import '@mantine/core';
-import './other-6ba313a1.js';
+import './other-7fd66ceb.js';
 import './miscTheme.js';
 import '@emotion/react';
 import '@emotion/styled';
-import './utils-fd96839b.js';
+import './utils-2ed3ab9a.js';
 
 const MobileBottomNavigationWrapper = (_a) => {
     var { children, isCollapsed = false, template = 'homepage' } = _a, rest = __rest(_a, ["children", "isCollapsed", "template"]);

package/build/esm/mobileBottomNavigationIcon.js

@@ -1,10 +1,10 @@
-import './tslib.es6-69e90f6a.js';
+import './tslib.es6-46bc9308.js';
 import 'react';
-import './index-c587e0f0.js';
+import './index-53acd19b.js';
 import './miscTheme.js';
-export { M as MobileBottomNavigationIcon } from './MobileBottomNavigationIcon-8944ece4.js';
+export { M as MobileBottomNavigationIcon } from './MobileBottomNavigationIcon-8c3f5567.js';
 import '@mantine/core';
-import './other-6ba313a1.js';
+import './other-7fd66ceb.js';
 import '@emotion/react';
 import '@emotion/styled';
-import './utils-fd96839b.js';
+import './utils-2ed3ab9a.js';