@cleartrip/ct-platform-login-module 3.3.1-beta.9 → 3.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,717 +1,2 @@
1
- import { __assign, __awaiter, __generator, __spreadArray, __rest } from 'tslib';
2
- import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
3
- import { useRef, useState, useEffect, useCallback, useMemo } from 'react';
4
- import { Toast } from '@cleartrip/ct-design-toast';
5
- import { Spacer } from '@cleartrip/ct-design-spacer';
6
- import { Drawer } from '@cleartrip/ct-platform-drawer';
7
- import { ThemeProvider } from '@cleartrip/ct-design-theme';
8
- import { LOGIN_CONSTANTS, NAVIGATION_ROUTES } from '@cleartrip/ct-platform-constants';
9
- import { getRavenEventProps, ravenSDKTrigger, isIOSApp, autoReadOtp, isEmpty, updateNativeOnLogin, validateOtp, isHTMLInputElement, isNumeric, isFKSSOEnabled, isAndroidApp, isPwa, handleFKSSO, MULTI_SPACE, isValidMobileNumber, showMobileNumberHint, getCurrentPathName, getQueryParam, updateNativeAndroidOnSignIn, triggerOTPListener, sendLoginOtp, sendEventWithUserInsights } from '@cleartrip/ct-platform-utils';
10
- import { FieldV2, PhoneField } from '@cleartrip/ct-design-field';
11
- import { Spinner } from '@cleartrip/ct-design-spinner';
12
- import { Typography, TypographyVariant } from '@cleartrip/ct-design-typography';
13
- import { AlertCallout } from '@cleartrip/ct-design-alert-callout';
14
- import { InfoIcon, Edit, CheckCircle } from '@cleartrip/ct-design-icons';
15
- import classNames from 'classnames';
16
- import { Button } from '@cleartrip/ct-design-button';
17
- import { Divider } from '@cleartrip/ct-design-divider';
18
- import { FlipkartLogo } from '@cleartrip/ct-platform-assets';
19
- import { Swiper, SwiperSlide } from 'swiper/react';
20
- import SwiperCore, { Autoplay, Navigation, Pagination } from 'swiper';
21
-
22
- function styleInject(css, ref) {
23
- if (ref === void 0) ref = {};
24
- var insertAt = ref.insertAt;
25
- if (!css || typeof document === 'undefined') {
26
- return;
27
- }
28
- var head = document.head || document.getElementsByTagName('head')[0];
29
- var style = document.createElement('style');
30
- style.type = 'text/css';
31
- if (insertAt === 'top') {
32
- if (head.firstChild) {
33
- head.insertBefore(style, head.firstChild);
34
- } else {
35
- head.appendChild(style);
36
- }
37
- } else {
38
- head.appendChild(style);
39
- }
40
- if (style.styleSheet) {
41
- style.styleSheet.cssText = css;
42
- } else {
43
- style.appendChild(document.createTextNode(css));
44
- }
45
- }
46
-
47
- var css_248z$3 = ".index-module_mobileinput_footertext__jPQ-g a{color:#0f6bff;text-decoration:none}.index-module_mobileinput-seperator__7Ewok{position:relative}.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_slider_carousel_wrapper__0SuGB{border-top-left-radius:16px;border-top-right-radius:16px;width:100dvw}.index-module_login_form__tpSDz{background-color:#fff;padding-left:16px;padding-right:16px}.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}.index-module_login_otp_error__o3y2L{padding-top:4px}.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_footer_text__nkeJv{color:grey!important;font-size:12px!important}.index-module_swiper-custom-pagination__Ma1gV{--swiper-theme-color:#fff;--swiper-pagination-color:#fff;--swiper-pagination-bullet-inactive-color:#999;--swiper-pagination-bullet-inactive-opacity:1}.index-module_swiper-custom-pagination__Ma1gV *>span{height:6px;width:6px}.index-module_otp_box_wrapper__sM2Ba{margin-right:8px}.index-module_otp_container__1CE4N{display:flex;flex-direction:column;margin-top:24px}.index-module_swiper__r5-8U{height:100%;width:100%}.index-module_swiper__r5-8U .index-module_swiper-slide__Zchn0{height:auto}.index-module_swiper-slide__Zchn0 img{display:block;height:100%;object-fit:fill;width:100%}";
48
- var styles$1 = {"mobileinput_footertext":"index-module_mobileinput_footertext__jPQ-g","mobileinput-seperator":"index-module_mobileinput-seperator__7Ewok","mobileinput_seperatortext":"index-module_mobileinput_seperatortext__-KDOp","slider_carousel_wrapper":"index-module_slider_carousel_wrapper__0SuGB","login_form":"index-module_login_form__tpSDz","nonUtilsSelector_toast":"index-module_nonUtilsSelector_toast__lvWmB","login_otp_error":"index-module_login_otp_error__o3y2L","login_otp_input":"index-module_login_otp_input__L-3P8","footer_text":"index-module_footer_text__nkeJv","swiper-custom-pagination":"index-module_swiper-custom-pagination__Ma1gV","otp_box_wrapper":"index-module_otp_box_wrapper__sM2Ba","otp_container":"index-module_otp_container__1CE4N","swiper":"index-module_swiper__r5-8U","swiper-slide":"index-module_swiper-slide__Zchn0"};
49
- styleInject(css_248z$3);
50
-
51
- var css_248z$2 = ".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}}";
52
- var Styles$1 = {"loader__container":"index-module_loader__container__VX-VO","three-dots-loader":"index-module_three-dots-loader__i7R-R"};
53
- styleInject(css_248z$2);
54
-
55
- var ThreeDotsLoader = function () {
56
- return (jsx("div", __assign({ className: Styles$1['loader__container'] }, { children: jsx("div", { className: Styles$1['three-dots-loader'] }) })));
57
- };
58
-
59
- var AutoDetectState;
60
- (function (AutoDetectState) {
61
- AutoDetectState[AutoDetectState["DETECTING"] = 0] = "DETECTING";
62
- AutoDetectState[AutoDetectState["FAILED"] = 1] = "FAILED";
63
- AutoDetectState[AutoDetectState["DETECTED"] = 2] = "DETECTED";
64
- })(AutoDetectState || (AutoDetectState = {}));
65
- var OtpInput = function (_a) {
66
- 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;
67
- var inputRefs = useRef(Array(4).fill(null));
68
- var _b = useState(AutoDetectState.DETECTING), autoDetecting = _b[0], setAutoDetecting = _b[1];
69
- var _c = useState(LOGIN_CONSTANTS.OTP_COUNTDOWN), countdown = _c[0], setCountdown = _c[1];
70
- var _d = useState(''), otp = _d[0], setOtp = _d[1];
71
- var _f = useState(true), countdownEnabled = _f[0], setCountdownEnabled = _f[1];
72
- var _g = useState(false), verifiedOtp = _g[0], setVerifiedOtp = _g[1];
73
- var _h = useState(''), otpErrorMessage = _h[0], setOtpErrorMessage = _h[1];
74
- var _j = useState(true), enableAutoDetect = _j[0], setEnableAutoDetect = _j[1];
75
- var _k = useState(false), showOtpVerificationLoader = _k[0], setShowOtpVerificationLoader = _k[1];
76
- var lastOtpRequest = useRef();
77
- var lastOtpRequestTimeStamp = useRef();
78
- var loginMethod = 'CT';
79
- useEffect(function () {
80
- autoDetect();
81
- var eventProps = getRavenEventProps();
82
- ravenSDKTrigger('u_login_click', __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));
83
- }, []);
84
- useEffect(function () {
85
- if (isIOSApp()) {
86
- setEnableAutoDetect(false);
87
- }
88
- }, []);
89
- useEffect(function () {
90
- autoDetect();
91
- }, []);
92
- useEffect(function () {
93
- if (!showOtpVerificationLoader) {
94
- inputRefs.current[0].focus();
95
- inputRefs.current[0].click();
96
- }
97
- }, [showOtpVerificationLoader]);
98
- useEffect(function () {
99
- if (countdown === 0) {
100
- setCountdownEnabled(false);
101
- }
102
- }, [countdown]);
103
- useEffect(function () {
104
- var interval;
105
- if (countdownEnabled && countdown > 0) {
106
- interval = setInterval(function () {
107
- setCountdown(function (prevCountdown) { return prevCountdown - 1; });
108
- }, 1000);
109
- }
110
- return function () {
111
- clearInterval(interval);
112
- };
113
- }, [countdownEnabled, countdown]);
114
- var autoDetect = useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
115
- var otp_1, _e_1;
116
- return __generator(this, function (_a) {
117
- switch (_a.label) {
118
- case 0:
119
- _a.trys.push([0, 2, , 3]);
120
- return [4, autoReadOtp()];
121
- case 1:
122
- otp_1 = _a.sent();
123
- setOtp(otp_1);
124
- setAutoDetecting(AutoDetectState.DETECTED);
125
- if ((otp_1 === null || otp_1 === void 0 ? void 0 : otp_1.length) === LOGIN_CONSTANTS.OTP_LENGTH &&
126
- handleOtpComplete) {
127
- handleOtpComplete(otp_1, true);
128
- }
129
- return [3, 3];
130
- case 2:
131
- _e_1 = _a.sent();
132
- if (_e_1 === 'NOT_SUPPORTED') {
133
- setEnableAutoDetect(false);
134
- }
135
- return [3, 3];
136
- case 3: return [2];
137
- }
138
- });
139
- }); }, [enableAutoDetect]);
140
- var handleOtpValidationError = useCallback(function (e) {
141
- var eventProps = getRavenEventProps();
142
- ravenSDKTrigger('u_login_error', __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));
143
- var message = e === null || e === void 0 ? void 0 : e.message;
144
- if (message !== 'OTP_VALIDATE_LIMIT_EXCEEDED') {
145
- setOtp('');
146
- }
147
- inputRefs.current[0].focus();
148
- inputRefs.current[0].click();
149
- var messageValue = LOGIN_CONSTANTS[message];
150
- var toastMessage = typeof messageValue === 'string'
151
- ? messageValue
152
- : LOGIN_CONSTANTS.INVALID_OTP;
153
- setOtpErrorMessage(toastMessage);
154
- }, [inputRefs]);
155
- var handleOtpComplete = useCallback(function (otp, autodetected) { return __awaiter(void 0, void 0, void 0, function () {
156
- var eventProps, response, status_1, action, e_1;
157
- return __generator(this, function (_a) {
158
- switch (_a.label) {
159
- case 0:
160
- _a.trys.push([0, 2, , 3]);
161
- eventProps = getRavenEventProps();
162
- ravenSDKTrigger('u_login_click', __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));
163
- if (otp === lastOtpRequest.current &&
164
- lastOtpRequestTimeStamp.current &&
165
- lastOtpRequestTimeStamp.current - Date.now() <= 100) {
166
- return [2];
167
- }
168
- lastOtpRequest.current = otp;
169
- lastOtpRequestTimeStamp.current = Date.now();
170
- if (hotelsLoyaltyFlow) {
171
- setShowOtpVerificationLoader(true);
172
- }
173
- return [4, validateOtp(mobileNumber, otp)];
174
- case 1:
175
- response = _a.sent();
176
- status_1 = response.status, action = response.action;
177
- if (Number(status_1) === 200 && !isEmpty(action)) {
178
- setVerifiedOtp(true);
179
- setOtpErrorMessage('');
180
- updateNativeOnLogin();
181
- if (action === 'SIGNUP') {
182
- if (!skipProfileFlow) {
183
- window.location.href =
184
- NAVIGATION_ROUTES.PERSONAL_DETAILS +
185
- '?onboardingFlow=true';
186
- }
187
- handleLoginSuccess(loginMethod, true);
188
- }
189
- else {
190
- handleLoginSuccess(loginMethod);
191
- }
192
- }
193
- else {
194
- if (hotelsLoyaltyFlow) {
195
- setShowOtpVerificationLoader(false);
196
- }
197
- handleLoginFailure(loginMethod);
198
- }
199
- return [3, 3];
200
- case 2:
201
- e_1 = _a.sent();
202
- if (hotelsLoyaltyFlow) {
203
- setShowOtpVerificationLoader(false);
204
- }
205
- handleLoginFailure(loginMethod);
206
- handleOtpValidationError(e_1);
207
- return [3, 3];
208
- case 3: return [2];
209
- }
210
- });
211
- }); }, [
212
- lastOtpRequest,
213
- lastOtpRequestTimeStamp,
214
- setVerifiedOtp,
215
- setAutoDetecting,
216
- setOtpErrorMessage,
217
- handleOtpValidationError,
218
- ]);
219
- var handleOnPaste = function () { return __awaiter(void 0, void 0, void 0, function () {
220
- var clipboardData, pastedArr, pastedString;
221
- var _a, _b;
222
- return __generator(this, function (_c) {
223
- switch (_c.label) {
224
- case 0: return [4, navigator.clipboard.readText()];
225
- case 1:
226
- clipboardData = _c.sent();
227
- if (clipboardData && isNumeric(clipboardData)) {
228
- pastedArr = clipboardData
229
- .slice(0, LOGIN_CONSTANTS.OTP_LENGTH)
230
- .split('');
231
- (_a = inputRefs.current[LOGIN_CONSTANTS.OTP_LENGTH - 1]) === null || _a === void 0 ? void 0 : _a.focus();
232
- (_b = inputRefs.current[LOGIN_CONSTANTS.OTP_LENGTH - 1]) === null || _b === void 0 ? void 0 : _b.click();
233
- pastedString = pastedArr.join('');
234
- setOtp(pastedString);
235
- if (pastedString.length === LOGIN_CONSTANTS.OTP_LENGTH) {
236
- handleOtpComplete(pastedString, false);
237
- }
238
- }
239
- return [2];
240
- }
241
- });
242
- }); };
243
- var handleInput = useCallback(function (event, index) {
244
- var _a, _b;
245
- setErrorCallout('');
246
- var value = event.target.value;
247
- if (value !== '' && index < inputRefs.current.length - 1) {
248
- (_a = inputRefs.current[index + 1]) === null || _a === void 0 ? void 0 : _a.focus();
249
- (_b = inputRefs.current[index + 1]) === null || _b === void 0 ? void 0 : _b.click();
250
- }
251
- var inputValues = inputRefs.current.map(function (ref) {
252
- if (isHTMLInputElement(ref)) {
253
- return ref.value;
254
- }
255
- return '';
256
- });
257
- var otpValue = inputValues.join('').slice(0, 4);
258
- setOtp(otpValue);
259
- if (otpValue.length === LOGIN_CONSTANTS.OTP_LENGTH) {
260
- handleOtpComplete(otpValue, false);
261
- }
262
- }, [setOtp, handleOtpComplete]);
263
- var handleKeyDown = useCallback(function (e, index) {
264
- var _a, _b, _c;
265
- if (e.key === 'Backspace' &&
266
- index > 0 &&
267
- ((_a = inputRefs.current[index]) === null || _a === void 0 ? void 0 : _a.value) === '') {
268
- e.preventDefault();
269
- (_b = inputRefs.current[index - 1]) === null || _b === void 0 ? void 0 : _b.focus();
270
- (_c = inputRefs.current[index - 1]) === null || _c === void 0 ? void 0 : _c.click();
271
- }
272
- }, [inputRefs]);
273
- var onResendOtpClick = useCallback(function () {
274
- setCountdown(LOGIN_CONSTANTS.OTP_COUNTDOWN);
275
- setCountdownEnabled(true);
276
- getOTP(mobileNumber);
277
- var eventProps = getRavenEventProps();
278
- ravenSDKTrigger('u_login_error', __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));
279
- }, [setCountdown, setCountdownEnabled]);
280
- var onEditCLick = useCallback(function () {
281
- setCtaDisabled(true);
282
- setShowMobilePage(true);
283
- setMobileNumber('');
284
- }, [setShowMobilePage]);
285
- return (jsxs("div", __assign({ className: 'flex flex-column bg-neutral-100', style: { height: otpInputHeight } }, { children: [errorCallout && (jsx(AlertCallout, { variant: 'error', textNode: errorCallout, prefixIconNode: jsx(InfoIcon, { fill: 'red' }), style: {
286
- color: '#ffff',
287
- backgroundColor: '#db201e',
288
- }, className: 'fs-12' })), jsxs("div", __assign({ className: 'flex flex-bottom' }, { children: [jsxs(Typography, __assign({ variant: 'HM1', color: 'heading' }, { children: [LOGIN_CONSTANTS.OTP_TEXT, " ", jsx("br", {}), mobileNumber] })), jsx("div", __assign({ className: 'pl-2', onClick: onEditCLick }, { children: jsx(Edit, {}) }))] })), jsxs("div", __assign({ className: styles$1.otp_container }, { children: [jsxs("div", __assign({ className: 'flex', style: hotelsLoyaltyFlow
289
- ? { width: 'max-content', position: 'relative' }
290
- : {} }, { children: [__spreadArray([], Array(LOGIN_CONSTANTS.OTP_LENGTH), true).map(function (_, i) { return (jsx("div", __assign({ className: styles$1.otp_box_wrapper }, { children: jsx(FieldV2, { prompt: {
291
- hasError: !!otpErrorMessage,
292
- }, type: 'number', placeholder: '', value: otp[i], max: 1, inputMode: 'numeric', className: styles$1.login_otp_input, variant: 'md', ref: function (ref) {
293
- if (ref) {
294
- inputRefs.current[i] = ref;
295
- }
296
- }, onKeyDown: function (e) { return handleKeyDown(e, i); }, onChange: function (e) { return handleInput(e, i); }, onPaste: handleOnPaste, autoFocus: i === 0, disabled: hotelsLoyaltyFlow &&
297
- showOtpVerificationLoader
298
- ? true
299
- : false }) }), i)); }), hotelsLoyaltyFlow && showOtpVerificationLoader && (jsx(ThreeDotsLoader, {}))] })), !!otpErrorMessage && (jsx(Typography, __assign({ variant: 'P1', color: 'warning', className: styles$1.login_otp_error }, { children: otpErrorMessage })))] })), jsx(Spacer, { className: 'pt-2' }), autoDetecting === AutoDetectState.DETECTING &&
300
- !verifiedOtp &&
301
- enableAutoDetect &&
302
- countdown >
303
- LOGIN_CONSTANTS.RESEND_OTP_COUNTDOWN && (jsxs("div", __assign({ className: 'flex flex-middle' }, { children: [jsx(Spinner, { width: '20px', height: '20px', borderColor: '#11a670', className: 'bg-neutral-900 bc-black' }), jsx(Typography, __assign({ variant: 'B3', className: 'fs-12 fw-500 ml-1 c-neutral-700' }, { children: LOGIN_CONSTANTS.AUTO_DETECTING_TEXT }))] }))), autoDetecting === AutoDetectState.DETECTING &&
304
- countdown <= LOGIN_CONSTANTS.RESEND_OTP_COUNTDOWN &&
305
- enableAutoDetect &&
306
- !verifiedOtp && (jsx(Fragment, { children: jsxs("div", __assign({ className: 'flex' }, { children: [jsx(Typography, __assign({ variant: 'B3', className: 'fs-12 fw-500 c-neutral-700 ' }, { children: LOGIN_CONSTANTS.OTP_RESEND_TEXT })), jsx(Spacer, { className: 'ml-1' }), otpResendDisabled ? (jsx(Typography, __assign({ className: 'color-neutral-200 fw-500', variant: 'B3' }, { children: LOGIN_CONSTANTS.RESEND_CTA }))) : (jsxs(Fragment, { children: [countdown === 0 && (jsx(Fragment, { children: jsx(Typography, __assign({ isClickable: true, variant: 'B3', onClick: onResendOtpClick, color: 'link', className: '\n fs-12 fw-500 c-pointer' }, { children: LOGIN_CONSTANTS.RESEND_CTA })) })), countdown > 0 && (jsx(Typography, __assign({ color: 'disabled', variant: 'B3' }, { children: ' Resend (' + countdown + 's)' })))] }))] })) })), !otpErrorMessage && verifiedOtp && (jsx(Fragment, { children: jsxs("div", __assign({ className: 'flex flex-middle' }, { children: [jsx(CheckCircle, {}), jsx(Typography, __assign({ variant: 'P1', color: 'success', className: 'fs-12' }, { children: autoDetecting === AutoDetectState.DETECTED
307
- ? LOGIN_CONSTANTS.AUTO_DETECTED_TEXT
308
- : LOGIN_CONSTANTS.VERIFIED_MESSAGE }))] })) })), jsx(Spacer, { className: 'mt-24' })] })));
309
- };
310
-
311
- var css_248z$1 = ".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}";
312
- 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"};
313
- styleInject(css_248z$1);
314
-
315
- var Loader = function (_a) {
316
- var title = _a.title, message = _a.message, className = _a.className;
317
- return (jsx("div", __assign({ className: "".concat(Styles['utilswrapper'], " utilswrapper") }, { children: jsx("div", __assign({ className: classNames(Styles['loader'], className) }, { children: jsxs("div", __assign({ className: Styles['loader__content'] }, { children: [jsx("div", { className: Styles['loader__spinner'] }), jsx("h5", __assign({ className: Styles['loader__heading'] }, { children: title })), jsx("p", __assign({ className: Styles['loader__text'] }, { children: message }))] })) })) })));
318
- };
319
-
320
- var MobileInput = function (_a) {
321
- 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, currentPageUri = _a.currentPageUri, ravenPayload = _a.ravenPayload, hotelsLoyaltyFlow = _a.hotelsLoyaltyFlow;
322
- var fkSSOEnabled = useState(isFKSSOEnabled)[0];
323
- var _b = useState(false), fkButtonLoading = _b[0], setFkButtonLoading = _b[1];
324
- var inputRef = useRef(null);
325
- var mobileViewRef = useRef(null);
326
- useEffect(function () {
327
- if (mobileViewRef.current) {
328
- var height = mobileViewRef.current.clientHeight;
329
- setMobileInputHeight(height);
330
- }
331
- }, [mobileViewRef.current]);
332
- useEffect(function () {
333
- var timeout;
334
- if (inputRef.current) {
335
- timeout = setTimeout(function () {
336
- var _a;
337
- (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
338
- }, 100);
339
- }
340
- return function () {
341
- clearTimeout(timeout);
342
- };
343
- }, []);
344
- useEffect(function () {
345
- if (isAndroidApp()) {
346
- autoDetectMobileNumber();
347
- }
348
- }, []);
349
- var handleFKSSOClick = useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
350
- var eventProps, redirectUrl;
351
- return __generator(this, function (_a) {
352
- switch (_a.label) {
353
- case 0:
354
- _a.trys.push([0, 2, , 3]);
355
- eventProps = getRavenEventProps();
356
- ravenSDKTrigger('u_login_click', __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));
357
- setFkButtonLoading(true);
358
- return [4, handleFKSSO(fallbackUri, skipProfileFlow
359
- ? currentPageUri
360
- : NAVIGATION_ROUTES.PERSONAL_DETAILS +
361
- '?onboardingFlow=true', currentPageUri)];
362
- case 1:
363
- redirectUrl = _a.sent();
364
- if (!hotelsLoyaltyFlow) {
365
- setFkButtonLoading(false);
366
- }
367
- if (isPwa()) {
368
- window.location.href = redirectUrl;
369
- }
370
- return [3, 3];
371
- case 2:
372
- _a.sent();
373
- setFkButtonLoading(false);
374
- return [3, 3];
375
- case 3: return [2];
376
- }
377
- });
378
- }); }, []);
379
- var handleInputChange = useCallback(function (event, autoDetected) {
380
- if (autoDetected === void 0) { autoDetected = false; }
381
- setErrorCallout('');
382
- var value = event.target.value || '';
383
- value = value.replace(MULTI_SPACE, ' ').trimStart();
384
- setMobileNumber(value);
385
- var validMobileNo = isValidMobileNumber(event.target.value);
386
- if (validMobileNo) {
387
- getOTP(value);
388
- var eventProps = getRavenEventProps();
389
- ravenSDKTrigger('u_login_click', __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));
390
- if (!autoDetected) {
391
- ravenSDKTrigger('u_login_click', __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));
392
- }
393
- else {
394
- ravenSDKTrigger('u_login_click', __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));
395
- }
396
- }
397
- }, [setMobileNumber]);
398
- var autoDetectMobileNumber = useCallback(function () { return __awaiter(void 0, void 0, void 0, function () {
399
- var autoDetectedNumber, simulatedEvent;
400
- return __generator(this, function (_a) {
401
- switch (_a.label) {
402
- case 0: return [4, showMobileNumberHint()];
403
- case 1:
404
- autoDetectedNumber = _a.sent();
405
- simulatedEvent = {
406
- target: {
407
- value: autoDetectedNumber,
408
- },
409
- };
410
- if (autoDetectedNumber) {
411
- handleInputChange(simulatedEvent, true);
412
- }
413
- return [2];
414
- }
415
- });
416
- }); }, [handleInputChange]);
417
- var handlePrivacyPolicyClick = useCallback(function () {
418
- var eventProps = getRavenEventProps();
419
- ravenSDKTrigger('u_login_click', __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));
420
- window.location.href = NAVIGATION_ROUTES.PRIVACY_POLICY;
421
- }, []);
422
- var handleTermsOfUseClick = useCallback(function () {
423
- var eventProps = getRavenEventProps();
424
- ravenSDKTrigger('u_login_click', __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));
425
- window.location.href = NAVIGATION_ROUTES.TERMS;
426
- }, []);
427
- return (jsxs("div", __assign({ className: 'flex flex-column', ref: mobileViewRef }, { children: [errorCallout && (jsx(AlertCallout, { variant: 'error', textNode: errorCallout, prefixIconNode: jsx(InfoIcon, { fill: 'red' }), style: {
428
- color: '#ffff',
429
- backgroundColor: '#db201e',
430
- }, className: 'fs-12' })), jsx(Typography, __assign({ variant: 'HM1', color: 'heading', className: 'mb-4 fs-24' }, { children: LOGIN_CONSTANTS.LOGIN_TO_CT })), jsx("label", __assign({ style: {
431
- visibility: 'hidden',
432
- width: '0.1px',
433
- height: '0.1px',
434
- }, htmlFor: 'phonenumber' }, { children: "Phone number" })), jsx(PhoneField, { onChange: handleInputChange, value: mobileNumber, name: 'phonenumber', placeholder: '', inputMode: 'numeric', ref: inputRef, min: 0, max: 10, autoFocus: true, countryCode: LOGIN_CONSTANTS.COUNTRY_CODE }), jsx(Button, __assign({ color: 'primary', size: 'medium', minWidth: '160px', disabled: ctaDisabled, loading: sendingOtp, className: 'my-6', onClick: function () { return getOTP(mobileNumber); } }, { children: LOGIN_CONSTANTS.GET_OTP })), fkSSOEnabled && (jsxs(Fragment, { children: [jsxs("div", __assign({ className: 'my-6 p-relative' }, { children: [jsx(Divider, {}), jsx("span", __assign({ className: "".concat(styles$1.mobileinput_seperatortext) }, { children: "or" }))] })), jsx(Button, __assign({ variant: 'outline', size: 'medium', className: 'my-6', loading: fkButtonLoading, onClick: handleFKSSOClick, showLeftIcon: !fkButtonLoading, LeftIcon: jsx("img", { src: FlipkartLogo }) }, { children: LOGIN_CONSTANTS.FK_LOGIN_CTA }))] })), jsxs("div", __assign({ className: 'pt-8 pb-6' }, { children: [jsx(Divider, {}), jsxs("div", __assign({ className: 'flex flex-middle \n flex-center flex-wrap pt-2' }, { children: [jsx(Typography, __assign({ variant: 'P1', className: styles$1.footer_text }, { children: LOGIN_CONSTANTS.FOOTER_TEXT })), jsx(Typography, __assign({ variant: 'P1', color: 'link', className: 'pl-1 fs-12', isClickable: true, onClick: handlePrivacyPolicyClick }, { children: LOGIN_CONSTANTS.PRIVACY_CTA })), jsx(Typography, __assign({ className: 'px-1 fs-12 c-neutral-700', variant: 'P1' }, { children: '& ' })), jsx(Typography, __assign({ variant: 'P1', color: 'link', isClickable: true, onClick: handleTermsOfUseClick, className: 'fs-12' }, { children: LOGIN_CONSTANTS.TNC_CTA }))] }))] }))] })));
435
- };
436
-
437
- const imagePlaceHolderURI =
438
- // eslint-disable-next-line max-len
439
- 'data:image/png;base64,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';
440
- const ImageUrls = [{
441
- src: 'https://fastui.cltpstatic.com/image/upload/offermgmt/images/carousel1.png',
442
- placeholder: imagePlaceHolderURI
443
- }, {
444
- src: 'https://fastui.cltpstatic.com/image/upload/offermgmt/images/carousel2.png',
445
- placeholder: imagePlaceHolderURI
446
- }, {
447
- src: 'https://fastui.cltpstatic.com/image/upload/offermgmt/images/carousel3.png',
448
- placeholder: imagePlaceHolderURI
449
- }];
450
-
451
- var ImageWithPlaceholder = function (_a) {
452
- var src = _a.src, placeholderSrc = _a.placeholderSrc, onLoad = _a.onLoad, props = __rest(_a, ["src", "placeholderSrc", "onLoad"]);
453
- var _b = useState(placeholderSrc || src), imgSrc = _b[0], setImgSrc = _b[1];
454
- var onLoadRef = useRef(onLoad);
455
- useEffect(function () {
456
- onLoadRef.current = onLoad;
457
- }, [onLoad]);
458
- useEffect(function () {
459
- var img = new Image();
460
- img.onload = function () {
461
- setImgSrc(src);
462
- if (onLoadRef.current) {
463
- onLoadRef.current();
464
- }
465
- };
466
- img.src = src;
467
- }, [src]);
468
- return jsx("img", __assign({ src: imgSrc }, props));
469
- };
470
-
471
- var css_248z = ".index-module_slides__container__9XVd4{align-items:center;box-sizing:border-box;display:flex;gap:1.5rem;height:197px;justify-content:center;width:100%}.index-module_slides__container--imageContainer__q0RuP{align-self:flex-start;margin-top:2rem;width:128px}";
472
- var styles = {"slides__container":"index-module_slides__container__9XVd4","slides__container--imageContainer":"index-module_slides__container--imageContainer__q0RuP"};
473
- styleInject(css_248z);
474
-
475
- var Slide = function (_a) {
476
- var textData = _a.textData, bgColor = _a.bgColor, imageUrl = _a.imageUrl, altText = _a.altText;
477
- return (jsxs("div", __assign({ className: styles['slides__container'], style: {
478
- backgroundColor: bgColor,
479
- } }, { children: [jsx("div", __assign({ className: styles['slides__container--imageContainer'] }, { children: jsx(ImageWithPlaceholder, { width: 128, height: 128, alt: altText, src: imageUrl }) })), jsx("div", { children: textData === null || textData === void 0 ? void 0 : textData.map(function (item, index) {
480
- return (jsx(Typography, __assign({ variant: TypographyVariant.HM2, style: {
481
- color: item.textColor,
482
- lineHeight: '24px',
483
- } }, { children: item.text }), index));
484
- }) })] })));
485
- };
486
- var getSlides = function () {
487
- return [
488
- jsx(Slide, { bgColor: '#4F8EF0', imageUrl: 'https://fastui.cltpstatic.com/image/upload/f_auto,q_auto,w_128,h_128,dpr_2/offermgmt/images/banner/Login%20Frame.png', altText: 'Dhonicampaign_icon', textData: [
489
- {
490
- text: 'Use code CTMAHI',
491
- textColor: '#fff',
492
- },
493
- {
494
- text: '& get flat 777 off,',
495
- textColor: '#fff',
496
- },
497
- {
498
- text: 'on your first',
499
- textColor: '#032529',
500
- },
501
- {
502
- text: 'flight booking',
503
- textColor: '#032529',
504
- },
505
- ] }, 1),
506
- jsx(Slide, { bgColor: '#FF8D71', imageUrl: 'https://fastui.cltpstatic.com/image/upload/f_auto,w_128,h_128,dpr_2/offermgmt/images/loginSheetMyntra.webp', altText: 'loyality_benefits_icon', textData: [
507
- {
508
- text: 'Loyalty benefits',
509
- textColor: '#fff',
510
- },
511
- {
512
- text: 'and discounts',
513
- textColor: '#fff',
514
- },
515
- {
516
- text: 'for Flipkart and',
517
- textColor: '#331005',
518
- },
519
- {
520
- text: 'Myntra members',
521
- textColor: '#331005',
522
- },
523
- ] }, 2),
524
- jsx(Slide, { bgColor: '#FFC142', imageUrl: 'https://fastui.cltpstatic.com/image/upload/f_auto,w_128,h_128,dpr_2/offermgmt/images/loginSheetCoupon.webp', altText: 'CTLogin_icon', textData: [
525
- {
526
- text: 'Flat 25% off',
527
- textColor: '#fff',
528
- },
529
- {
530
- text: 'on your first',
531
- textColor: '#fff',
532
- },
533
- {
534
- text: 'hotel booking',
535
- textColor: '#fff',
536
- },
537
- {
538
- text: 'Code: CTMAHI',
539
- textColor: '#332504',
540
- },
541
- ] }, 3),
542
- jsx(Slide, { bgColor: '#61C149', imageUrl: 'https://fastui.cltpstatic.com/image/upload/f_auto,w_128,h_128,dpr_2/offermgmt/images/loginSheetWallet.webp', altText: 'EarnAndRedeem_icon', textData: [
543
- {
544
- text: 'Earn and',
545
- textColor: '#fff',
546
- },
547
- {
548
- text: 'redeem up to',
549
- textColor: '#fff',
550
- },
551
- {
552
- text: '650 Flipkart',
553
- textColor: '#13270F',
554
- },
555
- {
556
- text: 'Supercoins',
557
- textColor: '#13270F',
558
- },
559
- ] }, 4),
560
- ];
561
- };
562
-
563
- SwiperCore.use([Autoplay, Navigation, Pagination]);
564
- var CarouselWrapper = function (_a) {
565
- var customSlides = _a.customSlides, carouselImages = _a.carouselImages;
566
- var imageUrls = useMemo(function () {
567
- if (!isEmpty(carouselImages))
568
- return carouselImages;
569
- return ImageUrls;
570
- }, [carouselImages]);
571
- return (jsx("div", __assign({ className: " o-hidden p-relative ".concat(styles$1.slider_carousel_wrapper) }, { children: jsx(Swiper, __assign({ autoplay: true, slidesPerView: 1, navigation: false, loop: true, pagination: { clickable: true }, className: "".concat(styles$1['swiper'], " ").concat(styles$1['swiper-custom-pagination']), lazy: {
572
- loadPrevNextAmount: 1,
573
- } }, { children: carouselImages && carouselImages.length > 0
574
- ? imageUrls === null || imageUrls === void 0 ? void 0 : imageUrls.map(function (item, index) {
575
- return (jsx(SwiperSlide, __assign({ className: styles$1['swiper-slide'] }, { children: jsx(Fragment, { children: index < 1 ? (jsx(ImageWithPlaceholder, { src: item.src, placeholderSrc: item.placeholder, alt: "Slide ".concat(index + 1), rel: 'preload', fetchPriority: 'high' })) : (jsx(ImageWithPlaceholder, { src: item.src, placeholderSrc: item.placeholder, alt: "Slide ".concat(index + 1), loading: 'lazy', className: 'lazy' })) }) }), index));
576
- })
577
- : customSlides && customSlides.length > 0
578
- ? customSlides === null || customSlides === void 0 ? void 0 : customSlides.map(function (item, index) {
579
- return (jsx(SwiperSlide, __assign({ className: styles$1['swiper-slide'] }, { children: item }), index));
580
- })
581
- : getSlides().length &&
582
- getSlides().map(function (item, index) {
583
- return (jsx(SwiperSlide, __assign({ className: styles$1['swiper-slide'] }, { children: item }), index));
584
- }) })) })));
585
- };
586
-
587
- var LoginModule = function (_a) {
588
- var fallbackUri = _a.fallbackUri, isDrawerOpen = _a.isDrawerOpen, skipProfileFlow = _a.skipProfileFlow, _b = _a.showCarousel, showCarousel = _b === void 0 ? true : _b, _c = _a.ravenPayload, ravenPayload = _c === void 0 ? {} : _c, handleLoginClose = _a.handleLoginClose, onAuthSuccess = _a.onAuthSuccess, onAuthFailure = _a.onAuthFailure, customSlides = _a.customSlides, _d = _a.carouselImages, carouselImages = _d === void 0 ? [] : _d, _e = _a.hotelsLoyaltyFlow, hotelsLoyaltyFlow = _e === void 0 ? false : _e, _f = _a.closeOnOutsideClick, closeOnOutsideClick = _f === void 0 ? false : _f, _g = _a.sendUserInsights, sendUserInsights = _g === void 0 ? true : _g;
589
- var _h = useState(true), showMobilePage = _h[0], setShowMobilePage = _h[1];
590
- var _j = useState(true), ctaDisabled = _j[0], setCtaDisabled = _j[1];
591
- var _k = useState(false), sendingOtp = _k[0], setSendingOtp = _k[1];
592
- var _l = useState(isDrawerOpen), showLoginForm = _l[0], setShowLoginForm = _l[1];
593
- var _m = useState(''), mobileNumber = _m[0], setMobileNumber = _m[1];
594
- var _o = useState(0), mobileInputHeight = _o[0], setMobileInputHeight = _o[1];
595
- var _p = useState(false), otpResendDisabled = _p[0], setOtpResendDisabled = _p[1];
596
- var _q = useState(''), errorCallout = _q[0], setErrorCallout = _q[1];
597
- var _r = useState(false), showSuccess = _r[0], setShowSuccess = _r[1];
598
- var _s = useState(false), showSigninLoader = _s[0], setShowSigninLoader = _s[1];
599
- var currentPageUri = useState(function () { return getCurrentPathName(); })[0];
600
- var showSigninLoaderScreen = function () {
601
- setShowSigninLoader(true);
602
- };
603
- useEffect(function () {
604
- if (window) {
605
- window['showSigninLoaderScreen'] = showSigninLoaderScreen;
606
- }
607
- var queryValue = getQueryParam('fkSSOstatus');
608
- var loginMethod = 'FK';
609
- if (queryValue === 'signin') {
610
- if (isAndroidApp()) {
611
- updateNativeAndroidOnSignIn();
612
- }
613
- handleLoginSuccess(loginMethod);
614
- }
615
- if (queryValue === 'signup') {
616
- if (isAndroidApp()) {
617
- updateNativeAndroidOnSignIn();
618
- }
619
- handleLoginSuccess(loginMethod, true);
620
- }
621
- if (queryValue === 'failure') {
622
- handleLoginFailure(loginMethod);
623
- }
624
- }, []);
625
- var getOTP = useCallback(function (mobileNumber) { return __awaiter(void 0, void 0, void 0, function () {
626
- var res, status_1, err_1, message, errorMessage;
627
- return __generator(this, function (_a) {
628
- switch (_a.label) {
629
- case 0:
630
- _a.trys.push([0, 2, , 3]);
631
- setCtaDisabled(false);
632
- setSendingOtp(true);
633
- triggerOTPListener();
634
- return [4, sendLoginOtp(mobileNumber)];
635
- case 1:
636
- res = _a.sent();
637
- status_1 = (res || {}).status;
638
- if (status_1 === 'SUCCESS') {
639
- setShowMobilePage(false);
640
- setSendingOtp(false);
641
- }
642
- return [3, 3];
643
- case 2:
644
- err_1 = _a.sent();
645
- console.error(err_1);
646
- message = (err_1 || {}).message;
647
- setSendingOtp(false);
648
- errorMessage = message && LOGIN_CONSTANTS[message];
649
- if (errorMessage) {
650
- setErrorCallout(String(errorMessage));
651
- }
652
- else {
653
- setErrorCallout(String(LOGIN_CONSTANTS.GENERIC_ERROR_MESSAGE));
654
- }
655
- if (message === 'OTP_SEND_LIMIT_EXCEEDED') {
656
- setOtpResendDisabled(true);
657
- }
658
- return [3, 3];
659
- case 3: return [2];
660
- }
661
- });
662
- }); }, [showMobilePage, setShowMobilePage]);
663
- var handleLoginSuccess = useCallback(function (loginMethod, action) {
664
- var eventProps = getRavenEventProps();
665
- var payload = __assign({ action_name: 'login_successful', login_form: eventProps === null || eventProps === void 0 ? void 0 : eventProps.loginForm, login_type: 'native', login_new: action ? '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);
666
- if (sendUserInsights) {
667
- sendEventWithUserInsights('u_login_success', payload);
668
- }
669
- else {
670
- ravenSDKTrigger('u_login_success', payload);
671
- }
672
- if (hotelsLoyaltyFlow) {
673
- onAuthSuccess(handleDrawerClose);
674
- }
675
- else {
676
- onAuthSuccess();
677
- if (action && !skipProfileFlow) ;
678
- else {
679
- handleDrawerClose();
680
- setShowSuccess(true);
681
- }
682
- }
683
- }, [ravenPayload, skipProfileFlow, hotelsLoyaltyFlow, sendUserInsights]);
684
- var handleLoginFailure = useCallback(function (loginMethod) {
685
- onAuthFailure(loginMethod);
686
- }, []);
687
- var handleDrawerClose = function (evt) {
688
- evt === null || evt === void 0 ? void 0 : evt.stopPropagation();
689
- setShowLoginForm(false);
690
- setMobileNumber('');
691
- setCtaDisabled(true);
692
- var eventProps = getRavenEventProps();
693
- ravenSDKTrigger('u_login_click', __assign({ action_name: 'login_prompt_dismissed', 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));
694
- if (handleLoginClose && typeof handleLoginClose === 'function') {
695
- handleLoginClose();
696
- }
697
- };
698
- useEffect(function () {
699
- if (isDrawerOpen) {
700
- setShowMobilePage(true);
701
- setShowLoginForm(true);
702
- var eventProps = getRavenEventProps();
703
- ravenSDKTrigger('u_login_popup', __assign({ action_name: 'login_prompt_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));
704
- }
705
- else {
706
- setShowLoginForm(false);
707
- }
708
- }, [isDrawerOpen]);
709
- return (jsx(ThemeProvider, { children: jsxs(Fragment, { children: [jsx(Drawer, __assign({ direction: 'bottom', isOpen: showLoginForm, showClose: true, overlay: true, handleClose: handleDrawerClose, onClose: function () { }, closeOnOutsideClick: closeOnOutsideClick }, { children: jsx("div", __assign({ className: "".concat(styles$1['utilswrapper'], " utilswrapper") }, { children: jsxs("div", __assign({ style: {
710
- maxHeight: 'calc(100dvh - 60px)',
711
- overflowY: 'auto',
712
- borderRadius: '16px 16px 0 0',
713
- } }, { children: [showCarousel && (jsx(CarouselWrapper, { customSlides: customSlides, carouselImages: carouselImages })), jsxs("div", __assign({ className: styles$1['login_form'] }, { children: [jsx("div", { children: jsx(Spacer, { className: 'pt-6' }) }), showMobilePage ? (jsx(MobileInput, { device: 'PWA', ctaDisabled: ctaDisabled, sendingOtp: sendingOtp, getOTP: getOTP, mobileNumber: mobileNumber, setMobileNumber: setMobileNumber, setMobileInputHeight: setMobileInputHeight, fallbackUri: fallbackUri, skipProfileFlow: skipProfileFlow, currentPageUri: currentPageUri, setErrorCallout: setErrorCallout, errorCallout: errorCallout, ravenPayload: ravenPayload, hotelsLoyaltyFlow: hotelsLoyaltyFlow })) : (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 }))] }))] })) })) })), showSuccess && (jsx(Toast, { text: 'Logged in successfully!', show: showSuccess, className: "".concat(styles$1.nonUtilsSelector_toast), closeTimeout: 2000 })), showSigninLoader && (jsx(Loader, { title: 'Please wait', message: 'Signing in...', className: 'z-10 bg-white' }))] }) }));
714
- };
715
-
716
- export { LoginModule };
1
+ import{__assign as e,__awaiter as o,__generator as t,__spreadArray as i,__rest as n}from"tslib";import{jsx as r,jsxs as l,Fragment as a}from"react/jsx-runtime";import{useRef as c,useState as d,useEffect as s,useCallback as u,useMemo as _}from"react";import{Toast as m}from"@cleartrip/ct-design-toast";import{Spacer as p}from"@cleartrip/ct-design-spacer";import{Drawer as g}from"@cleartrip/ct-platform-drawer";import{ThemeProvider as f}from"@cleartrip/ct-design-theme";import{LOGIN_CONSTANTS as h,NAVIGATION_ROUTES as v}from"@cleartrip/ct-platform-constants";import{getRavenEventProps as x,ravenSDKTrigger as A,isIOSApp as C,autoReadOtp as b,isEmpty as E,updateNativeOnLogin as N,validateOtp as w,isHTMLInputElement as T,isNumeric as y,isFKSSOEnabled as D,isAndroidApp as I,isPwa as P,handleFKSSO as k,MULTI_SPACE as F,isValidMobileNumber as O,showMobileNumberHint as B,getCurrentPathName as Q,getQueryParam as R,updateNativeAndroidOnSignIn as S,triggerOTPListener as U,sendLoginOtp as G,sendEventWithUserInsights as L}from"@cleartrip/ct-platform-utils";import{FieldV2 as X,PhoneField as z}from"@cleartrip/ct-design-field";import{Spinner as M}from"@cleartrip/ct-design-spinner";import{Typography as V,TypographyVariant as J}from"@cleartrip/ct-design-typography";import{AlertCallout as W}from"@cleartrip/ct-design-alert-callout";import{InfoIcon as Z,Edit as q,CheckCircle as j}from"@cleartrip/ct-design-icons";import H from"classnames";import{Button as K}from"@cleartrip/ct-design-button";import{Divider as Y}from"@cleartrip/ct-design-divider";import{FlipkartLogo as $}from"@cleartrip/ct-platform-assets";import{Swiper as ee,SwiperSlide as oe}from"swiper/react";import te,{Autoplay as ie,Navigation as ne,Pagination as re}from"swiper";function le(e,o){void 0===o&&(o={});var t=o.insertAt;if(e&&"undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],n=document.createElement("style");n.type="text/css","top"===t&&i.firstChild?i.insertBefore(n,i.firstChild):i.appendChild(n),n.styleSheet?n.styleSheet.cssText=e:n.appendChild(document.createTextNode(e))}}var ae={mobileinput_footertext:"index-module_mobileinput_footertext__jPQ-g","mobileinput-seperator":"index-module_mobileinput-seperator__7Ewok",mobileinput_seperatortext:"index-module_mobileinput_seperatortext__-KDOp",slider_carousel_wrapper:"index-module_slider_carousel_wrapper__0SuGB",login_form:"index-module_login_form__tpSDz",nonUtilsSelector_toast:"index-module_nonUtilsSelector_toast__lvWmB",login_otp_error:"index-module_login_otp_error__o3y2L",login_otp_input:"index-module_login_otp_input__L-3P8",footer_text:"index-module_footer_text__nkeJv","swiper-custom-pagination":"index-module_swiper-custom-pagination__Ma1gV",otp_box_wrapper:"index-module_otp_box_wrapper__sM2Ba",otp_container:"index-module_otp_container__1CE4N",swiper:"index-module_swiper__r5-8U","swiper-slide":"index-module_swiper-slide__Zchn0"};le(".index-module_mobileinput_footertext__jPQ-g a{color:#0f6bff;text-decoration:none}.index-module_mobileinput-seperator__7Ewok{position:relative}.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_slider_carousel_wrapper__0SuGB{border-top-left-radius:16px;border-top-right-radius:16px;width:100dvw}.index-module_login_form__tpSDz{background-color:#fff;padding-left:16px;padding-right:16px}.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}.index-module_login_otp_error__o3y2L{padding-top:4px}.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_footer_text__nkeJv{color:grey!important;font-size:12px!important}.index-module_swiper-custom-pagination__Ma1gV{--swiper-theme-color:#fff;--swiper-pagination-color:#fff;--swiper-pagination-bullet-inactive-color:#999;--swiper-pagination-bullet-inactive-opacity:1}.index-module_swiper-custom-pagination__Ma1gV *>span{height:6px;width:6px}.index-module_otp_box_wrapper__sM2Ba{margin-right:8px}.index-module_otp_container__1CE4N{display:flex;flex-direction:column;margin-top:24px}.index-module_swiper__r5-8U{height:100%;width:100%}.index-module_swiper__r5-8U .index-module_swiper-slide__Zchn0{height:auto}.index-module_swiper-slide__Zchn0 img{display:block;height:100%;object-fit:fill;width:100%}");var ce="index-module_loader__container__VX-VO",de="index-module_three-dots-loader__i7R-R";le('.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 se,ue=function(){return r("div",e({className:ce},{children:r("div",{className:de})}))};!function(e){e[e.DETECTING=0]="DETECTING",e[e.FAILED=1]="FAILED",e[e.DETECTED=2]="DETECTED"}(se||(se={}));var _e=function(n){var _=n.mobileNumber,m=n.errorCallout,g=n.ravenPayload,f=n.otpInputHeight,D=n.skipProfileFlow,I=n.otpResendDisabled,P=n.hotelsLoyaltyFlow,k=n.getOTP,F=n.setCtaDisabled,O=n.setErrorCallout,B=n.setMobileNumber,Q=n.setShowMobilePage,R=n.handleLoginSuccess,S=n.handleLoginFailure,U=c(Array(4).fill(null)),G=d(se.DETECTING),L=G[0],z=G[1],J=d(h.OTP_COUNTDOWN),H=J[0],K=J[1],Y=d(""),$=Y[0],ee=Y[1],oe=d(!0),te=oe[0],ie=oe[1],ne=d(!1),re=ne[0],le=ne[1],ce=d(""),de=ce[0],_e=ce[1],me=d(!0),pe=me[0],ge=me[1],fe=d(!1),he=fe[0],ve=fe[1],xe=c(),Ae=c(),Ce="CT";s((function(){be();var o=x();A("u_login_click",e({action_name:"login_otp_screen_opened",login_form:null==o?void 0:o.loginForm,login_type:"native",vertical:null==o?void 0:o.vertical,page_name:null==o?void 0:o.pageName},g))}),[]),s((function(){C()&&ge(!1)}),[]),s((function(){be()}),[]),s((function(){he||(U.current[0].focus(),U.current[0].click())}),[he]),s((function(){0===H&&ie(!1)}),[H]),s((function(){var e;return te&&H>0&&(e=setInterval((function(){K((function(e){return e-1}))}),1e3)),function(){clearInterval(e)}}),[te,H]);var be=u((function(){return o(void 0,void 0,void 0,(function(){var e;return t(this,(function(o){switch(o.label){case 0:return o.trys.push([0,2,,3]),[4,b()];case 1:return e=o.sent(),ee(e),z(se.DETECTED),(null==e?void 0:e.length)===h.OTP_LENGTH&&Ne&&Ne(e,!0),[3,3];case 2:return"NOT_SUPPORTED"===o.sent()&&ge(!1),[3,3];case 3:return[2]}}))}))}),[pe]),Ee=u((function(o){var t=x();A("u_login_error",e({action_name:"otp_incorrect",login_form:null==t?void 0:t.loginForm,login_type:"native",vertical:null==t?void 0:t.vertical,page_name:null==t?void 0:t.pageName},g));var i=null==o?void 0:o.message;"OTP_VALIDATE_LIMIT_EXCEEDED"!==i&&ee(""),U.current[0].focus(),U.current[0].click();var n=h[i],r="string"==typeof n?n:h.INVALID_OTP;_e(r)}),[U]),Ne=u((function(i,n){return o(void 0,void 0,void 0,(function(){var o,r,l,a,c;return t(this,(function(t){switch(t.label){case 0:return t.trys.push([0,2,,3]),o=x(),A("u_login_click",e({action_name:"otp_entered",login_form:null==o?void 0:o.loginForm,login_type:"native",entry_type:n?"autodetected":"manual_entry",vertical:null==o?void 0:o.vertical,page_name:null==o?void 0:o.pageName},g)),i===xe.current&&Ae.current&&Ae.current-Date.now()<=100?[2]:(xe.current=i,Ae.current=Date.now(),P&&ve(!0),[4,w(_,i)]);case 1:return r=t.sent(),l=r.status,a=r.action,200!==Number(l)||E(a)?(P&&ve(!1),S(Ce)):(le(!0),_e(""),N(),"SIGNUP"===a?(D||(window.location.href=v.PERSONAL_DETAILS+"?onboardingFlow=true"),R(Ce,!0)):R(Ce)),[3,3];case 2:return c=t.sent(),P&&ve(!1),S(Ce),Ee(c),[3,3];case 3:return[2]}}))}))}),[xe,Ae,le,z,_e,Ee]),we=function(){return o(void 0,void 0,void 0,(function(){var e,o,i,n,r;return t(this,(function(t){switch(t.label){case 0:return[4,navigator.clipboard.readText()];case 1:return(e=t.sent())&&y(e)&&(o=e.slice(0,h.OTP_LENGTH).split(""),null===(n=U.current[h.OTP_LENGTH-1])||void 0===n||n.focus(),null===(r=U.current[h.OTP_LENGTH-1])||void 0===r||r.click(),i=o.join(""),ee(i),i.length===h.OTP_LENGTH&&Ne(i,!1)),[2]}}))}))},Te=u((function(e,o){var t,i;O(""),""!==e.target.value&&o<U.current.length-1&&(null===(t=U.current[o+1])||void 0===t||t.focus(),null===(i=U.current[o+1])||void 0===i||i.click());var n=U.current.map((function(e){return T(e)?e.value:""})).join("").slice(0,4);ee(n),n.length===h.OTP_LENGTH&&Ne(n,!1)}),[ee,Ne]),ye=u((function(e,o){var t,i,n;"Backspace"===e.key&&o>0&&""===(null===(t=U.current[o])||void 0===t?void 0:t.value)&&(e.preventDefault(),null===(i=U.current[o-1])||void 0===i||i.focus(),null===(n=U.current[o-1])||void 0===n||n.click())}),[U]),De=u((function(){K(h.OTP_COUNTDOWN),ie(!0),k(_);var o=x();A("u_login_error",e({action_name:"resend_otp_clicked",login_form:null==o?void 0:o.loginForm,login_type:"native",vertical:null==o?void 0:o.vertical,page_name:null==o?void 0:o.pageName},g))}),[K,ie]),Ie=u((function(){F(!0),Q(!0),B("")}),[Q]);return l("div",e({className:"flex flex-column bg-neutral-100",style:{height:f}},{children:[m&&r(W,{variant:"error",textNode:m,prefixIconNode:r(Z,{fill:"red"}),style:{color:"#ffff",backgroundColor:"#db201e"},className:"fs-12"}),l("div",e({className:"flex flex-bottom"},{children:[l(V,e({variant:"HM1",color:"heading"},{children:[h.OTP_TEXT," ",r("br",{}),_]})),r("div",e({className:"pl-2",onClick:Ie},{children:r(q,{})}))]})),l("div",e({className:ae.otp_container},{children:[l("div",e({className:"flex",style:P?{width:"max-content",position:"relative"}:{}},{children:[i([],Array(h.OTP_LENGTH),!0).map((function(o,t){return r("div",e({className:ae.otp_box_wrapper},{children:r(X,{prompt:{hasError:!!de},type:"number",placeholder:"",value:$[t],max:1,inputMode:"numeric",className:ae.login_otp_input,variant:"md",ref:function(e){e&&(U.current[t]=e)},onKeyDown:function(e){return ye(e,t)},onChange:function(e){return Te(e,t)},onPaste:we,autoFocus:0===t,disabled:!(!P||!he)})}),t)})),P&&he&&r(ue,{})]})),!!de&&r(V,e({variant:"P1",color:"warning",className:ae.login_otp_error},{children:de}))]})),r(p,{className:"pt-2"}),L===se.DETECTING&&!re&&pe&&H>h.RESEND_OTP_COUNTDOWN&&l("div",e({className:"flex flex-middle"},{children:[r(M,{width:"20px",height:"20px",borderColor:"#11a670",className:"bg-neutral-900 bc-black"}),r(V,e({variant:"B3",className:"fs-12 fw-500 ml-1 c-neutral-700"},{children:h.AUTO_DETECTING_TEXT}))]})),L===se.DETECTING&&H<=h.RESEND_OTP_COUNTDOWN&&pe&&!re&&r(a,{children:l("div",e({className:"flex"},{children:[r(V,e({variant:"B3",className:"fs-12 fw-500 c-neutral-700 "},{children:h.OTP_RESEND_TEXT})),r(p,{className:"ml-1"}),I?r(V,e({className:"color-neutral-200 fw-500",variant:"B3"},{children:h.RESEND_CTA})):l(a,{children:[0===H&&r(a,{children:r(V,e({isClickable:!0,variant:"B3",onClick:De,color:"link",className:"\n fs-12 fw-500 c-pointer"},{children:h.RESEND_CTA}))}),H>0&&r(V,e({color:"disabled",variant:"B3"},{children:" Resend ("+H+"s)"}))]})]}))}),!de&&re&&r(a,{children:l("div",e({className:"flex flex-middle"},{children:[r(j,{}),r(V,e({variant:"P1",color:"success",className:"fs-12"},{children:L===se.DETECTED?h.AUTO_DETECTED_TEXT:h.VERIFIED_MESSAGE}))]}))}),r(p,{className:"mt-24"})]}))},me={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"};le(".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 pe=function(o){var t=o.title,i=o.message,n=o.className;return r("div",e({className:"".concat(me.utilswrapper," utilswrapper")},{children:r("div",e({className:H(me.loader,n)},{children:l("div",e({className:me.loader__content},{children:[r("div",{className:me.loader__spinner}),r("h5",e({className:me.loader__heading},{children:t})),r("p",e({className:me.loader__text},{children:i}))]}))}))}))},ge=function(i){var n=i.sendingOtp,_=i.ctaDisabled,m=i.getOTP,p=i.setErrorCallout,g=i.errorCallout,f=i.mobileNumber,C=i.setMobileInputHeight,b=i.setMobileNumber,E=i.fallbackUri,N=i.skipProfileFlow,w=i.currentPageUri,T=i.ravenPayload,y=i.hotelsLoyaltyFlow,Q=d(D)[0],R=d(!1),S=R[0],U=R[1],G=c(null),L=c(null);s((function(){if(L.current){var e=L.current.clientHeight;C(e)}}),[L.current]),s((function(){var e;return G.current&&(e=setTimeout((function(){var e;null===(e=G.current)||void 0===e||e.focus()}),100)),function(){clearTimeout(e)}}),[]),s((function(){I()&&J()}),[]);var X=u((function(){return o(void 0,void 0,void 0,(function(){var o,i;return t(this,(function(t){switch(t.label){case 0:return t.trys.push([0,2,,3]),o=x(),A("u_login_click",e({action_name:"login_with_flipkart_clicked",login_form:null==o?void 0:o.loginForm,login_type:"fk_sso",vertical:null==o?void 0:o.vertical,page_name:null==o?void 0:o.pageName},T)),U(!0),[4,k(E,N?w:v.PERSONAL_DETAILS+"?onboardingFlow=true",w)];case 1:return i=t.sent(),y||U(!1),P()&&(window.location.href=i),[3,3];case 2:return t.sent(),U(!1),[3,3];case 3:return[2]}}))}))}),[]),M=u((function(o,t){void 0===t&&(t=!1),p("");var i=o.target.value||"";if(i=i.replace(F," ").trimStart(),b(i),O(o.target.value)){m(i);var n=x();A("u_login_click",e({action_name:"get_otp_clicked",login_form:null==n?void 0:n.loginForm,login_type:"native",entry_type:"auto_click",vertical:null==n?void 0:n.vertical,page_name:null==n?void 0:n.pageName},T)),A("u_login_click",e(t?{action_name:"phone_number_autodetected",login_form:null==n?void 0:n.loginForm,login_type:"native",entry_type:"autodetected",vertical:null==n?void 0:n.vertical,page_name:null==n?void 0:n.pageName}:{action_name:"phone_number_entered",login_form:null==n?void 0:n.loginForm,login_type:"native",entry_type:"manual_entry",vertical:null==n?void 0:n.vertical,page_name:null==n?void 0:n.pageName},T))}}),[b]),J=u((function(){return o(void 0,void 0,void 0,(function(){var e,o;return t(this,(function(t){switch(t.label){case 0:return[4,B()];case 1:return e=t.sent(),o={target:{value:e}},e&&M(o,!0),[2]}}))}))}),[M]),q=u((function(){var o=x();A("u_login_click",e({action_name:"policy_click",login_form:null==o?void 0:o.loginForm,login_type:"native",vertical:null==o?void 0:o.vertical,page_name:null==o?void 0:o.pageName},T)),window.location.href=v.PRIVACY_POLICY}),[]),j=u((function(){var o=x();A("u_login_click",e({action_name:"tnc_click",login_form:null==o?void 0:o.loginForm,login_type:"native",vertical:null==o?void 0:o.vertical,page_name:null==o?void 0:o.pageName},T)),window.location.href=v.TERMS}),[]);return l("div",e({className:"flex flex-column",ref:L},{children:[g&&r(W,{variant:"error",textNode:g,prefixIconNode:r(Z,{fill:"red"}),style:{color:"#ffff",backgroundColor:"#db201e"},className:"fs-12"}),r(V,e({variant:"HM1",color:"heading",className:"mb-4 fs-24"},{children:h.LOGIN_TO_CT})),r("label",e({style:{visibility:"hidden",width:"0.1px",height:"0.1px"},htmlFor:"phonenumber"},{children:"Phone number"})),r(z,{onChange:M,value:f,name:"phonenumber",placeholder:"",inputMode:"numeric",ref:G,min:0,max:10,autoFocus:!0,countryCode:h.COUNTRY_CODE}),r(K,e({color:"primary",size:"medium",minWidth:"160px",disabled:_,loading:n,className:"my-6",onClick:function(){return m(f)}},{children:h.GET_OTP})),Q&&l(a,{children:[l("div",e({className:"my-6 p-relative"},{children:[r(Y,{}),r("span",e({className:"".concat(ae.mobileinput_seperatortext)},{children:"or"}))]})),r(K,e({variant:"outline",size:"medium",className:"my-6",loading:S,onClick:X,showLeftIcon:!S,LeftIcon:r("img",{src:$})},{children:h.FK_LOGIN_CTA}))]}),l("div",e({className:"pt-8 pb-6"},{children:[r(Y,{}),l("div",e({className:"flex flex-middle \n flex-center flex-wrap pt-2"},{children:[r(V,e({variant:"P1",className:ae.footer_text},{children:h.FOOTER_TEXT})),r(V,e({variant:"P1",color:"link",className:"pl-1 fs-12",isClickable:!0,onClick:q},{children:h.PRIVACY_CTA})),r(V,e({className:"px-1 fs-12 c-neutral-700",variant:"P1"},{children:"& "})),r(V,e({variant:"P1",color:"link",isClickable:!0,onClick:j,className:"fs-12"},{children:h.TNC_CTA}))]}))]}))]}))};const fe="data:image/png;base64,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",he=[{src:"https://fastui.cltpstatic.com/image/upload/offermgmt/images/carousel1.png",placeholder:fe},{src:"https://fastui.cltpstatic.com/image/upload/offermgmt/images/carousel2.png",placeholder:fe},{src:"https://fastui.cltpstatic.com/image/upload/offermgmt/images/carousel3.png",placeholder:fe}];var ve=function(o){var t=o.src,i=o.placeholderSrc,l=o.onLoad,a=n(o,["src","placeholderSrc","onLoad"]),u=d(i||t),_=u[0],m=u[1],p=c(l);return s((function(){p.current=l}),[l]),s((function(){var e=new Image;e.onload=function(){m(t),p.current&&p.current()},e.src=t}),[t]),r("img",e({src:_},a))},xe="index-module_slides__container__9XVd4",Ae="index-module_slides__container--imageContainer__q0RuP";le(".index-module_slides__container__9XVd4{align-items:center;box-sizing:border-box;display:flex;gap:1.5rem;height:197px;justify-content:center;width:100%}.index-module_slides__container--imageContainer__q0RuP{align-self:flex-start;margin-top:2rem;width:128px}");var Ce=function(o){var t=o.textData,i=o.bgColor,n=o.imageUrl,a=o.altText;return l("div",e({className:xe,style:{backgroundColor:i}},{children:[r("div",e({className:Ae},{children:r(ve,{width:128,height:128,alt:a,src:n})})),r("div",{children:null==t?void 0:t.map((function(o,t){return r(V,e({variant:J.HM2,style:{color:o.textColor,lineHeight:"24px"}},{children:o.text}),t)}))})]}))},be=function(){return[r(Ce,{bgColor:"#4F8EF0",imageUrl:"https://fastui.cltpstatic.com/image/upload/f_auto,q_auto,w_128,h_128,dpr_2/offermgmt/images/banner/Login%20Frame.png",altText:"Dhonicampaign_icon",textData:[{text:"Use code CTMAHI",textColor:"#fff"},{text:"& get flat 777 off,",textColor:"#fff"},{text:"on your first",textColor:"#032529"},{text:"flight booking",textColor:"#032529"}]},1),r(Ce,{bgColor:"#FF8D71",imageUrl:"https://fastui.cltpstatic.com/image/upload/f_auto,w_128,h_128,dpr_2/offermgmt/images/loginSheetMyntra.webp",altText:"loyality_benefits_icon",textData:[{text:"Loyalty benefits",textColor:"#fff"},{text:"and discounts",textColor:"#fff"},{text:"for Flipkart and",textColor:"#331005"},{text:"Myntra members",textColor:"#331005"}]},2),r(Ce,{bgColor:"#FFC142",imageUrl:"https://fastui.cltpstatic.com/image/upload/f_auto,w_128,h_128,dpr_2/offermgmt/images/loginSheetCoupon.webp",altText:"CTLogin_icon",textData:[{text:"Flat 25% off",textColor:"#fff"},{text:"on your first",textColor:"#fff"},{text:"hotel booking",textColor:"#fff"},{text:"Code: CTMAHI",textColor:"#332504"}]},3),r(Ce,{bgColor:"#61C149",imageUrl:"https://fastui.cltpstatic.com/image/upload/f_auto,w_128,h_128,dpr_2/offermgmt/images/loginSheetWallet.webp",altText:"EarnAndRedeem_icon",textData:[{text:"Earn and",textColor:"#fff"},{text:"redeem up to",textColor:"#fff"},{text:"650 Flipkart",textColor:"#13270F"},{text:"Supercoins",textColor:"#13270F"}]},4)]};te.use([ie,ne,re]);var Ee=function(o){var t=o.customSlides,i=o.carouselImages,n=_((function(){return E(i)?he:i}),[i]);return r("div",e({className:" o-hidden p-relative ".concat(ae.slider_carousel_wrapper)},{children:r(ee,e({autoplay:!0,slidesPerView:1,navigation:!1,loop:!0,pagination:{clickable:!0},className:"".concat(ae.swiper," ").concat(ae["swiper-custom-pagination"]),lazy:{loadPrevNextAmount:1}},{children:i&&i.length>0?null==n?void 0:n.map((function(o,t){return r(oe,e({className:ae["swiper-slide"]},{children:r(a,{children:r(ve,t<1?{src:o.src,placeholderSrc:o.placeholder,alt:"Slide ".concat(t+1),rel:"preload",fetchPriority:"high"}:{src:o.src,placeholderSrc:o.placeholder,alt:"Slide ".concat(t+1),loading:"lazy",className:"lazy"})})}),t)})):t&&t.length>0?null==t?void 0:t.map((function(o,t){return r(oe,e({className:ae["swiper-slide"]},{children:o}),t)})):be().length&&be().map((function(o,t){return r(oe,e({className:ae["swiper-slide"]},{children:o}),t)}))}))}))},Ne=function(i){var n=i.fallbackUri,c=i.isDrawerOpen,_=i.skipProfileFlow,v=i.showCarousel,C=void 0===v||v,b=i.ravenPayload,E=void 0===b?{}:b,N=i.handleLoginClose,w=i.onAuthSuccess,T=i.onAuthFailure,y=i.customSlides,D=i.carouselImages,P=void 0===D?[]:D,k=i.hotelsLoyaltyFlow,F=void 0!==k&&k,O=i.closeOnOutsideClick,B=void 0!==O&&O,X=i.sendUserInsights,z=void 0===X||X,M=d(!0),V=M[0],J=M[1],W=d(!0),Z=W[0],q=W[1],j=d(!1),H=j[0],K=j[1],Y=d(c),$=Y[0],ee=Y[1],oe=d(""),te=oe[0],ie=oe[1],ne=d(0),re=ne[0],le=ne[1],ce=d(!1),de=ce[0],se=ce[1],ue=d(""),me=ue[0],fe=ue[1],he=d(!1),ve=he[0],xe=he[1],Ae=d(!1),Ce=Ae[0],be=Ae[1],Ne=d((function(){return Q()}))[0],we=function(){be(!0)};s((function(){window&&(window.showSigninLoaderScreen=we);var e=R("fkSSOstatus"),o="FK";"signin"===e&&(I()&&S(),ye(o)),"signup"===e&&(I()&&S(),ye(o,!0)),"failure"===e&&De(o)}),[]);var Te=u((function(e){return o(void 0,void 0,void 0,(function(){var o,i,n,r;return t(this,(function(t){switch(t.label){case 0:return t.trys.push([0,2,,3]),q(!1),K(!0),U(),[4,G(e)];case 1:return o=t.sent(),"SUCCESS"===(o||{}).status&&(J(!1),K(!1)),[3,3];case 2:return i=t.sent(),console.error(i),n=(i||{}).message,K(!1),r=n&&h[n],fe(String(r||h.GENERIC_ERROR_MESSAGE)),"OTP_SEND_LIMIT_EXCEEDED"===n&&se(!0),[3,3];case 3:return[2]}}))}))}),[V,J]),ye=u((function(o,t){var i=x(),n=e({action_name:"login_successful",login_form:null==i?void 0:i.loginForm,login_type:"native",login_new:t?"sign_up":"sign_in",vertical:null==i?void 0:i.vertical,page_name:null==i?void 0:i.pageName},E);z?L("u_login_success",n):A("u_login_success",n),F?w(Ie):(w(),t&&!_||(Ie(),xe(!0)))}),[E,_,F,z]),De=u((function(e){T(e)}),[]),Ie=function(o){null==o||o.stopPropagation(),ee(!1),ie(""),q(!0);var t=x();A("u_login_click",e({action_name:"login_prompt_dismissed",login_form:null==t?void 0:t.loginForm,login_type:"native",vertical:null==t?void 0:t.vertical,page_name:null==t?void 0:t.pageName},E)),N&&"function"==typeof N&&N()};return s((function(){if(c){J(!0),ee(!0);var o=x();A("u_login_popup",e({action_name:"login_prompt_opened",login_form:null==o?void 0:o.loginForm,login_type:"native",vertical:null==o?void 0:o.vertical,page_name:null==o?void 0:o.pageName},E))}else ee(!1)}),[c]),r(f,{children:l(a,{children:[r(g,e({direction:"bottom",isOpen:$,showClose:!0,overlay:!0,handleClose:Ie,onClose:function(){},closeOnOutsideClick:B},{children:r("div",e({className:"".concat(ae.utilswrapper," utilswrapper")},{children:l("div",e({style:{maxHeight:"calc(100dvh - 60px)",overflowY:"auto",borderRadius:"16px 16px 0 0"}},{children:[C&&r(Ee,{customSlides:y,carouselImages:P}),l("div",e({className:ae.login_form},{children:[r("div",{children:r(p,{className:"pt-6"})}),V?r(ge,{device:"PWA",ctaDisabled:Z,sendingOtp:H,getOTP:Te,mobileNumber:te,setMobileNumber:ie,setMobileInputHeight:le,fallbackUri:n,skipProfileFlow:_,currentPageUri:Ne,setErrorCallout:fe,errorCallout:me,ravenPayload:E,hotelsLoyaltyFlow:F}):r(_e,{mobileNumber:te,getOTP:Te,setCtaDisabled:q,setShowMobilePage:J,handleLoginSuccess:ye,handleLoginFailure:De,otpInputHeight:re,setMobileNumber:ie,setErrorCallout:fe,errorCallout:me,otpResendDisabled:de,ravenPayload:E,skipProfileFlow:_,hotelsLoyaltyFlow:F})]}))]}))}))})),ve&&r(m,{text:"Logged in successfully!",show:ve,className:"".concat(ae.nonUtilsSelector_toast),closeTimeout:2e3}),Ce&&r(pe,{title:"Please wait",message:"Signing in...",className:"z-10 bg-white"})]})})};export{Ne as LoginModule};
717
2
  //# sourceMappingURL=ct-platform-login-module.esm.js.map