@thetechfossil/auth2 1.2.1

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.
package/dist/index.mjs ADDED
@@ -0,0 +1,1844 @@
1
+ import axios from 'axios';
2
+ import { useState, useCallback, useEffect } from 'react';
3
+ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
4
+
5
+ var __defProp = Object.defineProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var HttpClient = class {
11
+ constructor(baseUrl, defaultHeaders = {}) {
12
+ this.csrfToken = null;
13
+ this.axiosInstance = axios.create({
14
+ baseURL: baseUrl.replace(/\/$/, ""),
15
+ headers: {
16
+ "Content-Type": "application/json",
17
+ ...defaultHeaders
18
+ },
19
+ withCredentials: true,
20
+ // Include cookies for CSRF
21
+ timeout: 3e4
22
+ // 30 second timeout
23
+ });
24
+ this.axiosInstance.interceptors.request.use(
25
+ (config) => {
26
+ if (this.csrfToken && ["post", "put", "delete", "patch"].includes(config.method?.toLowerCase() || "")) {
27
+ config.headers["x-csrf-token"] = this.csrfToken;
28
+ }
29
+ return config;
30
+ },
31
+ (error) => Promise.reject(error)
32
+ );
33
+ this.axiosInstance.interceptors.response.use(
34
+ (response) => response,
35
+ async (error) => {
36
+ const originalRequest = error.config;
37
+ if (error.response?.status === 403 && !originalRequest._retry) {
38
+ originalRequest._retry = true;
39
+ try {
40
+ await this.refreshCsrfToken();
41
+ if (originalRequest.headers) {
42
+ originalRequest.headers["x-csrf-token"] = this.csrfToken;
43
+ }
44
+ return this.axiosInstance(originalRequest);
45
+ } catch (refreshError) {
46
+ return Promise.reject(refreshError);
47
+ }
48
+ }
49
+ return Promise.reject(error);
50
+ }
51
+ );
52
+ }
53
+ async get(endpoint, headers) {
54
+ const response = await this.axiosInstance.get(endpoint, { headers });
55
+ return response.data;
56
+ }
57
+ async post(endpoint, data, headers) {
58
+ const response = await this.axiosInstance.post(endpoint, data, { headers });
59
+ return response.data;
60
+ }
61
+ async put(endpoint, data, headers) {
62
+ const response = await this.axiosInstance.put(endpoint, data, { headers });
63
+ return response.data;
64
+ }
65
+ async delete(endpoint, headers) {
66
+ const response = await this.axiosInstance.delete(endpoint, { headers });
67
+ return response.data;
68
+ }
69
+ setAuthToken(token) {
70
+ this.axiosInstance.defaults.headers.common["Authorization"] = `Bearer ${token}`;
71
+ }
72
+ removeAuthToken() {
73
+ delete this.axiosInstance.defaults.headers.common["Authorization"];
74
+ }
75
+ setCsrfToken(token) {
76
+ this.csrfToken = token;
77
+ }
78
+ getCsrfToken() {
79
+ return this.csrfToken;
80
+ }
81
+ removeCsrfToken() {
82
+ this.csrfToken = null;
83
+ }
84
+ async refreshCsrfToken() {
85
+ try {
86
+ const response = await this.axiosInstance.get("/api/v1/auth/csrf-token");
87
+ this.csrfToken = response.data.csrfToken;
88
+ } catch (error) {
89
+ console.error("Failed to refresh CSRF token:", error);
90
+ throw error;
91
+ }
92
+ }
93
+ };
94
+
95
+ // src/core/auth-service.ts
96
+ var AuthService = class {
97
+ constructor(config) {
98
+ this.token = null;
99
+ this.config = {
100
+ localStorageKey: "auth_token",
101
+ csrfEnabled: true,
102
+ ...config
103
+ };
104
+ this.httpClient = new HttpClient(this.config.baseUrl);
105
+ this.loadTokenFromStorage();
106
+ if (this.config.csrfEnabled && typeof window !== "undefined") {
107
+ this.refreshCsrfToken();
108
+ }
109
+ }
110
+ loadTokenFromStorage() {
111
+ if (typeof window !== "undefined" && this.config.localStorageKey) {
112
+ try {
113
+ const token = localStorage.getItem(this.config.localStorageKey);
114
+ if (token) {
115
+ this.token = token;
116
+ this.httpClient.setAuthToken(token);
117
+ }
118
+ } catch (error) {
119
+ console.warn("Failed to load token from storage:", error);
120
+ }
121
+ }
122
+ }
123
+ saveTokenToStorage(token) {
124
+ if (typeof window !== "undefined" && this.config.localStorageKey) {
125
+ try {
126
+ localStorage.setItem(this.config.localStorageKey, token);
127
+ } catch (error) {
128
+ console.warn("Failed to save token to storage:", error);
129
+ }
130
+ }
131
+ }
132
+ removeTokenFromStorage() {
133
+ if (typeof window !== "undefined" && this.config.localStorageKey) {
134
+ try {
135
+ localStorage.removeItem(this.config.localStorageKey);
136
+ } catch (error) {
137
+ console.warn("Failed to remove token from storage:", error);
138
+ }
139
+ }
140
+ }
141
+ isAuthenticated() {
142
+ return !!this.token;
143
+ }
144
+ getToken() {
145
+ return this.token;
146
+ }
147
+ getCurrentUser() {
148
+ if (!this.token)
149
+ return null;
150
+ try {
151
+ const payload = JSON.parse(atob(this.token.split(".")[1]));
152
+ return payload.user || null;
153
+ } catch (error) {
154
+ console.error("Failed to parse user from token:", error);
155
+ return null;
156
+ }
157
+ }
158
+ // CSRF Token Management
159
+ async refreshCsrfToken() {
160
+ if (!this.config.csrfEnabled)
161
+ return;
162
+ try {
163
+ const response = await this.httpClient.get("/api/v1/auth/csrf-token");
164
+ if (response.csrfToken) {
165
+ this.httpClient.setCsrfToken(response.csrfToken);
166
+ }
167
+ } catch (error) {
168
+ console.error("Failed to get CSRF token:", error);
169
+ }
170
+ }
171
+ getCsrfToken() {
172
+ return this.httpClient.getCsrfToken();
173
+ }
174
+ // OAuth Methods
175
+ loginWithOAuth(provider) {
176
+ if (typeof window === "undefined") {
177
+ throw new Error("OAuth login is only available in browser environments");
178
+ }
179
+ const oauthUrl = `${this.config.baseUrl}/api/v1/auth/oauth/${provider}`;
180
+ window.location.href = oauthUrl;
181
+ }
182
+ linkOAuthProvider(provider) {
183
+ if (typeof window === "undefined") {
184
+ throw new Error("OAuth linking is only available in browser environments");
185
+ }
186
+ if (!this.token) {
187
+ throw new Error("Must be authenticated to link OAuth provider");
188
+ }
189
+ const linkUrl = `${this.config.baseUrl}/api/v1/auth/oauth/${provider}/link`;
190
+ window.location.href = linkUrl;
191
+ }
192
+ async unlinkOAuthProvider(provider) {
193
+ if (!this.token) {
194
+ throw new Error("Not authenticated");
195
+ }
196
+ const response = await this.httpClient.delete(
197
+ `/api/v1/auth/oauth/${provider}/unlink`
198
+ );
199
+ return response;
200
+ }
201
+ // Standard Auth Methods
202
+ async login(data) {
203
+ const response = await this.httpClient.post("/api/v1/auth/login", data);
204
+ if (response.success && response.token) {
205
+ this.token = response.token;
206
+ this.httpClient.setAuthToken(response.token);
207
+ this.saveTokenToStorage(response.token);
208
+ return response;
209
+ }
210
+ if (response.success && response.message === "OTP sent to your email.") {
211
+ return response;
212
+ }
213
+ if (response.success && response.message === "OTP verified successfully." && response.token) {
214
+ this.token = response.token;
215
+ this.httpClient.setAuthToken(response.token);
216
+ this.saveTokenToStorage(response.token);
217
+ return response;
218
+ }
219
+ throw new Error(response.message || "Login failed");
220
+ }
221
+ async register(data) {
222
+ const registerData = { ...data };
223
+ if (!registerData.frontendBaseUrl && typeof window !== "undefined") {
224
+ registerData.frontendBaseUrl = process.env.FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_APP_URL || window.location.origin;
225
+ }
226
+ const response = await this.httpClient.post("/api/v1/auth/register", registerData);
227
+ if (response.success && response.message === "Registration data saved. Verification email sent. Please check your inbox.") {
228
+ return response;
229
+ }
230
+ throw new Error(response.message || "Registration failed");
231
+ }
232
+ async verify(data) {
233
+ const response = await this.httpClient.post("/api/v1/auth/verify", data);
234
+ if (response.success && response.token) {
235
+ this.token = response.token;
236
+ this.httpClient.setAuthToken(response.token);
237
+ this.saveTokenToStorage(response.token);
238
+ }
239
+ return response;
240
+ }
241
+ async verifyEmailToken(token) {
242
+ const response = await this.httpClient.get(`/api/v1/auth/verify-email?token=${token}`);
243
+ if (response.success && response.token) {
244
+ this.token = response.token;
245
+ this.httpClient.setAuthToken(response.token);
246
+ this.saveTokenToStorage(response.token);
247
+ }
248
+ return response;
249
+ }
250
+ async logout() {
251
+ this.token = null;
252
+ this.httpClient.removeAuthToken();
253
+ this.httpClient.removeCsrfToken();
254
+ this.removeTokenFromStorage();
255
+ }
256
+ async getProfile() {
257
+ if (!this.token) {
258
+ throw new Error("Not authenticated");
259
+ }
260
+ const response = await this.httpClient.get("/api/v1/user/me");
261
+ return response.user;
262
+ }
263
+ async updateProfile(data) {
264
+ if (!this.token) {
265
+ throw new Error("Not authenticated");
266
+ }
267
+ const response = await this.httpClient.post("/api/v1/user/update/user", data);
268
+ if (response.success && response.token) {
269
+ this.token = response.token;
270
+ this.httpClient.setAuthToken(response.token);
271
+ this.saveTokenToStorage(response.token);
272
+ }
273
+ return response;
274
+ }
275
+ async getAllUsers() {
276
+ if (!this.token) {
277
+ throw new Error("Not authenticated");
278
+ }
279
+ const response = await this.httpClient.get("/api/v1/user/all");
280
+ return response.users;
281
+ }
282
+ async getUserById(id) {
283
+ const response = await this.httpClient.get(`/api/v1/user/${id}`);
284
+ return response.user;
285
+ }
286
+ async forgotPassword(email) {
287
+ if (typeof window !== "undefined") {
288
+ process.env.FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_APP_URL || window.location.origin;
289
+ }
290
+ const response = await this.httpClient.post("/api/v1/auth/forgot-password", { email });
291
+ return response;
292
+ }
293
+ async resetPassword(token, password) {
294
+ const response = await this.httpClient.post("/api/v1/auth/reset-password", { token, password });
295
+ return response;
296
+ }
297
+ };
298
+
299
+ // src/react/index.ts
300
+ var react_exports = {};
301
+ __export(react_exports, {
302
+ AuthFlow: () => AuthFlow,
303
+ EmailVerificationPage: () => EmailVerificationPage,
304
+ LoginForm: () => LoginForm,
305
+ OtpForm: () => OtpForm,
306
+ RegisterForm: () => RegisterForm,
307
+ useAuth: () => useAuth
308
+ });
309
+ var useAuth = (config) => {
310
+ const [authService] = useState(() => new AuthService(config));
311
+ const [user, setUser] = useState(null);
312
+ const [isAuthenticated, setIsAuthenticated] = useState(false);
313
+ const [loading, setLoading] = useState(true);
314
+ const checkAuthStatus = useCallback(() => {
315
+ const authenticated = authService.isAuthenticated();
316
+ setIsAuthenticated(authenticated);
317
+ if (authenticated) {
318
+ const currentUser = authService.getCurrentUser();
319
+ setUser(currentUser);
320
+ } else {
321
+ setUser(null);
322
+ }
323
+ setLoading(false);
324
+ }, [authService]);
325
+ useEffect(() => {
326
+ checkAuthStatus();
327
+ }, [checkAuthStatus]);
328
+ const register = useCallback(async (data) => {
329
+ setLoading(true);
330
+ try {
331
+ const registerData = { ...data };
332
+ if (!registerData.frontendBaseUrl && typeof window !== "undefined") {
333
+ registerData.frontendBaseUrl = process.env.REACT_APP_FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_APP_URL || window.location.origin;
334
+ }
335
+ const response = await authService.register(registerData);
336
+ return response;
337
+ } finally {
338
+ setLoading(false);
339
+ }
340
+ }, [authService]);
341
+ const login = useCallback(async (data) => {
342
+ setLoading(true);
343
+ try {
344
+ const response = await authService.login(data);
345
+ if (response.success && response.user) {
346
+ setUser(response.user);
347
+ setIsAuthenticated(true);
348
+ }
349
+ return response;
350
+ } finally {
351
+ setLoading(false);
352
+ }
353
+ }, [authService]);
354
+ const verify = useCallback(async (data) => {
355
+ setLoading(true);
356
+ try {
357
+ const response = await authService.verify(data);
358
+ if (response.success && response.user) {
359
+ setUser(response.user);
360
+ setIsAuthenticated(true);
361
+ }
362
+ return response;
363
+ } finally {
364
+ setLoading(false);
365
+ }
366
+ }, [authService]);
367
+ const verifyEmailToken = useCallback(async (token) => {
368
+ setLoading(true);
369
+ try {
370
+ const response = await authService.verifyEmailToken(token);
371
+ if (response.success && response.user) {
372
+ setUser(response.user);
373
+ setIsAuthenticated(true);
374
+ }
375
+ return response;
376
+ } finally {
377
+ setLoading(false);
378
+ }
379
+ }, [authService]);
380
+ const logout = useCallback(async () => {
381
+ setLoading(true);
382
+ try {
383
+ await authService.logout();
384
+ setUser(null);
385
+ setIsAuthenticated(false);
386
+ } finally {
387
+ setLoading(false);
388
+ }
389
+ }, [authService]);
390
+ const updateProfile = useCallback(async (data) => {
391
+ setLoading(true);
392
+ try {
393
+ const response = await authService.updateProfile(data);
394
+ if (response.success && response.user) {
395
+ setUser(response.user);
396
+ }
397
+ return response;
398
+ } finally {
399
+ setLoading(false);
400
+ }
401
+ }, [authService]);
402
+ const getProfile = useCallback(async () => {
403
+ setLoading(true);
404
+ try {
405
+ const userData = await authService.getProfile();
406
+ setUser(userData);
407
+ return userData;
408
+ } finally {
409
+ setLoading(false);
410
+ }
411
+ }, [authService]);
412
+ const getAllUsers = useCallback(async () => {
413
+ setLoading(true);
414
+ try {
415
+ return await authService.getAllUsers();
416
+ } finally {
417
+ setLoading(false);
418
+ }
419
+ }, [authService]);
420
+ const getUserById = useCallback(async (id) => {
421
+ setLoading(true);
422
+ try {
423
+ return await authService.getUserById(id);
424
+ } finally {
425
+ setLoading(false);
426
+ }
427
+ }, [authService]);
428
+ return {
429
+ user,
430
+ isAuthenticated,
431
+ loading,
432
+ register,
433
+ login,
434
+ verify,
435
+ verifyEmailToken,
436
+ logout,
437
+ updateProfile,
438
+ getProfile,
439
+ getAllUsers,
440
+ getUserById
441
+ };
442
+ };
443
+ var LoginForm = ({
444
+ onSuccess,
445
+ onLoginSuccess,
446
+ onRegisterClick,
447
+ showRegisterLink = true,
448
+ config,
449
+ oauthProviders = ["google", "github"],
450
+ showOAuthButtons = true
451
+ }) => {
452
+ const [email, setEmail] = useState("");
453
+ const [password, setPassword] = useState("");
454
+ const [usePassword, setUsePassword] = useState(false);
455
+ const [showPassword, setShowPassword] = useState(false);
456
+ const [isLoading, setIsLoading] = useState(false);
457
+ const [error, setError] = useState(null);
458
+ const [rememberMe, setRememberMe] = useState(false);
459
+ const { login } = useAuth({
460
+ baseUrl: config?.baseUrl || (typeof window !== "undefined" ? window.location.origin : "http://localhost:7000")
461
+ });
462
+ const handleSubmit = async (e) => {
463
+ e.preventDefault();
464
+ setIsLoading(true);
465
+ setError(null);
466
+ try {
467
+ let response;
468
+ if (usePassword) {
469
+ response = await login({ email, password });
470
+ } else {
471
+ response = await login({ email });
472
+ }
473
+ if (response.success) {
474
+ onSuccess?.(response);
475
+ if (onLoginSuccess) {
476
+ if (response.message === "OTP sent to your email.") {
477
+ onLoginSuccess(email, true);
478
+ } else if (response.token) {
479
+ onLoginSuccess(email, false);
480
+ } else {
481
+ onLoginSuccess(email, true);
482
+ }
483
+ }
484
+ } else {
485
+ setError(response.message || "Login failed");
486
+ }
487
+ } catch (err) {
488
+ setError(err instanceof Error ? err.message : "An unknown error occurred");
489
+ } finally {
490
+ setIsLoading(false);
491
+ }
492
+ };
493
+ const toggleAuthMethod = () => {
494
+ setUsePassword(!usePassword);
495
+ setError(null);
496
+ };
497
+ const togglePasswordVisibility = () => {
498
+ setShowPassword(!showPassword);
499
+ };
500
+ return /* @__PURE__ */ jsx("div", { style: {
501
+ maxWidth: "400px",
502
+ margin: "0 auto",
503
+ padding: "30px",
504
+ borderRadius: "12px",
505
+ boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
506
+ backgroundColor: "#ffffff",
507
+ border: "1px solid #eaeaea"
508
+ }, children: /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, style: {
509
+ display: "flex",
510
+ flexDirection: "column"
511
+ }, children: [
512
+ /* @__PURE__ */ jsx("h2", { style: {
513
+ textAlign: "center",
514
+ marginBottom: "24px",
515
+ color: "#1f2937",
516
+ fontSize: "24px",
517
+ fontWeight: 600
518
+ }, children: usePassword ? "Login with Password" : "Login with OTP" }),
519
+ error && /* @__PURE__ */ jsx("div", { style: {
520
+ padding: "12px 16px",
521
+ marginBottom: "20px",
522
+ backgroundColor: "#f8d7da",
523
+ color: "#721c24",
524
+ border: "1px solid #f5c6cb",
525
+ borderRadius: "8px",
526
+ fontSize: "14px",
527
+ fontWeight: 500
528
+ }, children: error }),
529
+ /* @__PURE__ */ jsxs("div", { style: {
530
+ marginBottom: "20px"
531
+ }, children: [
532
+ /* @__PURE__ */ jsx("label", { htmlFor: "email", style: {
533
+ display: "block",
534
+ marginBottom: "8px",
535
+ fontWeight: 500,
536
+ color: "#374151",
537
+ fontSize: "14px"
538
+ }, children: "Email:" }),
539
+ /* @__PURE__ */ jsx(
540
+ "input",
541
+ {
542
+ id: "email",
543
+ type: "email",
544
+ value: email,
545
+ onChange: (e) => setEmail(e.target.value),
546
+ required: true,
547
+ disabled: isLoading,
548
+ style: {
549
+ width: "100%",
550
+ padding: "12px 16px",
551
+ border: "1px solid #ddd",
552
+ borderRadius: "8px",
553
+ fontSize: "16px",
554
+ boxSizing: "border-box",
555
+ color: "#111827",
556
+ transition: "all 0.2s ease",
557
+ backgroundColor: "#ffffff"
558
+ },
559
+ placeholder: "Enter your email"
560
+ }
561
+ )
562
+ ] }),
563
+ usePassword && /* @__PURE__ */ jsxs("div", { style: {
564
+ marginBottom: "20px",
565
+ position: "relative"
566
+ }, children: [
567
+ /* @__PURE__ */ jsx("label", { htmlFor: "login-password", style: {
568
+ display: "block",
569
+ marginBottom: "8px",
570
+ fontWeight: 500,
571
+ color: "#555",
572
+ fontSize: "14px"
573
+ }, children: "Password:" }),
574
+ /* @__PURE__ */ jsx(
575
+ "input",
576
+ {
577
+ id: "login-password",
578
+ type: showPassword ? "text" : "password",
579
+ value: password,
580
+ onChange: (e) => setPassword(e.target.value),
581
+ required: true,
582
+ disabled: isLoading,
583
+ style: {
584
+ width: "100%",
585
+ padding: "12px 16px",
586
+ border: "1px solid #ddd",
587
+ borderRadius: "8px",
588
+ fontSize: "16px",
589
+ boxSizing: "border-box",
590
+ color: "#333",
591
+ transition: "all 0.2s ease",
592
+ backgroundColor: "#fafafa"
593
+ },
594
+ placeholder: "Enter your password"
595
+ }
596
+ ),
597
+ /* @__PURE__ */ jsx(
598
+ "button",
599
+ {
600
+ type: "button",
601
+ onClick: togglePasswordVisibility,
602
+ disabled: isLoading,
603
+ style: {
604
+ position: "absolute",
605
+ right: "12px",
606
+ top: "38px",
607
+ background: "none",
608
+ border: "none",
609
+ cursor: "pointer",
610
+ color: "#666",
611
+ fontSize: "14px"
612
+ },
613
+ children: showPassword ? "Hide" : "Show"
614
+ }
615
+ )
616
+ ] }),
617
+ usePassword && /* @__PURE__ */ jsxs("div", { style: {
618
+ display: "flex",
619
+ alignItems: "center",
620
+ marginBottom: "16px",
621
+ marginTop: "8px"
622
+ }, children: [
623
+ /* @__PURE__ */ jsx(
624
+ "input",
625
+ {
626
+ type: "checkbox",
627
+ id: "remember-me",
628
+ checked: rememberMe,
629
+ onChange: (e) => setRememberMe(e.target.checked),
630
+ disabled: isLoading,
631
+ style: {
632
+ marginRight: "8px",
633
+ cursor: "pointer",
634
+ width: "16px",
635
+ height: "16px"
636
+ }
637
+ }
638
+ ),
639
+ /* @__PURE__ */ jsx(
640
+ "label",
641
+ {
642
+ htmlFor: "remember-me",
643
+ style: {
644
+ fontSize: "14px",
645
+ color: "#666",
646
+ cursor: "pointer",
647
+ userSelect: "none"
648
+ },
649
+ children: "Remember me"
650
+ }
651
+ )
652
+ ] }),
653
+ /* @__PURE__ */ jsx(
654
+ "button",
655
+ {
656
+ type: "submit",
657
+ disabled: isLoading,
658
+ style: {
659
+ padding: "14px",
660
+ backgroundColor: "#007bff",
661
+ color: "white",
662
+ border: "none",
663
+ borderRadius: "8px",
664
+ fontSize: "16px",
665
+ fontWeight: 600,
666
+ cursor: "pointer",
667
+ transition: "all 0.2s ease",
668
+ marginTop: "8px"
669
+ },
670
+ children: isLoading ? usePassword ? "Logging in..." : "Sending OTP..." : usePassword ? "Login" : "Send OTP"
671
+ }
672
+ ),
673
+ /* @__PURE__ */ jsx("div", { style: {
674
+ textAlign: "center",
675
+ marginTop: "20px",
676
+ paddingTop: "20px",
677
+ borderTop: "1px solid #eee"
678
+ }, children: /* @__PURE__ */ jsx(
679
+ "button",
680
+ {
681
+ type: "button",
682
+ onClick: toggleAuthMethod,
683
+ disabled: isLoading,
684
+ style: {
685
+ background: "none",
686
+ border: "none",
687
+ color: "#007bff",
688
+ textDecoration: "none",
689
+ cursor: "pointer",
690
+ fontSize: "14px",
691
+ fontWeight: 600,
692
+ padding: "0",
693
+ transition: "color 0.2s ease"
694
+ },
695
+ children: usePassword ? "Login with OTP instead" : "Login with password instead"
696
+ }
697
+ ) }),
698
+ showOAuthButtons && oauthProviders.length > 0 && /* @__PURE__ */ jsxs("div", { style: {
699
+ marginTop: "20px",
700
+ paddingTop: "20px",
701
+ borderTop: "1px solid #eee"
702
+ }, children: [
703
+ /* @__PURE__ */ jsxs("div", { style: {
704
+ position: "relative",
705
+ marginBottom: "16px"
706
+ }, children: [
707
+ /* @__PURE__ */ jsx("div", { style: {
708
+ position: "absolute",
709
+ top: "50%",
710
+ left: 0,
711
+ right: 0,
712
+ height: "1px",
713
+ backgroundColor: "#eee"
714
+ } }),
715
+ /* @__PURE__ */ jsx("div", { style: {
716
+ position: "relative",
717
+ textAlign: "center"
718
+ }, children: /* @__PURE__ */ jsx("span", { style: {
719
+ backgroundColor: "#ffffff",
720
+ padding: "0 12px",
721
+ color: "#666",
722
+ fontSize: "14px"
723
+ }, children: "Or continue with" }) })
724
+ ] }),
725
+ /* @__PURE__ */ jsxs("div", { style: {
726
+ display: "grid",
727
+ gridTemplateColumns: oauthProviders.length === 1 ? "1fr" : "repeat(2, 1fr)",
728
+ gap: "12px"
729
+ }, children: [
730
+ oauthProviders.includes("google") && /* @__PURE__ */ jsxs(
731
+ "a",
732
+ {
733
+ href: `${config?.baseUrl || "http://localhost:7000"}/api/v1/auth/oauth/google`,
734
+ style: {
735
+ display: "flex",
736
+ alignItems: "center",
737
+ justifyContent: "center",
738
+ gap: "8px",
739
+ padding: "10px 16px",
740
+ backgroundColor: "#ffffff",
741
+ border: "1px solid #ddd",
742
+ borderRadius: "8px",
743
+ color: "#333",
744
+ textDecoration: "none",
745
+ fontSize: "14px",
746
+ fontWeight: 500,
747
+ cursor: "pointer",
748
+ transition: "all 0.2s ease"
749
+ },
750
+ onMouseEnter: (e) => {
751
+ e.currentTarget.style.backgroundColor = "#f8f8f8";
752
+ e.currentTarget.style.borderColor = "#007bff";
753
+ },
754
+ onMouseLeave: (e) => {
755
+ e.currentTarget.style.backgroundColor = "#ffffff";
756
+ e.currentTarget.style.borderColor = "#ddd";
757
+ },
758
+ children: [
759
+ /* @__PURE__ */ jsxs("svg", { style: { width: "18px", height: "18px" }, viewBox: "0 0 24 24", children: [
760
+ /* @__PURE__ */ jsx(
761
+ "path",
762
+ {
763
+ fill: "#4285F4",
764
+ d: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
765
+ }
766
+ ),
767
+ /* @__PURE__ */ jsx(
768
+ "path",
769
+ {
770
+ fill: "#34A853",
771
+ d: "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
772
+ }
773
+ ),
774
+ /* @__PURE__ */ jsx(
775
+ "path",
776
+ {
777
+ fill: "#FBBC05",
778
+ d: "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"
779
+ }
780
+ ),
781
+ /* @__PURE__ */ jsx(
782
+ "path",
783
+ {
784
+ fill: "#EA4335",
785
+ d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
786
+ }
787
+ )
788
+ ] }),
789
+ "Google"
790
+ ]
791
+ }
792
+ ),
793
+ oauthProviders.includes("github") && /* @__PURE__ */ jsxs(
794
+ "a",
795
+ {
796
+ href: `${config?.baseUrl || "http://localhost:7000"}/api/v1/auth/oauth/github`,
797
+ style: {
798
+ display: "flex",
799
+ alignItems: "center",
800
+ justifyContent: "center",
801
+ gap: "8px",
802
+ padding: "10px 16px",
803
+ backgroundColor: "#24292e",
804
+ border: "1px solid #24292e",
805
+ borderRadius: "8px",
806
+ color: "#ffffff",
807
+ textDecoration: "none",
808
+ fontSize: "14px",
809
+ fontWeight: 500,
810
+ cursor: "pointer",
811
+ transition: "all 0.2s ease"
812
+ },
813
+ onMouseEnter: (e) => {
814
+ e.currentTarget.style.backgroundColor = "#1b1f23";
815
+ e.currentTarget.style.borderColor = "#1b1f23";
816
+ },
817
+ onMouseLeave: (e) => {
818
+ e.currentTarget.style.backgroundColor = "#24292e";
819
+ e.currentTarget.style.borderColor = "#24292e";
820
+ },
821
+ children: [
822
+ /* @__PURE__ */ jsx("svg", { style: { width: "18px", height: "18px" }, fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { d: "M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" }) }),
823
+ "GitHub"
824
+ ]
825
+ }
826
+ )
827
+ ] })
828
+ ] }),
829
+ showRegisterLink && /* @__PURE__ */ jsx("div", { style: {
830
+ textAlign: "center",
831
+ marginTop: "20px",
832
+ paddingTop: "20px",
833
+ borderTop: "1px solid #eee"
834
+ }, children: /* @__PURE__ */ jsxs("p", { style: {
835
+ color: "#666",
836
+ fontSize: "14px"
837
+ }, children: [
838
+ "Don't have an account?",
839
+ " ",
840
+ /* @__PURE__ */ jsx(
841
+ "button",
842
+ {
843
+ type: "button",
844
+ onClick: onRegisterClick,
845
+ disabled: isLoading,
846
+ style: {
847
+ background: "none",
848
+ border: "none",
849
+ color: "#007bff",
850
+ textDecoration: "none",
851
+ cursor: "pointer",
852
+ fontSize: "14px",
853
+ fontWeight: 600,
854
+ padding: "0",
855
+ transition: "color 0.2s ease"
856
+ },
857
+ children: "Register"
858
+ }
859
+ )
860
+ ] }) })
861
+ ] }) });
862
+ };
863
+ var RegisterForm = ({
864
+ onRegisterSuccess,
865
+ onLoginClick,
866
+ showLoginLink = true,
867
+ authConfig,
868
+ oauthProviders = ["google", "github"],
869
+ showOAuthButtons = true
870
+ }) => {
871
+ const [name, setName] = useState("");
872
+ const [email, setEmail] = useState("");
873
+ const [password, setPassword] = useState("");
874
+ const [confirmPassword, setConfirmPassword] = useState("");
875
+ const [isLoading, setIsLoading] = useState(false);
876
+ const [error, setError] = useState(null);
877
+ useState(false);
878
+ useState(false);
879
+ const getPasswordStrength = (pwd) => {
880
+ if (!pwd)
881
+ return { strength: "weak", score: 0, label: "" };
882
+ let score = 0;
883
+ if (pwd.length >= 6)
884
+ score++;
885
+ if (pwd.length >= 8)
886
+ score++;
887
+ if (/[a-z]/.test(pwd) && /[A-Z]/.test(pwd))
888
+ score++;
889
+ if (/\d/.test(pwd))
890
+ score++;
891
+ if (/[^a-zA-Z\d]/.test(pwd))
892
+ score++;
893
+ if (score <= 2)
894
+ return { strength: "weak", score, label: "Weak" };
895
+ if (score <= 3)
896
+ return { strength: "medium", score, label: "Medium" };
897
+ return { strength: "strong", score, label: "Strong" };
898
+ };
899
+ getPasswordStrength(password);
900
+ const config = authConfig || {
901
+ baseUrl: typeof window !== "undefined" ? process.env.NEXT_PUBLIC_AUTH_API_URL || window.location.origin : "http://localhost:7000"
902
+ };
903
+ const { register } = useAuth(config);
904
+ const handleSubmit = async (e) => {
905
+ e.preventDefault();
906
+ setIsLoading(true);
907
+ setError(null);
908
+ if (password !== confirmPassword) {
909
+ setError("Passwords do not match");
910
+ setIsLoading(false);
911
+ return;
912
+ }
913
+ if (password.length < 6) {
914
+ setError("Password must be at least 6 characters long");
915
+ setIsLoading(false);
916
+ return;
917
+ }
918
+ try {
919
+ const registerData = {
920
+ name,
921
+ email,
922
+ password,
923
+ frontendBaseUrl: typeof window !== "undefined" ? process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL || window.location.origin : void 0
924
+ };
925
+ const response = await register(registerData);
926
+ if (response.success) {
927
+ onRegisterSuccess?.();
928
+ } else {
929
+ setError(response.message || "Registration failed");
930
+ }
931
+ } catch (err) {
932
+ setError(err instanceof Error ? err.message : "An unknown error occurred");
933
+ } finally {
934
+ setIsLoading(false);
935
+ }
936
+ };
937
+ return /* @__PURE__ */ jsx("div", { style: {
938
+ maxWidth: "400px",
939
+ margin: "0 auto",
940
+ padding: "30px",
941
+ borderRadius: "12px",
942
+ boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
943
+ backgroundColor: "#ffffff",
944
+ border: "1px solid #eaeaea"
945
+ }, children: /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, style: {
946
+ display: "flex",
947
+ flexDirection: "column"
948
+ }, children: [
949
+ /* @__PURE__ */ jsx("h2", { style: {
950
+ textAlign: "center",
951
+ marginBottom: "24px",
952
+ color: "#1f2937",
953
+ fontSize: "24px",
954
+ fontWeight: 600
955
+ }, children: "Register" }),
956
+ error && /* @__PURE__ */ jsx("div", { style: {
957
+ padding: "12px 16px",
958
+ marginBottom: "20px",
959
+ backgroundColor: "#f8d7da",
960
+ color: "#721c24",
961
+ border: "1px solid #f5c6cb",
962
+ borderRadius: "8px",
963
+ fontSize: "14px",
964
+ fontWeight: 500
965
+ }, children: error }),
966
+ /* @__PURE__ */ jsxs("div", { style: {
967
+ marginBottom: "20px"
968
+ }, children: [
969
+ /* @__PURE__ */ jsx("label", { htmlFor: "name", style: {
970
+ display: "block",
971
+ marginBottom: "8px",
972
+ fontWeight: 500,
973
+ color: "#374151",
974
+ fontSize: "14px"
975
+ }, children: "Name:" }),
976
+ /* @__PURE__ */ jsx(
977
+ "input",
978
+ {
979
+ id: "name",
980
+ type: "text",
981
+ value: name,
982
+ onChange: (e) => setName(e.target.value),
983
+ required: true,
984
+ disabled: isLoading,
985
+ style: {
986
+ width: "100%",
987
+ padding: "12px 16px",
988
+ border: "1px solid #ddd",
989
+ borderRadius: "8px",
990
+ fontSize: "16px",
991
+ boxSizing: "border-box",
992
+ color: "#111827",
993
+ transition: "all 0.2s ease",
994
+ backgroundColor: "#ffffff"
995
+ },
996
+ placeholder: "Enter your name"
997
+ }
998
+ )
999
+ ] }),
1000
+ /* @__PURE__ */ jsxs("div", { style: {
1001
+ marginBottom: "20px"
1002
+ }, children: [
1003
+ /* @__PURE__ */ jsx("label", { htmlFor: "register-email", style: {
1004
+ display: "block",
1005
+ marginBottom: "8px",
1006
+ fontWeight: 500,
1007
+ color: "#555",
1008
+ fontSize: "14px"
1009
+ }, children: "Email:" }),
1010
+ /* @__PURE__ */ jsx(
1011
+ "input",
1012
+ {
1013
+ id: "register-email",
1014
+ type: "email",
1015
+ value: email,
1016
+ onChange: (e) => setEmail(e.target.value),
1017
+ required: true,
1018
+ disabled: isLoading,
1019
+ style: {
1020
+ width: "100%",
1021
+ padding: "12px 16px",
1022
+ border: "1px solid #ddd",
1023
+ borderRadius: "8px",
1024
+ fontSize: "16px",
1025
+ boxSizing: "border-box",
1026
+ color: "#333",
1027
+ transition: "all 0.2s ease",
1028
+ backgroundColor: "#fafafa"
1029
+ },
1030
+ placeholder: "Enter your email"
1031
+ }
1032
+ )
1033
+ ] }),
1034
+ /* @__PURE__ */ jsxs("div", { style: {
1035
+ marginBottom: "20px"
1036
+ }, children: [
1037
+ /* @__PURE__ */ jsx("label", { htmlFor: "password", style: {
1038
+ display: "block",
1039
+ marginBottom: "8px",
1040
+ fontWeight: 500,
1041
+ color: "#555",
1042
+ fontSize: "14px"
1043
+ }, children: "Password:" }),
1044
+ /* @__PURE__ */ jsx(
1045
+ "input",
1046
+ {
1047
+ id: "password",
1048
+ type: "password",
1049
+ value: password,
1050
+ onChange: (e) => setPassword(e.target.value),
1051
+ required: true,
1052
+ disabled: isLoading,
1053
+ style: {
1054
+ width: "100%",
1055
+ padding: "12px 16px",
1056
+ border: "1px solid #ddd",
1057
+ borderRadius: "8px",
1058
+ fontSize: "16px",
1059
+ boxSizing: "border-box",
1060
+ color: "#333",
1061
+ transition: "all 0.2s ease",
1062
+ backgroundColor: "#fafafa"
1063
+ },
1064
+ placeholder: "Enter your password",
1065
+ minLength: 6
1066
+ }
1067
+ )
1068
+ ] }),
1069
+ /* @__PURE__ */ jsxs("div", { style: {
1070
+ marginBottom: "20px"
1071
+ }, children: [
1072
+ /* @__PURE__ */ jsx("label", { htmlFor: "confirm-password", style: {
1073
+ display: "block",
1074
+ marginBottom: "8px",
1075
+ fontWeight: 500,
1076
+ color: "#555",
1077
+ fontSize: "14px"
1078
+ }, children: "Confirm Password:" }),
1079
+ /* @__PURE__ */ jsx(
1080
+ "input",
1081
+ {
1082
+ id: "confirm-password",
1083
+ type: "password",
1084
+ value: confirmPassword,
1085
+ onChange: (e) => setConfirmPassword(e.target.value),
1086
+ required: true,
1087
+ disabled: isLoading,
1088
+ style: {
1089
+ width: "100%",
1090
+ padding: "12px 16px",
1091
+ border: "1px solid #ddd",
1092
+ borderRadius: "8px",
1093
+ fontSize: "16px",
1094
+ boxSizing: "border-box",
1095
+ color: "#333",
1096
+ transition: "all 0.2s ease",
1097
+ backgroundColor: "#fafafa"
1098
+ },
1099
+ placeholder: "Confirm your password"
1100
+ }
1101
+ )
1102
+ ] }),
1103
+ /* @__PURE__ */ jsx(
1104
+ "button",
1105
+ {
1106
+ type: "submit",
1107
+ disabled: isLoading,
1108
+ style: {
1109
+ padding: "14px",
1110
+ backgroundColor: "#007bff",
1111
+ color: "white",
1112
+ border: "none",
1113
+ borderRadius: "8px",
1114
+ fontSize: "16px",
1115
+ fontWeight: 600,
1116
+ cursor: "pointer",
1117
+ transition: "all 0.2s ease",
1118
+ marginTop: "8px"
1119
+ },
1120
+ children: isLoading ? "Registering..." : "Register"
1121
+ }
1122
+ ),
1123
+ showOAuthButtons && oauthProviders.length > 0 && /* @__PURE__ */ jsxs("div", { style: {
1124
+ marginTop: "20px",
1125
+ paddingTop: "20px",
1126
+ borderTop: "1px solid #eee"
1127
+ }, children: [
1128
+ /* @__PURE__ */ jsxs("div", { style: {
1129
+ position: "relative",
1130
+ marginBottom: "16px"
1131
+ }, children: [
1132
+ /* @__PURE__ */ jsx("div", { style: {
1133
+ position: "absolute",
1134
+ top: "50%",
1135
+ left: 0,
1136
+ right: 0,
1137
+ height: "1px",
1138
+ backgroundColor: "#eee"
1139
+ } }),
1140
+ /* @__PURE__ */ jsx("div", { style: {
1141
+ position: "relative",
1142
+ textAlign: "center"
1143
+ }, children: /* @__PURE__ */ jsx("span", { style: {
1144
+ backgroundColor: "#ffffff",
1145
+ padding: "0 12px",
1146
+ color: "#666",
1147
+ fontSize: "14px"
1148
+ }, children: "Or continue with" }) })
1149
+ ] }),
1150
+ /* @__PURE__ */ jsxs("div", { style: {
1151
+ display: "grid",
1152
+ gridTemplateColumns: oauthProviders.length === 1 ? "1fr" : "repeat(2, 1fr)",
1153
+ gap: "12px"
1154
+ }, children: [
1155
+ oauthProviders.includes("google") && /* @__PURE__ */ jsxs(
1156
+ "a",
1157
+ {
1158
+ href: `${config.baseUrl}/api/v1/auth/oauth/google`,
1159
+ style: {
1160
+ display: "flex",
1161
+ alignItems: "center",
1162
+ justifyContent: "center",
1163
+ gap: "8px",
1164
+ padding: "10px 16px",
1165
+ backgroundColor: "#ffffff",
1166
+ border: "1px solid #ddd",
1167
+ borderRadius: "8px",
1168
+ color: "#333",
1169
+ textDecoration: "none",
1170
+ fontSize: "14px",
1171
+ fontWeight: 500,
1172
+ cursor: "pointer",
1173
+ transition: "all 0.2s ease"
1174
+ },
1175
+ onMouseEnter: (e) => {
1176
+ e.currentTarget.style.backgroundColor = "#f8f8f8";
1177
+ e.currentTarget.style.borderColor = "#007bff";
1178
+ },
1179
+ onMouseLeave: (e) => {
1180
+ e.currentTarget.style.backgroundColor = "#ffffff";
1181
+ e.currentTarget.style.borderColor = "#ddd";
1182
+ },
1183
+ children: [
1184
+ /* @__PURE__ */ jsxs("svg", { style: { width: "18px", height: "18px" }, viewBox: "0 0 24 24", children: [
1185
+ /* @__PURE__ */ jsx(
1186
+ "path",
1187
+ {
1188
+ fill: "#4285F4",
1189
+ d: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
1190
+ }
1191
+ ),
1192
+ /* @__PURE__ */ jsx(
1193
+ "path",
1194
+ {
1195
+ fill: "#34A853",
1196
+ d: "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
1197
+ }
1198
+ ),
1199
+ /* @__PURE__ */ jsx(
1200
+ "path",
1201
+ {
1202
+ fill: "#FBBC05",
1203
+ d: "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"
1204
+ }
1205
+ ),
1206
+ /* @__PURE__ */ jsx(
1207
+ "path",
1208
+ {
1209
+ fill: "#EA4335",
1210
+ d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
1211
+ }
1212
+ )
1213
+ ] }),
1214
+ "Google"
1215
+ ]
1216
+ }
1217
+ ),
1218
+ oauthProviders.includes("github") && /* @__PURE__ */ jsxs(
1219
+ "a",
1220
+ {
1221
+ href: `${config.baseUrl}/api/v1/auth/oauth/github`,
1222
+ style: {
1223
+ display: "flex",
1224
+ alignItems: "center",
1225
+ justifyContent: "center",
1226
+ gap: "8px",
1227
+ padding: "10px 16px",
1228
+ backgroundColor: "#24292e",
1229
+ border: "1px solid #24292e",
1230
+ borderRadius: "8px",
1231
+ color: "#ffffff",
1232
+ textDecoration: "none",
1233
+ fontSize: "14px",
1234
+ fontWeight: 500,
1235
+ cursor: "pointer",
1236
+ transition: "all 0.2s ease"
1237
+ },
1238
+ onMouseEnter: (e) => {
1239
+ e.currentTarget.style.backgroundColor = "#1b1f23";
1240
+ e.currentTarget.style.borderColor = "#1b1f23";
1241
+ },
1242
+ onMouseLeave: (e) => {
1243
+ e.currentTarget.style.backgroundColor = "#24292e";
1244
+ e.currentTarget.style.borderColor = "#24292e";
1245
+ },
1246
+ children: [
1247
+ /* @__PURE__ */ jsx("svg", { style: { width: "18px", height: "18px" }, fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { d: "M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" }) }),
1248
+ "GitHub"
1249
+ ]
1250
+ }
1251
+ )
1252
+ ] })
1253
+ ] }),
1254
+ showLoginLink && /* @__PURE__ */ jsx("div", { style: {
1255
+ textAlign: "center",
1256
+ marginTop: "20px",
1257
+ paddingTop: "20px",
1258
+ borderTop: "1px solid #eee"
1259
+ }, children: /* @__PURE__ */ jsxs("p", { style: {
1260
+ color: "#666",
1261
+ fontSize: "14px"
1262
+ }, children: [
1263
+ "Already have an account?",
1264
+ " ",
1265
+ /* @__PURE__ */ jsx(
1266
+ "button",
1267
+ {
1268
+ type: "button",
1269
+ onClick: onLoginClick,
1270
+ disabled: isLoading,
1271
+ style: {
1272
+ background: "none",
1273
+ border: "none",
1274
+ color: "#007bff",
1275
+ textDecoration: "none",
1276
+ cursor: "pointer",
1277
+ fontSize: "14px",
1278
+ fontWeight: 600,
1279
+ padding: "0",
1280
+ transition: "color 0.2s ease"
1281
+ },
1282
+ children: "Login"
1283
+ }
1284
+ )
1285
+ ] }) })
1286
+ ] }) });
1287
+ };
1288
+ var OtpForm = ({
1289
+ email,
1290
+ onVerifySuccess,
1291
+ onBackToLogin
1292
+ }) => {
1293
+ const [otp, setOtp] = useState("");
1294
+ const [isLoading, setIsLoading] = useState(false);
1295
+ const [error, setError] = useState(null);
1296
+ const [resendCooldown, setResendCooldown] = useState(0);
1297
+ const [resendLoading, setResendLoading] = useState(false);
1298
+ const { verify, login } = useAuth({
1299
+ baseUrl: typeof window !== "undefined" ? window.location.origin : "http://localhost:7000"
1300
+ });
1301
+ const handleSubmit = async (e) => {
1302
+ e.preventDefault();
1303
+ setIsLoading(true);
1304
+ setError(null);
1305
+ if (!/^\d{6}$/.test(otp)) {
1306
+ setError("Please enter a valid 6-digit OTP");
1307
+ setIsLoading(false);
1308
+ return;
1309
+ }
1310
+ try {
1311
+ const response = await verify({ email, otp });
1312
+ if (response.success) {
1313
+ onVerifySuccess?.();
1314
+ } else {
1315
+ setError(response.message || "Verification failed");
1316
+ }
1317
+ } catch (err) {
1318
+ setError(err instanceof Error ? err.message : "An unknown error occurred");
1319
+ } finally {
1320
+ setIsLoading(false);
1321
+ }
1322
+ };
1323
+ const handleOtpChange = (e) => {
1324
+ const value = e.target.value;
1325
+ if (/^\d{0,6}$/.test(value)) {
1326
+ setOtp(value);
1327
+ }
1328
+ };
1329
+ const handleResendOtp = async () => {
1330
+ if (resendCooldown > 0 || resendLoading)
1331
+ return;
1332
+ setResendLoading(true);
1333
+ setError(null);
1334
+ try {
1335
+ const response = await login({ email });
1336
+ if (response.success) {
1337
+ setResendCooldown(60);
1338
+ const interval = setInterval(() => {
1339
+ setResendCooldown((prev) => {
1340
+ if (prev <= 1) {
1341
+ clearInterval(interval);
1342
+ return 0;
1343
+ }
1344
+ return prev - 1;
1345
+ });
1346
+ }, 1e3);
1347
+ } else {
1348
+ setError(response.message || "Failed to resend OTP");
1349
+ }
1350
+ } catch (err) {
1351
+ setError(err instanceof Error ? err.message : "Failed to resend OTP");
1352
+ } finally {
1353
+ setResendLoading(false);
1354
+ }
1355
+ };
1356
+ return /* @__PURE__ */ jsx("div", { style: {
1357
+ maxWidth: "400px",
1358
+ margin: "0 auto",
1359
+ padding: "30px",
1360
+ borderRadius: "12px",
1361
+ boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
1362
+ backgroundColor: "#ffffff",
1363
+ border: "1px solid #eaeaea"
1364
+ }, children: /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, style: {
1365
+ display: "flex",
1366
+ flexDirection: "column"
1367
+ }, children: [
1368
+ /* @__PURE__ */ jsx("h2", { style: {
1369
+ textAlign: "center",
1370
+ marginBottom: "24px",
1371
+ color: "#1f2937",
1372
+ fontSize: "24px",
1373
+ fontWeight: 600
1374
+ }, children: "Verify OTP" }),
1375
+ /* @__PURE__ */ jsxs("p", { style: {
1376
+ textAlign: "center",
1377
+ marginBottom: "24px",
1378
+ color: "#4b5563",
1379
+ fontSize: "14px"
1380
+ }, children: [
1381
+ "Enter the 6-digit code sent to ",
1382
+ /* @__PURE__ */ jsx("strong", { style: { color: "#111827" }, children: email })
1383
+ ] }),
1384
+ error && /* @__PURE__ */ jsx("div", { style: {
1385
+ padding: "12px 16px",
1386
+ marginBottom: "20px",
1387
+ backgroundColor: "#f8d7da",
1388
+ color: "#721c24",
1389
+ border: "1px solid #f5c6cb",
1390
+ borderRadius: "8px",
1391
+ fontSize: "14px",
1392
+ fontWeight: 500
1393
+ }, children: error }),
1394
+ /* @__PURE__ */ jsxs("div", { style: {
1395
+ marginBottom: "20px"
1396
+ }, children: [
1397
+ /* @__PURE__ */ jsx("label", { htmlFor: "otp", style: {
1398
+ display: "block",
1399
+ marginBottom: "8px",
1400
+ fontWeight: 500,
1401
+ color: "#374151",
1402
+ fontSize: "14px"
1403
+ }, children: "OTP Code:" }),
1404
+ /* @__PURE__ */ jsx(
1405
+ "input",
1406
+ {
1407
+ id: "otp",
1408
+ type: "text",
1409
+ value: otp,
1410
+ onChange: handleOtpChange,
1411
+ required: true,
1412
+ disabled: isLoading,
1413
+ style: {
1414
+ width: "100%",
1415
+ padding: "12px 16px",
1416
+ border: "1px solid #ddd",
1417
+ borderRadius: "8px",
1418
+ fontSize: "20px",
1419
+ boxSizing: "border-box",
1420
+ color: "#111827",
1421
+ transition: "all 0.2s ease",
1422
+ backgroundColor: "#ffffff",
1423
+ textAlign: "center",
1424
+ letterSpacing: "5px"
1425
+ },
1426
+ maxLength: 6,
1427
+ placeholder: "123456",
1428
+ autoFocus: true
1429
+ }
1430
+ )
1431
+ ] }),
1432
+ /* @__PURE__ */ jsx(
1433
+ "button",
1434
+ {
1435
+ type: "submit",
1436
+ disabled: isLoading || otp.length !== 6,
1437
+ style: {
1438
+ padding: "14px",
1439
+ backgroundColor: "#007bff",
1440
+ color: "white",
1441
+ border: "none",
1442
+ borderRadius: "8px",
1443
+ fontSize: "16px",
1444
+ fontWeight: 600,
1445
+ cursor: "pointer",
1446
+ transition: "all 0.2s ease",
1447
+ marginTop: "8px"
1448
+ },
1449
+ children: isLoading ? "Verifying..." : "Verify OTP"
1450
+ }
1451
+ ),
1452
+ /* @__PURE__ */ jsxs("div", { style: {
1453
+ textAlign: "center",
1454
+ marginTop: "20px",
1455
+ paddingTop: "20px",
1456
+ borderTop: "1px solid #eee"
1457
+ }, children: [
1458
+ /* @__PURE__ */ jsx(
1459
+ "button",
1460
+ {
1461
+ type: "button",
1462
+ onClick: handleResendOtp,
1463
+ disabled: isLoading || resendLoading || resendCooldown > 0,
1464
+ style: {
1465
+ background: "none",
1466
+ border: "none",
1467
+ color: resendCooldown > 0 ? "#999" : "#007bff",
1468
+ textDecoration: "none",
1469
+ cursor: resendCooldown > 0 ? "not-allowed" : "pointer",
1470
+ fontSize: "14px",
1471
+ fontWeight: 600,
1472
+ padding: "0",
1473
+ marginBottom: "12px",
1474
+ transition: "color 0.2s ease",
1475
+ display: "block",
1476
+ width: "100%"
1477
+ },
1478
+ children: resendLoading ? "Sending..." : resendCooldown > 0 ? `Resend OTP in ${resendCooldown}s` : "Resend OTP"
1479
+ }
1480
+ ),
1481
+ /* @__PURE__ */ jsx(
1482
+ "button",
1483
+ {
1484
+ type: "button",
1485
+ onClick: onBackToLogin,
1486
+ disabled: isLoading,
1487
+ style: {
1488
+ background: "none",
1489
+ border: "none",
1490
+ color: "#007bff",
1491
+ textDecoration: "none",
1492
+ cursor: "pointer",
1493
+ fontSize: "14px",
1494
+ fontWeight: 600,
1495
+ padding: "0",
1496
+ transition: "color 0.2s ease"
1497
+ },
1498
+ children: "Back to Login"
1499
+ }
1500
+ )
1501
+ ] })
1502
+ ] }) });
1503
+ };
1504
+ var AuthFlow = ({
1505
+ onAuthComplete,
1506
+ initialStep = "login",
1507
+ showTitle = true
1508
+ }) => {
1509
+ const [step, setStep] = useState(initialStep);
1510
+ const [email, setEmail] = useState("");
1511
+ const [message, setMessage] = useState(null);
1512
+ const handleLoginSuccess = (email2, needsOtpVerification) => {
1513
+ setEmail(email2);
1514
+ if (needsOtpVerification) {
1515
+ setStep("otp");
1516
+ setMessage(null);
1517
+ } else {
1518
+ setMessage(null);
1519
+ onAuthComplete?.();
1520
+ }
1521
+ };
1522
+ const handleRegisterSuccess = () => {
1523
+ setMessage("Registration successful! Please check your email for verification.");
1524
+ setTimeout(() => {
1525
+ setStep("login");
1526
+ setMessage(null);
1527
+ }, 3e3);
1528
+ };
1529
+ const handleVerifySuccess = () => {
1530
+ setMessage(null);
1531
+ onAuthComplete?.();
1532
+ };
1533
+ const handleBackToLogin = () => {
1534
+ setStep("login");
1535
+ setMessage(null);
1536
+ };
1537
+ const renderCurrentStep = () => {
1538
+ switch (step) {
1539
+ case "login":
1540
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
1541
+ showTitle && /* @__PURE__ */ jsx("h1", { style: {
1542
+ textAlign: "center",
1543
+ marginBottom: "24px",
1544
+ color: "#333",
1545
+ fontSize: "32px",
1546
+ fontWeight: 700
1547
+ }, children: "Welcome Back" }),
1548
+ message && /* @__PURE__ */ jsx("div", { style: {
1549
+ padding: "12px 16px",
1550
+ marginBottom: "20px",
1551
+ backgroundColor: "#d4edda",
1552
+ color: "#155724",
1553
+ border: "1px solid #c3e6cb",
1554
+ borderRadius: "8px",
1555
+ fontSize: "14px",
1556
+ fontWeight: 500
1557
+ }, children: message }),
1558
+ /* @__PURE__ */ jsx(
1559
+ LoginForm,
1560
+ {
1561
+ onLoginSuccess: handleLoginSuccess,
1562
+ onRegisterClick: () => setStep("register"),
1563
+ showRegisterLink: true
1564
+ }
1565
+ )
1566
+ ] });
1567
+ case "register":
1568
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
1569
+ showTitle && /* @__PURE__ */ jsx("h1", { style: {
1570
+ textAlign: "center",
1571
+ marginBottom: "24px",
1572
+ color: "#333",
1573
+ fontSize: "32px",
1574
+ fontWeight: 700
1575
+ }, children: "Create Account" }),
1576
+ message && /* @__PURE__ */ jsx("div", { style: {
1577
+ padding: "12px 16px",
1578
+ marginBottom: "20px",
1579
+ backgroundColor: "#d4edda",
1580
+ color: "#155724",
1581
+ border: "1px solid #c3e6cb",
1582
+ borderRadius: "8px",
1583
+ fontSize: "14px",
1584
+ fontWeight: 500
1585
+ }, children: message }),
1586
+ /* @__PURE__ */ jsx(
1587
+ RegisterForm,
1588
+ {
1589
+ onRegisterSuccess: handleRegisterSuccess,
1590
+ onLoginClick: () => setStep("login"),
1591
+ showLoginLink: true
1592
+ }
1593
+ )
1594
+ ] });
1595
+ case "otp":
1596
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
1597
+ showTitle && /* @__PURE__ */ jsx("h1", { style: {
1598
+ textAlign: "center",
1599
+ marginBottom: "24px",
1600
+ color: "#333",
1601
+ fontSize: "32px",
1602
+ fontWeight: 700
1603
+ }, children: "Verify Your Email" }),
1604
+ /* @__PURE__ */ jsx(
1605
+ OtpForm,
1606
+ {
1607
+ email,
1608
+ onVerifySuccess: handleVerifySuccess,
1609
+ onBackToLogin: handleBackToLogin
1610
+ }
1611
+ )
1612
+ ] });
1613
+ default:
1614
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
1615
+ showTitle && /* @__PURE__ */ jsx("h1", { style: {
1616
+ textAlign: "center",
1617
+ marginBottom: "24px",
1618
+ color: "#333",
1619
+ fontSize: "32px",
1620
+ fontWeight: 700
1621
+ }, children: "Welcome Back" }),
1622
+ /* @__PURE__ */ jsx(
1623
+ LoginForm,
1624
+ {
1625
+ onLoginSuccess: handleLoginSuccess,
1626
+ onRegisterClick: () => setStep("register"),
1627
+ showRegisterLink: true
1628
+ }
1629
+ )
1630
+ ] });
1631
+ }
1632
+ };
1633
+ return /* @__PURE__ */ jsx("div", { style: {
1634
+ minHeight: "300px",
1635
+ display: "flex",
1636
+ alignItems: "center",
1637
+ justifyContent: "center"
1638
+ }, children: renderCurrentStep() });
1639
+ };
1640
+ var EmailVerificationPage = ({
1641
+ token,
1642
+ onVerificationSuccess,
1643
+ onVerificationError,
1644
+ baseUrl
1645
+ }) => {
1646
+ const [isLoading, setIsLoading] = useState(true);
1647
+ const [message, setMessage] = useState("");
1648
+ const [isSuccess, setIsSuccess] = useState(false);
1649
+ const { verifyEmailToken } = useAuth({
1650
+ baseUrl: baseUrl || (typeof window !== "undefined" ? window.location.origin : "http://localhost:7000")
1651
+ });
1652
+ useEffect(() => {
1653
+ const verifyEmail = async () => {
1654
+ if (!token) {
1655
+ setIsLoading(false);
1656
+ setMessage("Invalid verification token");
1657
+ setIsSuccess(false);
1658
+ onVerificationError?.("Invalid verification token");
1659
+ return;
1660
+ }
1661
+ try {
1662
+ const response = await verifyEmailToken(token);
1663
+ if (response.success) {
1664
+ setIsLoading(false);
1665
+ setMessage(response.message || "Email verified successfully!");
1666
+ setIsSuccess(true);
1667
+ onVerificationSuccess?.();
1668
+ } else {
1669
+ setIsLoading(false);
1670
+ setMessage(response.message || "Email verification failed");
1671
+ setIsSuccess(false);
1672
+ onVerificationError?.(response.message || "Email verification failed");
1673
+ }
1674
+ } catch (err) {
1675
+ setIsLoading(false);
1676
+ const errorMessage = err instanceof Error ? err.message : "An unknown error occurred";
1677
+ setMessage(errorMessage);
1678
+ setIsSuccess(false);
1679
+ onVerificationError?.(errorMessage);
1680
+ }
1681
+ };
1682
+ verifyEmail();
1683
+ }, [token, verifyEmailToken, onVerificationSuccess, onVerificationError]);
1684
+ if (isLoading) {
1685
+ return /* @__PURE__ */ jsx("div", { style: {
1686
+ maxWidth: "500px",
1687
+ margin: "0 auto",
1688
+ padding: "30px",
1689
+ borderRadius: "12px",
1690
+ boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
1691
+ backgroundColor: "#ffffff",
1692
+ textAlign: "center",
1693
+ border: "1px solid #eaeaea"
1694
+ }, children: /* @__PURE__ */ jsxs("div", { style: {
1695
+ padding: "20px"
1696
+ }, children: [
1697
+ /* @__PURE__ */ jsx("h2", { style: { color: "black" }, children: "Verifying your email..." }),
1698
+ /* @__PURE__ */ jsx("div", { style: {
1699
+ border: "4px solid #f3f3f3",
1700
+ borderTop: "4px solid #007bff",
1701
+ borderRadius: "50%",
1702
+ width: "40px",
1703
+ height: "40px",
1704
+ animation: "spin 2s linear infinite",
1705
+ margin: "20px auto"
1706
+ } })
1707
+ ] }) });
1708
+ }
1709
+ return /* @__PURE__ */ jsx("div", { style: {
1710
+ maxWidth: "500px",
1711
+ margin: "0 auto",
1712
+ padding: "30px",
1713
+ borderRadius: "12px",
1714
+ boxShadow: "0 4px 20px rgba(0, 0, 0, 0.1)",
1715
+ backgroundColor: "#ffffff",
1716
+ textAlign: "center",
1717
+ border: "1px solid #eaeaea"
1718
+ }, children: /* @__PURE__ */ jsxs("div", { style: {
1719
+ padding: "20px"
1720
+ }, children: [
1721
+ /* @__PURE__ */ jsx("h2", { style: { color: "black" }, children: "Email Verification" }),
1722
+ /* @__PURE__ */ jsx("div", { style: {
1723
+ padding: "16px 20px",
1724
+ margin: "24px 0",
1725
+ borderRadius: "8px",
1726
+ fontSize: "15px",
1727
+ fontWeight: 500,
1728
+ backgroundColor: isSuccess ? "#d4edda" : "#f8d7da",
1729
+ color: isSuccess ? "#155724" : "#721c24",
1730
+ border: isSuccess ? "1px solid #c3e6cb" : "1px solid #f5c6cb"
1731
+ }, children: message }),
1732
+ isSuccess && /* @__PURE__ */ jsxs("div", { style: {
1733
+ marginTop: "24px"
1734
+ }, children: [
1735
+ /* @__PURE__ */ jsx("p", { style: { color: "black" }, children: "Your email has been successfully verified!" }),
1736
+ /* @__PURE__ */ jsx(
1737
+ "button",
1738
+ {
1739
+ onClick: () => window.location.href = "/login",
1740
+ style: {
1741
+ padding: "12px 24px",
1742
+ backgroundColor: "#007bff",
1743
+ color: "white",
1744
+ border: "none",
1745
+ borderRadius: "8px",
1746
+ fontSize: "16px",
1747
+ fontWeight: 600,
1748
+ cursor: "pointer",
1749
+ transition: "all 0.2s ease"
1750
+ },
1751
+ children: "Go to Login"
1752
+ }
1753
+ )
1754
+ ] })
1755
+ ] }) });
1756
+ };
1757
+
1758
+ // src/node/index.ts
1759
+ var node_exports = {};
1760
+ __export(node_exports, {
1761
+ AuthClient: () => AuthClient
1762
+ });
1763
+
1764
+ // src/node/auth-client.ts
1765
+ var AuthClient = class extends AuthService {
1766
+ constructor(config) {
1767
+ super(config);
1768
+ }
1769
+ // Override methods that require browser-specific features
1770
+ // For Node.js, token persistence must be handled manually
1771
+ async register(data) {
1772
+ const registerData = { ...data };
1773
+ if (!registerData.frontendBaseUrl) {
1774
+ registerData.frontendBaseUrl = process.env.FRONTEND_BASE_URL || process.env.NEXT_PUBLIC_FRONTEND_BASE_URL || process.env.REACT_APP_FRONTEND_BASE_URL;
1775
+ }
1776
+ const response = await this["httpClient"].post("/api/v1/auth/register", registerData);
1777
+ if (response.success && response.message === "Registration data saved. Verification email sent. Please check your inbox.") {
1778
+ return response;
1779
+ }
1780
+ throw new Error(response.message || "Registration failed");
1781
+ }
1782
+ async login(data) {
1783
+ const response = await this["httpClient"].post("/api/v1/auth/login", data);
1784
+ if (response.success && response.token) {
1785
+ this["token"] = response.token;
1786
+ this["httpClient"].setAuthToken(response.token);
1787
+ return response;
1788
+ }
1789
+ if (response.success && response.message === "OTP sent to your email.") {
1790
+ return response;
1791
+ }
1792
+ if (response.success && response.message === "OTP verified successfully." && response.token) {
1793
+ this["token"] = response.token;
1794
+ this["httpClient"].setAuthToken(response.token);
1795
+ return response;
1796
+ }
1797
+ throw new Error(response.message || "Login failed");
1798
+ }
1799
+ async verify(data) {
1800
+ const response = await this["httpClient"].post("/api/v1/auth/verify", data);
1801
+ if (response.success && response.token) {
1802
+ this["token"] = response.token;
1803
+ this["httpClient"].setAuthToken(response.token);
1804
+ }
1805
+ return response;
1806
+ }
1807
+ async logout() {
1808
+ this["token"] = null;
1809
+ this["httpClient"].removeAuthToken();
1810
+ }
1811
+ async getProfile() {
1812
+ if (!this["token"]) {
1813
+ throw new Error("Not authenticated");
1814
+ }
1815
+ const response = await this["httpClient"].get("/api/v1/user/me");
1816
+ return response.user;
1817
+ }
1818
+ async getUserById(id) {
1819
+ const response = await this["httpClient"].get(`/api/v1/user/${id}`);
1820
+ return response.user;
1821
+ }
1822
+ async updateProfile(data) {
1823
+ if (!this["token"]) {
1824
+ throw new Error("Not authenticated");
1825
+ }
1826
+ const response = await this["httpClient"].post("/api/v1/user/update/name", data);
1827
+ if (response.success && response.token) {
1828
+ this["token"] = response.token;
1829
+ this["httpClient"].setAuthToken(response.token);
1830
+ }
1831
+ return response;
1832
+ }
1833
+ async getAllUsers() {
1834
+ if (!this["token"]) {
1835
+ throw new Error("Not authenticated");
1836
+ }
1837
+ const response = await this["httpClient"].get("/api/v1/user/all");
1838
+ return response.users;
1839
+ }
1840
+ };
1841
+
1842
+ export { AuthService, HttpClient, node_exports as node, react_exports as react };
1843
+ //# sourceMappingURL=out.js.map
1844
+ //# sourceMappingURL=index.mjs.map