@hhgtech/hhg-components 1.29.362-beta-4 → 1.29.362-beta-6

package/build/lead.js

@@ -2,47 +2,47 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-0f05f7d2.js');
+var tslib_es6 = require('./tslib.es6-91e092ae.js');
 var React = require('react');
 var core = require('@mantine/core');
 var dayjs = require('dayjs');
 var debounce = require('lodash/debounce');
 var form = require('@mantine/form');
-var index = require('./index-8fca7a9d.js');
-var translationsContext = require('./translationsContext-0cce698e.js');
+var usePlacesAutocomplete = require('./usePlacesAutocomplete-7b83983f.js');
+var index = require('./index-4e12800c.js');
+var translationsContext = require('./translationsContext-9687dc3f.js');
 var miscCookieHelper = require('./miscCookieHelper.js');
-var utils$1 = require('./utils-92198b16.js');
-var index$1 = require('./index-4032bb76.js');
-var index$2 = require('./index-dc2c3c19.js');
-var index$4 = require('./index-89ddaca2.js');
-var utils = require('./utils-49d56a81.js');
+var utils$1 = require('./utils-ad823692.js');
+var index$1 = require('./index-c359d080.js');
+var index$2 = require('./index-eaea1669.js');
+var index$4 = require('./index-b9c21c28.js');
+var utils = require('./utils-8cdcde5d.js');
 var dates = require('@mantine/dates');
-var index$7 = require('./index-3667d285.js');
-require('./index-533d8aac.js');
-require('./index-f79016ad.js');
-require('./useMantineLocale-bfb9db0d.js');
-var index$5 = require('./index-9560e920.js');
-require('./index.styles-7115b21f.js');
+var index$7 = require('./index-f28b96a7.js');
+require('./index-f518f327.js');
+require('./index-2b902706.js');
+require('./useMantineLocale-d3b08d5e.js');
+var index$5 = require('./index-341b39a7.js');
+require('./index.styles-36d65d5c.js');
 var hooks = require('@mantine/hooks');
-require('./other-dcd6c6e0.js');
-require('./index-3db2f173.js');
-var usePlacesAutocomplete = require('./usePlacesAutocomplete-f1b37b61.js');
-var index$3 = require('./index-0c76baea.js');
-var index$6 = require('./index-b13b1f46.js');
+require('./other-55d7a29c.js');
+require('./index-ab62215d.js');
+var index$3 = require('./index-88c05c6d.js');
+var index$6 = require('./index-053f53ad.js');
 var styled = require('@emotion/styled');
 var uuid = require('uuid');
 var react = require('@emotion/react');
 var miscTheme = require('./miscTheme.js');
-var index$8 = require('./index-fea999ae.js');
-var index$9 = require('./index-13837682.js');
-var useScreenSize = require('./useScreenSize-4399bd9f.js');
+var index$8 = require('./index-e90ccbbb.js');
+var index$9 = require('./index-7858e63b.js');
+var useScreenSize = require('./useScreenSize-c6515eb2.js');
 var ReactDOM = require('react-dom');
-var Close = require('./Close-5e14817a.js');
+var Close = require('./Close-8e99232e.js');
 require('@hhgtech/icons/other');
 require('@mantine/carousel');
-require('./Locale-b6198746.js');
+require('./Locale-3b16bb0e.js');
 require('classnames');
-require('./useUniqueId-2d718c77.js');
+require('./useUniqueId-220be409.js');
 require('./constantsSite.js');
 require('@hhgtech/icons/core');
 require('date-fns/locale');
@@ -79,91 +79,6 @@ var styled__default = /*#__PURE__*/_interopDefault(styled);
 
 const LeadGenComponentContext = React.createContext({});
 
