@cleartrip/ct-platform-login-form 1.2.1-beta.0 → 1.3.0

package/dist/ct-platform-login-form.cjs.js

@@ -1,546 +1,2 @@
-'use strict';
-
-var tslib = require('tslib');
-var jsxRuntime = require('react/jsx-runtime');
-var react = require('react');
-var ctPlatformUtils = require('@cleartrip/ct-platform-utils');
-var ctDesignToast = require('@cleartrip/ct-design-toast');
-var ctPlatformConstants = require('@cleartrip/ct-platform-constants');
-var ctDesignField = require('@cleartrip/ct-design-field');
-var ctDesignSpacer = require('@cleartrip/ct-design-spacer');
-var ctDesignSpinner = require('@cleartrip/ct-design-spinner');
-var ctDesignTypography = require('@cleartrip/ct-design-typography');
-var ctDesignAlertCallout = require('@cleartrip/ct-design-alert-callout');
-var ctDesignIcons = require('@cleartrip/ct-design-icons');
-var classNames = require('classnames');
-var ctDesignButton = require('@cleartrip/ct-design-button');
-var ctDesignDivider = require('@cleartrip/ct-design-divider');
-var ctPlatformAssets = require('@cleartrip/ct-platform-assets');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var classNames__default = /*#__PURE__*/_interopDefault(classNames);
-
-function styleInject(css, ref) {
-  if (ref === void 0) ref = {};
-  var insertAt = ref.insertAt;
-  if (!css || typeof document === 'undefined') {
-    return;
-  }
-  var head = document.head || document.getElementsByTagName('head')[0];
-  var style = document.createElement('style');
-  style.type = 'text/css';
-  if (insertAt === 'top') {
-    if (head.firstChild) {
-      head.insertBefore(style, head.firstChild);
-    } else {
-      head.appendChild(style);
-    }
-  } else {
-    head.appendChild(style);
-  }
-  if (style.styleSheet) {
-    style.styleSheet.cssText = css;
-  } else {
-    style.appendChild(document.createTextNode(css));
-  }
-}
-
-var css_248z$2 = ".index-module_mobileinput_seperatortext__-KDOp{background:#fff;left:0;margin:0 auto;position:absolute;right:0;text-align:center;top:-10px;width:40px}.index-module_footer_text__nkeJv{color:grey!important;font-size:12px!important}.index-module_otp_container__1CE4N{display:flex;flex-direction:column;margin-top:24px}.index-module_otp_box_wrapper__sM2Ba{margin-right:8px}.index-module_login_otp_input__L-3P8{font-size:24px!important;font-style:normal;font-weight:600!important;height:56px!important;line-height:28px;padding:auto;text-align:center;width:56px!important}.index-module_login_otp_error__o3y2L{padding-top:4px}.index-module_nonUtilsSelector_toast__lvWmB{bottom:12px!important;margin-bottom:12px;margin:0 auto!important;padding:12px 16px!important;width:calc(100% - 48px)!important;z-index:2000}";
-var styles = {"mobileinput_seperatortext":"index-module_mobileinput_seperatortext__-KDOp","footer_text":"index-module_footer_text__nkeJv","otp_container":"index-module_otp_container__1CE4N","otp_box_wrapper":"index-module_otp_box_wrapper__sM2Ba","login_otp_input":"index-module_login_otp_input__L-3P8","login_otp_error":"index-module_login_otp_error__o3y2L","nonUtilsSelector_toast":"index-module_nonUtilsSelector_toast__lvWmB"};
-styleInject(css_248z$2);
-
-var css_248z$1 = ".index-module_loader__container__VX-VO{align-items:center;background:#fff;border-radius:32px;box-shadow:0 8px 24px 0 rgba(26,26,26,.1);display:flex;height:34px;justify-content:center;left:50%;padding:12px;position:absolute;top:50%;transform:translate(-50%,-50%);width:66px}.index-module_loader__container__VX-VO .index-module_three-dots-loader__i7R-R{animation:index-module_three-dots-loader__i7R-R 1s linear infinite alternate;animation-delay:.5s;background-color:#1a1a1a;border-radius:5px;height:8px;position:relative;width:8px}.index-module_loader__container__VX-VO .index-module_three-dots-loader__i7R-R:after,.index-module_loader__container__VX-VO .index-module_three-dots-loader__i7R-R:before{content:\"\";display:inline-block;position:absolute;top:0}.index-module_loader__container__VX-VO .index-module_three-dots-loader__i7R-R:before{animation:index-module_three-dots-loader__i7R-R 1s infinite alternate;animation-delay:0s;background-color:#1a1a1a;border-radius:5px;height:8px;left:-15px;width:8px}.index-module_loader__container__VX-VO .index-module_three-dots-loader__i7R-R:after{animation:index-module_three-dots-loader__i7R-R 1s infinite alternate;animation-delay:1s;background-color:#1a1a1a;border-radius:5px;height:8px;left:15px;width:8px}@keyframes index-module_three-dots-loader__i7R-R{0%{background-color:#1a1a1a}50%,to{background-color:grey}}";
-var Styles$1 = {"loader__container":"index-module_loader__container__VX-VO","three-dots-loader":"index-module_three-dots-loader__i7R-R"};
-styleInject(css_248z$1);
-
-var ThreeDotsLoader = function () {
-    return (jsxRuntime.jsx("div", tslib.__assign({ className: Styles$1['loader__container'] }, { children: jsxRuntime.jsx("div", { className: Styles$1['three-dots-loader'] }) })));
-};
-
-var AutoDetectState;
-(function (AutoDetectState) {
-    AutoDetectState[AutoDetectState["DETECTING"] = 0] = "DETECTING";
-    AutoDetectState[AutoDetectState["FAILED"] = 1] = "FAILED";
-    AutoDetectState[AutoDetectState["DETECTED"] = 2] = "DETECTED";
-})(AutoDetectState || (AutoDetectState = {}));
-var OtpInput = function (_a) {
-    var mobileNumber = _a.mobileNumber, errorCallout = _a.errorCallout, ravenPayload = _a.ravenPayload, otpInputHeight = _a.otpInputHeight, skipProfileFlow = _a.skipProfileFlow, otpResendDisabled = _a.otpResendDisabled, hotelsLoyaltyFlow = _a.hotelsLoyaltyFlow, getOTP = _a.getOTP, setCtaDisabled = _a.setCtaDisabled, setErrorCallout = _a.setErrorCallout, setMobileNumber = _a.setMobileNumber, setShowMobilePage = _a.setShowMobilePage, handleLoginSuccess = _a.handleLoginSuccess, handleLoginFailure = _a.handleLoginFailure;
-    var inputRefs = react.useRef(Array(4).fill(null));
-    var _b = react.useState(AutoDetectState.DETECTING), autoDetecting = _b[0], setAutoDetecting = _b[1];
-    var _c = react.useState(ctPlatformConstants.LOGIN_CONSTANTS.OTP_COUNTDOWN), countdown = _c[0], setCountdown = _c[1];
-    var _d = react.useState(''), otp = _d[0], setOtp = _d[1];
-    var _f = react.useState(true), countdownEnabled = _f[0], setCountdownEnabled = _f[1];
-    var _g = react.useState(false), verifiedOtp = _g[0], setVerifiedOtp = _g[1];
-    var _h = react.useState(''), otpErrorMessage = _h[0], setOtpErrorMessage = _h[1];
-    var _j = react.useState(true), enableAutoDetect = _j[0], setEnableAutoDetect = _j[1];
-    var _k = react.useState(false), showOtpVerificationLoader = _k[0], setShowOtpVerificationLoader = _k[1];
-    var lastOtpRequest = react.useRef();
-    var lastOtpRequestTimeStamp = react.useRef();
-    var loginMethod = 'CT';
-    react.useEffect(function () {
-        autoDetect();
-        var eventProps = ctPlatformUtils.getRavenEventProps();
-        ctPlatformUtils.ravenSDKTrigger('u_login_click', tslib.__assign({ action_name: 'login_otp_screen_opened', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'native', vertical: eventProps === null || eventProps === void 0 ? void 0 : eventProps.vertical, page_name: eventProps === null || eventProps === void 0 ? void 0 : eventProps.pageName }, ravenPayload));
-    }, []);
-    react.useEffect(function () {
-        if (ctPlatformUtils.isIOSApp()) {
-            setEnableAutoDetect(false);
-        }
-    }, []);
-    react.useEffect(function () {
-        autoDetect();
-    }, []);
-    react.useEffect(function () {
-        if (!showOtpVerificationLoader) {
-            inputRefs.current[0].focus();
-            inputRefs.current[0].click();
-        }
-    }, [showOtpVerificationLoader]);
-    react.useEffect(function () {
-        if (countdown === 0) {
-            setCountdownEnabled(false);
-        }
-    }, [countdown]);
-    react.useEffect(function () {
-        var interval;
-        if (countdownEnabled && countdown > 0) {
-            interval = setInterval(function () {
-                setCountdown(function (prevCountdown) { return prevCountdown - 1; });
-            }, 1000);
-        }
-        return function () {
-            clearInterval(interval);
-        };
-    }, [countdownEnabled, countdown]);
-    var autoDetect = react.useCallback(function () { return tslib.__awaiter(void 0, void 0, void 0, function () {
-        var otp_1, _e_1;
-        return tslib.__generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    _a.trys.push([0, 2, , 3]);
-                    return [4, ctPlatformUtils.autoReadOtp()];
-                case 1:
-                    otp_1 = _a.sent();
-                    setOtp(otp_1);
-                    setAutoDetecting(AutoDetectState.DETECTED);
-                    if ((otp_1 === null || otp_1 === void 0 ? void 0 : otp_1.length) === ctPlatformConstants.LOGIN_CONSTANTS.OTP_LENGTH &&
-                        handleOtpComplete) {
-                        handleOtpComplete(otp_1, true);
-                    }
-                    return [3, 3];
-                case 2:
-                    _e_1 = _a.sent();
-                    if (_e_1 === 'NOT_SUPPORTED') {
-                        setEnableAutoDetect(false);
-                    }
-                    return [3, 3];
-                case 3: return [2];
-            }
-        });
-    }); }, [enableAutoDetect]);
-    var handleOtpValidationError = react.useCallback(function (e) {
-        var eventProps = ctPlatformUtils.getRavenEventProps();
-        ctPlatformUtils.ravenSDKTrigger('u_login_error', tslib.__assign({ action_name: 'otp_incorrect', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'native', vertical: eventProps === null || eventProps === void 0 ? void 0 : eventProps.vertical, page_name: eventProps === null || eventProps === void 0 ? void 0 : eventProps.pageName }, ravenPayload));
-        var message = e === null || e === void 0 ? void 0 : e.message;
-        if (message !== 'OTP_VALIDATE_LIMIT_EXCEEDED') {
-            setOtp('');
-        }
-        inputRefs.current[0].focus();
-        inputRefs.current[0].click();
-        var messageValue = ctPlatformConstants.LOGIN_CONSTANTS[message];
-        var toastMessage = typeof messageValue === 'string'
-            ? messageValue
-            : ctPlatformConstants.LOGIN_CONSTANTS.INVALID_OTP;
-        setOtpErrorMessage(toastMessage);
-    }, [inputRefs]);
-    var handleOtpComplete = react.useCallback(function (otp, autodetected) { return tslib.__awaiter(void 0, void 0, void 0, function () {
-        var eventProps, response, status_1, action, e_1;
-        return tslib.__generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    _a.trys.push([0, 2, , 3]);
-                    eventProps = ctPlatformUtils.getRavenEventProps();
-                    ctPlatformUtils.ravenSDKTrigger('u_login_click', tslib.__assign({ action_name: 'otp_entered', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'native', entry_type: !autodetected ? 'manual_entry' : 'autodetected', vertical: eventProps === null || eventProps === void 0 ? void 0 : eventProps.vertical, page_name: eventProps === null || eventProps === void 0 ? void 0 : eventProps.pageName }, ravenPayload));
-                    if (otp === lastOtpRequest.current &&
-                        lastOtpRequestTimeStamp.current &&
-                        lastOtpRequestTimeStamp.current - Date.now() <= 100) {
-                        return [2];
-                    }
-                    lastOtpRequest.current = otp;
-                    lastOtpRequestTimeStamp.current = Date.now();
-                    if (hotelsLoyaltyFlow) {
-                        setShowOtpVerificationLoader(true);
-                    }
-                    return [4, ctPlatformUtils.validateOtp(mobileNumber, otp)];
-                case 1:
-                    response = _a.sent();
-                    status_1 = response.status, action = response.action;
-                    if (Number(status_1) === 200 && !ctPlatformUtils.isEmpty(action)) {
-                        setVerifiedOtp(true);
-                        setOtpErrorMessage('');
-                        ctPlatformUtils.updateNativeOnLogin();
-                        if (action === 'SIGNUP') {
-                            if (!skipProfileFlow) {
-                                window.location.href =
-                                    ctPlatformConstants.NAVIGATION_ROUTES.PERSONAL_DETAILS +
-                                        '?onboardingFlow=true';
-                            }
-                            handleLoginSuccess(loginMethod, true);
-                        }
-                        else {
-                            handleLoginSuccess(loginMethod);
-                        }
-                    }
-                    else {
-                        if (hotelsLoyaltyFlow) {
-                            setShowOtpVerificationLoader(false);
-                        }
-                        handleLoginFailure(loginMethod);
-                    }
-                    return [3, 3];
-                case 2:
-                    e_1 = _a.sent();
-                    if (hotelsLoyaltyFlow) {
-                        setShowOtpVerificationLoader(false);
-                    }
-                    handleLoginFailure(loginMethod);
-                    handleOtpValidationError(e_1);
-                    return [3, 3];
-                case 3: return [2];
-            }
-        });
-    }); }, [
-        lastOtpRequest,
-        lastOtpRequestTimeStamp,
-        setVerifiedOtp,
-        setAutoDetecting,
-        setOtpErrorMessage,
-        handleOtpValidationError,
-    ]);
-    var handleOnPaste = function () { return tslib.__awaiter(void 0, void 0, void 0, function () {
-        var clipboardData, pastedArr, pastedString;
-        var _a, _b;
-        return tslib.__generator(this, function (_c) {
-            switch (_c.label) {
-                case 0: return [4, navigator.clipboard.readText()];
-                case 1:
-                    clipboardData = _c.sent();
-                    if (clipboardData && ctPlatformUtils.isNumeric(clipboardData)) {
-                        pastedArr = clipboardData
-                            .slice(0, ctPlatformConstants.LOGIN_CONSTANTS.OTP_LENGTH)
-                            .split('');
-                        (_a = inputRefs.current[ctPlatformConstants.LOGIN_CONSTANTS.OTP_LENGTH - 1]) === null || _a === void 0 ? void 0 : _a.focus();
-                        (_b = inputRefs.current[ctPlatformConstants.LOGIN_CONSTANTS.OTP_LENGTH - 1]) === null || _b === void 0 ? void 0 : _b.click();
-                        pastedString = pastedArr.join('');
-                        setOtp(pastedString);
-                        if (pastedString.length === ctPlatformConstants.LOGIN_CONSTANTS.OTP_LENGTH) {
-                            handleOtpComplete(pastedString, false);
-                        }
-                    }
-                    return [2];
-            }
-        });
-    }); };
-    var handleInput = react.useCallback(function (event, index) {
-        var _a, _b;
-        setErrorCallout('');
-        var value = event.target.value;
-        if (value !== '' && index < inputRefs.current.length - 1) {
-            (_a = inputRefs.current[index + 1]) === null || _a === void 0 ? void 0 : _a.focus();
-            (_b = inputRefs.current[index + 1]) === null || _b === void 0 ? void 0 : _b.click();
-        }
-        var inputValues = inputRefs.current.map(function (ref) {
-            if (ctPlatformUtils.isHTMLInputElement(ref)) {
-                return ref.value;
-            }
-            return '';
-        });
-        var otpValue = inputValues.join('').slice(0, 4);
-        setOtp(otpValue);
-        if (otpValue.length === ctPlatformConstants.LOGIN_CONSTANTS.OTP_LENGTH) {
-            handleOtpComplete(otpValue, false);
-        }
-    }, [setOtp, handleOtpComplete]);
-    var handleKeyDown = react.useCallback(function (e, index) {
-        var _a, _b, _c;
-        if (e.key === 'Backspace' &&
-            index > 0 &&
-            ((_a = inputRefs.current[index]) === null || _a === void 0 ? void 0 : _a.value) === '') {
-            e.preventDefault();
-            (_b = inputRefs.current[index - 1]) === null || _b === void 0 ? void 0 : _b.focus();
-            (_c = inputRefs.current[index - 1]) === null || _c === void 0 ? void 0 : _c.click();
-        }
-    }, [inputRefs]);
-    var onResendOtpClick = react.useCallback(function () {
-        setCountdown(ctPlatformConstants.LOGIN_CONSTANTS.OTP_COUNTDOWN);
-        setCountdownEnabled(true);
-        getOTP(mobileNumber);
-        var eventProps = ctPlatformUtils.getRavenEventProps();
-        ctPlatformUtils.ravenSDKTrigger('u_login_error', tslib.__assign({ action_name: 'resend_otp_clicked', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'native', vertical: eventProps === null || eventProps === void 0 ? void 0 : eventProps.vertical, page_name: eventProps === null || eventProps === void 0 ? void 0 : eventProps.pageName }, ravenPayload));
-    }, [setCountdown, setCountdownEnabled]);
-    var onEditCLick = react.useCallback(function () {
-        setCtaDisabled(true);
-        setShowMobilePage(true);
-        setMobileNumber('');
-    }, [setShowMobilePage]);
-    return (jsxRuntime.jsxs("div", tslib.__assign({ className: 'flex flex-column bg-neutral-100', style: { height: otpInputHeight } }, { children: [errorCallout && (jsxRuntime.jsx(ctDesignAlertCallout.AlertCallout, { variant: 'error', textNode: errorCallout, prefixIconNode: jsxRuntime.jsx(ctDesignIcons.InfoIcon, { fill: 'red' }), style: {
-                    color: '#ffff',
-                    backgroundColor: '#db201e',
-                }, className: 'fs-12' })), jsxRuntime.jsxs("div", tslib.__assign({ className: 'flex flex-bottom' }, { children: [jsxRuntime.jsxs(ctDesignTypography.Typography, tslib.__assign({ variant: 'HM1', color: 'heading' }, { children: [ctPlatformConstants.LOGIN_CONSTANTS.OTP_TEXT, " ", jsxRuntime.jsx("br", {}), mobileNumber] })), jsxRuntime.jsx("div", tslib.__assign({ className: 'pl-2', onClick: onEditCLick }, { children: jsxRuntime.jsx(ctDesignIcons.Edit, {}) }))] })), jsxRuntime.jsxs("div", tslib.__assign({ className: styles.otp_container }, { children: [jsxRuntime.jsxs("div", tslib.__assign({ className: 'flex', style: hotelsLoyaltyFlow
-                            ? { width: 'max-content', position: 'relative' }
-                            : {} }, { children: [tslib.__spreadArray([], Array(ctPlatformConstants.LOGIN_CONSTANTS.OTP_LENGTH), true).map(function (_, i) { return (jsxRuntime.jsx("div", tslib.__assign({ className: styles.otp_box_wrapper }, { children: jsxRuntime.jsx(ctDesignField.FieldV2, { prompt: {
-                                        hasError: !!otpErrorMessage,
-                                    }, type: 'number', placeholder: '', value: otp[i], max: 1, inputMode: 'numeric', className: styles.login_otp_input, variant: 'md', ref: function (ref) {
-                                        if (ref) {
-                                            inputRefs.current[i] = ref;
-                                        }
-                                    }, onKeyDown: function (e) { return handleKeyDown(e, i); }, onChange: function (e) { return handleInput(e, i); }, onPaste: handleOnPaste, autoFocus: i === 0, disabled: hotelsLoyaltyFlow &&
-                                        showOtpVerificationLoader
-                                        ? true
-                                        : false }) }), i)); }), hotelsLoyaltyFlow && showOtpVerificationLoader && (jsxRuntime.jsx(ThreeDotsLoader, {}))] })), !!otpErrorMessage && (jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ variant: 'P1', color: 'warning', className: styles.login_otp_error }, { children: otpErrorMessage })))] })), jsxRuntime.jsx(ctDesignSpacer.Spacer, { className: 'pt-2' }), autoDetecting === AutoDetectState.DETECTING &&
-                !verifiedOtp &&
-                enableAutoDetect &&
-                countdown >
-                    ctPlatformConstants.LOGIN_CONSTANTS.RESEND_OTP_COUNTDOWN && (jsxRuntime.jsxs("div", tslib.__assign({ className: 'flex flex-middle' }, { children: [jsxRuntime.jsx(ctDesignSpinner.Spinner, { width: '20px', height: '20px', borderColor: '#11a670', className: 'bg-neutral-900 bc-black' }), jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ variant: 'B3', className: 'fs-12 fw-500 ml-1 c-neutral-700' }, { children: ctPlatformConstants.LOGIN_CONSTANTS.AUTO_DETECTING_TEXT }))] }))), autoDetecting === AutoDetectState.DETECTING &&
-                countdown <= ctPlatformConstants.LOGIN_CONSTANTS.RESEND_OTP_COUNTDOWN &&
-                enableAutoDetect &&
-                !verifiedOtp && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", tslib.__assign({ className: 'flex' }, { children: [jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ variant: 'B3', className: 'fs-12 fw-500  c-neutral-700 ' }, { children: ctPlatformConstants.LOGIN_CONSTANTS.OTP_RESEND_TEXT })), jsxRuntime.jsx(ctDesignSpacer.Spacer, { className: 'ml-1' }), otpResendDisabled ? (jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ className: 'color-neutral-200 fw-500', variant: 'B3' }, { children: ctPlatformConstants.LOGIN_CONSTANTS.RESEND_CTA }))) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [countdown === 0 && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ isClickable: true, variant: 'B3', onClick: onResendOtpClick, color: 'link', className: '\n                                                fs-12 fw-500 c-pointer' }, { children: ctPlatformConstants.LOGIN_CONSTANTS.RESEND_CTA })) })), countdown > 0 && (jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ color: 'disabled', variant: 'B3' }, { children: ' Resend (' + countdown + 's)' })))] }))] })) })), !otpErrorMessage && verifiedOtp && (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", tslib.__assign({ className: 'flex flex-middle' }, { children: [jsxRuntime.jsx(ctDesignIcons.CheckCircle, {}), jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ variant: 'P1', color: 'success', className: 'fs-12' }, { children: autoDetecting === AutoDetectState.DETECTED
-                                ? ctPlatformConstants.LOGIN_CONSTANTS.AUTO_DETECTED_TEXT
-                                : ctPlatformConstants.LOGIN_CONSTANTS.VERIFIED_MESSAGE }))] })) })), jsxRuntime.jsx(ctDesignSpacer.Spacer, { className: 'mt-24' })] })));
-};
-
-var css_248z = ".index-module_loader__63LeU{align-items:center;background-color:hsla(0,0%,100%,.95);bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:0}.index-module_loader__63LeU.index-module_With-full-opacity__ZSY-U{background-color:#fff}.index-module_loader__content__Q6kJl{max-width:280px;text-align:center}.index-module_loader__spinner__6B3AR{animation:index-module_loader-rotate__efcf3 .8s linear infinite;border:2px solid rgba(51,102,204,.3);border-radius:50%;border-top-color:#36c;display:inline-block;height:30px;margin-bottom:10px;position:relative;width:30px}.index-module_loader__heading__7YZ3N{color:#000;font-size:18px;font-weight:600;margin-bottom:5px}.index-module_loader__text__1QcLi{color:rgba(0,0,0,.8);font-size:16px;line-height:1.5}";
-var Styles = {"loader":"index-module_loader__63LeU","With-full-opacity":"index-module_With-full-opacity__ZSY-U","loader__content":"index-module_loader__content__Q6kJl","loader__spinner":"index-module_loader__spinner__6B3AR","loader-rotate":"index-module_loader-rotate__efcf3","loader__heading":"index-module_loader__heading__7YZ3N","loader__text":"index-module_loader__text__1QcLi"};
-styleInject(css_248z);
-
-var Loader = function (_a) {
-    var title = _a.title, message = _a.message, className = _a.className;
-    return (jsxRuntime.jsx("div", tslib.__assign({ className: "".concat(Styles['utilswrapper'], " utilswrapper") }, { children: jsxRuntime.jsx("div", tslib.__assign({ className: classNames__default.default(Styles['loader'], className) }, { children: jsxRuntime.jsxs("div", tslib.__assign({ className: Styles['loader__content'] }, { children: [jsxRuntime.jsx("div", { className: Styles['loader__spinner'] }), jsxRuntime.jsx("h5", tslib.__assign({ className: Styles['loader__heading'] }, { children: title })), jsxRuntime.jsx("p", tslib.__assign({ className: Styles['loader__text'] }, { children: message }))] })) })) })));
-};
-
-var MobileInput = function (_a) {
-    var sendingOtp = _a.sendingOtp, ctaDisabled = _a.ctaDisabled, getOTP = _a.getOTP, setErrorCallout = _a.setErrorCallout, errorCallout = _a.errorCallout, mobileNumber = _a.mobileNumber, setMobileInputHeight = _a.setMobileInputHeight, setMobileNumber = _a.setMobileNumber, fallbackUri = _a.fallbackUri, skipProfileFlow = _a.skipProfileFlow, ravenPayload = _a.ravenPayload, hotelsLoyaltyFlow = _a.hotelsLoyaltyFlow, _b = _a.isFkLoginEnabled, isFkLoginEnabled = _b === void 0 ? true : _b, _c = _a.isPrivacyPolicyVisible, isPrivacyPolicyVisible = _c === void 0 ? true : _c;
-    var fkSSOEnabled = react.useState(ctPlatformUtils.isFKSSOEnabled)[0];
-    var _d = react.useState(false), fkButtonLoading = _d[0], setFkButtonLoading = _d[1];
-    var inputRef = react.useRef(null);
-    var mobileViewRef = react.useRef(null);
-    react.useEffect(function () {
-        if (mobileViewRef.current) {
-            var height = mobileViewRef.current.clientHeight;
-            setMobileInputHeight(height);
-        }
-    }, [mobileViewRef.current]);
-    react.useEffect(function () {
-        var timeout;
-        if (inputRef.current) {
-            timeout = setTimeout(function () {
-                var _a;
-                (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-            }, 100);
-        }
-        return function () {
-            clearTimeout(timeout);
-        };
-    }, []);
-    react.useEffect(function () {
-        if (ctPlatformUtils.isAndroidApp()) {
-            autoDetectMobileNumber();
-        }
-    }, []);
-    var handleFKSSOClick = react.useCallback(function () { return tslib.__awaiter(void 0, void 0, void 0, function () {
-        var eventProps, redirectUrl;
-        return tslib.__generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    _a.trys.push([0, 2, , 3]);
-                    eventProps = ctPlatformUtils.getRavenEventProps();
-                    ctPlatformUtils.ravenSDKTrigger('u_login_click', tslib.__assign({ action_name: 'login_with_flipkart_clicked', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'fk_sso', vertical: eventProps === null || eventProps === void 0 ? void 0 : eventProps.vertical, page_name: eventProps === null || eventProps === void 0 ? void 0 : eventProps.pageName }, ravenPayload));
-                    setFkButtonLoading(true);
-                    return [4, ctPlatformUtils.handleFKSSO(fallbackUri, skipProfileFlow)];
-                case 1:
-                    redirectUrl = _a.sent();
-                    if (!hotelsLoyaltyFlow) {
-                        setFkButtonLoading(false);
-                    }
-                    if (ctPlatformUtils.isPwa()) {
-                        window.location.href = redirectUrl;
-                    }
-                    return [3, 3];
-                case 2:
-                    _a.sent();
-                    setFkButtonLoading(false);
-                    return [3, 3];
-                case 3: return [2];
-            }
-        });
-    }); }, []);
-    var handleInputChange = react.useCallback(function (event, autoDetected) {
-        if (autoDetected === void 0) { autoDetected = false; }
-        setErrorCallout('');
-        var value = event.target.value || '';
-        value = value.replace(ctPlatformUtils.MULTI_SPACE, ' ').trimStart();
-        setMobileNumber(value);
-        var validMobileNo = ctPlatformUtils.isValidMobileNumber(event.target.value);
-        if (validMobileNo) {
-            getOTP(value);
-            var eventProps = ctPlatformUtils.getRavenEventProps();
-            ctPlatformUtils.ravenSDKTrigger('u_login_click', tslib.__assign({ action_name: 'get_otp_clicked', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'native', entry_type: 'auto_click', vertical: eventProps === null || eventProps === void 0 ? void 0 : eventProps.vertical, page_name: eventProps === null || eventProps === void 0 ? void 0 : eventProps.pageName }, ravenPayload));
-            if (!autoDetected) {
-                ctPlatformUtils.ravenSDKTrigger('u_login_click', tslib.__assign({ action_name: 'phone_number_entered', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'native', entry_type: 'manual_entry', vertical: eventProps === null || eventProps === void 0 ? void 0 : eventProps.vertical, page_name: eventProps === null || eventProps === void 0 ? void 0 : eventProps.pageName }, ravenPayload));
-            }
-            else {
-                ctPlatformUtils.ravenSDKTrigger('u_login_click', tslib.__assign({ action_name: 'phone_number_autodetected', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'native', entry_type: 'autodetected', vertical: eventProps === null || eventProps === void 0 ? void 0 : eventProps.vertical, page_name: eventProps === null || eventProps === void 0 ? void 0 : eventProps.pageName }, ravenPayload));
-            }
-        }
-    }, [setMobileNumber]);
-    var autoDetectMobileNumber = react.useCallback(function () { return tslib.__awaiter(void 0, void 0, void 0, function () {
-        var autoDetectedNumber, simulatedEvent;
-        return tslib.__generator(this, function (_a) {
-            switch (_a.label) {
-                case 0: return [4, ctPlatformUtils.showMobileNumberHint()];
-                case 1:
-                    autoDetectedNumber = _a.sent();
-                    simulatedEvent = {
-                        target: {
-                            value: autoDetectedNumber,
-                        },
-                    };
-                    if (autoDetectedNumber) {
-                        handleInputChange(simulatedEvent, true);
-                    }
-                    return [2];
-            }
-        });
-    }); }, [handleInputChange]);
-    var handlePrivacyPolicyClick = react.useCallback(function () {
-        var eventProps = ctPlatformUtils.getRavenEventProps();
-        ctPlatformUtils.ravenSDKTrigger('u_login_click', tslib.__assign({ action_name: 'policy_click', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'native', vertical: eventProps === null || eventProps === void 0 ? void 0 : eventProps.vertical, page_name: eventProps === null || eventProps === void 0 ? void 0 : eventProps.pageName }, ravenPayload));
-        window.location.href = ctPlatformConstants.NAVIGATION_ROUTES.PRIVACY_POLICY;
-    }, []);
-    var handleTermsOfUseClick = react.useCallback(function () {
-        var eventProps = ctPlatformUtils.getRavenEventProps();
-        ctPlatformUtils.ravenSDKTrigger('u_login_click', tslib.__assign({ action_name: 'tnc_click', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'native', vertical: eventProps === null || eventProps === void 0 ? void 0 : eventProps.vertical, page_name: eventProps === null || eventProps === void 0 ? void 0 : eventProps.pageName }, ravenPayload));
-        window.location.href = ctPlatformConstants.NAVIGATION_ROUTES.TERMS;
-    }, []);
-    return (jsxRuntime.jsxs("div", tslib.__assign({ className: 'flex flex-column', ref: mobileViewRef }, { children: [errorCallout && (jsxRuntime.jsx(ctDesignAlertCallout.AlertCallout, { variant: 'error', textNode: errorCallout, prefixIconNode: jsxRuntime.jsx(ctDesignIcons.InfoIcon, { fill: 'red' }), style: {
-                    color: '#ffff',
-                    backgroundColor: '#db201e',
-                }, className: 'fs-12' })), jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ variant: 'HM1', color: 'heading', className: 'mb-4 fs-24' }, { children: ctPlatformConstants.LOGIN_CONSTANTS.LOGIN_TO_CT })), jsxRuntime.jsx("label", tslib.__assign({ style: {
-                    visibility: 'hidden',
-                    width: '0.1px',
-                    height: '0.1px',
-                }, htmlFor: 'phonenumber' }, { children: "Phone number" })), jsxRuntime.jsx(ctDesignField.PhoneField, { onChange: handleInputChange, value: mobileNumber, name: 'phonenumber', placeholder: '', inputMode: 'numeric', ref: inputRef, min: 0, max: 10, autoFocus: true, countryCode: ctPlatformConstants.LOGIN_CONSTANTS.COUNTRY_CODE }), jsxRuntime.jsx(ctDesignButton.Button, tslib.__assign({ color: 'primary', size: 'medium', minWidth: '160px', disabled: ctaDisabled, loading: sendingOtp, className: 'my-6', onClick: function () { return getOTP(mobileNumber); } }, { children: ctPlatformConstants.LOGIN_CONSTANTS.GET_OTP })), fkSSOEnabled && isFkLoginEnabled && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", tslib.__assign({ className: 'my-6 p-relative' }, { children: [jsxRuntime.jsx(ctDesignDivider.Divider, {}), jsxRuntime.jsx("span", tslib.__assign({ className: "".concat(styles.mobileinput_seperatortext) }, { children: "or" }))] })), jsxRuntime.jsx(ctDesignButton.Button, tslib.__assign({ variant: 'outline', size: 'medium', className: 'my-6', loading: fkButtonLoading, onClick: handleFKSSOClick, showLeftIcon: !fkButtonLoading, LeftIcon: jsxRuntime.jsx("img", { src: ctPlatformAssets.FlipkartLogo }) }, { children: ctPlatformConstants.LOGIN_CONSTANTS.FK_LOGIN_CTA }))] })), isPrivacyPolicyVisible && (jsxRuntime.jsxs("div", tslib.__assign({ className: 'pt-8 pb-6' }, { children: [jsxRuntime.jsx(ctDesignDivider.Divider, {}), jsxRuntime.jsxs("div", tslib.__assign({ className: 'flex flex-middle \n                    flex-center flex-wrap pt-2' }, { children: [jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ variant: 'P1', className: styles.footer_text }, { children: ctPlatformConstants.LOGIN_CONSTANTS.FOOTER_TEXT })), jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ variant: 'P1', color: 'link', className: 'pl-1 fs-12', isClickable: true, onClick: handlePrivacyPolicyClick }, { children: ctPlatformConstants.LOGIN_CONSTANTS.PRIVACY_CTA })), jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ className: 'px-1 fs-12 c-neutral-700', variant: 'P1' }, { children: '& ' })), jsxRuntime.jsx(ctDesignTypography.Typography, tslib.__assign({ variant: 'P1', color: 'link', isClickable: true, onClick: handleTermsOfUseClick, className: 'fs-12' }, { children: ctPlatformConstants.LOGIN_CONSTANTS.TNC_CTA }))] }))] })))] })));
-};
-
-var LoginForm = function (_a) {
-    var fallbackUri = _a.fallbackUri, isLoginModule = _a.isLoginModule, skipProfileFlow = _a.skipProfileFlow, sendUserInsights = _a.sendUserInsights, isFkLoginEnabled = _a.isFkLoginEnabled, _b = _a.ravenPayload, ravenPayload = _b === void 0 ? {} : _b, hotelsLoyaltyFlow = _a.hotelsLoyaltyFlow, enableProfileFetch = _a.enableProfileFetch, isPrivacyPolicyVisible = _a.isPrivacyPolicyVisible, onAuthSuccess = _a.onAuthSuccess, onAuthFailure = _a.onAuthFailure;
-    var _c = react.useState(true), showMobilePage = _c[0], setShowMobilePage = _c[1];
-    var _d = react.useState(true), ctaDisabled = _d[0], setCtaDisabled = _d[1];
-    var _e = react.useState(false), sendingOtp = _e[0], setSendingOtp = _e[1];
-    var _f = react.useState(''), mobileNumber = _f[0], setMobileNumber = _f[1];
-    var _g = react.useState(0), mobileInputHeight = _g[0], setMobileInputHeight = _g[1];
-    var _h = react.useState(''), errorCallout = _h[0], setErrorCallout = _h[1];
-    var _j = react.useState(false), otpResendDisabled = _j[0], setOtpResendDisabled = _j[1];
-    var _k = react.useState(false), showSuccess = _k[0], setShowSuccess = _k[1];
-    var _l = react.useState(false), showSigninLoader = _l[0], setShowSigninLoader = _l[1];
-    var getOTP = react.useCallback(function (mobileNumber) { return tslib.__awaiter(void 0, void 0, void 0, function () {
-        var res, status_1, err_1, message, errorMessage;
-        return tslib.__generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    _a.trys.push([0, 2, , 3]);
-                    setCtaDisabled(false);
-                    setSendingOtp(true);
-                    ctPlatformUtils.triggerOTPListener();
-                    return [4, ctPlatformUtils.sendLoginOtp(mobileNumber)];
-                case 1:
-                    res = _a.sent();
-                    status_1 = (res || {}).status;
-                    if (status_1 === 'SUCCESS') {
-                        setShowMobilePage(false);
-                        setSendingOtp(false);
-                    }
-                    return [3, 3];
-                case 2:
-                    err_1 = _a.sent();
-                    console.error(err_1);
-                    message = (err_1 || {}).message;
-                    setSendingOtp(false);
-                    errorMessage = message && ctPlatformConstants.LOGIN_CONSTANTS[message];
-                    if (errorMessage) {
-                        setErrorCallout(String(errorMessage));
-                    }
-                    else {
-                        setErrorCallout(String(ctPlatformConstants.LOGIN_CONSTANTS.GENERIC_ERROR_MESSAGE));
-                    }
-                    if (message === 'OTP_SEND_LIMIT_EXCEEDED') {
-                        setOtpResendDisabled(true);
-                    }
-                    return [3, 3];
-                case 3: return [2];
-            }
-        });
-    }); }, [showMobilePage, setShowMobilePage]);
-    var handleLoginSuccess = react.useCallback(function (loginMethod, isSignUp) {
-        var eventProps = ctPlatformUtils.getRavenEventProps();
-        var payload = tslib.__assign({ action_name: 'login_successful', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'native', login_new: isSignUp ? 'sign_up' : 'sign_in', vertical: eventProps === null || eventProps === void 0 ? void 0 : eventProps.vertical, page_name: eventProps === null || eventProps === void 0 ? void 0 : eventProps.pageName }, ravenPayload);
-        if (sendUserInsights) {
-            ctPlatformUtils.sendEventWithUserInsights('u_login_success', payload);
-        }
-        else {
-            ctPlatformUtils.ravenSDKTrigger('u_login_success', payload);
-        }
-        if (enableProfileFetch) {
-            ctPlatformUtils.handleProfileFetch();
-        }
-        if (!hotelsLoyaltyFlow &&
-            !isLoginModule &&
-            (!isSignUp || skipProfileFlow)) {
-            setShowSuccess(true);
-        }
-        onAuthSuccess(isSignUp);
-    }, [
-        ravenPayload,
-        isLoginModule,
-        skipProfileFlow,
-        sendUserInsights,
-        hotelsLoyaltyFlow,
-        enableProfileFetch,
-    ]);
-    var handleLoginFailure = react.useCallback(function (loginMethod) {
-        onAuthFailure(loginMethod);
-    }, []);
-    var showSigninLoaderScreen = function () {
-        setShowSigninLoader(true);
-    };
-    react.useEffect(function () {
-        if (isLoginModule) {
-            return;
-        }
-        if (window) {
-            window['showSigninLoaderScreen'] = showSigninLoaderScreen;
-        }
-        var queryValue = ctPlatformUtils.getQueryParam('fkSSOstatus');
-        var loginMethod = 'FK';
-        if (queryValue === 'signin') {
-            if (ctPlatformUtils.isAndroidApp()) {
-                ctPlatformUtils.updateNativeAndroidOnSignIn();
-            }
-            handleLoginSuccess(loginMethod);
-        }
-        if (queryValue === 'signup') {
-            if (ctPlatformUtils.isAndroidApp()) {
-                ctPlatformUtils.updateNativeAndroidOnSignIn();
-            }
-            handleLoginSuccess(loginMethod, true);
-        }
-        if (queryValue === 'failure') {
-            handleLoginFailure(loginMethod);
-        }
-    }, []);
-    return (jsxRuntime.jsxs("div", tslib.__assign({ className: "".concat(styles['utilswrapper'], " utilswrapper") }, { children: [showSuccess && (jsxRuntime.jsx(ctDesignToast.Toast, { text: 'Logged in successfully!', show: showSuccess, className: "".concat(styles['nonUtilsSelector_toast']), closeTimeout: 2000 })), showSigninLoader && (jsxRuntime.jsx(Loader, { title: 'Please wait', message: 'Signing in...', className: 'z-10 bg-white' })), showMobilePage ? (jsxRuntime.jsx(MobileInput, { device: 'PWA', ctaDisabled: ctaDisabled, sendingOtp: sendingOtp, getOTP: getOTP, mobileNumber: mobileNumber, setMobileNumber: setMobileNumber, setMobileInputHeight: setMobileInputHeight, fallbackUri: fallbackUri, skipProfileFlow: skipProfileFlow, setErrorCallout: setErrorCallout, errorCallout: errorCallout, ravenPayload: ravenPayload, hotelsLoyaltyFlow: hotelsLoyaltyFlow, isFkLoginEnabled: isFkLoginEnabled, isPrivacyPolicyVisible: isPrivacyPolicyVisible })) : (jsxRuntime.jsx(OtpInput, { mobileNumber: mobileNumber, getOTP: getOTP, setCtaDisabled: setCtaDisabled, setShowMobilePage: setShowMobilePage, handleLoginSuccess: handleLoginSuccess, handleLoginFailure: handleLoginFailure, otpInputHeight: mobileInputHeight, setMobileNumber: setMobileNumber, setErrorCallout: setErrorCallout, errorCallout: errorCallout, otpResendDisabled: otpResendDisabled, ravenPayload: ravenPayload, skipProfileFlow: skipProfileFlow, hotelsLoyaltyFlow: hotelsLoyaltyFlow }))] })));
-};
-
-exports.LoginForm = LoginForm;
+"use strict";var e=require("tslib"),n=require("react/jsx-runtime"),i=require("react"),t=require("@cleartrip/ct-platform-utils"),a=require("@cleartrip/ct-design-toast"),r=require("@cleartrip/ct-platform-constants"),o=require("@cleartrip/ct-design-field"),l=require("@cleartrip/ct-design-spacer"),s=require("@cleartrip/ct-design-spinner"),_=require("@cleartrip/ct-design-typography"),c=require("@cleartrip/ct-design-alert-callout"),d=require("@cleartrip/ct-design-icons"),u=require("classnames"),g=require("@cleartrip/ct-design-button"),p=require("@cleartrip/ct-design-divider"),m=require("@cleartrip/ct-platform-assets");function v(e){return e&&e.__esModule?e:{default:e}}var f=v(u);function x(e,n){void 0===n&&(n={});var i=n.insertAt;if(e&&"undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===i&&t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.styleSheet?a.styleSheet.cssText=e:a.appendChild(document.createTextNode(e))}}var N={mobileinput_seperatortext:"index-module_mobileinput_seperatortext__-KDOp",footer_text:"index-module_footer_text__nkeJv",otp_container:"index-module_otp_container__1CE4N",otp_box_wrapper:"index-module_otp_box_wrapper__sM2Ba",login_otp_input:"index-module_login_otp_input__L-3P8",login_otp_error:"index-module_login_otp_error__o3y2L",nonUtilsSelector_toast:"index-module_nonUtilsSelector_toast__lvWmB"};x(".index-module_mobileinput_seperatortext__-KDOp{background:#fff;left:0;margin:0 auto;position:absolute;right:0;text-align:center;top:-10px;width:40px}.index-module_footer_text__nkeJv{color:grey!important;font-size:12px!important}.index-module_otp_container__1CE4N{display:flex;flex-direction:column;margin-top:24px}.index-module_otp_box_wrapper__sM2Ba{margin-right:8px}.index-module_login_otp_input__L-3P8{font-size:24px!important;font-style:normal;font-weight:600!important;height:56px!important;line-height:28px;padding:auto;text-align:center;width:56px!important}.index-module_login_otp_error__o3y2L{padding-top:4px}.index-module_nonUtilsSelector_toast__lvWmB{bottom:12px!important;margin-bottom:12px;margin:0 auto!important;padding:12px 16px!important;width:calc(100% - 48px)!important;z-index:2000}");var h="index-module_loader__container__VX-VO",T="index-module_three-dots-loader__i7R-R";x('.index-module_loader__container__VX-VO{align-items:center;background:#fff;border-radius:32px;box-shadow:0 8px 24px 0 rgba(26,26,26,.1);display:flex;height:34px;justify-content:center;left:50%;padding:12px;position:absolute;top:50%;transform:translate(-50%,-50%);width:66px}.index-module_loader__container__VX-VO .index-module_three-dots-loader__i7R-R{animation:index-module_three-dots-loader__i7R-R 1s linear infinite alternate;animation-delay:.5s;background-color:#1a1a1a;border-radius:5px;height:8px;position:relative;width:8px}.index-module_loader__container__VX-VO .index-module_three-dots-loader__i7R-R:after,.index-module_loader__container__VX-VO .index-module_three-dots-loader__i7R-R:before{content:"";display:inline-block;position:absolute;top:0}.index-module_loader__container__VX-VO .index-module_three-dots-loader__i7R-R:before{animation:index-module_three-dots-loader__i7R-R 1s infinite alternate;animation-delay:0s;background-color:#1a1a1a;border-radius:5px;height:8px;left:-15px;width:8px}.index-module_loader__container__VX-VO .index-module_three-dots-loader__i7R-R:after{animation:index-module_three-dots-loader__i7R-R 1s infinite alternate;animation-delay:1s;background-color:#1a1a1a;border-radius:5px;height:8px;left:15px;width:8px}@keyframes index-module_three-dots-loader__i7R-R{0%{background-color:#1a1a1a}50%,to{background-color:grey}}');var S,b=function(){return n.jsx("div",e.__assign({className:h},{children:n.jsx("div",{className:T})}))};!function(e){e[e.DETECTING=0]="DETECTING",e[e.FAILED=1]="FAILED",e[e.DETECTED=2]="DETECTED"}(S||(S={}));var O=function(a){var u=a.mobileNumber,g=a.errorCallout,p=a.ravenPayload,m=a.otpInputHeight,v=a.skipProfileFlow,f=a.otpResendDisabled,x=a.hotelsLoyaltyFlow,h=a.getOTP,T=a.setCtaDisabled,O=a.setErrorCallout,y=a.setMobileNumber,E=a.setShowMobilePage,C=a.handleLoginSuccess,k=a.handleLoginFailure,I=i.useRef(Array(4).fill(null)),L=i.useState(S.DETECTING),w=L[0],A=L[1],P=i.useState(r.LOGIN_CONSTANTS.OTP_COUNTDOWN),j=P[0],D=P[1],R=i.useState(""),G=R[0],F=R[1],U=i.useState(!0),V=U[0],M=U[1],K=i.useState(!1),q=K[0],B=K[1],H=i.useState(""),X=H[0],W=H[1],z=i.useState(!0),Y=z[0],Q=z[1],J=i.useState(!1),Z=J[0],$=J[1],ee=i.useRef(),ne=i.useRef(),ie="CT";i.useEffect((function(){te();var n=t.getRavenEventProps();t.ravenSDKTrigger("u_login_click",e.__assign({action_name:"login_otp_screen_opened",login_form:null==n?void 0:n.loginForm,login_type:"native",vertical:null==n?void 0:n.vertical,page_name:null==n?void 0:n.pageName},p))}),[]),i.useEffect((function(){t.isIOSApp()&&Q(!1)}),[]),i.useEffect((function(){te()}),[]),i.useEffect((function(){Z||(I.current[0].focus(),I.current[0].click())}),[Z]),i.useEffect((function(){0===j&&M(!1)}),[j]),i.useEffect((function(){var e;return V&&j>0&&(e=setInterval((function(){D((function(e){return e-1}))}),1e3)),function(){clearInterval(e)}}),[V,j]);var te=i.useCallback((function(){return e.__awaiter(void 0,void 0,void 0,(function(){var n;return e.__generator(this,(function(e){switch(e.label){case 0:return e.trys.push([0,2,,3]),[4,t.autoReadOtp()];case 1:return n=e.sent(),F(n),A(S.DETECTED),(null==n?void 0:n.length)===r.LOGIN_CONSTANTS.OTP_LENGTH&&re&&re(n,!0),[3,3];case 2:return"NOT_SUPPORTED"===e.sent()&&Q(!1),[3,3];case 3:return[2]}}))}))}),[Y]),ae=i.useCallback((function(n){var i=t.getRavenEventProps();t.ravenSDKTrigger("u_login_error",e.__assign({action_name:"otp_incorrect",login_form:null==i?void 0:i.loginForm,login_type:"native",vertical:null==i?void 0:i.vertical,page_name:null==i?void 0:i.pageName},p));var a=null==n?void 0:n.message;"OTP_VALIDATE_LIMIT_EXCEEDED"!==a&&F(""),I.current[0].focus(),I.current[0].click();var o=r.LOGIN_CONSTANTS[a],l="string"==typeof o?o:r.LOGIN_CONSTANTS.INVALID_OTP;W(l)}),[I]),re=i.useCallback((function(n,i){return e.__awaiter(void 0,void 0,void 0,(function(){var a,o,l,s,_;return e.__generator(this,(function(c){switch(c.label){case 0:return c.trys.push([0,2,,3]),a=t.getRavenEventProps(),t.ravenSDKTrigger("u_login_click",e.__assign({action_name:"otp_entered",login_form:null==a?void 0:a.loginForm,login_type:"native",entry_type:i?"autodetected":"manual_entry",vertical:null==a?void 0:a.vertical,page_name:null==a?void 0:a.pageName},p)),n===ee.current&&ne.current&&ne.current-Date.now()<=100?[2]:(ee.current=n,ne.current=Date.now(),x&&$(!0),[4,t.validateOtp(u,n)]);case 1:return o=c.sent(),l=o.status,s=o.action,200!==Number(l)||t.isEmpty(s)?(x&&$(!1),k(ie)):(B(!0),W(""),t.updateNativeOnLogin(),"SIGNUP"===s?(v||(window.location.href=r.NAVIGATION_ROUTES.PERSONAL_DETAILS+"?onboardingFlow=true"),C(ie,!0)):C(ie)),[3,3];case 2:return _=c.sent(),x&&$(!1),k(ie),ae(_),[3,3];case 3:return[2]}}))}))}),[ee,ne,B,A,W,ae]),oe=function(){return e.__awaiter(void 0,void 0,void 0,(function(){var n,i,a,o,l;return e.__generator(this,(function(e){switch(e.label){case 0:return[4,navigator.clipboard.readText()];case 1:return(n=e.sent())&&t.isNumeric(n)&&(i=n.slice(0,r.LOGIN_CONSTANTS.OTP_LENGTH).split(""),null===(o=I.current[r.LOGIN_CONSTANTS.OTP_LENGTH-1])||void 0===o||o.focus(),null===(l=I.current[r.LOGIN_CONSTANTS.OTP_LENGTH-1])||void 0===l||l.click(),a=i.join(""),F(a),a.length===r.LOGIN_CONSTANTS.OTP_LENGTH&&re(a,!1)),[2]}}))}))},le=i.useCallback((function(e,n){var i,a;O(""),""!==e.target.value&&n<I.current.length-1&&(null===(i=I.current[n+1])||void 0===i||i.focus(),null===(a=I.current[n+1])||void 0===a||a.click());var o=I.current.map((function(e){return t.isHTMLInputElement(e)?e.value:""})).join("").slice(0,4);F(o),o.length===r.LOGIN_CONSTANTS.OTP_LENGTH&&re(o,!1)}),[F,re]),se=i.useCallback((function(e,n){var i,t,a;"Backspace"===e.key&&n>0&&""===(null===(i=I.current[n])||void 0===i?void 0:i.value)&&(e.preventDefault(),null===(t=I.current[n-1])||void 0===t||t.focus(),null===(a=I.current[n-1])||void 0===a||a.click())}),[I]),_e=i.useCallback((function(){D(r.LOGIN_CONSTANTS.OTP_COUNTDOWN),M(!0),h(u);var n=t.getRavenEventProps();t.ravenSDKTrigger("u_login_error",e.__assign({action_name:"resend_otp_clicked",login_form:null==n?void 0:n.loginForm,login_type:"native",vertical:null==n?void 0:n.vertical,page_name:null==n?void 0:n.pageName},p))}),[D,M]),ce=i.useCallback((function(){T(!0),E(!0),y("")}),[E]);return n.jsxs("div",e.__assign({className:"flex flex-column bg-neutral-100",style:{height:m}},{children:[g&&n.jsx(c.AlertCallout,{variant:"error",textNode:g,prefixIconNode:n.jsx(d.InfoIcon,{fill:"red"}),style:{color:"#ffff",backgroundColor:"#db201e"},className:"fs-12"}),n.jsxs("div",e.__assign({className:"flex flex-bottom"},{children:[n.jsxs(_.Typography,e.__assign({variant:"HM1",color:"heading"},{children:[r.LOGIN_CONSTANTS.OTP_TEXT," ",n.jsx("br",{}),u]})),n.jsx("div",e.__assign({className:"pl-2",onClick:ce},{children:n.jsx(d.Edit,{})}))]})),n.jsxs("div",e.__assign({className:N.otp_container},{children:[n.jsxs("div",e.__assign({className:"flex",style:x?{width:"max-content",position:"relative"}:{}},{children:[e.__spreadArray([],Array(r.LOGIN_CONSTANTS.OTP_LENGTH),!0).map((function(i,t){return n.jsx("div",e.__assign({className:N.otp_box_wrapper},{children:n.jsx(o.FieldV2,{prompt:{hasError:!!X},type:"number",placeholder:"",value:G[t],max:1,inputMode:"numeric",className:N.login_otp_input,variant:"md",ref:function(e){e&&(I.current[t]=e)},onKeyDown:function(e){return se(e,t)},onChange:function(e){return le(e,t)},onPaste:oe,autoFocus:0===t,disabled:!(!x||!Z)})}),t)})),x&&Z&&n.jsx(b,{})]})),!!X&&n.jsx(_.Typography,e.__assign({variant:"P1",color:"warning",className:N.login_otp_error},{children:X}))]})),n.jsx(l.Spacer,{className:"pt-2"}),w===S.DETECTING&&!q&&Y&&j>r.LOGIN_CONSTANTS.RESEND_OTP_COUNTDOWN&&n.jsxs("div",e.__assign({className:"flex flex-middle"},{children:[n.jsx(s.Spinner,{width:"20px",height:"20px",borderColor:"#11a670",className:"bg-neutral-900 bc-black"}),n.jsx(_.Typography,e.__assign({variant:"B3",className:"fs-12 fw-500 ml-1 c-neutral-700"},{children:r.LOGIN_CONSTANTS.AUTO_DETECTING_TEXT}))]})),w===S.DETECTING&&j<=r.LOGIN_CONSTANTS.RESEND_OTP_COUNTDOWN&&Y&&!q&&n.jsx(n.Fragment,{children:n.jsxs("div",e.__assign({className:"flex"},{children:[n.jsx(_.Typography,e.__assign({variant:"B3",className:"fs-12 fw-500  c-neutral-700 "},{children:r.LOGIN_CONSTANTS.OTP_RESEND_TEXT})),n.jsx(l.Spacer,{className:"ml-1"}),f?n.jsx(_.Typography,e.__assign({className:"color-neutral-200 fw-500",variant:"B3"},{children:r.LOGIN_CONSTANTS.RESEND_CTA})):n.jsxs(n.Fragment,{children:[0===j&&n.jsx(n.Fragment,{children:n.jsx(_.Typography,e.__assign({isClickable:!0,variant:"B3",onClick:_e,color:"link",className:"\n                                                fs-12 fw-500 c-pointer"},{children:r.LOGIN_CONSTANTS.RESEND_CTA}))}),j>0&&n.jsx(_.Typography,e.__assign({color:"disabled",variant:"B3"},{children:" Resend ("+j+"s)"}))]})]}))}),!X&&q&&n.jsx(n.Fragment,{children:n.jsxs("div",e.__assign({className:"flex flex-middle"},{children:[n.jsx(d.CheckCircle,{}),n.jsx(_.Typography,e.__assign({variant:"P1",color:"success",className:"fs-12"},{children:w===S.DETECTED?r.LOGIN_CONSTANTS.AUTO_DETECTED_TEXT:r.LOGIN_CONSTANTS.VERIFIED_MESSAGE}))]}))}),n.jsx(l.Spacer,{className:"mt-24"})]}))},y={loader:"index-module_loader__63LeU","With-full-opacity":"index-module_With-full-opacity__ZSY-U",loader__content:"index-module_loader__content__Q6kJl",loader__spinner:"index-module_loader__spinner__6B3AR","loader-rotate":"index-module_loader-rotate__efcf3",loader__heading:"index-module_loader__heading__7YZ3N",loader__text:"index-module_loader__text__1QcLi"};x(".index-module_loader__63LeU{align-items:center;background-color:hsla(0,0%,100%,.95);bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:0}.index-module_loader__63LeU.index-module_With-full-opacity__ZSY-U{background-color:#fff}.index-module_loader__content__Q6kJl{max-width:280px;text-align:center}.index-module_loader__spinner__6B3AR{animation:index-module_loader-rotate__efcf3 .8s linear infinite;border:2px solid rgba(51,102,204,.3);border-radius:50%;border-top-color:#36c;display:inline-block;height:30px;margin-bottom:10px;position:relative;width:30px}.index-module_loader__heading__7YZ3N{color:#000;font-size:18px;font-weight:600;margin-bottom:5px}.index-module_loader__text__1QcLi{color:rgba(0,0,0,.8);font-size:16px;line-height:1.5}");var E=function(i){var t=i.title,a=i.message,r=i.className;return n.jsx("div",e.__assign({className:"".concat(y.utilswrapper," utilswrapper")},{children:n.jsx("div",e.__assign({className:f.default(y.loader,r)},{children:n.jsxs("div",e.__assign({className:y.loader__content},{children:[n.jsx("div",{className:y.loader__spinner}),n.jsx("h5",e.__assign({className:y.loader__heading},{children:t})),n.jsx("p",e.__assign({className:y.loader__text},{children:a}))]}))}))}))},C=function(a){var l=a.sendingOtp,s=a.ctaDisabled,u=a.getOTP,v=a.setErrorCallout,f=a.errorCallout,x=a.mobileNumber,h=a.setMobileInputHeight,T=a.setMobileNumber,S=a.fallbackUri,b=a.skipProfileFlow,O=a.ravenPayload,y=a.hotelsLoyaltyFlow,E=a.isFkLoginEnabled,C=void 0===E||E,k=a.isPrivacyPolicyVisible,I=void 0===k||k,L=i.useState(t.isFKSSOEnabled)[0],w=i.useState(!1),A=w[0],P=w[1],j=i.useRef(null),D=i.useRef(null);i.useEffect((function(){if(D.current){var e=D.current.clientHeight;h(e)}}),[D.current]),i.useEffect((function(){var e;return j.current&&(e=setTimeout((function(){var e;null===(e=j.current)||void 0===e||e.focus()}),100)),function(){clearTimeout(e)}}),[]),i.useEffect((function(){t.isAndroidApp()&&F()}),[]);var R=i.useCallback((function(){return e.__awaiter(void 0,void 0,void 0,(function(){var n,i;return e.__generator(this,(function(a){switch(a.label){case 0:return a.trys.push([0,2,,3]),n=t.getRavenEventProps(),t.ravenSDKTrigger("u_login_click",e.__assign({action_name:"login_with_flipkart_clicked",login_form:null==n?void 0:n.loginForm,login_type:"fk_sso",vertical:null==n?void 0:n.vertical,page_name:null==n?void 0:n.pageName},O)),P(!0),[4,t.handleFKSSO(S,b)];case 1:return i=a.sent(),y||P(!1),t.isPwa()&&(window.location.href=i),[3,3];case 2:return a.sent(),P(!1),[3,3];case 3:return[2]}}))}))}),[]),G=i.useCallback((function(n,i){void 0===i&&(i=!1),v("");var a=n.target.value||"";if(a=a.replace(t.MULTI_SPACE," ").trimStart(),T(a),t.isValidMobileNumber(n.target.value)){u(a);var r=t.getRavenEventProps();t.ravenSDKTrigger("u_login_click",e.__assign({action_name:"get_otp_clicked",login_form:null==r?void 0:r.loginForm,login_type:"native",entry_type:"auto_click",vertical:null==r?void 0:r.vertical,page_name:null==r?void 0:r.pageName},O)),i?t.ravenSDKTrigger("u_login_click",e.__assign({action_name:"phone_number_autodetected",login_form:null==r?void 0:r.loginForm,login_type:"native",entry_type:"autodetected",vertical:null==r?void 0:r.vertical,page_name:null==r?void 0:r.pageName},O)):t.ravenSDKTrigger("u_login_click",e.__assign({action_name:"phone_number_entered",login_form:null==r?void 0:r.loginForm,login_type:"native",entry_type:"manual_entry",vertical:null==r?void 0:r.vertical,page_name:null==r?void 0:r.pageName},O))}}),[T]),F=i.useCallback((function(){return e.__awaiter(void 0,void 0,void 0,(function(){var n,i;return e.__generator(this,(function(e){switch(e.label){case 0:return[4,t.showMobileNumberHint()];case 1:return n=e.sent(),i={target:{value:n}},n&&G(i,!0),[2]}}))}))}),[G]),U=i.useCallback((function(){var n=t.getRavenEventProps();t.ravenSDKTrigger("u_login_click",e.__assign({action_name:"policy_click",login_form:null==n?void 0:n.loginForm,login_type:"native",vertical:null==n?void 0:n.vertical,page_name:null==n?void 0:n.pageName},O)),window.location.href=r.NAVIGATION_ROUTES.PRIVACY_POLICY}),[]),V=i.useCallback((function(){var n=t.getRavenEventProps();t.ravenSDKTrigger("u_login_click",e.__assign({action_name:"tnc_click",login_form:null==n?void 0:n.loginForm,login_type:"native",vertical:null==n?void 0:n.vertical,page_name:null==n?void 0:n.pageName},O)),window.location.href=r.NAVIGATION_ROUTES.TERMS}),[]);return n.jsxs("div",e.__assign({className:"flex flex-column",ref:D},{children:[f&&n.jsx(c.AlertCallout,{variant:"error",textNode:f,prefixIconNode:n.jsx(d.InfoIcon,{fill:"red"}),style:{color:"#ffff",backgroundColor:"#db201e"},className:"fs-12"}),n.jsx(_.Typography,e.__assign({variant:"HM1",color:"heading",className:"mb-4 fs-24"},{children:r.LOGIN_CONSTANTS.LOGIN_TO_CT})),n.jsx("label",e.__assign({style:{visibility:"hidden",width:"0.1px",height:"0.1px"},htmlFor:"phonenumber"},{children:"Phone number"})),n.jsx(o.PhoneField,{onChange:G,value:x,name:"phonenumber",placeholder:"",inputMode:"numeric",ref:j,min:0,max:10,autoFocus:!0,countryCode:r.LOGIN_CONSTANTS.COUNTRY_CODE}),n.jsx(g.Button,e.__assign({color:"primary",size:"medium",minWidth:"160px",disabled:s,loading:l,className:"my-6",onClick:function(){return u(x)}},{children:r.LOGIN_CONSTANTS.GET_OTP})),L&&C&&n.jsxs(n.Fragment,{children:[n.jsxs("div",e.__assign({className:"my-6 p-relative"},{children:[n.jsx(p.Divider,{}),n.jsx("span",e.__assign({className:"".concat(N.mobileinput_seperatortext)},{children:"or"}))]})),n.jsx(g.Button,e.__assign({variant:"outline",size:"medium",className:"my-6",loading:A,onClick:R,showLeftIcon:!A,LeftIcon:n.jsx("img",{src:m.FlipkartLogo})},{children:r.LOGIN_CONSTANTS.FK_LOGIN_CTA}))]}),I&&n.jsxs("div",e.__assign({className:"pt-8 pb-6"},{children:[n.jsx(p.Divider,{}),n.jsxs("div",e.__assign({className:"flex flex-middle \n                    flex-center flex-wrap pt-2"},{children:[n.jsx(_.Typography,e.__assign({variant:"P1",className:N.footer_text},{children:r.LOGIN_CONSTANTS.FOOTER_TEXT})),n.jsx(_.Typography,e.__assign({variant:"P1",color:"link",className:"pl-1 fs-12",isClickable:!0,onClick:U},{children:r.LOGIN_CONSTANTS.PRIVACY_CTA})),n.jsx(_.Typography,e.__assign({className:"px-1 fs-12 c-neutral-700",variant:"P1"},{children:"& "})),n.jsx(_.Typography,e.__assign({variant:"P1",color:"link",isClickable:!0,onClick:V,className:"fs-12"},{children:r.LOGIN_CONSTANTS.TNC_CTA}))]}))]}))]}))};exports.LoginForm=function(o){var l=o.fallbackUri,s=o.isLoginModule,_=o.skipProfileFlow,c=o.sendUserInsights,d=o.isFkLoginEnabled,u=o.ravenPayload,g=void 0===u?{}:u,p=o.hotelsLoyaltyFlow,m=o.enableProfileFetch,v=o.isPrivacyPolicyVisible,f=o.onAuthSuccess,x=o.onAuthFailure,h=i.useState(!0),T=h[0],S=h[1],b=i.useState(!0),y=b[0],k=b[1],I=i.useState(!1),L=I[0],w=I[1],A=i.useState(""),P=A[0],j=A[1],D=i.useState(0),R=D[0],G=D[1],F=i.useState(""),U=F[0],V=F[1],M=i.useState(!1),K=M[0],q=M[1],B=i.useState(!1),H=B[0],X=B[1],W=i.useState(!1),z=W[0],Y=W[1],Q=i.useCallback((function(n){return e.__awaiter(void 0,void 0,void 0,(function(){var i,a,o,l;return e.__generator(this,(function(e){switch(e.label){case 0:return e.trys.push([0,2,,3]),k(!1),w(!0),t.triggerOTPListener(),[4,t.sendLoginOtp(n)];case 1:return i=e.sent(),"SUCCESS"===(i||{}).status&&(S(!1),w(!1)),[3,3];case 2:return a=e.sent(),console.error(a),o=(a||{}).message,w(!1),l=o&&r.LOGIN_CONSTANTS[o],V(String(l||r.LOGIN_CONSTANTS.GENERIC_ERROR_MESSAGE)),"OTP_SEND_LIMIT_EXCEEDED"===o&&q(!0),[3,3];case 3:return[2]}}))}))}),[T,S]),J=i.useCallback((function(n,i){var a=t.getRavenEventProps(),r=e.__assign({action_name:"login_successful",login_form:null==a?void 0:a.loginForm,login_type:"native",login_new:i?"sign_up":"sign_in",vertical:null==a?void 0:a.vertical,page_name:null==a?void 0:a.pageName},g);c?t.sendEventWithUserInsights("u_login_success",r):t.ravenSDKTrigger("u_login_success",r),m&&t.handleProfileFetch(),p||s||i&&!_||X(!0),f(i)}),[g,s,_,c,p,m]),Z=i.useCallback((function(e){x(e)}),[]),$=function(){Y(!0)};return i.useEffect((function(){if(!s){window&&(window.showSigninLoaderScreen=$);var e=t.getQueryParam("fkSSOstatus"),n="FK";"signin"===e&&(t.isAndroidApp()&&t.updateNativeAndroidOnSignIn(),J(n)),"signup"===e&&(t.isAndroidApp()&&t.updateNativeAndroidOnSignIn(),J(n,!0)),"failure"===e&&Z(n)}}),[]),n.jsxs("div",e.__assign({className:"".concat(N.utilswrapper," utilswrapper")},{children:[H&&n.jsx(a.Toast,{text:"Logged in successfully!",show:H,className:"".concat(N.nonUtilsSelector_toast),closeTimeout:2e3}),z&&n.jsx(E,{title:"Please wait",message:"Signing in...",className:"z-10 bg-white"}),T?n.jsx(C,{device:"PWA",ctaDisabled:y,sendingOtp:L,getOTP:Q,mobileNumber:P,setMobileNumber:j,setMobileInputHeight:G,fallbackUri:l,skipProfileFlow:_,setErrorCallout:V,errorCallout:U,ravenPayload:g,hotelsLoyaltyFlow:p,isFkLoginEnabled:d,isPrivacyPolicyVisible:v}):n.jsx(O,{mobileNumber:P,getOTP:Q,setCtaDisabled:k,setShowMobilePage:S,handleLoginSuccess:J,handleLoginFailure:Z,otpInputHeight:R,setMobileNumber:j,setErrorCallout:V,errorCallout:U,otpResendDisabled:K,ravenPayload:g,skipProfileFlow:_,hotelsLoyaltyFlow:p})]}))};
 //# sourceMappingURL=ct-platform-login-form.cjs.js.map