@hhgtech/hhg-components 1.29.304 → 1.29.306-beta-1

package/build/organisms.js

@@ -2,78 +2,78 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var index = require('./index-bd16b8a1.js');
-var index$1 = require('./index-49d984f5.js');
-var index$2 = require('./index-1d58e8ed.js');
+var index = require('./index-19f24ab6.js');
+var index$1 = require('./index-bee68a8d.js');
+var index$2 = require('./index-b127af91.js');
 var navigationLogoutPopup = require('./navigationLogoutPopup.js');
-var navigationProfileButton = require('./index-0c4c606b.js');
+var navigationProfileButton = require('./index-5593ab66.js');
 var profileNavigation = require('./profileNavigation.js');
-require('./tslib.es6-3d51d0f9.js');
+require('./tslib.es6-686ff696.js');
 require('react');
-require('./index-2a7aac5f.js');
-require('./index-9923a75c.js');
+require('./index-10266e00.js');
+require('./index-224d9ca2.js');
 require('@hhgtech/icons/other');
 require('@mantine/core');
 require('@mantine/hooks');
-require('./index-50592c00.js');
+require('./index-845de0bd.js');
 require('./constantsDomainLocales.js');
-require('./Locale-d521ebc6.js');
+require('./Locale-7b280065.js');
 require('./constantsIsProduction.js');
-require('./useScreenSize-73ddfee2.js');
+require('./useScreenSize-0401fbfe.js');
 require('@emotion/styled');
-require('./utils-ad02d413.js');
+require('./utils-45383606.js');
 require('@mantine/carousel');
-require('./index-6f552517.js');
-require('./other-0a459e98.js');
-require('./index-894c8500.js');
+require('./index-94fe7461.js');
+require('./other-42f538a2.js');
+require('./index-ef3fe96d.js');
 require('./miscTheme.js');
-require('./useMantineLocale-f2a01306.js');
+require('./useMantineLocale-3e339316.js');
 require('@mantine/notifications');
-require('./index-d6f15734.js');
+require('./index-4fce52d2.js');
 require('date-fns/locale');
 require('./constantsSite.js');
 require('./constantsRiskScreener.js');
 require('dayjs');
-require('./index-79dae201.js');
+require('./index-93165efa.js');
 require('classnames');
-require('./useUniqueId-6fb7b102.js');
+require('./useUniqueId-87671891.js');
 require('@hhgtech/icons/core');
-require('./normalizeLink-c9ed6c3f.js');
-require('./dataTransform-eaaa7307.js');
-require('./index-2947e776.js');
-require('./logoIcon-c00932fe.js');
-require('./index-3b84402a.js');
-require('./translationsContext-7d235252.js');
+require('./normalizeLink-870f013d.js');
+require('./dataTransform-81c7720a.js');
+require('./index-3359cd7b.js');
+require('./logoIcon-cf2b41d2.js');
+require('./index-cd8df0b4.js');
+require('./translationsContext-e1ddb362.js');
 require('lodash/throttle');
 require('@mantine/dates');
-require('./index.styles-e3bb01fa.js');
-require('./index-9840d47f.js');
-require('./constants-6cb831c0.js');
-require('./store-0c588912.js');
+require('./index.styles-afac97a7.js');
+require('./index-b5eb38b7.js');
+require('./constants-3dc27f33.js');
+require('./store-3889e12f.js');
 require('zustand');
 require('./miscCookieHelper.js');
-require('./index-bb2bde01.js');
-require('./utils-a6b09cf7.js');
-require('./index-7b5757b2.js');
+require('./index-57c1daea.js');
+require('./utils-b93bfb3c.js');
+require('./index-f6835a7d.js');
 require('slugify');
 require('string-format');
 require('./togetherApiPaths.js');