-const CAMPAIGN_TARGET_TYPE = { LINKS: 1, TAGS: 2 };
-let LEAD_API = 'https://dev.leadgen.hellobacsi.com/';
-const LEAD_DEVICE_TYPE = {
-    MOBILE: 1,
-    DESKTOP: 2,
-};
-let LEAD_CLASS = '';
-if (LEAD_API.includes('localhost')) {
-    LEAD_API = 'https://dev.leadgen.hellobacsi.com/';
-}
-if (location.hostname.includes('marrybaby.vn')) {
-    LEAD_CLASS = 'pink';
-}
-// var LEAD_CURRENT_URL = location.href.toLowerCase();
-let LEAD_CURRENT_URL = 'https://' + location.hostname + location.pathname + location.search;
-LEAD_CURRENT_URL = LEAD_CURRENT_URL.toLowerCase();
-// TODO: set inital object if exists
-if (sessionStorage.getItem('insider_object')) {
-    window.insider_object = JSON.parse(sessionStorage.getItem('insider_object'));
-}
-const docLang = document.documentElement.lang;
-// TODO: country code
-const LEAD_LOCALE_DATA$1 = {
-    'vi-VN': {
-        popupLang: 'vi',
-        countryCode: 'vn',
-        countryCodeNumber: 84,
-    },
-    'id-ID': {
-        popupLang: 'id',
-        countryCode: 'id',
-        countryCodeNumber: 62,
-    },
-    'th-TH': {
-        popupLang: 'th',
-        countryCode: 'th',
-        countryCodeNumber: 66,
-    },
-    'ms-MY': {
-        popupLang: 'ms',
-        countryCode: 'my',
-        countryCodeNumber: 60,
-    },
-    'zh-TW': {
-        popupLang: 'zh',
-        countryCode: 'tw',
-        countryCodeNumber: 886,
-    },
-    'km-KH': {
-        popupLang: 'km',
-        countryCode: 'kh',
-        countryCodeNumber: 855,
-    },
-    'my-MM': {
-        popupLang: 'my',
-        countryCode: 'mm',
-        countryCodeNumber: 95,
-    },
-    'hi-IN': {
-        popupLang: 'hi',
-        countryCode: 'in',
-        countryCodeNumber: 91,
-    },
-};
-const LEAD_LOCALE = LEAD_LOCALE_DATA$1[docLang] || LEAD_LOCALE_DATA$1['vi-VN'];
-function LEAD_RESET_VAR() {
-    // LEAD_CURRENT_URL = location.href.toLowerCase();
-    LEAD_CURRENT_URL =
-        'https://' + location.hostname + location.pathname + location.search;
-}
-const LEAD_TIMEZONE_DATA = {
-    1: 'Asia/Ho_Chi_Minh',
-    10: 'Asia/Ho_Chi_Minh',
-    11: 'Asia/Ho_Chi_Minh',
-    12: 'Asia/Ho_Chi_Minh',
-    2: 'Asia/Jakarta',
-    3: 'Asia/Bangkok',
-    4: 'Asia/Phnom_Penh',
-    5: 'Asia/Kuala_Lumpur',
-    6: 'Asia/Taipei',
-    7: 'Asia/Yangon',
-    8: 'Asia/Kolkata',
-    9: 'Asia/Manila', // Philippines / Filipinos Site
-};
-
 const LEADGEN_ACTIONS = {
     SHOW: 'SHOW',
     SCROLL: 'SCROLL',
@@ -687,7 +602,7 @@ const useLeadFormConfig$1 = ({ listBlockAdded = [], validatingPhoneRef, validati
                 return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value, (value) => {
                         if (value &&
                             window.intlTelInputUtils &&
-                            !window.intlTelInputUtils.isValidNumber(String(value), LEAD_LOCALE.countryCode)) {
+                            !window.intlTelInputUtils.isValidNumber(String(value), usePlacesAutocomplete.LEAD_LOCALE.countryCode)) {
                             return t('validator.phone');
                         }
                         if (!value)
@@ -886,9 +801,9 @@ const LocationBlock = ({ name, placeholder, locale, required = true, }) => {
                 React__default["default"].createElement("path", { d: "M10 9.792q.605 0 1.032-.427.426-.428.426-1.032 0-.603-.426-1.031A1.4 1.4 0 0 0 10 6.875q-.604 0-1.032.427a1.4 1.4 0 0 0-.426 1.031q0 .604.426 1.032.428.426 1.032.427m0 8.083q-.145 0-.292-.042a.7.7 0 0 1-.27-.145Q6.478 15 5.01 12.708 3.54 10.418 3.54 8.5q0-3.021 1.949-4.823T10 1.875t4.51 1.802q1.95 1.802 1.949 4.823 0 1.917-1.468 4.208-1.47 2.292-4.427 4.98a.7.7 0 0 1-.271.145 1 1 0 0 1-.292.042", fill: "#8C8C8C" })), autoComplete: 'no-auto-complete-' + randRef.current, rightSection: React__default["default"].createElement(React__default["default"].Fragment, null) }, form.getInputProps(name)))));
 };
 
-const SubtitleBlock$1 = ({ children, align, }) => (React__default["default"].createElement("p", { className: `lead-modal__description ${'le-text-align-' + (align || '')} ${LEAD_CLASS}` }, children));
+const SubtitleBlock$1 = ({ children, align, }) => (React__default["default"].createElement("p", { className: `lead-modal__description ${'le-text-align-' + (align || '')} ${usePlacesAutocomplete.LEAD_CLASS}` }, children));
 
