@uniai-fe/uds-templates 0.1.8 → 0.1.9
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/package.json
CHANGED
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
import { useMemo } from "react";
|
|
4
4
|
import { useWatch } from "react-hook-form";
|
|
5
5
|
import type { ReactNode } from "react";
|
|
6
|
+
import { DEFAULT_PASSWORD_RULES } from "../../common/password/constants";
|
|
7
|
+
import type { AuthPasswordRule } from "../../common/password/types";
|
|
6
8
|
import type {
|
|
7
9
|
AuthSignupAccountFields,
|
|
8
10
|
AuthSignupAccountValues,
|
|
@@ -26,6 +28,7 @@ export function useSignupAccountForm<
|
|
|
26
28
|
fields,
|
|
27
29
|
form,
|
|
28
30
|
onSubmit,
|
|
31
|
+
passwordRules,
|
|
29
32
|
}: UseSignupAccountFormOptions<TFields>): UseSignupAccountFormReturn<TFields> {
|
|
30
33
|
const values = useWatch({ control: form.control }) as
|
|
31
34
|
| AuthSignupAccountValues
|
|
@@ -82,13 +85,45 @@ export function useSignupAccountForm<
|
|
|
82
85
|
);
|
|
83
86
|
}, [confirmFieldName, fields, form, passwordFieldName]);
|
|
84
87
|
|
|
88
|
+
const passwordValue =
|
|
89
|
+
(values?.[passwordFieldName] as string | undefined) ?? "";
|
|
90
|
+
const confirmPasswordValue =
|
|
91
|
+
(values?.[confirmFieldName] as string | undefined) ?? "";
|
|
92
|
+
|
|
93
|
+
const normalizedPasswordRules: AuthPasswordRule[] =
|
|
94
|
+
passwordRules && passwordRules.length > 0
|
|
95
|
+
? passwordRules
|
|
96
|
+
: DEFAULT_PASSWORD_RULES;
|
|
97
|
+
|
|
98
|
+
const arePasswordRulesFulfilled =
|
|
99
|
+
normalizedPasswordRules.length > 0
|
|
100
|
+
? normalizedPasswordRules.every(rule => {
|
|
101
|
+
if (typeof rule.fulfilled === "boolean") {
|
|
102
|
+
return rule.fulfilled;
|
|
103
|
+
}
|
|
104
|
+
if (typeof rule.predicate === "function") {
|
|
105
|
+
return rule.predicate(passwordValue);
|
|
106
|
+
}
|
|
107
|
+
return false;
|
|
108
|
+
})
|
|
109
|
+
: true;
|
|
110
|
+
|
|
111
|
+
const isConfirmMatched =
|
|
112
|
+
passwordValue.trim().length > 0 &&
|
|
113
|
+
confirmPasswordValue.trim().length > 0 &&
|
|
114
|
+
confirmPasswordValue === passwordValue;
|
|
115
|
+
|
|
85
116
|
const trimmedFilled =
|
|
86
117
|
values &&
|
|
87
118
|
Object.values(values).every(value =>
|
|
88
119
|
typeof value === "string" ? value.trim().length > 0 : false,
|
|
89
120
|
);
|
|
90
121
|
|
|
91
|
-
const disabled =
|
|
122
|
+
const disabled =
|
|
123
|
+
form.formState.isSubmitting ||
|
|
124
|
+
!trimmedFilled ||
|
|
125
|
+
!arePasswordRulesFulfilled ||
|
|
126
|
+
!isConfirmMatched;
|
|
92
127
|
|
|
93
128
|
const onSubmitHandler = form.handleSubmit(onSubmit);
|
|
94
129
|
|
|
@@ -47,17 +47,6 @@ export function AuthSignupAccountForm({
|
|
|
47
47
|
defaultValues,
|
|
48
48
|
});
|
|
49
49
|
|
|
50
|
-
const {
|
|
51
|
-
register,
|
|
52
|
-
helpers,
|
|
53
|
-
disabled,
|
|
54
|
-
onSubmit: handleSubmit,
|
|
55
|
-
} = useSignupAccountForm({
|
|
56
|
-
fields,
|
|
57
|
-
form,
|
|
58
|
-
onSubmit,
|
|
59
|
-
});
|
|
60
|
-
|
|
61
50
|
const passwordFieldName =
|
|
62
51
|
(fields.password.attr?.name as keyof AuthSignupAccountValues | undefined) ??
|
|
63
52
|
("password" as keyof AuthSignupAccountValues);
|
|
@@ -71,6 +60,18 @@ export function AuthSignupAccountForm({
|
|
|
71
60
|
? passwordRules
|
|
72
61
|
: DEFAULT_PASSWORD_RULES;
|
|
73
62
|
|
|
63
|
+
const {
|
|
64
|
+
register,
|
|
65
|
+
helpers,
|
|
66
|
+
disabled,
|
|
67
|
+
onSubmit: handleSubmit,
|
|
68
|
+
} = useSignupAccountForm({
|
|
69
|
+
fields,
|
|
70
|
+
form,
|
|
71
|
+
onSubmit,
|
|
72
|
+
passwordRules: resolvedPasswordRules,
|
|
73
|
+
});
|
|
74
|
+
|
|
74
75
|
return (
|
|
75
76
|
<FormProvider {...form}>
|
|
76
77
|
<form
|
|
@@ -5,7 +5,6 @@ import type {
|
|
|
5
5
|
AuthSignupStepIndicatorItem,
|
|
6
6
|
AuthSignupTemplateProps,
|
|
7
7
|
} from "../types";
|
|
8
|
-
import type { AuthSignupStepId } from "../types";
|
|
9
8
|
import { AuthSignupUserInfoForm } from "./UserInfoForm";
|
|
10
9
|
import { AuthSignupVerificationForm } from "./VerificationForm";
|
|
11
10
|
import { AuthSignupAccountForm } from "./AccountForm";
|
|
@@ -19,13 +18,6 @@ const DEFAULT_STEPS: AuthSignupStepIndicatorItem[] = [
|
|
|
19
18
|
{ id: "complete", label: "완료" },
|
|
20
19
|
];
|
|
21
20
|
|
|
22
|
-
const STEP_INDEX: Record<AuthSignupStepId, number> = {
|
|
23
|
-
userInfo: 0,
|
|
24
|
-
verifyAgreement: 1,
|
|
25
|
-
generateAccount: 2,
|
|
26
|
-
complete: 3,
|
|
27
|
-
};
|
|
28
|
-
|
|
29
21
|
/**
|
|
30
22
|
* 회원가입 템플릿; Step1~4 화면을 AuthContainer 위에서 전환한다.
|
|
31
23
|
* @component
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { ReactNode } from "react";
|
|
2
2
|
import type { InputState } from "@uniai-fe/uds-primitives";
|
|
3
|
+
import type { AuthPasswordRule } from "../../common/password/types";
|
|
3
4
|
import type {
|
|
4
5
|
AuthSignupFieldProps,
|
|
5
6
|
AuthSignupUserInfoFields,
|
|
@@ -73,6 +74,7 @@ export interface UseSignupAccountFormOptions<
|
|
|
73
74
|
fields: TFields;
|
|
74
75
|
form: UseFormReturn<AuthSignupAccountValues>;
|
|
75
76
|
onSubmit: SubmitHandler<AuthSignupAccountValues>;
|
|
77
|
+
passwordRules?: AuthPasswordRule[];
|
|
76
78
|
}
|
|
77
79
|
|
|
78
80
|
export interface UseSignupAccountFormReturn<
|