@ttoss/react-auth 2.6.30 → 2.6.32

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/esm/index.js CHANGED
@@ -1,969 +1,28 @@
1
1
  /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
2
2
 
3
3
  // src/Auth.tsx
4
- import { useI18n as useI18n7 } from "@ttoss/react-i18n";
5
- import { useNotifications as useNotifications2 } from "@ttoss/react-notifications";
6
- import { Flex as Flex5 } from "@ttoss/ui";
7
- import { confirmResetPassword, confirmSignUp, resendSignUpCode, resetPassword, signIn, signUp } from "aws-amplify/auth";
8
- import * as React5 from "react";
9
-
10
- // src/AuthCard.tsx
4
+ import { Auth as AuthCore, useAuthScreen } from "@ttoss/react-auth-core";
5
+ import { useI18n } from "@ttoss/react-i18n";
11
6
  import { useNotifications } from "@ttoss/react-notifications";
12
- import { Box, Button, Flex, Heading } from "@ttoss/ui";
7
+ import { confirmResetPassword, confirmSignUp, resendSignUpCode, resetPassword, signIn, signUp } from "aws-amplify/auth";
13
8
  import * as React from "react";
14
-
15
- // src/ErrorBoundary.tsx
16
- import { NotificationCard } from "@ttoss/components/NotificationCard";
17
- import { notify } from "@ttoss/logger";
18
- import { useI18n } from "@ttoss/react-i18n";
19
- import { ErrorBoundary as ReactErrorBoundary } from "react-error-boundary";
20
9
  import { jsx } from "react/jsx-runtime";