-require('./constants-07b72239.js');
-require('./constants-fa32edf5.js');
-require('./index-8ed91073.js');
-require('./index-2c8b22f3.js');
-require('./useIsInit-b7392217.js');
+require('./constants-f64cf447.js');
+require('./constants-b913fdef.js');
+require('./index-90390997.js');
+require('./index-53a0a295.js');
+require('./useIsInit-844a67ab.js');
 require('./miscDefaultClassWrapper.js');
 require('dayjs/plugin/relativeTime');
-require('./index-da21bee9.js');
-require('./index-d3a2f594.js');
+require('./index-7f790b1c.js');
+require('./index-5b53f9e7.js');
 require('lodash/debounce');
-require('./core-819c47cf.js');
-require('./index-79549f6f.js');
-require('./index-a636b13b.js');
-require('./index-8845e9c8.js');
-require('./Spinner-4b80b692.js');
-require('./ChevronDown-6dd5adba.js');
+require('./core-f757cb7d.js');
+require('./index-939934b9.js');
+require('./index-e1c884de.js');
+require('./index-70eb6cb6.js');
+require('./Spinner-f56442bf.js');
+require('./ChevronDown-442d6d28.js');
 require('@emotion/react');
 
 

package/build/{post-71d75389.js → post-fbd312f1.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-3d51d0f9.js');
+var tslib_es6 = require('./tslib.es6-686ff696.js');
 var togetherApiPaths = require('./togetherApiPaths.js');
-var togetherComponentGlobalContext = require('./utils-a6b09cf7.js');
+var togetherComponentGlobalContext = require('./utils-b93bfb3c.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;

package/build/profileNavigation.js

@@ -3,39 +3,39 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var index$4 = require('./index-d6f15734.js');
-var index$3 = require('./index-9923a75c.js');
+var index$4 = require('./index-4fce52d2.js');
+var index$3 = require('./index-224d9ca2.js');
 require('@mantine/core');
 require('@mantine/dates');
-require('./index-894c8500.js');
-var index$2 = require('./index-50592c00.js');
-require('./useMantineLocale-f2a01306.js');
-var index$1 = require('./index-6f552517.js');
-require('./index-79dae201.js');
-require('./index.styles-e3bb01fa.js');
-var index = require('./index-3b84402a.js');
+require('./index-ef3fe96d.js');
+var index$2 = require('./index-845de0bd.js');
+require('./useMantineLocale-3e339316.js');
+var index$1 = require('./index-94fe7461.js');
+require('./index-93165efa.js');
+require('./index.styles-afac97a7.js');
+var index = require('./index-cd8df0b4.js');
 require('@mantine/hooks');
-require('./utils-ad02d413.js');
-require('./other-0a459e98.js');
-require('./index-9840d47f.js');
-var ChevronDown = require('./ChevronDown-6dd5adba.js');
-var normalizeLink = require('./normalizeLink-c9ed6c3f.js');
+require('./utils-45383606.js');
+require('./other-42f538a2.js');
+require('./index-b5eb38b7.js');
+var ChevronDown = require('./ChevronDown-442d6d28.js');
+var normalizeLink = require('./normalizeLink-870f013d.js');
 var react = require('@emotion/react');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
-require('./translationsContext-7d235252.js');
+require('./translationsContext-e1ddb362.js');
 require('date-fns/locale');
 require('./constantsSite.js');
-require('./Locale-d521ebc6.js');
+require('./Locale-7b280065.js');
 require('./constantsDomainLocales.js');
 require('./constantsRiskScreener.js');
 require('./constantsIsProduction.js');
-require('./tslib.es6-3d51d0f9.js');
+require('./tslib.es6-686ff696.js');
 require('@hhgtech/icons/other');
-require('./useScreenSize-73ddfee2.js');
+require('./useScreenSize-0401fbfe.js');
 require('@mantine/carousel');
 require('classnames');
-require('./useUniqueId-6fb7b102.js');
+require('./useUniqueId-87671891.js');
 require('@hhgtech/icons/core');
 require('@mantine/notifications');
 require('dayjs');

package/build/progressBar.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-3d51d0f9.js');
+var tslib_es6 = require('./tslib.es6-686ff696.js');
 var React = require('react');
 var throttle = require('lodash/throttle');
 var styled = require('@emotion/styled');

package/build/pwg.js

@@ -3,45 +3,45 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var index$2 = require('./index-a636b13b.js');
-var index = require('./index-6f552517.js');
-var index$4 = require('./index-fc899474.js');
-var index$1 = require('./index-3b84402a.js');
+var index$2 = require('./index-e1c884de.js');
+var index = require('./index-94fe7461.js');
+var index$4 = require('./index-f4c2d4bf.js');
+var index$1 = require('./index-cd8df0b4.js');
 var miscTheme = require('./miscTheme.js');
 var recharts = require('recharts');
-var index$3 = require('./index-f88dde32.js');
-var useOutsideClick = require('./useOutsideClick-fc858a3a.js');
+var index$3 = require('./index-841a4652.js');
+var useOutsideClick = require('./useOutsideClick-238f49e5.js');
 var styled = require('@emotion/styled');
-var tslib_es6 = require('./tslib.es6-3d51d0f9.js');
+var tslib_es6 = require('./tslib.es6-686ff696.js');
 require('@mantine/core');
-require('./other-0a459e98.js');
-require('./index-894c8500.js');
-require('./Locale-d521ebc6.js');
-require('./index-50592c00.js');
+require('./other-42f538a2.js');
+require('./index-ef3fe96d.js');
+require('./Locale-7b280065.js');
+require('./index-845de0bd.js');
 require('./constantsDomainLocales.js');
 require('./constantsIsProduction.js');
-require('./useScreenSize-73ddfee2.js');
-require('./utils-ad02d413.js');
-require('./index-2f04b7bb.js');
-require('./index-9923a75c.js');
+require('./useScreenSize-0401fbfe.js');
+require('./utils-45383606.js');
+require('./index-16ab7130.js');
+require('./index-224d9ca2.js');
 require('@hhgtech/icons/other');
 require('@mantine/hooks');
 require('@mantine/carousel');
-require('./useMantineLocale-f2a01306.js');
+require('./useMantineLocale-3e339316.js');
 require('@mantine/notifications');
-require('./index-d6f15734.js');
+require('./index-4fce52d2.js');
 require('date-fns/locale');
 require('./constantsSite.js');
 require('./constantsRiskScreener.js');
 require('dayjs');
-require('./index-79dae201.js');
+require('./index-93165efa.js');
 require('classnames');
-require('./useUniqueId-6fb7b102.js');
+require('./useUniqueId-87671891.js');
 require('@hhgtech/icons/core');
 require('@mantine/dates');
-require('./index.styles-e3bb01fa.js');
-require('./translationsContext-7d235252.js');
-require('./index-9840d47f.js');
+require('./index.styles-afac97a7.js');
+require('./translationsContext-e1ddb362.js');
+require('./index-b5eb38b7.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/ssoV2/screens/components/progressBar.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { SSOV2StoreType } from "../../ssoStateManager/store";
+import { SSOStepType } from "../../stepsManager";
+export declare const isSocialFlowFn: (flowData: SSOV2StoreType['flowData']) => boolean;
+export declare const isDisplayProgressBarFn: (flowData: SSOV2StoreType['flowData'], step: SSOStepType) => boolean;
+export declare const getCurrentStepNumber: (flowData: SSOV2StoreType['flowData'], step: SSOStepType) => 2 | 3;
+declare const ProgressBar: () => React.JSX.Element;
+export default ProgressBar;

package/build/ssoV2/screens/components/setupLater.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type Props = {
+    style?: React.CSSProperties;
+};
+declare const SetupLater: ({ style }: Props) => React.JSX.Element;
+export default SetupLater;

package/build/ssoV2.js

@@ -2,29 +2,29 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-3d51d0f9.js');
+var tslib_es6 = require('./tslib.es6-686ff696.js');
 var React = require('react');
-var index$5 = require('./index-9923a75c.js');
-var store = require('./store-0c588912.js');
+var index$5 = require('./index-224d9ca2.js');
+var store = require('./store-3889e12f.js');
 var arrow = require('@hhgtech/icons/arrow');
 var core$1 = require('@hhgtech/icons/core');
-var index$2 = require('./index-d6f15734.js');
-var logoIcon = require('./logoIcon-c00932fe.js');
-var index$4 = require('./index-79dae201.js');
-var index$1 = require('./index-6cee48ca.js');
+var index$2 = require('./index-4fce52d2.js');
+var logoIcon = require('./logoIcon-cf2b41d2.js');
+var index$4 = require('./index-93165efa.js');
+var index$1 = require('./index-942681b2.js');
 var core = require('@mantine/core');
 require('@mantine/dates');
-require('./index-894c8500.js');
-require('./index-50592c00.js');
-var useMantineLocale = require('./useMantineLocale-f2a01306.js');
-var index$3 = require('./index-6f552517.js');
-var index = require('./index-3b84402a.js');
+require('./index-ef3fe96d.js');
+require('./index-845de0bd.js');
+var useMantineLocale = require('./useMantineLocale-3e339316.js');
+var index$3 = require('./index-94fe7461.js');
+var index = require('./index-cd8df0b4.js');
 require('@mantine/hooks');
-require('./utils-ad02d413.js');
-require('./other-0a459e98.js');
-require('./index-9840d47f.js');
-var Locale = require('./Locale-d521ebc6.js');
-var Google = require('./Google-8bd07e22.js');
+require('./utils-45383606.js');
+require('./other-42f538a2.js');
+require('./index-b5eb38b7.js');
+var Locale = require('./Locale-7b280065.js');
+var Google = require('./Google-242cb4f6.js');
 var PhoneInputBase = require('react-phone-number-input');
 var styled = require('@emotion/styled');
 var cn = require('classnames');
@@ -32,28 +32,28 @@ var other = require('@hhgtech/icons/other');
 var debounce = require('lodash/debounce');
 var throttle = require('lodash/throttle');
 var Flags = require('react-phone-number-input/flags');
-var useScreenSize = require('./useScreenSize-73ddfee2.js');
+var useScreenSize = require('./useScreenSize-0401fbfe.js');
 var vaul = require('vaul');
-var utils = require('./utils-4cf43561.js');
-var index$6 = require('./index-4ad6a4f9.js');
+var utils = require('./utils-b4bc84a4.js');
+var index$6 = require('./index-112333a2.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 var form = require('@mantine/form');
 var yup = require('yup');
 var dayjs = require('dayjs');
-var index$7 = require('./index-debac956.js');
+var index$7 = require('./index-cffa8b01.js');
 require('@mantine/carousel');
 require('./miscTheme.js');
-require('./useUniqueId-6fb7b102.js');
+require('./useUniqueId-87671891.js');
 require('./constantsSite.js');
 require('zustand');
 require('./constantsIsProduction.js');
-require('./normalizeLink-c9ed6c3f.js');
+require('./normalizeLink-870f013d.js');
 require('./miscCookieHelper.js');
 require('date-fns/locale');
 require('./constantsRiskScreener.js');
-require('./index.styles-e3bb01fa.js');
+require('./index.styles-afac97a7.js');
 require('@mantine/notifications');
-require('./translationsContext-7d235252.js');
+require('./translationsContext-e1ddb362.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -190,18 +190,66 @@ const BackgroundHeader = () => (React__default["default"].createElement("svg", {
             React__default["default"].createElement("stop", { stopColor: "#fff", stopOpacity: "0" }),
             React__default["default"].createElement("stop", { offset: "1", stopColor: "#fff" })))));
 
+const isSocialFlowFn = (flowData) => {
+    return (flowData === null || flowData === void 0 ? void 0 : flowData.method) === 'google' || (flowData === null || flowData === void 0 ? void 0 : flowData.method) === 'facebook';
+};
+const isDisplayProgressBarFn = (flowData, step) => {
+    const showProgressBar = (step === null || step === void 0 ? void 0 : step.type) === store.SSOStepTypeType.VERIFY_PHONE ||
+        (step === null || step === void 0 ? void 0 : step.type) === store.SSOStepTypeType.SETUP_FULL;
+    const isSocialFlow = isSocialFlowFn(flowData);
+    return showProgressBar && isSocialFlow;
+};
+const getCurrentStepNumber = (flowData, step) => {
+    const isSocialFlow = isSocialFlowFn(flowData);
+    /** Social (Google, Facebook): FIRST => VERIFY_PHONE | OTP => STEP_FULL */
+    if (isSocialFlow) {
+        if ((step === null || step === void 0 ? void 0 : step.type) === store.SSOStepTypeType.OTP ||
+            (step === null || step === void 0 ? void 0 : step.type) === store.SSOStepTypeType.VERIFY_PHONE) {
+            return 2;
+        }
+        if ((step === null || step === void 0 ? void 0 : step.type) === store.SSOStepTypeType.SETUP_FULL) {
+            return 3;
+        }
+    }
+    return;
+};
+const ProgressBar = () => {
+    const { steps, currentStepIndex } = store.useSSOSteps();
+    const { flowData } = store.useSSOV2Store();
+    const currentStep = steps[currentStepIndex];
+    const totalStepNumber = 3; // TODO: Update for other flows later
+    const activeStepNumber = getCurrentStepNumber(flowData, currentStep);
+    if (!activeStepNumber)
+        return null;
+    return (React__default["default"].createElement(core.Flex, { gap: 2 }, Array.from({ length: totalStepNumber }).map((_, idx) => {
+        const currentStepNumber = idx + 1;
+        return (React__default["default"].createElement(core.Box, { key: currentStepNumber, style: {
+                width: 39,
+                height: 4,
+                borderRadius: 4,
+                backgroundColor: currentStepNumber <= activeStepNumber ? '#2D87F3' : 'white',
+            } }));
+    })));
+};
+
 const SSOPopupWrapper = ({ children, opened, onClose, }) => {
     var _a;
-    const { steps, goBack } = store.useSSOSteps();
+    const { steps, goBack, currentStepIndex } = store.useSSOSteps();
+    const { flowData } = store.useSSOV2Store();
     const { locale, tracking } = useSSOState();
-    const showBack = steps.length > 1;
+    const currentStep = steps[currentStepIndex];
+    const isSocialFlow = isSocialFlowFn(flowData);
+    const showProgressBar = isDisplayProgressBarFn(flowData, currentStep);
+    const showBack = steps.length > 1 && !showProgressBar;
     const showClose = steps.length === 1;
-    const showLogo = steps.length === 1;
+    const showLogo = steps.length === 1 || showProgressBar;
     const logoType = (_a = index$2.LOCALE_SPECS[locale]) === null || _a === void 0 ? void 0 : _a.LOGO_TYPE;
     const [closeConfirmOpen, setCloseConfirmOpen] = React__default["default"].useState(false);
     const onCloseClick = () => {
         setCloseConfirmOpen(true);
     };
+    const addonShowProgressBar = showProgressBar ||
+        (isSocialFlow && (currentStep === null || currentStep === void 0 ? void 0 : currentStep.type) === store.SSOStepTypeType.OTP);
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
         React__default["default"].createElement(index$1.Modal, { opened: opened, onClose: onCloseClick, styles: (theme) => ({
                 body: {
@@ -262,7 +310,8 @@ const SSOPopupWrapper = ({ children, opened, onClose, }) => {
                         background: 'white',
                         borderRadius: '100%',
                     }, onClick: onCloseClick, "data-event-category": tracking === null || tracking === void 0 ? void 0 : tracking.category, "data-event-action": tracking === null || tracking === void 0 ? void 0 : tracking.action, "data-event-label": "Exit" },
-                    React__default["default"].createElement(core$1.Close, null)))),
+                    React__default["default"].createElement(core$1.Close, null))),
+                addonShowProgressBar && React__default["default"].createElement(ProgressBar, null)),
             React__default["default"].createElement("div", { style: {
                     flex: 1,
                 } }, children)),
