@hhgtech/hhg-components 1.29.80 → 1.29.82

package/build/subot.js

@@ -3,57 +3,61 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var index$2 = require('./index-18ddaa1b.js');
-var tslib_es6 = require('./tslib.es6-4bc45883.js');
-var index$3 = require('./index-3a03bb34.js');
+var index$2 = require('./index-1f3fc2e3.js');
+var tslib_es6 = require('./tslib.es6-bd3f8718.js');
+var index$3 = require('./index-e3bbd009.js');
 var Cookies = require('js-cookie');
 var fd = require('fastdom');
 var fastdomPromised = require('fastdom/extensions/fastdom-promised');
-var utils = require('./utils-9f62698f.js');
+var togetherComponentGlobalContext = require('./utils-169c6a7d.js');
 var formatString = require('string-format');
-var index$1 = require('./index-61ef343d.js');
+var index$1 = require('./index-206afefb.js');
 var hexRgb = require('hex-rgb');
 var cn = require('classnames');
-var index$a = require('./index-bced434a.js');
-var index$8 = require('./index-c67602d7.js');
+var index$c = require('./index-6fdcd09d.js');
+var index$b = require('./index-ca616373.js');
 var framerMotion = require('framer-motion');
 var styled = require('@emotion/styled');
-var utils$1 = require('./utils-4849d92a.js');
-var index$4 = require('./index-94fd9ea6.js');
+var utils = require('./utils-15a9772e.js');
+var index$4 = require('./index-3eb666e6.js');
 var remarkable = require('remarkable');
 var other = require('@hhgtech/icons/other');
 var reactIntersectionObserver = require('react-intersection-observer');
 var core = require('@mantine/core');
-var index$5 = require('./index-858f60e0.js');
+var index$5 = require('./index-64d8db08.js');
 var dayjs = require('dayjs');
 var isSameOrBefore = require('dayjs/plugin/isSameOrBefore');
+var constants = require('./constants-a78fa8b3.js');
 var uuid = require('uuid');
-var index$6 = require('./index-e60c98f8.js');
-var theme = require('./theme-f410baf6.js');
-var isProduction = require('./isProduction-2e55aee3.js');
+var index$6 = require('./index-1fdf2f01.js');
+var theme = require('./theme-be20929b.js');
+var isProduction = require('./isProduction-20cd663d.js');
+var index$7 = require('./index-dff7ee1b.js');
 require('@mantine/dates');
-require('./useMantineLocale-b243f628.js');
-require('./translationsContext-11cafcfc.js');
+require('./useMantineLocale-0d63dfea.js');
+require('./translationsContext-00fdb62e.js');
 require('@mantine/hooks');
 var isEmpty = require('lodash/isEmpty');
 var reactHookForm = require('react-hook-form');
 var PhoneInputBase = require('react-phone-number-input');
 var api = require('@react-google-maps/api');
-var usePlacesAutocomplete = require('./usePlacesAutocomplete-08b86d2d.js');
-var index$9 = require('./index-5029b5d8.js');
-var index$7 = require('./index-8c826f3e.js');
+var usePlacesAutocomplete = require('./usePlacesAutocomplete-9520e525.js');
+var defaultClassWrapper = require('./defaultClassWrapper-b7719693.js');
+var index$9 = require('./index-a6a9855f.js');
+var index$a = require('./index-4bc690c9.js');
+var index$8 = require('./index-f222ee45.js');
 require('date-fns/locale');
-require('./index-1250dd06.js');
-require('./cookieHelper-b2132ffc.js');
+require('./index-82c85f9d.js');
+require('./cookieHelper-86ae022e.js');
 require('slugify');
-require('./index-917c975c.js');
-require('./Instagram-91ba1e26.js');
-require('./useTranslations-d5456a98.js');
-require('date-fns');
-require('react-day-picker/DayPickerInput');
+require('./index-10760994.js');
+require('./WhatsApp-46f4f408.js');
+require('./useTranslations-685f989b.js');
 require('@mantine/carousel');
-require('./useUniqueId-4ce69bff.js');
+require('./useUniqueId-1af8848e.js');
 require('@hhgtech/icons/core');