21
- var ErrorFallback = ({
22
- resetErrorBoundary
23
- }) => {
10
+ var Auth = props => {
24
11
  const {
25
12
  intl
26
13
  } = useI18n();
27
- return /* @__PURE__ */jsx("div", {
28
- role: "alert",
29
- children: /* @__PURE__ */jsx(NotificationCard, {
30
- type: "error",
31
- message: intl.formatMessage({
32
- id: "khMx/2",
33
- defaultMessage: [{
34
- "type": 0,
35
- "value": "An error occurred with your authentication. Please try again."
36
- }]
37
- }),
38
- onClose: resetErrorBoundary
39
- })
40
- });
41
- };
42
- var ErrorBoundary = ({
43
- children
44
- }) => {
45
- return /* @__PURE__ */jsx(ReactErrorBoundary, {
46
- FallbackComponent: ErrorFallback,
47
- onError: error => {
48
- notify({
49
- type: "error",
50
- title: "Authentication Error",
51
- message: error.message
52
- });
53
- },
54
- children
55
- });
56
- };
57
-
58
- // src/AuthCard.tsx
59
- import { jsx as jsx2, jsxs } from "react/jsx-runtime";
60
- var LogoContext = React.createContext({});
61
- var LogoProvider = ({
62
- children,
63
- ...values
64
- }) => {
65
- return /* @__PURE__ */jsx2(LogoContext.Provider, {
66
- value: values,
67
- children
68
- });
69
- };
70
- var AuthCard = ({
71
- children,
72
- title,
73
- buttonLabel,
74
- extraButton,
75
- isValidForm
76
- }) => {
77
- const {
78
- logo
79
- } = React.useContext(LogoContext);
80
- const {
81
- isLoading
82
- } = useNotifications();
83
- return /* @__PURE__ */jsxs(Box, {
84
- sx: {
85
- maxWidth: "400px",
86
- width: "full",
87
- border: "md",
88
- borderColor: "display.border.muted.default",
89
- paddingX: "8",
90
- paddingY: "9",
91
- backgroundColor: "surface"
92
- },
93
- children: [logo && /* @__PURE__ */jsx2(Flex, {
94
- sx: {
95
- width: "full",
96
- maxHeight: "90px",
97
- justifyContent: "center",
98
- marginBottom: "8"
99
- },
100
- children: logo
101
- }), /* @__PURE__ */jsxs(Flex, {
102
- sx: {
103
- flexDirection: "column"
104
- },
105
- children: [/* @__PURE__ */jsx2(Heading, {
106
- as: "h2",
107
- variant: "h2",
108
- sx: {
109
- marginBottom: "8"
110
- },
111
- children: title
112
- }), /* @__PURE__ */jsx2(ErrorBoundary, {
113
- children
114
- }), /* @__PURE__ */jsxs(Flex, {
115
- sx: {
116
- flexDirection: "column",
117
- width: "100%",
118
- gap: "7",
119
- marginTop: "8"
120
- },
121
- children: [/* @__PURE__ */jsx2(Button, {
122
- type: "submit",
123
- "aria-label": "submit-button",
124
- variant: "accent",
125
- disabled: isLoading || !isValidForm,
126
- sx: {
127
- textAlign: "center",
128
- display: "initial"
129
- },
130
- loading: isLoading,
131
- children: buttonLabel
132
- }), extraButton]
133
- })]
134
- })]
135
- });
136
- };
137
-
138
- // src/AuthConfirmSignUp.tsx
139
- import { NotificationCard as NotificationCard2 } from "@ttoss/components/NotificationCard";
140
- import { Form, FormFieldInput, useForm, yup, yupResolver } from "@ttoss/forms";
141
- import { useI18n as useI18n2 } from "@ttoss/react-i18n";
142
- import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
143
- var AuthConfirmSignUp = ({
144
- email,
145
- onConfirmSignUp
146
- }) => {
147
- const {
148
- intl
149
- } = useI18n2();
150
- const schema = yup.object().shape({
151
- code: yup.string().required(intl.formatMessage({
152
- id: "0XOzcH",
153
- defaultMessage: [{
154
- "type": 0,
155
- "value": "Required field"
156
- }]
157
- })).max(6, intl.formatMessage({
158
- id: "S3pjKw",
159
- defaultMessage: [{
160
- "type": 0,
161
- "value": "Minimum "
162
- }, {
163
- "type": 1,
164
- "value": "value"
165
- }, {
166
- "type": 0,
167
- "value": " characters"
168
- }]
169
- }, {
170
- value: 6
171
- }))
172
- }).required();
173
- const formMethods = useForm({
174
- resolver: yupResolver(schema)
175
- });
176
- return /* @__PURE__ */jsx3(Form, {
177
- ...formMethods,
178
- onSubmit: ({
179
- code
180
- }) => {
181
- return onConfirmSignUp({
182
- code,
183
- email
184
- });
185
- },
186
- children: /* @__PURE__ */jsxs2(AuthCard, {
187
- buttonLabel: intl.formatMessage({
188
- id: "UNttd+",
189
- defaultMessage: [{
190
- "type": 0,
191
- "value": "Confirm"
192
- }]
193
- }),
194
- isValidForm: formMethods.formState.isValid,
195
- title: intl.formatMessage({
196
- id: "cGR2eI",
197
- defaultMessage: [{
198
- "type": 0,
199
- "value": "Confirmation"
200
- }]
201
- }),
202
- children: [/* @__PURE__ */jsx3(NotificationCard2, {
203
- type: "info",
204
- message: intl.formatMessage({
205
- id: "pwv2cR",
206
- defaultMessage: [{
207
- "type": 0,
208
- "value": "We have sent a confirmation code to your email address. Please enter the code below."
209
- }]
210
- })
211
- }), /* @__PURE__ */jsx3(FormFieldInput, {
212
- sx: {
213
- marginTop: "6"
214
- },
215
- name: "code",
216
- label: intl.formatMessage({
217
- id: "KY2T6J",
218
- defaultMessage: [{
219
- "type": 0,
220
- "value": "Code"
221
- }]
222
- })
223
- })]
224
- })
225
- });
226
- };
227
-
228
- // src/AuthForgotPassword.tsx
229
- import { Form as Form2, FormFieldInput as FormFieldInput2, useForm as useForm2, yup as yup2, yupResolver as yupResolver2 } from "@ttoss/forms";
230
- import { useI18n as useI18n3 } from "@ttoss/react-i18n";
231
- import { NotificationsBox } from "@ttoss/react-notifications";
232
- import { Button as Button2, Link, Text } from "@ttoss/ui";
233
- import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
234
- var AuthForgotPassword = ({
235
- onForgotPassword,
236
- onCancel,
237
- onSignUp
238
- }) => {
239
- const {
240
- intl
241
- } = useI18n3();
242
- const schema = yup2.object().shape({
243
- email: yup2.string().required(intl.formatMessage({
244
- id: "5oOshZ",
245
- defaultMessage: [{
246
- "type": 0,
247
- "value": "Enter your email address"
248
- }]
249
- })).email(intl.formatMessage({
250
- id: "SnONhb",
251
- defaultMessage: [{
252
- "type": 0,
253
- "value": "Please, insert a valid e-mail"
254
- }]
255
- }))
256
- }).required();
257
- const formMethods = useForm2({
258
- resolver: yupResolver2(schema),
259
- mode: "onBlur"
260
- });
261
- return /* @__PURE__ */jsx4(Form2, {
262
- ...formMethods,
263
- sx: {
264
- maxWidth: "390px"
265
- },
266
- onSubmit: ({
267
- email
268
- }) => {
269
- return onForgotPassword({
270
- email
271
- });
272
- },
273
- children: /* @__PURE__ */jsxs3(AuthCard, {
274
- buttonLabel: intl.formatMessage({
275
- id: "mZzmNV",
276
- defaultMessage: [{
277
- "type": 0,
278
- "value": "Recover Password"
279
- }]
280
- }),
281
- isValidForm: formMethods.formState.isValid,
282
- title: intl.formatMessage({
283
- id: "S4bbEj",
284
- defaultMessage: [{
285
- "type": 0,
286
- "value": "Recovering Password"
287
- }]
288
- }),
289
- extraButton: /* @__PURE__ */jsx4(Button2, {
290
- sx: {
291
- textAlign: "center",
292
- display: "initial"
293
- },
294
- variant: "secondary",
295
- onClick: onCancel,
296
- children: intl.formatMessage({
297
- id: "6PdOcy",
298
- defaultMessage: [{
299
- "type": 0,
300
- "value": "Cancel"
301
- }]
302
- })
303
- }),
304
- children: [/* @__PURE__ */jsx4(FormFieldInput2, {
305
- name: "email",
306
- label: intl.formatMessage({
307
- id: "XreZg+",
308
- defaultMessage: [{
309
- "type": 0,
310
- "value": "Registered Email"
311
- }]
312
- })
313
- }), /* @__PURE__ */jsx4(NotificationsBox, {}), /* @__PURE__ */jsx4(Text, {
314
- sx: {
315
- marginTop: "xl",
316
- cursor: "pointer"
317
- },
318
- as: Link,
319
- onClick: onSignUp,
320
- children: intl.formatMessage({
321
- id: "lZvoYL",
322
- defaultMessage: [{
323
- "type": 0,
324
- "value": "Sign up now"
325
- }]
326
- })
327
- })]
328
- })
329
- });
330
- };
331
-
332
- // ../cloud-auth/src/config.ts
333
- var PASSWORD_MINIMUM_LENGTH = 8;
334
-
335
- // src/AuthForgotPasswordResetPassword.tsx
336
- import { Form as Form3, FormFieldInput as FormFieldInput3, FormFieldPassword, useForm as useForm3, yup as yup3, yupResolver as yupResolver3 } from "@ttoss/forms";
337
- import { useI18n as useI18n4 } from "@ttoss/react-i18n";
338
- import { NotificationsBox as NotificationsBox2 } from "@ttoss/react-notifications";
339
- import { Button as Button3 } from "@ttoss/ui";
340
- import * as React2 from "react";
341
- import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
342
- var AuthForgotPasswordResetPassword = ({
343
- email,
344
- onForgotPasswordResetPassword,
345
- onCancel
346
- }) => {
347
14
  const {
348
- intl
349
- } = useI18n4();
350
- const schema = React2.useMemo(() => {
351
- return yup3.object().shape({
352
- code: yup3.string().required(intl.formatMessage({
353
- id: "0XOzcH",
354
- defaultMessage: [{
355
- "type": 0,
356
- "value": "Required field"
357
- }]
358
- })).max(6, intl.formatMessage({
359
- id: "S3pjKw",
360
- defaultMessage: [{
361
- "type": 0,
362
- "value": "Minimum "
363
- }, {
364
- "type": 1,
365
- "value": "value"
366
- }, {
367
- "type": 0,
368
- "value": " characters"
369
- }]
370
- }, {
371
- value: 6
372
- })),
373
- password: yup3.string().required(intl.formatMessage({
374
- id: "kdFYba",
375
- defaultMessage: [{
376
- "type": 0,
377
- "value": "Password field is required"
378
- }]
379
- })).min(PASSWORD_MINIMUM_LENGTH, intl.formatMessage({
380
- id: "TZ4WUk",
381
- defaultMessage: [{
382
- "type": 0,
383
- "value": "Password requires "
384
- }, {
385
- "type": 1,
386
- "value": "value"
387
- }, {
388
- "type": 0,
389
- "value": " characters"
390
- }]
391
- }, {
392
- value: PASSWORD_MINIMUM_LENGTH
393
- })).trim(),
394
- confirmPassword: yup3.string().required(intl.formatMessage({
395
- id: "NJ57Qj",
396
- defaultMessage: [{
397
- "type": 0,
398
- "value": "Confirm password field is required"
399
- }]
400
- })).oneOf([yup3.ref("password")], intl.formatMessage({
401
- id: "WU/CqP",
402
- defaultMessage: [{
403
- "type": 0,
404
- "value": "Passwords are not the same"
405
- }]
406
- }))
407
- }).required();
408
- }, [intl]);
409
- const formMethods = useForm3({
410
- resolver: yupResolver3(schema),
411
- mode: "onBlur"
412
- });
413
- return /* @__PURE__ */jsx5(Form3, {
414
- ...formMethods,
415
- sx: {
416
- maxWidth: "390px"
417
- },
418
- onSubmit: ({
419
- code,
420
- password
421
- }) => {
422
- return onForgotPasswordResetPassword({
423
- email,
424
- code,
425
- newPassword: password
426
- });
427
- },
428
- children: /* @__PURE__ */jsxs4(AuthCard, {
429
- buttonLabel: intl.formatMessage({
430
- id: "mZzmNV",
431
- defaultMessage: [{
432
- "type": 0,
433
- "value": "Recover Password"
434
- }]
435
- }),
436
- isValidForm: formMethods.formState.isValid,
437
- title: intl.formatMessage({
438
- id: "S4bbEj",
439
- defaultMessage: [{
440
- "type": 0,
441
- "value": "Recovering Password"
442
- }]
443
- }),
444
- extraButton: /* @__PURE__ */jsx5(Button3, {
445
- sx: {
446
- textAlign: "center",
447
- display: "initial"
448
- },
449
- variant: "secondary",
450
- onClick: onCancel,
451
- children: intl.formatMessage({
452
- id: "6PdOcy",
453
- defaultMessage: [{
454
- "type": 0,
455
- "value": "Cancel"
456
- }]
457
- })
458
- }),
459
- children: [/* @__PURE__ */jsx5(FormFieldInput3, {
460
- name: "code",
461
- label: intl.formatMessage({
462
- id: "42HafR",
463
- defaultMessage: [{
464
- "type": 0,
465
- "value": "Code"
466
- }]
467
- })
468
- }), /* @__PURE__ */jsx5(FormFieldPassword, {
469
- name: "password",
470
- label: intl.formatMessage({
471
- id: "PylVqx",
472
- defaultMessage: [{
473
- "type": 0,
474
- "value": "Password"
475
- }]
476
- })
477
- }), /* @__PURE__ */jsx5(FormFieldPassword, {
478
- name: "confirmPassword",
479
- label: intl.formatMessage({
480
- id: "lY+cuM",
481
- defaultMessage: [{
482
- "type": 0,
483
- "value": "Confirm password"
484
- }]
485
- })
486
- }), /* @__PURE__ */jsx5(NotificationsBox2, {})]
487
- })
488
- });
489
- };
490
-
491
- // src/AuthFullScreen.tsx
492
- import { Flex as Flex2 } from "@ttoss/ui";
493
- import { jsx as jsx6 } from "react/jsx-runtime";
494
- var AuthFullScreen = ({
495
- children
496
- }) => {
497
- return /* @__PURE__ */jsx6(Flex2, {
498
- sx: {
499
- height: "100vh",
500
- width: "100vw",
501
- justifyContent: "center",
502
- alignItems: "center",
503
- margin: 0,
504
- backgroundPosition: "center",
505
- backgroundRepeat: "no-repeat",
506
- backgroundSize: "cover"
507
- },
508
- children
509
- });
510
- };
511
-
512
- // src/AuthProvider.tsx
513
- import { fetchAuthSession, fetchUserAttributes, getCurrentUser, signOut as awsSignOut } from "aws-amplify/auth";
514
- import { Hub } from "aws-amplify/utils";
515
- import * as React3 from "react";
516
- import { jsx as jsx7 } from "react/jsx-runtime";
517
- var signOut = () => {
518
- return awsSignOut();
519
- };
520
- var AuthContext = React3.createContext({
521
- signOut,
522
- isAuthenticated: false,
523
- user: null,
524
- tokens: null,
525
- screen: {
526
- value: "signIn",
527
- context: {}
528
- },
529
- setScreen: () => {}
530
- });
531
- var AuthProvider = ({
532
- children
533
- }) => {
534
- const [authState, setAuthState] = React3.useState({
535
- user: null,
536
- tokens: null,
537
- isAuthenticated: void 0
538
- });
539
- const [screen, setScreen] = React3.useState({
540
- value: "signIn",
541
- context: {}
542
- });
543
- React3.useEffect(() => {
544
- const updateUser = () => {
545
- getCurrentUser().then(async ({
546
- userId
547
- }) => {
548
- const [session, user] = await Promise.all([fetchAuthSession(), fetchUserAttributes()]);
549
- const idToken = session.tokens?.idToken?.toString() ?? "";
550
- const accessToken = session.tokens?.accessToken.toString() ?? "";
551
- setAuthState({
552
- user: {
553
- id: userId,
554
- email: user.email ?? "",
555
- emailVerified: user.email_verified ?? ""
556
- },
557
- tokens: {
558
- idToken,
559
- accessToken,
560
- refreshToken: ""
561
- },
562
- isAuthenticated: true
563
- });
564
- }).catch(() => {
565
- setAuthState({
566
- user: null,
567
- tokens: null,
568
- isAuthenticated: false
569
- });
570
- });
571
- };
572
- const updateUserListener = Hub.listen("auth", updateUser);
573
- updateUser();
574
- return () => {
575
- updateUserListener();
576
- };
577
- }, []);
578
- if (authState.isAuthenticated === void 0) {
579
- return null;
580
- }
581
- return /* @__PURE__ */jsx7(AuthContext.Provider, {
582
- value: {
583
- signOut,
584
- isAuthenticated: authState.isAuthenticated ?? false,
585
- user: authState.user,
586
- tokens: authState.tokens,
587
- screen,
588
- setScreen
589
- },
590
- children
591
- });
592
- };
593
- var useAuth = () => {
594
- return React3.useContext(AuthContext);
595
- };
596
-
597
- // src/AuthSignIn.tsx
598
- import { Form as Form4, FormFieldInput as FormFieldInput4, FormFieldPassword as FormFieldPassword2, useForm as useForm4, yup as yup4, yupResolver as yupResolver4 } from "@ttoss/forms";
599
- import { useI18n as useI18n5 } from "@ttoss/react-i18n";
600
- import { NotificationsBox as NotificationsBox3 } from "@ttoss/react-notifications";
601
- import { Button as Button4, Flex as Flex3, Link as Link2, Text as Text2 } from "@ttoss/ui";
602
- import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
603
- var AuthSignIn = ({
604
- onSignIn,
605
- onSignUp,
606
- defaultValues,
607
- onForgotPassword
608
- }) => {
609
- const {
610
- intl
611
- } = useI18n5();
612
- const schema = yup4.object().shape({
613
- email: yup4.string().required(intl.formatMessage({
614
- id: "d1YCuH",
615
- defaultMessage: [{
616
- "type": 0,
617
- "value": "Enter your email address"
618
- }]
619
- })).email(intl.formatMessage({
620
- id: "9cApwd",
621
- defaultMessage: [{
622
- "type": 0,
623
- "value": "Please, insert a valid e-mail"
624
- }]
625
- })),
626
- password: yup4.string().required(intl.formatMessage({
627
- id: "kdFYba",
628
- defaultMessage: [{
629
- "type": 0,
630
- "value": "Password field is required"
631
- }]
632
- })).min(PASSWORD_MINIMUM_LENGTH, intl.formatMessage({
633
- id: "TZ4WUk",
634
- defaultMessage: [{
635
- "type": 0,
636
- "value": "Password requires "
637
- }, {
638
- "type": 1,
639
- "value": "value"
640
- }, {
641
- "type": 0,
642
- "value": " characters"
643
- }]
644
- }, {
645
- value: PASSWORD_MINIMUM_LENGTH
646
- })).trim()
647
- // remember: yup.boolean(),
648
- });
649
- const formMethods = useForm4({
650
- defaultValues,
651
- mode: "onBlur",
652
- resolver: yupResolver4(schema)
653
- });
654
- const onSubmitForm = data => {
655
- return onSignIn(data);
656
- };
657
- return /* @__PURE__ */jsx8(Form4, {
658
- sx: {
659
- maxWidth: "390px",
660
- width: "100%"
661
- },
662
- ...formMethods,
663
- onSubmit: onSubmitForm,
664
- children: /* @__PURE__ */jsxs5(AuthCard, {
665
- title: intl.formatMessage({
666
- id: "SQJto2",
667
- defaultMessage: [{
668
- "type": 0,
669
- "value": "Sign in"
670
- }]
671
- }),
672
- buttonLabel: intl.formatMessage({
673
- id: "SQJto2",
674
- defaultMessage: [{
675
- "type": 0,
676
- "value": "Sign in"
677
- }]
678
- }),
679
- isValidForm: formMethods.formState.isValid,
680
- extraButton: /* @__PURE__ */jsx8(Button4, {
681
- type: "button",
682
- variant: "secondary",
683
- sx: {
684
- textAlign: "center",
685
- display: "initial"
686
- },
687
- onClick: onSignUp,
688
- "aria-label": "sign-up",
689
- children: intl.formatMessage({
690
- id: "EZ3YF2",
691
- defaultMessage: [{
692
- "type": 0,
693
- "value": "Sign up"
694
- }]
695
- })
696
- }),
697
- children: [/* @__PURE__ */jsxs5(Flex3, {
698
- sx: {
699
- flexDirection: "column",
700
- gap: "xl"
701
- },
702
- children: [/* @__PURE__ */jsx8(FormFieldInput4, {
703
- name: "email",
704
- label: intl.formatMessage({
705
- id: "5E12mO",
706
- defaultMessage: [{
707
- "type": 0,
708
- "value": "Email"
709
- }]
710
- })
711
- }), /* @__PURE__ */jsx8(FormFieldPassword2, {
712
- name: "password",
713
- label: intl.formatMessage({
714
- id: "PylVqx",
715
- defaultMessage: [{
716
- "type": 0,
717
- "value": "Password"
718
- }]
719
- })
720
- })]
721
- }), /* @__PURE__ */jsx8(Flex3, {
722
- sx: {
723
- justifyContent: "space-between",
724
- marginTop: "lg"
725
- },
726
- children: /* @__PURE__ */jsx8(Text2, {
727
- sx: {
728
- marginLeft: "auto",
729
- cursor: "pointer"
730
- },
731
- as: Link2,
732
- onClick: onForgotPassword,
733
- children: intl.formatMessage({
734
- id: "BtK6KR",
735
- defaultMessage: [{
736
- "type": 0,
737
- "value": "Forgot password?"
738
- }]
739
- })
740
- })
741
- }), /* @__PURE__ */jsx8(NotificationsBox3, {})]
742
- })
743
- });
744
- };
745
-
746
- // src/AuthSignUp.tsx
747
- import { Form as Form5, FormFieldCheckbox, FormFieldInput as FormFieldInput5, FormFieldPassword as FormFieldPassword3, useForm as useForm5, yup as yup5, yupResolver as yupResolver5 } from "@ttoss/forms";
748
- import { useI18n as useI18n6 } from "@ttoss/react-i18n";
749
- import { NotificationsBox as NotificationsBox4 } from "@ttoss/react-notifications";
750
- import { Flex as Flex4, Link as Link3, Text as Text3 } from "@ttoss/ui";
751
- import * as React4 from "react";
752
- import { Fragment as Fragment2, jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
753
- var AuthSignUp = props => {
754
- const {
755
- intl
756
- } = useI18n6();
757
- const schema = React4.useMemo(() => {
758
- return yup5.object().shape({
759
- email: yup5.string().required(intl.formatMessage({
760
- id: "d1YCuH",
761
- defaultMessage: [{
762
- "type": 0,
763
- "value": "Enter your email address"
764
- }]
765
- })).email(intl.formatMessage({
766
- id: "OhDL0i",
767
- defaultMessage: [{
768
- "type": 0,
769
- "value": "Invalid email"
770
- }]
771
- })),
772
- password: yup5.string().required(intl.formatMessage({
773
- id: "kdFYba",
774
- defaultMessage: [{
775
- "type": 0,
776
- "value": "Password field is required"
777
- }]
778
- })).min(PASSWORD_MINIMUM_LENGTH, intl.formatMessage({
779
- id: "TZ4WUk",
780
- defaultMessage: [{
781
- "type": 0,
782
- "value": "Password requires "
783
- }, {
784
- "type": 1,
785
- "value": "value"
786
- }, {
787
- "type": 0,
788
- "value": " characters"
789
- }]
790
- }, {
791
- value: PASSWORD_MINIMUM_LENGTH
792
- })).trim(),
793
- confirmPassword: yup5.string().required(intl.formatMessage({
794
- id: "NJ57Qj",
795
- defaultMessage: [{
796
- "type": 0,
797
- "value": "Confirm password field is required"
798
- }]
799
- })).oneOf([yup5.ref("password")], intl.formatMessage({
800
- id: "WU/CqP",
801
- defaultMessage: [{
802
- "type": 0,
803
- "value": "Passwords are not the same"
804
- }]
805
- })),
806
- signUpTerms: props.signUpTerms?.isRequired ? yup5.boolean().required(intl.formatMessage({
807
- id: "qnQYqN",
808
- defaultMessage: [{
809
- "type": 0,
810
- "value": "You must accept the terms and conditions"
811
- }]
812
- })) : yup5.boolean()
813
- });
814
- }, [intl, props.signUpTerms?.isRequired]);
815
- const signUpTermsLabel = React4.useMemo(() => {
816
- if (!props.signUpTerms) {
817
- return null;
818
- }
819
- const signUpTermsFirstMessage = intl.formatMessage({
820
- id: "Co3exe",
821
- defaultMessage: [{
822
- "type": 0,
823
- "value": "By signing up, you agree to the following Terms and Conditions."
824
- }]
825
- });
826
- const termsLinks = props.signUpTerms.terms.map((term, index, terms) => {
827
- const finalPunctuation = index === terms.length - 1 ? "." : ", ";
828
- return /* @__PURE__ */jsxs6(React4.Fragment, {
829
- children: [/* @__PURE__ */jsx9(Link3, {
830
- href: term.url,
831
- target: "_blank",
832
- rel: "noreferrer",
833
- children: term.label
834
- }, index), finalPunctuation]
835
- }, index);
836
- });
837
- const label = /* @__PURE__ */jsxs6(Text3, {
838
- children: [signUpTermsFirstMessage, " ", termsLinks]
839
- });
840
- return label;
841
- }, [intl, props.signUpTerms]);
842
- const signUpTermsNode = React4.useMemo(() => {
843
- if (!props.signUpTerms) {
844
- return null;
845
- }
846
- if (props.signUpTerms.isRequired) {
847
- return /* @__PURE__ */jsx9(FormFieldCheckbox, {
848
- name: "signUpTerms",
849
- label: signUpTermsLabel
850
- });
851
- } else {
852
- return /* @__PURE__ */jsx9(Fragment2, {
853
- children: signUpTermsLabel
854
- });
855
- }
856
- }, [props.signUpTerms, signUpTermsLabel]);
857
- const formMethods = useForm5({
858
- mode: "onBlur",
859
- resolver: yupResolver5(schema)
860
- });
861
- const onSubmitForm = data => {
862
- return props.onSignUp(data);
863
- };
864
- return /* @__PURE__ */jsx9(Form5, {
865
- sx: {
866
- maxWidth: "390px",
867
- width: "100%"
868
- },
869
- ...formMethods,
870
- onSubmit: onSubmitForm,
871
- children: /* @__PURE__ */jsxs6(AuthCard, {
872
- buttonLabel: intl.formatMessage({
873
- id: "URJDrG",
874
- defaultMessage: [{
875
- "type": 0,
876
- "value": "Sign up"
877
- }]
878
- }),
879
- title: intl.formatMessage({
880
- id: "oayEC3",
881
- defaultMessage: [{
882
- "type": 0,
883
- "value": "Sign up"
884
- }]
885
- }),
886
- isValidForm: formMethods.formState.isValid,
887
- extraButton: /* @__PURE__ */jsx9(Text3, {
888
- sx: {
889
- cursor: "pointer"
890
- },
891
- onClick: props.onReturnToSignIn,
892
- as: Link3,
893
- children: intl.formatMessage({
894
- id: "8GMUPk",
895
- defaultMessage: [{
896
- "type": 0,
897
- "value": "I'm already registered"
898
- }]
899
- })
900
- }),
901
- children: [/* @__PURE__ */jsxs6(Flex4, {
902
- sx: {
903
- flexDirection: "column",
904
- gap: "xl"
905
- },
906
- children: [/* @__PURE__ */jsx9(FormFieldInput5, {
907
- name: "email",
908
- label: intl.formatMessage({
909
- id: "5E12mO",
910
- defaultMessage: [{
911
- "type": 0,
912
- "value": "Email"
913
- }]
914
- })
915
- }), /* @__PURE__ */jsx9(FormFieldPassword3, {
916
- name: "password",
917
- label: intl.formatMessage({
918
- id: "PylVqx",
919
- defaultMessage: [{
920
- "type": 0,
921
- "value": "Password"
922
- }]
923
- })
924
- }), /* @__PURE__ */jsx9(FormFieldPassword3, {
925
- name: "confirmPassword",
926
- label: intl.formatMessage({
927
- id: "lY+cuM",
928
- defaultMessage: [{
929
- "type": 0,
930
- "value": "Confirm password"
931
- }]
932
- })
933
- }), signUpTermsNode]
934
- }), /* @__PURE__ */jsx9(NotificationsBox4, {})]
935
- })
936
- });
937
- };
938
-
939
- // src/Auth.tsx
940
- import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
941
- var AuthLogic = props => {
942
- const {
943
- intl
944
- } = useI18n7();
945
- const {
946
- isAuthenticated,
947
15
  screen,
948
16
  setScreen
949
- } = useAuth();
17
+ } = useAuthScreen();
950
18
  const {
951
- setLoading,
952
- addNotification,
953
- clearNotifications
954
- } = useNotifications2();
955
- React5.useEffect(() => {
956
- clearNotifications();
957
- }, [screen.value, clearNotifications]);
958
- React5.useEffect(() => {
959
- return clearNotifications;
960
- }, [clearNotifications]);
961
- const onSignIn = React5.useCallback(async ({
19
+ addNotification
20
+ } = useNotifications();
21
+ const onSignIn = React.useCallback(async ({
962
22
  email,
963
23
  password
964
24
  }) => {
965
25
  try {
966
- setLoading(true);
967
26
  const result = await signIn({
968
27
  username: email,
969
28
  password
@@ -978,7 +37,7 @@ var AuthLogic = props => {
978
37
  username: email
979
38
  });
980
39
  setScreen({
981
- value: "signUpResendConfirmation",
40
+ value: "confirmSignUpWithCode",
982
41
  context: {
983
42
  email
984
43
  }
@@ -1001,16 +60,13 @@ var AuthLogic = props => {
1001
60
  type: "error",
1002
61
  message: error.message
1003
62
  });
1004
- } finally {
1005
- setLoading(false);
1006
63
  }
1007
- }, [addNotification, intl, setLoading, setScreen]);
1008
- const onSignUp = React5.useCallback(async ({
64
+ }, [addNotification, intl, setScreen]);
65
+ const onSignUp = React.useCallback(async ({
1009
66
  email,
1010
67
  password
1011
68
  }) => {
1012
69
  try {
1013
- setLoading(true);
1014
70
  await signUp({
1015
71
  username: email,
1016
72
  password,
@@ -1021,7 +77,7 @@ var AuthLogic = props => {
1021
77
  }
1022
78
  });
1023
79
  setScreen({
1024
- value: "signUpConfirm",
80
+ value: "confirmSignUpWithCode",
1025
81
  context: {
1026
82
  email
1027
83
  }
@@ -1031,51 +87,36 @@ var AuthLogic = props => {
1031
87
  type: "error",
1032
88
  message: error.message
1033
89
  });
1034
- } finally {
1035
- setLoading(false);
1036
90
  }
1037
- }, [setLoading, setScreen, addNotification]);
1038
- const onConfirmSignUp = React5.useCallback(async ({
91
+ }, [setScreen, addNotification]);
92
+ const onConfirmSignUpWithCode = React.useCallback(async ({
1039
93
  email,
1040
94
  code
1041
95
  }) => {
1042
96
  try {
1043
- setLoading(true);
1044
97
  await confirmSignUp({
1045
98
  confirmationCode: code,
1046
99
  username: email
1047
100
  });
1048
101
  setScreen({
1049
- value: "signIn",
1050
- context: {
1051
- email
1052
- }
102
+ value: "signIn"
1053
103
  });
1054
104
  } catch (error) {
1055
105
  addNotification({
1056
106
  type: "error",
1057
107
  message: error.message
1058
108
  });
1059
- } finally {
1060
- setLoading(false);
1061
109
  }
1062
- }, [setLoading, setScreen, addNotification]);
1063
- const onReturnToSignIn = React5.useCallback(() => {
1064
- setScreen({
1065
- value: "signIn",
1066
- context: {}
1067
- });
1068
- }, [setScreen]);
1069
- const onForgotPassword = React5.useCallback(async ({
110
+ }, [setScreen, addNotification]);
111
+ const onForgotPassword = React.useCallback(async ({
1070
112
  email
1071
113
  }) => {
1072
114
  try {
1073
- setLoading(true);
1074
115
  await resetPassword({
1075
116
  username: email
1076
117
  });
1077
118
  setScreen({
1078
- value: "forgotPasswordResetPassword",
119
+ value: "confirmResetPassword",
1079
120
  context: {
1080
121
  email
1081
122
  }
@@ -1085,142 +126,108 @@ var AuthLogic = props => {
1085
126
  type: "error",
1086
127
  message: error.message
1087
128
  });
1088
- } finally {
1089
- setLoading(false);
1090
129
  }
1091
- }, [setLoading, setScreen, addNotification]);
1092
- const onForgotPasswordResetPassword = React5.useCallback(async ({
130
+ }, [setScreen, addNotification]);
131
+ const onForgotPasswordResetPassword = React.useCallback(async ({
1093
132
  email,
1094
133
  code,
1095
134
  newPassword
1096
135
  }) => {
1097
136
  try {
1098
- setLoading(true);
1099
137
  await confirmResetPassword({
1100
138
  confirmationCode: code,
1101
139
  username: email,
1102
140
  newPassword
1103
141
  });
1104
142
  setScreen({
1105
- value: "signIn",
1106
- context: {
1107
- email
1108
- }
143
+ value: "signIn"
1109
144
  });
1110
145
  } catch (error) {
1111
146
  addNotification({
1112
147
  type: "error",
1113
148
  message: error.message
1114
149
  });
1115
- } finally {
1116
- setLoading(false);
1117
150
  }
1118
- }, [setLoading, setScreen, addNotification]);
1119
- if (isAuthenticated) {
1120
- return null;
1121
- }
1122
- if (screen.value === "signUp") {
1123
- return /* @__PURE__ */jsx10(AuthSignUp, {
1124
- onSignUp,
1125
- onReturnToSignIn,
1126
- signUpTerms: props.signUpTerms
1127
- });
1128
- }
1129
- if (screen.value === "signUpConfirm" || screen.value === "signUpResendConfirmation") {
1130
- return /* @__PURE__ */jsx10(AuthConfirmSignUp, {
1131
- onConfirmSignUp,
1132
- email: screen.context.email
1133
- });
1134
- }
1135
- if (screen.value === "forgotPassword") {
1136
- return /* @__PURE__ */jsx10(AuthForgotPassword, {
1137
- onForgotPassword,
1138
- onCancel: onReturnToSignIn,
1139
- onSignUp: () => {
1140
- setScreen({
1141
- value: "signUp",
1142
- context: {}
1143
- });
1144
- }
1145
- });
1146
- }
1147
- if (screen.value === "forgotPasswordResetPassword") {
1148
- return /* @__PURE__ */jsx10(AuthForgotPasswordResetPassword, {
1149
- email: screen.context.email,
1150
- onForgotPasswordResetPassword,
1151
- onCancel: onReturnToSignIn
1152
- });
1153
- }
1154
- return /* @__PURE__ */jsx10(AuthSignIn, {
151
+ }, [setScreen, addNotification]);
152
+ return /* @__PURE__ */jsx(AuthCore, {
153
+ screen,
154
+ setScreen,
1155
155
  onSignIn,
1156
- onSignUp: () => {
1157
- setScreen({
1158
- value: "signUp",
1159
- context: {}
1160
- });
156
+ onSignUp,
157
+ onConfirmSignUpWithCode,
158
+ onForgotPassword,
159
+ onForgotPasswordResetPassword,
160
+ signUpTerms: props.signUpTerms,
161
+ logo: props.logo,
162
+ layout: props.layout
163
+ });
164
+ };
165
+
166
+ // src/AuthProvider.tsx
167
+ import { AuthProvider as AuthProviderCore, useAuth } from "@ttoss/react-auth-core";
168
+ import { signOut } from "aws-amplify/auth";
169
+ import { Hub } from "aws-amplify/utils";
170
+ import * as React2 from "react";
171
+
172
+ // src/getAuthData.ts
173
+ import { fetchAuthSession, fetchUserAttributes, getCurrentUser } from "aws-amplify/auth";
174
+ var getAuthData = async ({
175
+ includeTokens
176
+ } = {}) => {
177
+ const currentUser = await getCurrentUser();
178
+ const [session, user] = await Promise.all([includeTokens ? fetchAuthSession() : Promise.resolve(null), fetchUserAttributes()]);
179
+ const idToken = session?.tokens?.idToken?.toString() ?? "";
180
+ const accessToken = session?.tokens?.accessToken?.toString() ?? "";
181
+ const refreshToken = "";
182
+ return {
183
+ user: {
184
+ id: currentUser.userId,
185
+ email: user.email ?? "",
186
+ emailVerified: user.email_verified === "true"
1161
187
  },
1162
- onForgotPassword: () => {
1163
- setScreen({
1164
- value: "forgotPassword",
1165
- context: {}
1166
- });
188
+ tokens: {
189
+ idToken,
190
+ accessToken,
191
+ refreshToken
1167
192
  },
1168
- defaultValues: {
1169
- email: screen.context.email
1170
- }
1171
- });
193
+ isAuthenticated: true
194
+ };
1172
195
  };
1173
- var Auth = props => {
1174
- const {
1175
- layout = {
1176
- fullScreen: true
1177
- }
1178
- } = props;
1179
- const withLogoNode = React5.useMemo(() => {
1180
- return /* @__PURE__ */jsx10(LogoProvider, {
1181
- logo: props.logo,
1182
- children: /* @__PURE__ */jsx10(ErrorBoundary, {
1183
- children: /* @__PURE__ */jsx10(AuthLogic, {
1184
- signUpTerms: props.signUpTerms
1185
- })
1186
- })
1187
- });
1188
- }, [props.logo, props.signUpTerms]);
1189
- if (layout.fullScreen) {
1190
- if (layout.sideContentPosition) {
1191
- return /* @__PURE__ */jsx10(AuthFullScreen, {
1192
- children: /* @__PURE__ */jsxs7(Flex5, {
1193
- sx: {
1194
- width: "100%",
1195
- height: "100%",
1196
- flexDirection: layout.sideContentPosition === "left" ? "row" : "row-reverse"
1197
- },
1198
- children: [/* @__PURE__ */jsx10(Flex5, {
1199
- sx: {
1200
- width: "100%",
1201
- height: "100%",
1202
- flex: [0, 0, 1],
1203
- justifyContent: "center",
1204
- alignItems: "center"
1205
- },
1206
- children: layout.sideContent
1207
- }), /* @__PURE__ */jsx10(Flex5, {
1208
- sx: {
1209
- width: "100%",
1210
- height: "100%",
1211
- flex: [1],
1212
- justifyContent: "center",
1213
- alignItems: "center"
1214
- },
1215
- children: withLogoNode
1216
- })]
1217
- })
196
+ var checkAuth = async () => {
197
+ try {
198
+ const currentUser = await getCurrentUser();
199
+ return !!currentUser;
200
+ } catch {
201
+ return false;
202
+ }
203
+ };
204
+
205
+ // src/AuthProvider.tsx
206
+ import { jsx as jsx2 } from "react/jsx-runtime";
207
+ var AuthProvider = props => {
208
+ const [authListenerCount, setAuthListenerCount] = React2.useState(0);
209
+ React2.useEffect(() => {
210
+ const listener = () => {
211
+ setAuthListenerCount(count => {
212
+ return count + 1;
1218
213
  });
214
+ };
215
+ const stopHubListener = Hub.listen("auth", listener);
216
+ return () => {
217
+ stopHubListener();
218
+ };
219
+ }, []);
220
+ const getAuthDataCallback = React2.useCallback(async () => {
221
+ try {
222
+ return getAuthData();
223
+ } catch {
224
+ return null;
1219
225
  }
1220
- return /* @__PURE__ */jsx10(AuthFullScreen, {
1221
- children: withLogoNode
1222
- });
1223
- }
1224
- return withLogoNode;
226
+ }, [authListenerCount]);
227
+ return /* @__PURE__ */jsx2(AuthProviderCore, {
228
+ getAuthData: getAuthDataCallback,
229
+ signOut,
230
+ children: props.children
231
+ });
1225
232
  };
1226
- export { Auth, AuthProvider, useAuth };
233
+ export { Auth, AuthProvider, checkAuth, getAuthData, useAuth };