@@ -2110,7 +2159,6 @@ const SSOFirstScreen = ({ hidden, config, }) => {
     }, [hidden]);
     const [loading, setLoading] = React__default["default"].useState(false);
     const handleLoginBySocial = (credential, provider) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
-        var _c, _d;
         const res = yield loginBySocial(credential, provider);
         if ((res === null || res === void 0 ? void 0 : res._status) === 1) {
             store.handleAuthSuccess(res === null || res === void 0 ? void 0 : res._data);
@@ -2121,9 +2169,20 @@ const SSOFirstScreen = ({ hidden, config, }) => {
                         method: provider,
                     },
                 });
-                if (!store.isUserFinishedSetup(userInfo._data) ||
-                    !userInfo._data.phone ||
-                    !userInfo._data.phone_verified_at) {
+                const isNotHavePhone = !userInfo._data.phone || !userInfo._data.phone_verified_at;
+                if (isNotHavePhone) {
+                    store.useSSOV2Store.setState((f) => ({
+                        flowData: Object.assign(Object.assign({}, f.flowData), { flow: 'login', isVerifyPhone: true }),
+                    }));
+                    addStep({
+                        type: store.SSOStepTypeType.VERIFY_PHONE,
+                        config: {
+                            provider: provider,
+                        },
+                    });
+                    goNext();
+                }
+                else if (!store.isUserFinishedSetup(userInfo._data)) {
                     store.useSSOV2Store.setState((f) => ({
                         flowData: Object.assign(Object.assign({}, f.flowData), { flow: 'signup' }),
                     }));
@@ -2154,19 +2213,6 @@ const SSOFirstScreen = ({ hidden, config, }) => {
                         goNext();
                     }
                 }
-                else if (!((_c = userInfo._data) === null || _c === void 0 ? void 0 : _c.phone_verified_at) ||
-                    !((_d = userInfo._data) === null || _d === void 0 ? void 0 : _d.phone)) {
-                    store.useSSOV2Store.setState((f) => ({
-                        flowData: Object.assign(Object.assign({}, f.flowData), { flow: 'login', isVerifyPhone: true }),
-                    }));
-                    addStep({
-                        type: store.SSOStepTypeType.VERIFY_PHONE,
-                        config: {
-                            provider: provider,
-                        },
-                    });
-                    goNext();
-                }
                 else {
                     onClose === null || onClose === void 0 ? void 0 : onClose(true);
                 }
@@ -2206,7 +2252,7 @@ const SSOFirstScreen = ({ hidden, config, }) => {
         };
     }, []);
     const onClickContinueZalo = () => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