-const TitleBlock$1 = ({ children, align, }) => (React__default["default"].createElement("h2", { className: `lead-modal__title ${'le-text-align-' + (align || '')} ${LEAD_CLASS}` }, children));
+const TitleBlock$1 = ({ children, align, }) => (React__default["default"].createElement("h2", { className: `lead-modal__title ${'le-text-align-' + (align || '')} ${usePlacesAutocomplete.LEAD_CLASS}` }, children));
 
 const Fields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, styles, classNames, popoverProps, }) => {
     const { classes, cx } = useStyles$2(undefined, {
@@ -945,7 +860,7 @@ const Fields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, style
             case 'LinkButtonBlock':
                 return (React__default["default"].createElement("div", { key: index },
                     React__default["default"].createElement("a", { target: newtab ? 'blank' : 'parrent', href: url, style: { textDecoration: 'none' } },
-                        React__default["default"].createElement(index$3.Button, { type: "button", size: "md", className: `lead-modal__btn ${LEAD_CLASS}`, onClick: () => {
+                        React__default["default"].createElement(index$3.Button, { type: "button", size: "md", className: `lead-modal__btn ${usePlacesAutocomplete.LEAD_CLASS}`, onClick: () => {
                                 onClose === null || onClose === void 0 ? void 0 : onClose();
                                 onOtherSubmit === null || onOtherSubmit === void 0 ? void 0 : onOtherSubmit();
                             } }, value))));
@@ -2623,7 +2538,7 @@ const ThankyouPopup = ({ title, titleAlign, subtitle, subtitleAlign, link, linkN
             }))),
             linkText && (React__default["default"].createElement("div", null,
                 React__default["default"].createElement("a", { href: link, target: linkNewTab ? '_blank' : 'parrent', rel: "noreferrer" },
-                    React__default["default"].createElement("button", { className: `lead-modal__btn ${LEAD_CLASS}` }, linkText)))))));
+                    React__default["default"].createElement("button", { className: `lead-modal__btn ${usePlacesAutocomplete.LEAD_CLASS}` }, linkText)))))));
 };
 
 const InlineLayout = ({ content, inlinePosition, }) => {
@@ -2771,7 +2686,7 @@ const EmptyComponent = ({ onClose, onContinue, }) => {
             React__default["default"].createElement(core.Button, { onClick: onContinue, size: "lg", variant: "filled", fullWidth: false, className: "leadgen-btn leadgen-btn_empty_again" }, t('lead.empty.submitAgain')))));
 };
 
