UNPKG

7.98 kBTypeScriptView Raw
1import { FieldValues } from './fields';
2import { Control } from './form';
3import { FieldArrayPath, FieldArrayPathValue } from './path';
4import { RegisterOptions, Validate } from './validator';
5export type UseFieldArrayProps<TFieldValues extends FieldValues = FieldValues, TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>, TKeyName extends string = 'id'> = {
6 name: TFieldArrayName;
7 keyName?: TKeyName;
8 control?: Control<TFieldValues>;
9 rules?: {
10 validate?: Validate<FieldArray<TFieldValues, TFieldArrayName>[], TFieldValues> | Record<string, Validate<FieldArray<TFieldValues, TFieldArrayName>[], TFieldValues>>;
11 } & Pick<RegisterOptions<TFieldValues>, 'maxLength' | 'minLength' | 'required'>;
12 shouldUnregister?: boolean;
13};
14/**
15 * `useFieldArray` returned `fields` with unique id
16 */
17export type FieldArrayWithId<TFieldValues extends FieldValues = FieldValues, TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>, TKeyName extends string = 'id'> = FieldArray<TFieldValues, TFieldArrayName> & Record<TKeyName, string>;
18export type FieldArray<TFieldValues extends FieldValues = FieldValues, TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>> = FieldArrayPathValue<TFieldValues, TFieldArrayName> extends ReadonlyArray<infer U> | null | undefined ? U : never;
19/**
20 * `useFieldArray` focus option, ability to toggle focus on and off with `shouldFocus` and setting focus by either field index or name.
21 */
22export type FieldArrayMethodProps = {
23 shouldFocus?: boolean;
24 focusIndex?: number;
25 focusName?: string;
26};
27/**
28 * Swap field array by supplying from and to index
29 *
30 * @remarks
31 * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/calc-i231d)
32 *
33 * @param indexA - from index
34 * @param indexB - to index
35 *
36 * @example
37 * ```tsx
38 * <button type="button" onClick={() => swap(0, 1)}>swap</button>
39 * ```
40 */
41export type UseFieldArraySwap = (indexA: number, indexB: number) => void;
42/**
43 * Move field array by supplying from and to index
44 *
45 * @remarks
46 * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/calc-i231d)
47 *
48 * @param indexA - from index
49 * @param indexB - to index
50 *
51 * @example
52 * ```tsx
53 * <button type="button" onClick={() => move(0, 1)}>swap</button>
54 * ```
55 */
56export type UseFieldArrayMove = (indexA: number, indexB: number) => void;
57/**
58 * Prepend field/fields to the start of the fields and optionally focus. The input value will be registered during this action.
59 *
60 * @remarks
61 * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/calc-i231d)
62 *
63 * @param value - prepend items or items
64 * @param options - focus options
65 *
66 * @example
67 * ```tsx
68 * <button type="button" onClick={() => prepend({ name: "data" })}>Prepend</button>
69 * <button type="button" onClick={() => prepend({ name: "data" }, { shouldFocus: false })}>Prepend</button>
70 * <button
71 * type="button"
72 * onClick={() => prepend([{ name: "data" }, { name: "data" }])}
73 * >
74 * Prepend
75 * </button>
76 * ```
77 */
78export type UseFieldArrayPrepend<TFieldValues extends FieldValues, TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>> = (value: FieldArray<TFieldValues, TFieldArrayName> | FieldArray<TFieldValues, TFieldArrayName>[], options?: FieldArrayMethodProps) => void;
79/**
80 * Append field/fields to the end of your fields and focus. The input value will be registered during this action.
81 *
82 * @remarks
83 * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/calc-i231d)
84 *
85 * @param value - append items or items.
86 * @param options - focus options
87 *
88 * @example
89 * ```tsx
90 * <button type="button" onClick={() => append({ name: "data" })}>Append</button>
91 * <button type="button" onClick={() => append({ name: "data" }, { shouldFocus: false })}>Append</button>
92 * <button
93 * type="button"
94 * onClick={() => append([{ name: "data" }, { name: "data" }])}
95 * >
96 * Append
97 * </button>
98 * ```
99 */
100export type UseFieldArrayAppend<TFieldValues extends FieldValues, TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>> = (value: FieldArray<TFieldValues, TFieldArrayName> | FieldArray<TFieldValues, TFieldArrayName>[], options?: FieldArrayMethodProps) => void;
101/**
102 * Remove field/fields at particular position.
103 *
104 * @remarks
105 * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/calc-i231d)
106 *
107 * @param index - index to remove at, or remove all when no index provided.
108 *
109 * @example
110 * ```tsx
111 * <button type="button" onClick={() => remove(0)}>Remove</button>
112 * <button
113 * type="button"
114 * onClick={() => remove()}
115 * >
116 * Remove all
117 * </button>
118 * ```
119 */
120export type UseFieldArrayRemove = (index?: number | number[]) => void;
121/**
122 * Insert field/fields at particular position and focus.
123 *
124 * @remarks
125 * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/calc-i231d)
126 *
127 * @param index - insert position
128 * @param value - insert field or fields
129 * @param options - focus options
130 *
131 * @example
132 * ```tsx
133 * <button type="button" onClick={() => insert(1, { name: "data" })}>Insert</button>
134 * <button type="button" onClick={() => insert(1, { name: "data" }, { shouldFocus: false })}>Insert</button>
135 * <button
136 * type="button"
137 * onClick={() => insert(1, [{ name: "data" }, { name: "data" }])}
138 * >
139 * Insert
140 * </button>
141 * ```
142 */
143export type UseFieldArrayInsert<TFieldValues extends FieldValues, TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>> = (index: number, value: FieldArray<TFieldValues, TFieldArrayName> | FieldArray<TFieldValues, TFieldArrayName>[], options?: FieldArrayMethodProps) => void;
144/**
145 * Update field/fields at particular position.
146 *
147 * @remarks
148 * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/calc-i231d)
149 *
150 * @param index - insert position
151 * @param value - insert field or fields
152 *
153 * @example
154 * ```tsx
155 * <button type="button" onClick={() => update(1, { name: "data" })}>Update</button>
156 * <button
157 * type="button"
158 * onClick={() => update(1, [{ name: "data" }, { name: "data" }])}
159 * >
160 * Update
161 * </button>
162 * ```
163 */
164export type UseFieldArrayUpdate<TFieldValues extends FieldValues, TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>> = (index: number, value: FieldArray<TFieldValues, TFieldArrayName>) => void;
165/**
166 * Replace the entire field array values.
167 *
168 * @remarks
169 * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/calc-i231d)
170 *
171 * @param value - the entire field values.
172 *
173 * @example
174 * ```tsx
175 * <button
176 * type="button"
177 * onClick={() => replace([{ name: "data" }, { name: "data" }])}
178 * >
179 * Replace
180 * </button>
181 * ```
182 */
183export type UseFieldArrayReplace<TFieldValues extends FieldValues, TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>> = (value: FieldArray<TFieldValues, TFieldArrayName> | FieldArray<TFieldValues, TFieldArrayName>[]) => void;
184export type UseFieldArrayReturn<TFieldValues extends FieldValues = FieldValues, TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>, TKeyName extends string = 'id'> = {
185 swap: UseFieldArraySwap;
186 move: UseFieldArrayMove;
187 prepend: UseFieldArrayPrepend<TFieldValues, TFieldArrayName>;
188 append: UseFieldArrayAppend<TFieldValues, TFieldArrayName>;
189 remove: UseFieldArrayRemove;
190 insert: UseFieldArrayInsert<TFieldValues, TFieldArrayName>;
191 update: UseFieldArrayUpdate<TFieldValues, TFieldArrayName>;
192 replace: UseFieldArrayReplace<TFieldValues, TFieldArrayName>;
193 fields: FieldArrayWithId<TFieldValues, TFieldArrayName, TKeyName>[];
194};
195//# sourceMappingURL=fieldArray.d.ts.map
\No newline at end of file