-        var _e, _f;
+        var _c, _d;
         setLoading(true);
         const { areaCode, phoneNumber } = splitPhone(phone);
         if (!areaCode || !phoneNumber || !phone) {
@@ -2215,8 +2261,8 @@ const SSOFirstScreen = ({ hidden, config, }) => {
         }
         const userExist = yield store.checkUserExist({ phone: phoneNumber });
         if ((userExist === null || userExist === void 0 ? void 0 : userExist._status) === 1) {
-            const provider = (_e = userExist._data) === null || _e === void 0 ? void 0 : _e.provider;
-            if ((_f = userExist._data) === null || _f === void 0 ? void 0 : _f.is_pass) {
+            const provider = (_c = userExist._data) === null || _c === void 0 ? void 0 : _c.provider;
+            if ((_d = userExist._data) === null || _d === void 0 ? void 0 : _d.is_pass) {
                 store.useSSOV2Store.setState({
                     flowData: {
                         method: 'zalo',
@@ -2267,7 +2313,7 @@ const SSOFirstScreen = ({ hidden, config, }) => {
         setLoading(false);
     });
     const onClickContinuePhone = () => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
-        var _g, _h;
+        var _e, _f;
         setLoading(true);
         const { areaCode, phoneNumber } = splitPhone(phone);
         if (!areaCode || !phoneNumber || !phone) {
@@ -2276,8 +2322,8 @@ const SSOFirstScreen = ({ hidden, config, }) => {
         }
         const userExist = yield store.checkUserExist({ phone: phoneNumber });
         if ((userExist === null || userExist === void 0 ? void 0 : userExist._status) === 1) {
-            const provider = (_g = userExist._data) === null || _g === void 0 ? void 0 : _g.provider;
-            if ((_h = userExist._data) === null || _h === void 0 ? void 0 : _h.is_pass) {
+            const provider = (_e = userExist._data) === null || _e === void 0 ? void 0 : _e.provider;
+            if ((_f = userExist._data) === null || _f === void 0 ? void 0 : _f.is_pass) {
                 store.useSSOV2Store.setState({
                     flowData: {
                         method: 'sms',
@@ -2328,7 +2374,7 @@ const SSOFirstScreen = ({ hidden, config, }) => {
         setLoading(false);
     });
     const onClickLoginWithPhone = () => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
-        var _j, _k;
+        var _g, _h;
         setLoading(true);
         const { areaCode, phoneNumber } = splitPhone(phone);
         if (!areaCode || !phoneNumber || !phone) {
@@ -2337,7 +2383,7 @@ const SSOFirstScreen = ({ hidden, config, }) => {
         }
         const userExist = yield store.checkUserExist({ phone: phoneNumber });
         if ((userExist === null || userExist === void 0 ? void 0 : userExist._status) === 1) {
-            if (!userExist._data || !((_j = userExist._data) === null || _j === void 0 ? void 0 : _j.is_pass)) {
+            if (!userExist._data || !((_g = userExist._data) === null || _g === void 0 ? void 0 : _g.is_pass)) {
                 useMantineLocale.showNotification({
                     message: t('ssov2.first.noAccountOrPass'),
                     type: 'danger',
@@ -2345,7 +2391,7 @@ const SSOFirstScreen = ({ hidden, config, }) => {
                 setActiveTab('signup');
                 return setLoading(false);
             }
-            if ((_k = userExist._data) === null || _k === void 0 ? void 0 : _k.is_pass) {
+            if ((_h = userExist._data) === null || _h === void 0 ? void 0 : _h.is_pass) {
                 store.useSSOV2Store.setState({
                     flowData: {
                         method: 'phone',
@@ -2900,7 +2946,7 @@ const SSOOTPScreen = ({ hidden, index: index$1, config, }) => {
                         'data-event-category': trackingCategory,
                         'data-event-action': trackingAction,
                         'data-event-label': 'Enter Code',
-                    } })),
+                    }, placeholder: "*" })),
             React__default["default"].createElement(core.Group, { spacing: 8, align: "center", style: {
                     height: 40,
                 } },
@@ -3293,6 +3339,15 @@ const SSOPasswordForgotSetup = ({ hidden, }) => {
             React__default["default"].createElement(index$4.Button, { type: "submit", size: "lg", variant: "primary", fullWidth: true, disabled: loading, loading: loading, "data-event-category": trackingCategory, "data-event-action": trackingAction, "data-event-label": "Save" }, t('ssov2.button.save')))));
 };
 
+const SetupLater = ({ style = {} }) => {
+    const { t } = index.useTranslations();
+    const { onClose } = useSSOState();
+    const onClickSetupLater = () => {
+        onClose === null || onClose === void 0 ? void 0 : onClose(true);
+    };
+    return (React__default["default"].createElement(index$4.Button, { size: "sm", variant: "white", color: "#737373", style: Object.assign({ fontWeight: 400 }, style), onClick: onClickSetupLater }, t('ssov2.button.setupLater')));
+};
+
 const SSOPhoneVerify = ({ hidden, config, }) => {
     const { t } = index.useTranslations();
     const [phone, setPhone] = React__default["default"].useState('');
@@ -3410,7 +3465,8 @@ const SSOPhoneVerify = ({ hidden, config, }) => {
                             setErrMsg('');
                         }, isError: !!errMsg, required: true, name: "phone", disabled: loading, "data-event-category": trackingCategory, "data-event-action": trackingAction, "data-event-label": "Enter Phone" })),
                 React__default["default"].createElement(index$4.Button, { size: "lg", variant: "primary", onClick: onClickContinueZalo, disabled: loading, loading: loading, "data-event-category": trackingCategory, "data-event-action": trackingAction, "data-event-label": "Continue with Zalo" }, t('ssov2.button.continueZalo')),
-                React__default["default"].createElement(index$4.Button, { size: "lg", variant: "secondary", onClick: onClickContinuePhone, disabled: loading, loading: loading, "data-event-category": trackingCategory, "data-event-action": trackingAction, "data-event-label": "Continue with SMS" }, t('ssov2.button.continueSMS'))))));
+                React__default["default"].createElement(index$4.Button, { size: "lg", variant: "secondary", onClick: onClickContinuePhone, disabled: loading, loading: loading, "data-event-category": trackingCategory, "data-event-action": trackingAction, "data-event-label": "Continue with SMS" }, t('ssov2.button.continueSMS')),
+                React__default["default"].createElement(SetupLater, null)))));
 };
 
 const FemaleIcon = () => (React__default["default"].createElement("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
@@ -3450,7 +3506,7 @@ const OtherSetup = ({ form, needPhone, skipPhone, needEmail, isEmailDisable, isP
     const [dobChanged, setDobChanged] = React__default["default"].useState(false);
     return (React__default["default"].createElement(core.Stack, { spacing: 12 },
         needPhone && (React__default["default"].createElement(React__default["default"].Fragment, null,
-            React__default["default"].createElement(index$5.Input.Wrapper, Object.assign({ label: t('ssov2.setup.field.phone.label'), withAsterisk: true }, form.getInputProps('phone')),
+            React__default["default"].createElement(index$5.Input.Wrapper, Object.assign({ label: t('ssov2.setup.field.phone.label'), withAsterisk: true }, form.getInputProps('phone'), { display: skipPhone ? 'none' : 'block' }),
                 React__default["default"].createElement(StyledPhone, { defaultCountry: (locale ? utils.MAPPED_LOCALE[locale] || 'VN' : 'VN'), value: form.getInputProps('phone').value, onChange: (value) => {
                         form.setFieldValue('phone', value);
                     }, isError: !!form.getInputProps('phone').error, required: true, name: "phone", disabled: loading || isPhoneDisabled, "data-event-category": tracking === null || tracking === void 0 ? void 0 : tracking.category, "data-event-action": tracking === null || tracking === void 0 ? void 0 : tracking.action, "data-event-label": "Enter Phone" })),
@@ -3778,7 +3834,8 @@ const SSOSetupScreen = ({ hidden, config, }) => {
                 ? t('ssov2.setup.button.veriyPhone')
                 : authFlow === 'signup'
                     ? t('ssov2.setup.button.createAccount')
-                    : t('ssov2.button.save')))));
+                    : t('ssov2.button.save')),
+            React__default["default"].createElement(SetupLater, { style: { marginTop: -8 } }))));
 };
 
 // import {

package/build/{store-0c588912.js → store-3889e12f.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-3d51d0f9.js');
+var tslib_es6 = require('./tslib.es6-686ff696.js');
 var zustand = require('zustand');
 var constantsIsProduction = require('./constantsIsProduction.js');
-var normalizeLink = require('./normalizeLink-c9ed6c3f.js');
-var index = require('./index-d6f15734.js');
+var normalizeLink = require('./normalizeLink-870f013d.js');
+var index = require('./index-4fce52d2.js');
 var miscCookieHelper = require('./miscCookieHelper.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');