-const SubtitleBlock = ({ children, align, }) => (React__default["default"].createElement("p", { className: `lead-modal__description ${'le-text-align-' + (align || '')} ${LEAD_CLASS}` }, children));
+const SubtitleBlock = ({ children, align, }) => (React__default["default"].createElement("p", { className: `lead-modal__description ${'le-text-align-' + (align || '')} ${usePlacesAutocomplete.LEAD_CLASS}` }, children));
 
 const cssInputNotShrink = react.css `
   height: 100% !important;
@@ -3109,7 +3024,7 @@ const ChoiceField = (props) => {
     return (React__default["default"].createElement(StyledChoiceFieldContainer, Object.assign({ className: core.clsx(className, 'choiceField') }, restProps), children));
 };
 
-const TitleBlock = ({ children, align, }) => (React__default["default"].createElement("h2", { className: `lead-modal__title ${'le-text-align-' + (align || '')} ${LEAD_CLASS}` }, children));
+const TitleBlock = ({ children, align, }) => (React__default["default"].createElement("h2", { className: `lead-modal__title ${'le-text-align-' + (align || '')} ${usePlacesAutocomplete.LEAD_CLASS}` }, children));
 
 const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, }) => {
     const form = useLeadFormContext();
@@ -3173,7 +3088,7 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
             case 'LinkButtonBlock':
                 return (React__default["default"].createElement("div", { key: index },
                     React__default["default"].createElement("a", { target: newtab ? 'blank' : 'parrent', href: url, style: { textDecoration: 'none' } },
-                        React__default["default"].createElement(index$3.Button, { type: "button", size: "md", className: `lead-modal__btn ${LEAD_CLASS}`, onClick: () => {
+                        React__default["default"].createElement(index$3.Button, { type: "button", size: "md", className: `lead-modal__btn ${usePlacesAutocomplete.LEAD_CLASS}`, onClick: () => {
                                 onClose === null || onClose === void 0 ? void 0 : onClose();
                                 onOtherSubmit === null || onOtherSubmit === void 0 ? void 0 : onOtherSubmit();
                             } }, value))));
@@ -3428,8 +3343,8 @@ const OtpBlock = ({ otpData, onSuccess, autoSendWhenOpen, }) => {
         React__default["default"].createElement(FormContainer, { title: t('lead.otp.title'), description: t('lead.otp.desc', {
                 phone: `<strong>${displayPhone}</strong>`,
             }), footer: React__default["default"].createElement(React__default["default"].Fragment, null,
-                React__default["default"].createElement(core.Button, { type: "submit", size: "lg", variant: "filled", className: `lead-modal__btn leadgen-btn_action ${LEAD_CLASS}`, disabled: !otp, loading: isSubmitLoading }, t('lead.otp.verify')),
-                React__default["default"].createElement(core.Button, { type: "button", size: "lg", variant: "light", className: `lead-modal__btn lead-phone-otp-button leadgen-btn_action ${LEAD_CLASS}`, onClick: () => {
+                React__default["default"].createElement(core.Button, { type: "submit", size: "lg", variant: "filled", className: `lead-modal__btn leadgen-btn_action ${usePlacesAutocomplete.LEAD_CLASS}`, disabled: !otp, loading: isSubmitLoading }, t('lead.otp.verify')),
+                React__default["default"].createElement(core.Button, { type: "button", size: "lg", variant: "light", className: `lead-modal__btn lead-phone-otp-button leadgen-btn_action ${usePlacesAutocomplete.LEAD_CLASS}`, onClick: () => {
                         sendOtp();
                     }, disabled: !!resendTimer }, t('lead.otp.resend', {
                     timer: resendTimer ? ` (${resendTimer}s)` : '',
@@ -3759,358 +3674,6 @@ const TabLayout = ({ popupId, url, newTab, image, onClose, onOtherSubmit, }) =>
                 React__default["default"].createElement(CloseButton, { onClose: onClose, containerClassName: "close-button-top-right" })))));
 };
 
-// import mockLeadData from './mockLeadData'
-const listCampaignScheduled = [];
-const listCampaignScheduledToActivated = [];
-const listCampaignActiveButExpired = [];
-const listCampaignExcludeSonsored = [];
-const listCampaignDifferentSponsor = [];
-const listCampaignNotDisplayInRangeOfTime = [];
-function isMobile() {
-    return /Android|webOS|iPhone|iPad|iPod|BlackBerry|BB|PlayBook|IEMobile|Windows Phone|Kindle|Silk|Opera Mini/i.test(navigator.userAgent);
-}
-const getShuffleArray = (array) => {
-    const newArray = [...array];
-    for (let i = newArray.length - 1; i > 0; i--) {
-        const j = Math.floor(Math.random() * (i + 1));
-        const temp = newArray[i];
-        newArray[i] = newArray[j];
-        newArray[j] = temp;
-    }
-    return newArray;
-};
-const getTimeByTimezone = (timeZone = 'UTC') => {
-    const date = new Date();
-    return new Date(date.toLocaleString('en-US', { timeZone }));
-};
-const parseDateByCampaignTime = (dateStr) => {
-    // Format like this: 2023-04-04 00:00:00
-    try {
-        const [datePart, timePart] = dateStr.split(' ');
-        const [year, month, day] = datePart.split('-').map(Number);
-        const [hours, minutes, seconds] = timePart.split(':').map(Number);
-        /** JavaScript counts months from 0 to 11 */
-        return new Date(year, month - 1, day, hours, minutes, seconds);
-    }
-    catch (err) {
-        return null;
-    }
-};
-const checkCampaignNowInTimeframe = (c) => {
-    var _a;
-    const siteId = ((_a = c.site) === null || _a === void 0 ? void 0 : _a.id) || 1;
-    const startedAtStr = c.started_at;
-    const endedAtStr = c.ended_at;
-    const startedDate = parseDateByCampaignTime(startedAtStr);
-    const endedDate = parseDateByCampaignTime(endedAtStr);
-    if (!startedDate || !endedDate) {
-        return false;
-    }
-    const timeZone = LEAD_TIMEZONE_DATA[siteId];
-    const nowWithTimezoneMs = getTimeByTimezone(timeZone).getTime();
-    if (nowWithTimezoneMs <= endedDate.getTime() &&
-        nowWithTimezoneMs >= startedDate.getTime()) {
-        listCampaignScheduledToActivated.push(c);
-        return true;
-    }
-    return false;
-};
-function checkCampaignActiveButExpireAlready(c) {
-    var _a;
-    /** Do not setup timeframe for this campaign. No need to check */
-    if (c.forever === 1) {
-        return true;
-    }
-    const startedAtStr = c.started_at;
-    const endedAtStr = c.ended_at;
-    const startedDate = parseDateByCampaignTime(startedAtStr);
-    const endedDate = parseDateByCampaignTime(endedAtStr);
-    /** Do not setup timeframe for this campaign. No need to check */
-    if (!startedDate || !endedDate) {
-        return true;
-    }
-    const siteId = ((_a = c.site) === null || _a === void 0 ? void 0 : _a.id) || 1;
-    const timeZone = LEAD_TIMEZONE_DATA[siteId];
-    const nowWithTimezoneMs = getTimeByTimezone(timeZone).getTime();
-    /** Check if this expire already, do not show */
-    if (nowWithTimezoneMs > endedDate.getTime()) {
-        listCampaignActiveButExpired.push(c);
-        return false;
-    }
-    return true;
-}
-function shouldNotDisplayIfExcludeAllSponsors(c) {
-    var _a;
-    const excludeSponsored = Number((_a = c.rules.find((i) => i.rule == 'exclude_sponsored')) === null || _a === void 0 ? void 0 : _a.value);
-    const isSponsored = Boolean(document.querySelector('.hhg-disclaimer-text'));
-    if (isSponsored && excludeSponsored) {
-        listCampaignExcludeSonsored.push(c);
-        return true;
-    }
-    return false;
-}
-function shouldDisplayWithCurrentSponsor(c) {
-    var _a, _b;
-    try {
-        // TODO: BE will rename `exclude_sponsored_list` later
-        const stringOrArray = (_a = c.rules.find((i) => i.rule == 'exclude_sponsored_list')) === null || _a === void 0 ? void 0 : _a.value;
-        const whiteListSponsors = stringOrArray instanceof Array ? stringOrArray : JSON.parse(stringOrArray);
-        const dataSponsoredId = Number((_b = document
-            .querySelector('[data-sponsored-id]')) === null || _b === void 0 ? void 0 : _b.getAttribute('data-sponsored-id'));
-        // There is no config for sponsor id and white list, should show as default
-        if (!dataSponsoredId ||
-            dataSponsoredId <= 0 ||
-            whiteListSponsors.length === 0) {
-            return true;
-        }
-        // Check the dataSponsoredId exists in the white list or not.
-        const isExist = whiteListSponsors.find((s) => s.id == dataSponsoredId);
-        if (isExist) {
-            return true;
-        }
-        listCampaignDifferentSponsor.push({ id: c.id, rules: c.rules });
-        return false;
-    }
-    catch (err) {
-        // Default is show
-        return true;
-    }
-}
-const filterFnCampaign = (c) => {
-    if (shouldNotDisplayIfExcludeAllSponsors(c)) {
-        return false;
-    }
-    else if (!shouldDisplayWithCurrentSponsor(c)) {
-        return false;
-    }
-    /** Active */
-    if (c.formatted_status === 1) {
-        return checkCampaignActiveButExpireAlready(c);
-    }
-    /** Schedule */
-    if (c.formatted_status === 0) {
-        listCampaignScheduled.push(c);
-        return checkCampaignNowInTimeframe(c);
-    }
-    return false;
-};
-const fillterApprearanceTimeCampaign = (c) => {
-    var _a;
-    try {
-        const isTimeInRange = (currentTime, startTime, endTime) => {
-            const startParts = startTime.split(':');
-            const endParts = endTime.split(':');
-            const startDate = new Date();
-            startDate.setHours(Number(startParts[0]), Number(startParts[1]), 0, 0);
-            const endDate = new Date();
-            endDate.setHours(Number(endParts[0]), Number(endParts[1]), 0, 0);
-            return currentTime >= startDate && currentTime <= endDate;
-        };
-        const rulesApprValue = (_a = c.rules.find((i) => i.rule == 'appearance_time')) === null || _a === void 0 ? void 0 : _a.value;
-        const startTime = rulesApprValue.startTime;
-        const endTime = rulesApprValue.endTime || '23:59';
-        if (!startTime) {
-            return true;
-        }
-        if (isTimeInRange(new Date(), startTime, endTime)) {
-            return true;
-        }
-        listCampaignNotDisplayInRangeOfTime.push(c);
-        return false;
-    }
-    catch (err) {
-        return true;
-    }
-};
-let timeoutRef = null;
-let LEAD_SCROLL_EVENT = null;
-function clearPassiveEvent() {
-    if (timeoutRef) {
-        clearTimeout(timeoutRef);
-        timeoutRef = null;
-    }
-    if (LEAD_SCROLL_EVENT) {
-        window.removeEventListener('scroll', LEAD_SCROLL_EVENT);
-        LEAD_SCROLL_EVENT = null;
-    }
-}
-function checkShowPopup({ leadApi, leadSiteId, leadDomain, onShowPopup, DEBUG_URL, }) {
-    // clear previous passive event, check for new condition
-    clearPassiveEvent();
-    const leadCurrentUrl = DEBUG_URL ||
-        ('https://' +
-            location.hostname +
-            location.pathname +
-            location.search).toLowerCase();
-    fetch(leadApi + 'api/campaign/' + leadSiteId, {
-        method: 'POST',
-        headers: {
-            'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({
-            url: leadCurrentUrl,
-            ga_client_id: miscCookieHelper.getCookie('_ga') || null,
-        }),
-    })
-        .then((response) => {
-        return response.json();
-        // return mockLeadData || response.json()
-    })
-        .then((data) => {
-        var _a, _b, _c, _d;
-        LeadLog('List campagin: ', data);
-        LEAD_RESET_VAR();
-        if (data._status == 1) {
-            const campaigns = (((_b = (_a = data._data) === null || _a === void 0 ? void 0 : _a.campaigns) === null || _b === void 0 ? void 0 : _b.filter(filterFnCampaign)) || []).filter(fillterApprearanceTimeCampaign);
-            if (!miscCookieHelper.getCookie('hhg-id')) {
-                miscCookieHelper.setCookie('hhg-id', uuid.v1(), {
-                    domain: '.' + leadDomain,
-                    path: '/',
-                });
-                LeadLog('😍 Set HHG ID cookie');
-            }
-            // getCookie('hhg-id')
-            // TODO: HP-534 Filter desktop
-            let campaignsDevice = [];
-            if (isMobile()) {
-                campaignsDevice = campaigns.filter((c) => c.device_types.some((d) => d.id == LEAD_DEVICE_TYPE.MOBILE));
-            }
-            else {
-                campaignsDevice = campaigns.filter((c) => c.device_types.some((d) => d.id == LEAD_DEVICE_TYPE.DESKTOP));
-            }
-            LeadLog(`👓 campaignsDevice`, campaignsDevice);
-            LeadLog('--listCampaignScheduled', listCampaignScheduled);
-            LeadLog('--listCampaignScheduledToActivated', listCampaignScheduledToActivated);
-            LeadLog('--listCampaignActiveButExpired', listCampaignActiveButExpired);
-            LeadLog('--listCampaignExcludeSonsored', listCampaignExcludeSonsored);
-            LeadLog('--listCampaignDifferentSponsor', listCampaignDifferentSponsor);
-            LeadLog('--listCampaignNotDisplayInRangeOfTime', listCampaignNotDisplayInRangeOfTime);
-            // Check links
-            let listLinksObj = campaignsDevice
-                .map((i, index) => i.targets
-                .filter((i) => i.type == CAMPAIGN_TARGET_TYPE.LINKS)
-                .map((i) => (Object.assign(Object.assign({}, i), { campaignIndex: index }))))
-                .flat(1);
-            // Check list link match current href
-            listLinksObj = listLinksObj.filter((i) => {
-                var _a;
-                const target = new URL(String(i.target).toLowerCase());
-                if (i.option == 'exact_match')
-                    // FOR TEST LOCAL:
-                    // return Boolean(location.pathname === target.pathname)
-                    return Boolean(leadCurrentUrl === ((_a = target.href) === null || _a === void 0 ? void 0 : _a.toLowerCase()));
-                if (i.option == 'start_with') {
-                    // FOR TEST LOCAL:
-                    // if (location.pathname.includes(target.pathname)) {
-                    if (leadCurrentUrl.includes(String(i.target).toLowerCase())) {
-                        const listExcluding = i.sub_target
-                            .filter((i) => i.option == 'excluding')
-                            .map((i) => { var _a; return (_a = i.value) === null || _a === void 0 ? void 0 : _a.toLowerCase(); });
-                        return !listExcluding.includes(leadCurrentUrl.split('?')[0]);
-                    }
-                    else {
-                        return false;
-                    }
-                }
-            });
-            // Check tags
-            const listMetaTag = Array.from(document.getElementsByTagName('META')).filter((i) => i.getAttribute('property') == 'article:tag');
-            const listTags = listMetaTag.map((i) => i.content);
-            let listCampaignHasTag = [];
-            let listTagsObj = [];
-            if (listTags && listTags.length) {
-                listCampaignHasTag = campaignsDevice
-                    .map((i, index) => i.targets
-                    .filter((i) => i.type == CAMPAIGN_TARGET_TYPE.TAGS)
-                    .map((i) => (Object.assign(Object.assign({}, i), { campaignIndex: index }))))
-                    .flat(1);
-                listTagsObj = listCampaignHasTag.filter((i) => listTags.includes(i.target));
-            }
-            const listCampaginsMatch = [...listLinksObj, ...listTagsObj];
-            const cookieKeys = document.cookie
-                .split('; ')
-                .map((i) => i.split('=')[0]);
-            const listCampaignCodeSubmited = cookieKeys.filter((i) => i.includes('lead_submited'));
-            LeadLog(`--listCampaignCodeSubmited`, listCampaignCodeSubmited);
-            const listCampaignCodeClosed = cookieKeys.filter((i) => i.includes('lead_closed'));
-            LeadLog(`--listCampaignCodeClosed`, listCampaignCodeClosed);
-            const listCampaignSubmitedClosed = [
-                ...listCampaignCodeSubmited,
-                ...listCampaignCodeClosed,
-            ];
-            const listCampaignNoSubmitedClosed = listCampaginsMatch.filter((i) => {
-                const hasSubmited = listCampaignSubmitedClosed.some((k) => k.includes(campaignsDevice[i.campaignIndex].code));
-                return !hasSubmited;
-            });
-            const listCampaignValid = getShuffleArray(listCampaignNoSubmitedClosed);
-            // .sort(
-            //   (a, b) =>
-            //     (listCampaignValid[a.campaignIndex]?.score || 0) -
-            //     (listCampaignValid[b.campaignIndex]?.score || 0),
-            // )
-            LeadLog('--listCampaignValid : ', listCampaignValid);
-            if (listCampaignValid && listCampaignValid.length) {
-                const CAMPAIGN_SHOW = campaignsDevice[listCampaignValid[0].campaignIndex];
-                LeadLog(`CAMPAIGN_SHOW`, CAMPAIGN_SHOW);
-                const { rules } = CAMPAIGN_SHOW;
-                // CHECK RULE TRIGGER POPUP
-                const timeoutRule = Number((_c = rules.find((i) => i.rule == 'time')) === null || _c === void 0 ? void 0 : _c.value);
-                LeadLog(`timeoutRule`, timeoutRule);
-                const scrollRule = Number((_d = rules.find((i) => i.rule == 'scroll')) === null || _d === void 0 ? void 0 : _d.value);
-                LeadLog(`scrollRule`, scrollRule);
-                let impressionAction = 'TIME';
-                if (Number.isInteger(timeoutRule)) {
-                    impressionAction = 'TIME';
-                    LeadLog('✨ SHOW AWESOME POPUP AFTER: ', timeoutRule, ' seconds');
-                    timeoutRef = setTimeout(() => {
-                        onShowPopup === null || onShowPopup === void 0 ? void 0 : onShowPopup(CAMPAIGN_SHOW, impressionAction);
-                    }, timeoutRule * 1000);
-                }
-                if (Number.isInteger(scrollRule)) {
-                    impressionAction = 'SCROLL';
-                    LeadLog('✨ SHOW AWESOME AFTER: SCROLL', scrollRule, ' %');
-                    const $p = document.querySelector(`[data-url="${location.pathname}"]`) ||
-                        document.querySelector('body');
-                    const pct = $p.getBoundingClientRect().top;
-                    const pb = $p.offsetHeight;
-                    LeadLog(`👓 Element check scroll: `, $p);
-                    LEAD_SCROLL_EVENT = function leadScollCheckHandler() {
-                        const wt = window.pageYOffset || document.documentElement.scrollTop;
-                        let percent = 0;
-                        if (wt >= pct) {
-                            percent = Math.round(((wt - pct) / (pb - innerHeight)) * 100);
-                        }
-                        LeadLog('---Scroll', percent, scrollRule);
-                        // TODO: CHECK FOOTER HEIGHT
-                        if (percent >= scrollRule) {
-                            window.removeEventListener('scroll', LEAD_SCROLL_EVENT);
-                            onShowPopup === null || onShowPopup === void 0 ? void 0 : onShowPopup(CAMPAIGN_SHOW, impressionAction);
-                        }
-                    };
-                    window.addEventListener('scroll', LEAD_SCROLL_EVENT, {
-                        passive: true,
-                    });
-                }
-            }
-            else {
-                LeadLog('🚧 No lead campaigns on current URL, tags');
-            }
-        }
-    })
-        .catch((err) => {
-        LeadLog(`Lead error: `, err);
-    });
-}
-const LeadLog = (...params) => {
-    if (process.env.NODE_ENV !== 'production' ||
-        (process.env.NEXT_PUBLIC_DEPLOY_ENV &&
-            process.env.NEXT_PUBLIC_DEPLOY_ENV !== 'production') ||
-        (typeof localStorage !== 'undefined' &&
-            localStorage.getItem('hhg_debug') === 'true')) {
-        console.log(...params);
-    }
-};
-
 function getCategoryLevel(t = 'Xin chao {{category_2}} extra') {
     if (t.includes('{{category_')) {
         const cl = '{{category_'.length;
@@ -4157,7 +3720,7 @@ const NewLeadPopup = ({ campaign, action, onSubmit, onClose, showThankyou, local
     const popupIdRef = React.useRef('lead-modal-' + uuid.v1());
     const categoryLevel = getCategoryLevel(titleText);
     if (categoryLevel) {
-        LeadLog('⚡️ Has categoryLevel', categoryLevel);
+        usePlacesAutocomplete.LeadLog('⚡️ Has categoryLevel', categoryLevel);
         const listMeta = Array.from(document.getElementsByTagName('META'));
         const valueMeta = listMeta.find((i) => i.name === `content_category_${categoryLevel}`);
         const valueMetaEn = listMeta.find((i) => i.name === `content_category_en_${categoryLevel}`);
@@ -4167,19 +3730,19 @@ const NewLeadPopup = ({ campaign, action, onSubmit, onClose, showThankyou, local
                 value_en: valueMetaEn.content,
             };
             titleText = titleText.replace(`{{category_${categoryLevel}}}`, valueMeta.content);
-            LeadLog('⚡️ Set categoryData ', categoryLevel);
+            usePlacesAutocomplete.LeadLog('⚡️ Set categoryData ', categoryLevel);
         }
         else {
-            LeadLog('⚡️ No META TAG for categoryLevel, not show popup', categoryLevel);
+            usePlacesAutocomplete.LeadLog('⚡️ No META TAG for categoryLevel, not show popup', categoryLevel);
             return null;
         }
     }
     else {
-        LeadLog('⚡️ No categoryLevel', categoryLevel);
+        usePlacesAutocomplete.LeadLog('⚡️ No categoryLevel', categoryLevel);
     }
     const onOtherSubmit = () => {
         var _a, _b, _c, _d;
-        LeadLog('👌 Other submit click');
+        usePlacesAutocomplete.LeadLog('👌 Other submit click');
         document.body.classList.remove('noscroll');
         if (currentLayout.includes('Skin')) {
             const $head = document.querySelector('#masthead');
@@ -4190,11 +3753,11 @@ const NewLeadPopup = ({ campaign, action, onSubmit, onClose, showThankyou, local
         const expiresDay = Number((_b = (_a = campaign.rules.find((r) => r.rule == 'days_to_show_again')) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : 7);
         const showAgain = Number((_d = (_c = campaign.rules.find((r) => r.rule == 'show_again_after_submit')) === null || _c === void 0 ? void 0 : _c.value) !== null && _d !== void 0 ? _d : 0);
         if (showAgain === 0) {
-            LeadLog('⛔ Popup never show again!');
+            usePlacesAutocomplete.LeadLog('⛔ Popup never show again!');
             miscCookieHelper.setCookie(`lead_submited_${code}`, `target_${extra_fields.popupVersion}`, { domain: '.' + siteDomain, path: '/' });
         }
         if (showAgain == 1) {
-            LeadLog(`⌛ Popup will show again after ${expiresDay} days!`);
+            usePlacesAutocomplete.LeadLog(`⌛ Popup will show again after ${expiresDay} days!`);
             miscCookieHelper.setCookie(`lead_submited_${code}`, `target_${extra_fields.popupVersion}`, { domain: '.' + siteDomain, days: expiresDay, path: '/' });
         }
         const gaCookie = miscCookieHelper.getCookie('_ga') || null;
@@ -4219,11 +3782,11 @@ const NewLeadPopup = ({ campaign, action, onSubmit, onClose, showThankyou, local
             .then((response) => response.json())
             .then((data) => {
             if (data.status === 'error') {
-                LeadLog(data);
+                usePlacesAutocomplete.LeadLog(data);
             }
         })
             .catch((error) => {
-            LeadLog('Error:', error);
+            usePlacesAutocomplete.LeadLog('Error:', error);
         });
         onClose === null || onClose === void 0 ? void 0 : onClose();
     };
@@ -4293,7 +3856,7 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, apiSubotUrl,
         var _a, _b;
         if (!showCampaign)
             return;
-        LeadLog(`👋👋👋 CLOSE POPUP ${showCampaign.code} 👋👋👋`);
+        usePlacesAutocomplete.LeadLog(`👋👋👋 CLOSE POPUP ${showCampaign.code} 👋👋👋`);
         if (!excludeExitRulesHandler) {
             const showAfterExit = Number((_a = showCampaign.rules.find((rule) => rule.rule == 'show_again_after_exit')) === null || _a === void 0 ? void 0 : _a.value);
             const expiresDay = Number((_b = showCampaign.rules.find((rule) => rule.rule == 'days_to_show_again')) === null || _b === void 0 ? void 0 : _b.value);
@@ -4327,17 +3890,17 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, apiSubotUrl,
         // window.next only on nextjs page
         if (window.next) {
             const debounced = debounce__default["default"]((e) => {
-                LeadLog('--🌻 routeChangeComplete', e, Date.now());
+                usePlacesAutocomplete.LeadLog('--🌻 routeChangeComplete', e, Date.now());
                 const currentPath = location.pathname;
                 // Remove floating, inline when url change
                 onClose();
-                clearPassiveEvent();
+                usePlacesAutocomplete.clearPassiveEvent();
                 if (document.querySelectorAll(`[data-popup-url="${currentPath}"]`).length) {
-                    LeadLog('🔥 This URL page has show popup!');
+                    usePlacesAutocomplete.LeadLog('🔥 This URL page has show popup!');
                 }
                 else {
-                    LeadLog('--Process checkShowPopup');
-                    checkShowPopup({
+                    usePlacesAutocomplete.LeadLog('--Process checkShowPopup');
+                    usePlacesAutocomplete.checkShowPopup({
                         leadApi: apiUrl,
                         leadDomain: siteDomain,
                         leadSiteId: siteId,
@@ -4351,7 +3914,7 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, apiSubotUrl,
             }, 500);
             window.next.router.events.on('routeChangeComplete', debounced);
         }
-        checkShowPopup({
+        usePlacesAutocomplete.checkShowPopup({
             leadApi: apiUrl,
             leadDomain: siteDomain,
             leadSiteId: siteId,
@@ -4365,7 +3928,7 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, apiSubotUrl,
             setShowEmpty(true);
             return;
         }
-        LeadLog('submitHandler', categoryLevel, categoryData);
+        usePlacesAutocomplete.LeadLog('submitHandler', categoryLevel, categoryData);
         const formData = Object.keys(formDataObj)
             .filter((key) => !!formDataObj[key])
             .map((key) => ({
@@ -4392,7 +3955,7 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, apiSubotUrl,
                         'text';
                     const value = control === 'tel'
                         ? window.intlTelInputUtils
-                            .formatNumber(String(i.value), LEAD_LOCALE === null || LEAD_LOCALE === void 0 ? void 0 : LEAD_LOCALE.countryCodeNumber, numberFormatType)
+                            .formatNumber(String(i.value), usePlacesAutocomplete.LEAD_LOCALE === null || usePlacesAutocomplete.LEAD_LOCALE === void 0 ? void 0 : usePlacesAutocomplete.LEAD_LOCALE.countryCodeNumber, numberFormatType)
                             .replace(/\s+/g, '')
                         : control === 'date'
                             ? dayjs__default["default"](i.value).format('YYYY-MM-DD')
@@ -4423,11 +3986,11 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, apiSubotUrl,
             7);
         const showAgain = Number(((_e = (_d = showCampaign.rules) === null || _d === void 0 ? void 0 : _d.find((r) => r.rule === 'show_again_after_submit')) === null || _e === void 0 ? void 0 : _e.value) || 0);
         if (showAgain == 0) {
-            LeadLog('⛔ Popup never show again!');
+            usePlacesAutocomplete.LeadLog('⛔ Popup never show again!');
             miscCookieHelper.setCookie(`lead_submited_${showCampaign.code}`, `target_${showCampaign === null || showCampaign === void 0 ? void 0 : showCampaign.extra_fields.targetType}`, { domain: '.' + siteDomain, path: '/' });
         }
         if (showAgain == 1) {
-            LeadLog(`⌛ Popup will show again after ${expiresDay} days!`);
+            usePlacesAutocomplete.LeadLog(`⌛ Popup will show again after ${expiresDay} days!`);
             miscCookieHelper.setCookie(`lead_submited_${showCampaign.code}`, `target_${showCampaign === null || showCampaign === void 0 ? void 0 : showCampaign.extra_fields.targetType}`, { domain: '.' + siteDomain, days: expiresDay, path: '/' });
         }
         fetch(`${apiUrl}api/campaign/${showCampaign.code}/lead`, {