Skip to content

Commit bfdf1a8

Browse files
elonehooelonehoo
committed
feat: add type
1 parent 2fee990 commit bfdf1a8

File tree

10 files changed

+1131
-0
lines changed

10 files changed

+1131
-0
lines changed

‎packages/vue-composition-form/src/types/errors.ts‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import type { Ref } from 'vue'
2+
import type { RegisterOptions } from './validator'
3+
import type { FieldElement } from './filed'
4+
5+
export type FieldError = Partial<{
6+
type: keyof RegisterOptions | string
7+
// types?: MultipleFieldErrors
8+
message?: string
9+
ref?: Ref<FieldElement>
10+
}>
11+
12+
export type FieldErrors<TFieldValues> = Partial<
13+
Record<keyof TFieldValues, FieldError>
14+
>

‎packages/vue-composition-form/src/types/fieldArray.ts‎

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
import type { FieldArrayPathValue } from './path/path';
2+
import type { FieldArrayPath , FieldPath } from './path'
3+
import type { FieldValues } from './filed'
4+
import type { UseFormControl } from './form'
5+
6+
export interface UseFieldArrayField<
7+
TFieldValues extends FieldValues = FieldValues,
8+
FieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
9+
> {
10+
index: number
11+
name: FieldName
12+
}
13+
14+
export type UseFieldArrayProps<
15+
TFieldValues extends FieldValues = FieldValues,
16+
TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>,
17+
TKeyName extends string = 'id',
18+
> = {
19+
name: TFieldArrayName;
20+
keyName?: TKeyName;
21+
control?: UseFormControl<TFieldValues>;
22+
shouldUnregister?: boolean;
23+
};
24+
25+
export type FieldArray<
26+
TFieldValues extends FieldValues = FieldValues,
27+
TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>,
28+
> = FieldArrayPathValue<TFieldValues, TFieldArrayName> extends
29+
| ReadonlyArray<infer U>
30+
| null
31+
| undefined
32+
? U
33+
: never;
34+
35+
36+
export type FieldPayload<
37+
TFieldValues extends FieldValues[] = FieldValues[],
38+
TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
39+
> = TFieldName
40+
41+
export interface FieldArrayMethodOptions {
42+
/**
43+
* should focus when field update
44+
*
45+
* @default false
46+
*/
47+
shouldFocus?: boolean
48+
}
49+
50+
export type UseFieldArrayInsert<TFieldValues extends FieldValues[]> = (
51+
startIndex: number,
52+
field: FieldPayload<TFieldValues>
53+
) => void
54+
55+
export type UseFieldArrayAppend<TFieldValues extends FieldValues[]> = (
56+
field: FieldPayload<TFieldValues>,
57+
options?: FieldArrayMethodOptions,
58+
) => void
59+
60+
export type UseFieldArrayPrepend<TFieldValues extends FieldValues[]> = (
61+
field: FieldPayload<TFieldValues>,
62+
options?: FieldArrayMethodOptions,
63+
) => void
64+
65+
export type UseFieldArrayRemove = (id: number | number[]) => void
66+
67+
export type UseFieldArraySwap = (from: number, to: number) => void
68+
69+
export interface UseFieldArrayReturn<FieldValues> {
70+
insert: UseFieldArrayInsert<FieldValues[]>
71+
remove: UseFieldArrayRemove
72+
prepend: UseFieldArrayPrepend<FieldValues[]>
73+
append: UseFieldArrayAppend<FieldValues[]>
74+
swap: UseFieldArraySwap
75+
fields: UseFieldArrayField<FieldValues>[]
76+
}

‎packages/vue-composition-form/src/types/filed.ts‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import type { Ref } from 'vue'
2+
import type { RegisterOptions } from './validator'
3+
import type { FieldError } from './errors'
4+
5+
export type FieldValues = Record<string, any>
6+
7+
export type FieldElement =
8+
| HTMLInputElement
9+
| HTMLSelectElement
10+
| HTMLTextAreaElement
11+
12+
export interface Field {
13+
inputValue: Ref
14+
el: Ref<FieldElement>
15+
rule: RegisterOptions
16+
isDirty: boolean
17+
isUnregistered: boolean
18+
}
19+
20+
export interface FieldState {
21+
isDirty: boolean
22+
isTouched: boolean
23+
invalid: boolean
24+
error?: FieldError
25+
}
26+
27+
export type Fields<
28+
FieldValues extends object,
29+
FieldKeys extends keyof FieldValues
30+
> = Record<FieldKeys, Field>