+require('date-fns');
+require('react-day-picker/DayPickerInput');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -143,7 +147,7 @@ const CachedSystem = {
 };
 
 const getSubotApiPath = (path, params) => {
-    const { subotApiUrl } = utils.GlobalData === null || utils.GlobalData === void 0 ? void 0 : utils.GlobalData.env;
+    const { subotApiUrl } = togetherComponentGlobalContext.GlobalData === null || togetherComponentGlobalContext.GlobalData === void 0 ? void 0 : togetherComponentGlobalContext.GlobalData.env;
     const apiUrl = subotApiUrl.endsWith('frontend/api/')
         ? subotApiUrl
         : subotApiUrl + 'frontend/api/';
@@ -152,7 +156,7 @@ const getSubotApiPath = (path, params) => {
 /** inline message */
 const subotInlineMessage = (data) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
     try {
-        return yield utils.callApi(getSubotApiPath(PATHS$1.GET_INLINE_MESSAGE), 'POST', {
+        return yield togetherComponentGlobalContext.callApi(getSubotApiPath(PATHS$1.GET_INLINE_MESSAGE), 'POST', {
             data,
         });
     }
@@ -184,7 +188,7 @@ const computeExtraSettingsForBot = (data) => {
 const subotInlineFirstNode = (id) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
     try {
         const data = yield CachedSystem.withCached('SubotInlineFirstNode/' + id, () => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
-            const response = yield utils.callApi(getSubotApiPath(PATHS$1.GET_INLINE_FIRST_NODE) + `/${id}`, 'GET');
+            const response = yield togetherComponentGlobalContext.callApi(getSubotApiPath(PATHS$1.GET_INLINE_FIRST_NODE) + `/${id}`, 'GET');
             computeExtraSettingsForBot(response);
             return response;
         }));
@@ -197,7 +201,7 @@ const subotInlineFirstNode = (id) => tslib_es6.__awaiter(void 0, void 0, void 0,
 /** inline click */
 const subotInlineClick = (data) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
     try {
-        return yield utils.callApi(getSubotApiPath(PATHS$1.GET_INLINE_CLICK), 'POST', {
+        return yield togetherComponentGlobalContext.callApi(getSubotApiPath(PATHS$1.GET_INLINE_CLICK), 'POST', {
             data,
         });
     }
@@ -206,7 +210,7 @@ const subotInlineClick = (data) => tslib_es6.__awaiter(void 0, void 0, void 0, f
 /** inline impression */
 const subotInlineImpression = (data) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
     try {
-        return yield utils.callApi(getSubotApiPath(PATHS$1.GET_INLINE_IMPRESSION), 'POST', {
+        return yield togetherComponentGlobalContext.callApi(getSubotApiPath(PATHS$1.GET_INLINE_IMPRESSION), 'POST', {
             data,
         });
     }
@@ -361,7 +365,7 @@ const getSubotInlineLogs = (botItem) => tslib_es6.__awaiter(void 0, void 0, void
     try {
         if (!botItem)
             return null;
-        const response = yield utils.callApi(getSubotApiPath(PATHS$1.GET_SUBOT_LOG, {
+        const response = yield togetherComponentGlobalContext.callApi(getSubotApiPath(PATHS$1.GET_SUBOT_LOG, {
             botId: botItem.id,
             cookieId: index$1.getSubotCookieId(),
             accountId: index$1.getUserIdFromCookie() || '',
@@ -610,9 +614,9 @@ const saveSubotInlineLogs = ({ nodes, activeId, params, accountIdFromLogs, }) =>
             data: JSON.stringify(data),
             status: statusFlowBot,
             type: 'inline',
-            market: index$3.MAP_DOMAIN_BY_LOCALE[utils.locale],
+            market: index$3.MAP_DOMAIN_BY_LOCALE[togetherComponentGlobalContext.locale],
         };
-        yield utils.callApi(getSubotApiPath(PATHS$1.POST_SUBOT_CREATE_LOG), 'POST', {
+        yield togetherComponentGlobalContext.callApi(getSubotApiPath(PATHS$1.POST_SUBOT_CREATE_LOG), 'POST', {
             data: payload,
         });
     }
@@ -658,7 +662,7 @@ const SubotInlineContext = React.createContext({
     userInfo: null,
 });
 const SubotInlineProvider = ({ children, articleLink, subotId, isFullContainer, bgColor: _bgColor, primaryColor: _primaryColor, textColor, textButtonColor, bgContentColor, bgImgFullContainer, isDisabledAnimationOnMobile, onCloseMobile, userInfo, }) => {
-    const { formatMessage: f, action: { pushNotifications }, } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f, action: { pushNotifications }, } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     const ref = React.useRef(null);
     // const { formatMessage: f } = useIntl()
     const refAccountIdFromLogs = React.useRef(null);
@@ -706,7 +710,7 @@ const SubotInlineProvider = ({ children, articleLink, subotId, isFullContainer,
         const gaData = window.gaData;
         const url = window.location.origin +
             index$3.basePath +
-            ((utils.GlobalData === null || utils.GlobalData === void 0 ? void 0 : utils.GlobalData.locale) === 'tl-PH'
+            ((togetherComponentGlobalContext.GlobalData === null || togetherComponentGlobalContext.GlobalData === void 0 ? void 0 : togetherComponentGlobalContext.GlobalData.locale) === 'tl-PH'
                 ? articleLink.replace('fil/', '')
                 : articleLink);
         const params = {
@@ -736,7 +740,7 @@ const SubotInlineProvider = ({ children, articleLink, subotId, isFullContainer,
                 .replace('https://hellohealthgroup.com', 'https://hellodoctor.com.ph'),
             window_id: index$1.getWindowId(),
         };
-        return index$1.overrideParamsByQuery(params, utils.GlobalData === null || utils.GlobalData === void 0 ? void 0 : utils.GlobalData.router.query);
+        return index$1.overrideParamsByQuery(params, togetherComponentGlobalContext.GlobalData === null || togetherComponentGlobalContext.GlobalData === void 0 ? void 0 : togetherComponentGlobalContext.GlobalData.router.query);
     }, []);
     const elementScrollIntoView = React.useCallback(() => {
         var _a;
@@ -1022,7 +1026,7 @@ const SubotInlineRevampContainer = styled__default["default"].div `
     pointer-events: none;
   }
 
-  ${utils$1.MediaQueries.mbUp} {
+  ${utils.MediaQueries.mbUp} {
     .si-inline-revamp-container {
       padding-right: 12px;
     }
@@ -1050,7 +1054,7 @@ const SubotInlineRevampContainer = styled__default["default"].div `
       height: calc(100% - 72px);
     }
 
-    ${utils$1.MediaQueries.mbUp} {
+    ${utils.MediaQueries.mbUp} {
       &[data-show-footer='true'] {
         height: calc(100% - 56px);
       }
@@ -1072,7 +1076,7 @@ const SubotInlineRevampContainer = styled__default["default"].div `
     }
   }
 
-  ${utils$1.MediaQueries.mbUp} {
+  ${utils.MediaQueries.mbUp} {
     .si-container-placeholder {
       height: 550px;
       max-height: 550px;
@@ -1100,7 +1104,7 @@ const SubotInlineRevampContainer = styled__default["default"].div `
     }
   }
 
-  ${utils$1.MediaQueries.mbDown} {
+  ${utils.MediaQueries.mbDown} {
     .si-container-open {
       position: fixed;
       width: auto;
@@ -1138,7 +1142,7 @@ const StyledContainerFullscreen = styled__default["default"].div `
   padding: 40px 0;
   font-family: Inter;
 
-  ${utils$1.MediaQueries.mbUp} {
+  ${utils.MediaQueries.mbUp} {
     padding: 80px 0;
   }
 
@@ -1149,7 +1153,7 @@ const StyledContainerFullscreen = styled__default["default"].div `
     margin: 0 auto;
     flex-direction: column;
 
-    ${utils$1.MediaQueries.mbUp} {
+    ${utils.MediaQueries.mbUp} {
       flex-direction: row;
       gap: 30px;
     }
@@ -1171,12 +1175,12 @@ const StyledContainerFullscreen = styled__default["default"].div `
       }
     }
 
-    ${utils$1.MediaQueries.mbUp} {
+    ${utils.MediaQueries.mbUp} {
       max-width: ${heightMobile};
       min-width: ${heightMobile};
     }
 
-    ${utils$1.MediaQueries.tdUp} {
+    ${utils.MediaQueries.tdUp} {
       max-width: 720px;
       min-width: 720px;
     }
@@ -1188,7 +1192,7 @@ const StyledContainerFullscreen = styled__default["default"].div `
     flex-direction: column;
     max-width: 490px;
 
-    ${utils$1.MediaQueries.mbUp} {
+    ${utils.MediaQueries.mbUp} {
       padding-top: 48px;
     }
 
@@ -1204,7 +1208,7 @@ const StyledContainerFullscreen = styled__default["default"].div `
       line-height: 1.2;
       letter-spacing: -0.616px;
 
-      ${utils$1.MediaQueries.mbUp} {
+      ${utils.MediaQueries.mbUp} {
         font-size: 40px;
         line-height: 48px;
         letter-spacing: -0.88px;
@@ -1262,7 +1266,7 @@ const Info = (props) => {
 
 const Container$v = () => {
     const [isShow, setIsShow] = React.useState(false);
-    const { formatMessage: f } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     return (React__default["default"].createElement(StyledWrap$q, null,
         React__default["default"].createElement("div", { className: "si-disclaimer", onClick: () => setIsShow(!isShow) },
             React__default["default"].createElement(Info, { className: "si-disclaimer-info-svg" }),
@@ -1279,7 +1283,7 @@ const Container$v = () => {
 Container$v.displayName = 'SubotInlineDisclaimer';
 
 const useCurrentUrl = () => {
-    const { data: { locale, router }, } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { data: { locale, router }, } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     const { asPath } = router || {};
     const [currentUrl, setCurrentUrl] = React.useState(() => `${index$1.getHelloSitesUrl(locale, false)}${index$3.basePath}${asPath}`);
     React.useEffect(() => {
@@ -1290,7 +1294,7 @@ const useCurrentUrl = () => {
 
 // import { useIntl } from 'react-intl'
 const useValidationMultiOption = () => {
-    const { formatMessage: f, action: { pushNotifications }, } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f, action: { pushNotifications }, } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     const validateSelectActions = (activeActions, node, callBack) => {
         if ((node === null || node === void 0 ? void 0 : node.multi_select_option) === index$2.NodeMultipleOptions.EXACT_NUMBER &&
             activeActions.length !== (node === null || node === void 0 ? void 0 : node.from)) {
@@ -1374,7 +1378,7 @@ const StyledWrap$p = styled__default["default"].div `
     display: flex;
   }
 
-  ${utils$1.MediaQueries.mbDown} {
+  ${utils.MediaQueries.mbDown} {
     &[data-show-action='false'] {
       justify-content: center;
       padding: 12px 0;
@@ -1451,7 +1455,7 @@ const excludeNodeList = [
 // }
 const Container$u = () => {
     var _a, _b, _c, _d, _e;
-    const { formatMessage: f, action: { pushNotifications }, } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f, action: { pushNotifications }, } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     const currentUrl = useCurrentUrl();
     const { listNodes, activeId, isShowFooter, onNext, onPrev, params, onStartOver, loading, } = React.useContext(SubotInlineContext);
     const { value } = React.useContext(NodeContext);
@@ -1710,7 +1714,7 @@ const StyledContainer = styled__default["default"].div `
     /* color: #262626; */
     color: var(--subot-inline-text-color, #262626);
 
-    ${utils$1.MediaQueries.mbUp} {
+    ${utils.MediaQueries.mbUp} {
       font-size: 24px;
       line-height: 120%;
       letter-spacing: -0.432px;
@@ -1724,7 +1728,7 @@ const StyledContainer = styled__default["default"].div `
     line-height: 24px;
     font-weight: 400;
 
-    ${utils$1.MediaQueries.mbUp} {
+    ${utils.MediaQueries.mbUp} {
       letter-spacing: -0.16px;
     }
   }
@@ -1806,7 +1810,7 @@ const SubotInlineVoucherLeftUI = ({ clientId, voucherAnswers }) => {
     const [quantityTotal, setQuantityTotal] = React.useState(0);
     const [quantityInStock, setQuantityInStock] = React.useState(0);
     React.useEffect(() => {
-        utils.callApi(getSubotApiPath(PATHS$1.GET_VOUCHER_QUANTITY, {
+        togetherComponentGlobalContext.callApi(getSubotApiPath(PATHS$1.GET_VOUCHER_QUANTITY, {
             search: (voucherAnswers === null || voucherAnswers === void 0 ? void 0 : voucherAnswers.voucherName.split('|')[0]) || '',
             clientId: clientId,
         }), 'GET').then((res) => {
@@ -1911,7 +1915,7 @@ const StyledWrap$k = styled__default["default"].div `
       display: block;
     }
 
-    ${utils$1.MediaQueries.mbUp} {
+    ${utils.MediaQueries.mbUp} {
       font-size: 22px;
       line-height: 32px;
       letter-spacing: -0.6px;
@@ -1948,22 +1952,22 @@ const PATHS = {
 };
 
 const getLeadPath = (path, params) => {
-    const { leadApiUrl } = utils.GlobalData === null || utils.GlobalData === void 0 ? void 0 : utils.GlobalData.env;
+    const { leadApiUrl } = togetherComponentGlobalContext.GlobalData === null || togetherComponentGlobalContext.GlobalData === void 0 ? void 0 : togetherComponentGlobalContext.GlobalData.env;
     return leadApiUrl + formatString__default["default"](path, Object.assign({}, params));
 };
 const callApiWithLead = (url, method, options) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
     if (options === null || options === void 0 ? void 0 : options.data) {
-        let cookie = Cookies__default["default"].get(utils.LEAD_TOKEN_COOKIE);
+        let cookie = Cookies__default["default"].get(constants.LEAD_TOKEN_COOKIE);
         const ga = Cookies__default["default"].get(index$3.GA_TOKEN_COOKIE);
         if (!cookie) {
             const newCookie = uuid.v4();
             cookie = newCookie;
-            Cookies__default["default"].set(utils.LEAD_TOKEN_COOKIE, newCookie);
+            Cookies__default["default"].set(constants.LEAD_TOKEN_COOKIE, newCookie);
         }
         options.data.cookie_id = cookie;
         options.data.ga_client_id = ga || '';
     }
-    return utils.callApi(url, method, options);
+    return togetherComponentGlobalContext.callApi(url, method, options);
 });
 
 dayjs__default["default"].extend(isSameOrBefore__default["default"]);
@@ -2362,7 +2366,7 @@ const StyledWrap$f = styled__default["default"].div `
 
 const Container$m = ({ text }) => {
     const [isShow, setIsShow] = React.useState(false);
-    const { formatMessage: f } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     if (!text) {
         return null;
     }
@@ -2380,7 +2384,7 @@ Container$m.displayName = 'SubotInlineDisclaimer';
 
 const Container$l = ({ intent }) => {
     var _a;
-    const { formatMessage: f } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     const handleOnClick = (service) => {
         if (!service.url) {
             return;
@@ -2491,7 +2495,7 @@ var _a$1;
 const SubotInlineIntentCol = styled__default["default"].div `
   width: ${({ width }) => width || '100%'};
   padding: 4px;
-  ${utils$1.MediaQueries.mbDown} {
+  ${utils.MediaQueries.mbDown} {
     width: 100%;
   }
 `;
@@ -2693,7 +2697,7 @@ styled__default["default"].div `
   border: 1px solid #ffecb6;
   border-radius: 16px;
 
-  ${utils$1.MediaQueries.mbUp} {
+  ${utils.MediaQueries.mbUp} {
     padding: 0 0 24px 0;
   }
 
@@ -2765,12 +2769,12 @@ const StyledSubInlineIntent = styled__default["default"].div `
     + div {
       margin-top: 16px;
 
-      ${utils$1.MediaQueries.mbUp} {
+      ${utils.MediaQueries.mbUp} {
         margin-top: 24px;
       }
     }
 
-    ${utils$1.MediaQueries.mbUp} {
+    ${utils.MediaQueries.mbUp} {
       font-size: 18px;
     }
   } */
@@ -2806,7 +2810,7 @@ const Container$f = ({ node }) => {
     var _a;
     // const isMobile = useGetIsMobile(true)
     const refMainIntents = React.useRef(null);
-    const { formatMessage: f } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     const { setIsShowFooter, listNodes } = React.useContext(SubotInlineContext);
     const [isShowMore, setIsShowMore] = React.useState(false);
     React.useEffect(() => {
@@ -3169,7 +3173,7 @@ var schema = {
 };
 
 // const STORAGE_URL = 'https://storage.googleapis.com/hhg-common'
-const STORAGE_URL = index$1.getHelloSitesUrl(utils.locale); // To fix the Cors issue later
+const STORAGE_URL = index$1.getHelloSitesUrl(togetherComponentGlobalContext.locale); // To fix the Cors issue later
 function getLevelKey(countryCode, level) {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const _schema = schema;
@@ -3343,9 +3347,9 @@ const googleMapsApisPlaceDetailsTypes = {
 };
 const googleMapAddressKeys = Object.keys(googleMapsApisPlaceDetailsTypes).concat(['address']);
 function GoogleAddressField({ action, formError, control, initValue, onChange, }) {
-    const locale = utils.GlobalData === null || utils.GlobalData === void 0 ? void 0 : utils.GlobalData.locale;
+    const locale = togetherComponentGlobalContext.GlobalData === null || togetherComponentGlobalContext.GlobalData === void 0 ? void 0 : togetherComponentGlobalContext.GlobalData.locale;
     const countryCode = locale.split('-')[1];
-    const { formatMessage: f } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     const [searchText, setSearchText] = React.useState('');
     const div = React.useRef(null);
     const rowRef = React.useRef(null);
@@ -3436,7 +3440,7 @@ function GoogleAddressField({ action, formError, control, initValue, onChange, }
             }, render: (props) => {
                 const { address = '' } = (props.field.value || {});
                 console.log('props', props);
-                return (React__default["default"].createElement(index$4.Select, { data: options, icon: React__default["default"].createElement(Location, null), itemComponent: SelectItem, 
+                return (React__default["default"].createElement(index$7.Select, { data: options, icon: React__default["default"].createElement(Location, null), itemComponent: SelectItem, 
                     // Always display the suggestions
                     filter: () => true, searchable: true, className: cn__default["default"]({
                         isEmpty: options.length === 0 ||
@@ -3505,7 +3509,7 @@ function GoogleAddressField({ action, formError, control, initValue, onChange, }
 }
 var GoogleAddressField$1 = React.memo(GoogleAddressField);
 
-const StyleDatePickerInput = utils.setDefaultClass(styled__default["default"].div `
+const StyleDatePickerInput = defaultClassWrapper.setDefaultClass(styled__default["default"].div `
     position: relative;
     .input-date {
       display: none;
@@ -3515,13 +3519,13 @@ const StyledUserInfoFormContainer = styled__default["default"].div `
   margin: 0 auto;
   background: #f7f9fc;
   border-radius: ${theme.theme.borderRadius};
-  ${utils$1.MediaQueries.mbDown} {
+  ${utils.MediaQueries.mbDown} {
     padding: 16px;
   }
-  ${utils$1.MediaQueries.tdDown} {
+  ${utils.MediaQueries.tdDown} {
     padding: 24px;
   }
-  ${utils$1.MediaQueries.mbUp} {
+  ${utils.MediaQueries.mbUp} {
     padding: 32px;
   }
   .user-info-form {
@@ -3537,13 +3541,13 @@ const StyledUserInfoFormContainer = styled__default["default"].div `
       }
     }
     .input-row {
-      ${utils$1.MediaQueries.mbDown} {
+      ${utils.MediaQueries.mbDown} {
         margin-bottom: 16px;
       }
-      ${utils$1.MediaQueries.tdDown} {
+      ${utils.MediaQueries.tdDown} {
         margin-bottom: 18px;
       }
-      ${utils$1.MediaQueries.mbUp} {
+      ${utils.MediaQueries.mbUp} {
         margin-bottom: 20px;
       }
       .address-dropdown > ul {
@@ -3734,13 +3738,13 @@ const StyledUserInfoFormContainer = styled__default["default"].div `
       }
     }
     .submit-btn-row {
-      ${utils$1.MediaQueries.mbUp} {
+      ${utils.MediaQueries.mbUp} {
         margin-bottom: 16px;
       }
-      ${utils$1.MediaQueries.tdDown} {
+      ${utils.MediaQueries.tdDown} {
         margin-bottom: 14px;
       }
-      ${utils$1.MediaQueries.mbDown} {
+      ${utils.MediaQueries.mbDown} {
         margin-bottom: 12px;
       }
       .subot-checkbox {
@@ -3883,7 +3887,7 @@ const StyleWrapperFullAddress = styled__default["default"].div `
     gap: 16px;
     justify-content: space-between;
 
-    ${utils$1.MediaQueries.mbDown} {
+    ${utils.MediaQueries.mbDown} {
       flex-direction: column;
       gap: 0;
     }
@@ -3993,7 +3997,7 @@ const CountDown = ({ onFinish, onClick, isFinished, resendLabel, className }, re
     const [count, setCount] = React.useState(index$1.TIME_RESET_RESEND_OTP);
     const intervalId = React.useRef();
     const onFinishLatest = React.useRef();
-    const { formatMessage: f } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     onFinishLatest.current = onFinish;
     const resetCountDown = React.useCallback(() => {
         let currentCount = index$1.TIME_RESET_RESEND_OTP;
@@ -4039,24 +4043,24 @@ styled__default["default"].div `
   margin: 0 auto;
   background: #f7f9fc;
   border-radius: ${theme.theme.borderRadius};
-  ${utils$1.MediaQueries.mbDown} {
+  ${utils.MediaQueries.mbDown} {
     padding: 16px;
   }
-  ${utils$1.MediaQueries.tdDown} {
+  ${utils.MediaQueries.tdDown} {
     padding: 24px;
   }
-  ${utils$1.MediaQueries.mbUp} {
+  ${utils.MediaQueries.mbUp} {
     padding: 32px;
   }
   .user-info-form {
     .input-row {
-      ${utils$1.MediaQueries.mbDown} {
+      ${utils.MediaQueries.mbDown} {
         margin-bottom: 16px;
       }
-      ${utils$1.MediaQueries.tdDown} {
+      ${utils.MediaQueries.tdDown} {
         margin-bottom: 18px;
       }
-      ${utils$1.MediaQueries.mbUp} {
+      ${utils.MediaQueries.mbUp} {
         margin-bottom: 20px;
       }
       .address-dropdown > ul {
@@ -4129,13 +4133,13 @@ styled__default["default"].div `
       }
     }
     .submit-btn-row {
-      ${utils$1.MediaQueries.mbUp} {
+      ${utils.MediaQueries.mbUp} {
         margin-bottom: 16px;
       }
-      ${utils$1.MediaQueries.tdDown} {
+      ${utils.MediaQueries.tdDown} {
         margin-bottom: 14px;
       }
-      ${utils$1.MediaQueries.mbDown} {
+      ${utils.MediaQueries.mbDown} {
         margin-bottom: 12px;
       }
       .subot-checkbox {
@@ -4334,10 +4338,10 @@ const PhoneInputWithCode = (props) => {
 
 const UserInfoForm = ({ className, style, actions, countryCode, callBack, formSubmitMeta, isFormRevamp, botId, nodeId, trackingSubmitBtn, }) => {
     const countRef = React.useRef();
-    const userInfo = utils.GlobalData === null || utils.GlobalData === void 0 ? void 0 : utils.GlobalData.userInfo;
-    const locale = utils.GlobalData === null || utils.GlobalData === void 0 ? void 0 : utils.GlobalData.locale;
+    const userInfo = togetherComponentGlobalContext.GlobalData === null || togetherComponentGlobalContext.GlobalData === void 0 ? void 0 : togetherComponentGlobalContext.GlobalData.userInfo;
+    const locale = togetherComponentGlobalContext.GlobalData === null || togetherComponentGlobalContext.GlobalData === void 0 ? void 0 : togetherComponentGlobalContext.GlobalData.locale;
     const currentUrl = useCurrentUrl();
-    const { formatMessage: f, action: { pushNotifications }, } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f, action: { pushNotifications }, } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     const addressData = useAddressMultipleLevelData(countryCode);
     // Level 1
     const provinceData = React.useMemo(() => {
@@ -4567,7 +4571,7 @@ const UserInfoForm = ({ className, style, actions, countryCode, callBack, formSu
         }
         setIsLoading(true);
         try {
-            const result = yield utils.callApi(getSubotApiPath(actionOtpWhatsApp
+            const result = yield togetherComponentGlobalContext.callApi(getSubotApiPath(actionOtpWhatsApp
                 ? PATHS$1.POST_SEND_OTP_WHATSAPP
                 : PATHS$1.POST_SEND_OTP), 'POST', {
                 data: actionOtpWhatsApp
@@ -4645,7 +4649,7 @@ const UserInfoForm = ({ className, style, actions, countryCode, callBack, formSu
         const parsedPhone = PhoneInputBase.parsePhoneNumber(data.otpPhoneNumber);
         if (action.key && parsedPhone) {
             try {
-                const result = yield utils.callApi(getSubotApiPath(actionOtpWhatsApp
+                const result = yield togetherComponentGlobalContext.callApi(getSubotApiPath(actionOtpWhatsApp
                     ? PATHS$1.POST_VERIFY_OTP_WHATSAPP
                     : PATHS$1.POST_VERIFY_OTP), 'POST', {
                     data: actionOtpWhatsApp
@@ -4707,7 +4711,7 @@ const UserInfoForm = ({ className, style, actions, countryCode, callBack, formSu
                                 required: true,
                             }, render: (props) => {
                                 var _a;
-                                return (React__default["default"].createElement(index$9.Dropdown, { id: actionAddressLever1.id, options: provinceData, onChange: (val) => {
+                                return (React__default["default"].createElement(index$a.Dropdown, { id: actionAddressLever1.id, options: provinceData, onChange: (val) => {
                                         props.field.onChange(val);
                                         handleSelectedProvince(val);
                                     }, value: props.field.value, placeholder: (actionAddressLever1 === null || actionAddressLever1 === void 0 ? void 0 : actionAddressLever1.label) || '', className: `address-dropdown ${((_a = props.field.value) === null || _a === void 0 ? void 0 : _a.value) ? '' : 'show-placeholder'}` }));
@@ -4723,7 +4727,7 @@ const UserInfoForm = ({ className, style, actions, countryCode, callBack, formSu
                                 required: true,
                             }, render: (props) => {
                                 var _a;
-                                return (React__default["default"].createElement(index$9.Dropdown, { id: actionAddressLever2.id, options: districtData, onChange: (val) => {
+                                return (React__default["default"].createElement(index$a.Dropdown, { id: actionAddressLever2.id, options: districtData, onChange: (val) => {
                                         props.field.onChange(val);
                                         handleSelectedDistrict(val);
                                     }, value: props.field.value, placeholder: (actionAddressLever2 === null || actionAddressLever2 === void 0 ? void 0 : actionAddressLever2.label) || '', className: `address-dropdown ${((_a = props.field.value) === null || _a === void 0 ? void 0 : _a.value) ? '' : 'show-placeholder'}` }));
@@ -4739,7 +4743,7 @@ const UserInfoForm = ({ className, style, actions, countryCode, callBack, formSu
                                 required: true,
                             }, render: (props) => {
                                 var _a;
-                                return (React__default["default"].createElement(index$9.Dropdown, { id: actionAddressLever3.id, options: communeData, onChange: (val) => {
+                                return (React__default["default"].createElement(index$a.Dropdown, { id: actionAddressLever3.id, options: communeData, onChange: (val) => {
                                         props.field.onChange(val);
                                     }, value: props.field.value, placeholder: (actionAddressLever3 === null || actionAddressLever3 === void 0 ? void 0 : actionAddressLever3.label) || '', className: `address-dropdown ${((_a = props.field.value) === null || _a === void 0 ? void 0 : _a.value) ? '' : 'show-placeholder'}` }));
                             } })),
@@ -4764,7 +4768,7 @@ const UserInfoForm = ({ className, style, actions, countryCode, callBack, formSu
                     React__default["default"].createElement(reactHookForm.Controller, { key: action.key, control: control, name: action.key, rules: {
                             required: true,
                         }, render: ({ field }) => {
-                            return (React__default["default"].createElement(index$4.Select, Object.assign({ searchable: true, data: options, placeholder: action.label }, field, { withinPortal: true, zIndex: 1000 })));
+                            return (React__default["default"].createElement(index$7.Select, Object.assign({ searchable: true, data: options, placeholder: action.label }, field, { withinPortal: true, zIndex: 1000 })));
                         } }),
                     errors[action.key] && (React__default["default"].createElement("p", { className: "error-message" }, f({
                         id: 'validation.error.requiredField',
@@ -4818,7 +4822,7 @@ const UserInfoForm = ({ className, style, actions, countryCode, callBack, formSu
                 return (React__default["default"].createElement("div", { className: "input-row", key: action.id },
                     React__default["default"].createElement("label", { htmlFor: action.key }, action.label),
                     React__default["default"].createElement(StyleDatePickerInput, null,
-                        React__default["default"].createElement(index$8.DatePicker, { locale: locale || 'en-PH', displayDateFormat: index$3.DATE_FNS_DATE_FORMAT, onChange: (_value) => {
+                        React__default["default"].createElement(index$9.DatePicker, { locale: locale || 'en-PH', displayDateFormat: index$3.DATE_FNS_DATE_FORMAT, onChange: (_value) => {
                                 const dateString = dayjs__default["default"](_value).format(index$3.API_DATE_FORMAT);
                                 setValue(action.key, dateString);
                                 trigger(action.key);
@@ -4945,7 +4949,7 @@ const UserInfoForm = ({ className, style, actions, countryCode, callBack, formSu
                             React__default["default"].createElement("span", { className: "verify-success-label" }, f({
                                 id: 'subot.verifyOTP.success.message',
                                 defaultMessage: 'Verified successful',
-                            })))) : (React__default["default"].createElement(index$7.Button, Object.assign({ className: "submit-btn", size: isFormRevamp ? 'md' : 'lg', isLoading: isLoadingVerify, isDisabled: !sentOTP, onClick: (e) => handleVerifyOTP(e, action) }, trackingVerifyOTP), f({
+                            })))) : (React__default["default"].createElement(index$8.Button, Object.assign({ className: "submit-btn", size: isFormRevamp ? 'md' : 'lg', isLoading: isLoadingVerify, isDisabled: !sentOTP, onClick: (e) => handleVerifyOTP(e, action) }, trackingVerifyOTP), f({
                             id: 'subot.verifyOTP.button',
                             defaultMessage: 'Verify OTP',
                         })))))));
@@ -4988,7 +4992,7 @@ const StyledWrap$a = styled__default["default"].div `
 
 const Container$d = ({ node, indexNumber }) => {
     var _a;
-    const locale = utils.GlobalData === null || utils.GlobalData === void 0 ? void 0 : utils.GlobalData.locale;
+    const locale = togetherComponentGlobalContext.GlobalData === null || togetherComponentGlobalContext.GlobalData === void 0 ? void 0 : togetherComponentGlobalContext.GlobalData.locale;
     const { params, listNodes, activeId, onSubmit, setIsShowFooter } = React.useContext(SubotInlineContext);
     React.useMemo(() => {
         setIsShowFooter(true);
@@ -5029,7 +5033,7 @@ const StyledWrap$8 = styled__default["default"].div `
       width: calc(50% - 8px);
     }
 
-    ${utils$1.MediaQueries.mbUp} {
+    ${utils.MediaQueries.mbUp} {
       gap: 32px;
       padding: 0 16px;
 
@@ -5046,7 +5050,7 @@ const Checkbox = (props) => {
         React__default["default"].createElement("path", { d: "M15.571 8 9.68 14 7 11.273", stroke: "#fff" })));
 };
 
-const StyledRadioIcon = utils.setDefaultClass(styled__default["default"].div `
+const StyledRadioIcon = defaultClassWrapper.setDefaultClass(styled__default["default"].div `
     position: relative;
     z-index: 1;
     display: flex;
@@ -5238,7 +5242,7 @@ const stylesButtonSubmitOther = {
 
 const Container$a = ({ action, onChange, active, htmlType, formSubmitMeta, }) => {
     const timeoutId = React.useRef(null);
-    const { formatMessage: f } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     const currentUrl = useCurrentUrl();
     const inputRef = React.useRef(null);
     const [otherText, setOtherText] = React.useState('');
@@ -5491,7 +5495,7 @@ const Container$5 = ({ node, indexNumber }) => {
 Container$5.displayName = 'SubotInlineNodeMultipleContainer';
 
 const useDescriptionPollNode = ({ node }) => {
-    const { formatMessage: f } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     let description = f({
         id: 'multiSelectError.required',
         defaultMessage: 'You must choose one options',
@@ -5607,7 +5611,7 @@ Container$4.displayName = 'SubotinlineNodePoll';
 const StyledWrap$1 = styled__default["default"].div ``;
 
 const Container$3 = ({ node }) => {
-    const { formatMessage: f } = React.useContext(utils.TogetherComponentGlobalContext);
+    const { formatMessage: f } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext);
     const { params, setIsShowFooter, listNodes, activeId } = React.useContext(SubotInlineContext);
     React.useMemo(() => {
         setIsShowFooter(true);
@@ -5814,7 +5818,7 @@ const View = ({ loading, backgroundImage, isShowFooter, isFullContainer, isDisab
                 React__default["default"].createElement(Close, null))),
             React__default["default"].createElement(NodeContextProvider, null,
                 React__default["default"].createElement("div", { className: "subot-inline-revamp-container", "data-show-footer": isShowFooter },
-                    loading && !isShowFooter && React__default["default"].createElement(index$8.Loading, { className: "si-loading" }),
+                    loading && !isShowFooter && React__default["default"].createElement(index$b.Loading, { className: "si-loading" }),
                     React__default["default"].createElement(Container$1, { onClickStart: () => {
                             setIsDisplayFullMobile(true);
                         } })),
@@ -5833,7 +5837,7 @@ const View = ({ loading, backgroundImage, isShowFooter, isFullContainer, isDisab
     }, [bgImgFullContainer]);
     if (isFullContainer) {
         return (React__default["default"].createElement(StyledContainerFullscreen, { style: styleFullContainer },
-            React__default["default"].createElement(index$a.Container, { className: "si-container" },
+            React__default["default"].createElement(index$c.Container, { className: "si-container" },
                 React__default["default"].createElement("div", { className: "si-revamp-left" },
                     React__default["default"].createElement(Container$t, { subotSettingData: subotSettingData }),
                     React__default["default"].createElement(Container$v, null)),