‎packages/vue-composition-form/src/types/form.ts‎

Lines changed: 226 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,226 @@
1+
import type { ToRefs } from 'vue'
2+
import type { FieldValues, Fields } from './filed'
3+
import type { Resolver } from './resolver'
4+
import type {
5+
DeepMap,
6+
DeepPartial,
7+
DefaultValues,
8+
UnpackNestedValue,
9+
} from './utils'
10+
import type { FieldError, FieldErrors } from './errors'
11+
import type { RegisterOptions } from './validator'
12+
import type { FieldPath, FieldPathValue } from './path'
13+
14+
export type Mode = 'onSubmit' | 'onBlur' | 'onChange' | 'onTouched' | 'all'
15+
16+
export type CriteriaMode = 'firstError' | 'all'
17+
18+
export type FieldNamesMarkedBoolean<TFieldValues extends FieldValues> = DeepMap<
19+
DeepPartial<TFieldValues>,
20+
boolean
21+
>
22+
23+
declare const $NestedValue: unique symbol
24+
25+
export type NestedValue<TValue extends object = object> = {
26+
[$NestedValue]: never
27+
} & TValue
28+
29+
export interface UseFormProps<TFieldValues extends object> {
30+
mode: Mode
31+
reValidateMode: Exclude<Mode, 'onTouched' | 'all'>
32+
defaultValues: Partial<DefaultValues<TFieldValues>>
33+
resolver: Resolver<TFieldValues>
34+
shouldFocusError: boolean
35+
shouldUnregister: boolean
36+
criteriaMode: CriteriaMode
37+
delayError: number
38+
}
39+
40+
export type KeepStateOptions = Partial<{
41+
keepDirtyValues: boolean
42+
keepErrors: boolean
43+
keepDirty: boolean
44+
keepValues: boolean
45+
keepDefaultValues: boolean
46+
keepIsSubmitted: boolean
47+
keepIsValid: boolean
48+
keepSubmitCount: boolean
49+
}>
50+
51+
export type SubmitHandler<TFieldValues extends FieldValues> = (
52+
data: UnpackNestedValue<TFieldValues>,
53+
event?: Event
54+
) => any | Promise<any>
55+
56+
export type SubmitErrorHandler<TFieldValues extends FieldValues> = (
57+
errors: FieldErrors<TFieldValues>,
58+
event?: Event
59+
) => any | Promise<any>
60+
61+
export type UseFormHandleSubmit<TFieldValues extends FieldValues> = (
62+
onValid: SubmitHandler<TFieldValues>,
63+
onInvalid?: SubmitErrorHandler<TFieldValues>
64+
) => (e?: Event) => Promise<void>
65+
66+
export type UseFormClearErrors<FieldName> = (
67+
fieldName?: FieldName | FieldName[]
68+
) => void
69+
70+
export type GetValuesReturn<TFieldValues extends FieldValues> = {
71+
[K in keyof TFieldValues]: TFieldValues[K] extends NestedValue<infer U>
72+
? U
73+
: TFieldValues[K]
74+
}
75+
76+
export type UseFormGetValues<FieldValues, FieldKeys> = (
77+
fieldNames?: FieldKeys | FieldKeys[]
78+
) => GetValuesReturn<FieldValues>
79+
80+
export interface GetFieldStateReturn {
81+
isDirty: boolean
82+
isValid: boolean
83+
error?: FieldError
84+
}
85+
86+
export type UseFormGetFieldState<FieldKeys> = (
87+
fieldName: FieldKeys
88+
) => GetFieldStateReturn
89+
90+
export type UseFormSetError<FieldName> = (
91+
name: FieldName,
92+
error: FieldError,
93+
config?: { shouldFocusError: boolean }
94+
) => void
95+
96+
export type UseFormSetValue<TFieldValues extends FieldValues> = <
97+
TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
98+
>(
99+
name: TFieldName,
100+
value: FieldPathValue<TFieldValues, TFieldName>,
101+
options?: {
102+
shouldValidate?: boolean
103+
shouldDirty?: boolean
104+
}
105+
) => Promise<void>
106+
107+
export type UseFormTriggerValidateOptions = {
108+
shouldFocus?: boolean
109+
}
110+
111+
export type UseFormTriggerValidate<
112+
TFieldValues extends FieldValues,
113+
FieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
114+
> = (
115+
fieldNames?: FieldName | FieldName[],
116+
options?: UseFormTriggerValidateOptions
117+
) => Promise<void>
118+
119+
export type UseFormResetField<TFieldValues extends FieldValues> = <
120+
TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
121+
>(
122+
name: TFieldName,
123+
options?: Partial<{
124+
keepDirty: boolean
125+
keepTouched: boolean
126+
keepError: boolean
127+
defaultValue: any
128+
}>
129+
) => void
130+
131+
export type UseFormReset<TFieldValues extends FieldValues> = (
132+
values?:
133+
| DefaultValues<TFieldValues>
134+
| UnpackNestedValue<TFieldValues>
135+
| 'all',
136+
keepStateOptions?: KeepStateOptions
137+
) => void
138+
139+
export type UseFormUnregister<TFieldValues extends FieldValues> = <
140+
TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
141+
>(
142+
name?: TFieldName,
143+
options?: Omit<
144+
KeepStateOptions,
145+
| 'keepIsSubmitted'
146+
| 'keepSubmitCount'
147+
| 'keepValues'
148+
| 'keepDefaultValues'
149+
| 'keepErrors'
150+
| 'keepIsValid'
151+
| 'keepDirtyValues'
152+
> & { keepValue?: boolean; keepError?: boolean }
153+
) => void
154+
155+
export interface UseFormRegisterReturn<
156+
T,
157+
BaseType = string | Date | number | T
158+
> {
159+
value: BaseType
160+
onInput: (e: InputEvent) => void
161+
modelValue: BaseType
162+
'onUpdate:modelValue': (input: any) => void
163+
}
164+
165+
// TODO solve register returnType problem
166+
export type UseFormRegister<TFieldValues extends FieldValues> = <
167+
TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
168+
>(
169+
name: TFieldName,
170+
options?: RegisterOptions<TFieldValues>
171+
) => any // UseFormRegisterReturn<TFieldName>
172+
173+
export type UseFormSetFocus<
174+
TFieldValues extends FieldValues,
175+
FieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
176+
> = (name: FieldName) => void
177+
178+
export type UseFormIsExistInErrors<
179+
TFieldValues extends FieldValues,
180+
FieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
181+
> = (name: FieldName) => boolean
182+
183+
export interface UseFormHandlers<
184+
TFieldValues extends FieldValues,
185+
FieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
186+
> {
187+
getValues: UseFormGetValues<TFieldValues, FieldName>
188+
getFieldState: UseFormGetFieldState<FieldName>
189+
setError: UseFormSetError<FieldName>
190+
clearErrors: UseFormClearErrors<FieldName>
191+
setValue: UseFormSetValue<TFieldValues>
192+
triggerValidate: UseFormTriggerValidate<FieldName>
193+
reset: UseFormReset<TFieldValues>
194+
handleSubmit: UseFormHandleSubmit<TFieldValues>
195+
unregister: UseFormUnregister<TFieldValues>
196+
register: UseFormRegister<TFieldValues>
197+
setFocus: UseFormSetFocus<FieldName>
198+
isExistInErrors: UseFormIsExistInErrors<FieldName>
199+
}
200+
201+
export type FieldArrayDefaultValues = Record<number, any>
202+
203+
export type UseFormControl<TFieldValues extends FieldValues> = {
204+
_formState: ToRefs<FormState<TFieldValues>>
205+
_fieldArrayDefaultValues: FieldArrayDefaultValues
206+
_fields: Fields<TFieldValues, keyof TFieldValues>
207+
} & UseFormHandlers<TFieldValues>
208+
209+
export type UseFormReturn<TFieldValues extends FieldValues> = {
210+
control: UseFormControl<TFieldValues>
211+
formState: ToRefs<FormState<TFieldValues>>
212+
fields: Fields<TFieldValues, keyof TFieldValues>
213+
} & UseFormHandlers<TFieldValues>
214+
215+
export interface FormState<TFieldValues> {
216+
isDirty: boolean
217+
dirtyFields: FieldNamesMarkedBoolean<TFieldValues>
218+
isSubmitted: boolean
219+
isSubmitSuccessful: boolean
220+
submitCount: number
221+
isSubmitting: boolean
222+
isValidating: boolean
223+
isValid: boolean
224+
defaultValues: DefaultValues<TFieldValues>
225+
errors: FieldErrors<TFieldValues>
226+
}

0 commit comments

Comments
 (0)