@radicalbit/formbit 2.0.0 → 3.0.0
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/README.md +517 -649
- package/dist/__tests__/is-validation-error.test.d.ts +1 -0
- package/dist/formbit-context.d.ts +4 -4
- package/dist/index.d.ts +1 -0
- package/dist/index.js +13 -13
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +13 -13
- package/dist/index.modern.js.map +1 -1
- package/dist/types/index.d.ts +135 -387
- package/dist/use-execute-callbacks.d.ts +2 -2
- package/dist/use-formbit.d.ts +5 -5
- package/dist/validate-sync-all.d.ts +2 -2
- package/package.json +4 -3
package/README.md
CHANGED
|
@@ -9,51 +9,20 @@ Formbit is a **lightweight React state form library** designed to simplify form
|
|
|
9
9
|
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
|
|
10
10
|
|
|
11
11
|
- [Features](#features)
|
|
12
|
-
- [Abstract](#abstract)
|
|
13
12
|
- [Install](#install)
|
|
14
|
-
- [Getting
|
|
13
|
+
- [Getting Started](#getting-started)
|
|
14
|
+
- [Usage Patterns](#usage-patterns)
|
|
15
|
+
- [Context Provider](#context-provider)
|
|
16
|
+
- [Edit / Initialize Pattern](#edit--initialize-pattern)
|
|
17
|
+
- [Multi-Step Form](#multi-step-form)
|
|
15
18
|
- [Local Development](#local-development)
|
|
16
|
-
- [
|
|
17
|
-
- [Check](#check)
|
|
18
|
-
- [CheckFnOptions](#checkfnoptions)
|
|
19
|
-
- [ClearIsDirty](#clearisdirty)
|
|
20
|
-
- [ErrorCallback](#errorcallback)
|
|
21
|
-
- [ErrorCheckCallback](#errorcheckcallback)
|
|
22
|
-
- [ErrorFn](#errorfn)
|
|
23
|
-
- [Errors](#errors)
|
|
24
|
-
- [Form](#form)
|
|
19
|
+
- [API Reference](#api-reference)
|
|
25
20
|
- [FormbitObject](#formbitobject)
|
|
26
|
-
- [
|
|
27
|
-
- [
|
|
28
|
-
- [
|
|
29
|
-
- [
|
|
30
|
-
- [
|
|
31
|
-
- [IsFormValid](#isformvalid)
|
|
32
|
-
- [LiveValidation](#livevalidation)
|
|
33
|
-
- [LiveValidationFn](#livevalidationfn)
|
|
34
|
-
- [Object](#object)
|
|
35
|
-
- [Remove](#remove)
|
|
36
|
-
- [RemoveAll](#removeall)
|
|
37
|
-
- [ResetForm](#resetform)
|
|
38
|
-
- [SetError](#seterror)
|
|
39
|
-
- [SetSchema](#setschema)
|
|
40
|
-
- [SubmitForm](#submitform)
|
|
41
|
-
- [SuccessCallback](#successcallback)
|
|
42
|
-
- [SuccessCheckCallback](#successcheckcallback)
|
|
43
|
-
- [SuccessSubmitCallback](#successsubmitcallback)
|
|
44
|
-
- [Validate](#validate)
|
|
45
|
-
- [ValidateAll](#validateall)
|
|
46
|
-
- [ValidateFnOptions](#validatefnoptions)
|
|
47
|
-
- [ValidateForm](#validateform)
|
|
48
|
-
- [ValidateOptions](#validateoptions)
|
|
49
|
-
- [ValidationError](#validationerror)
|
|
50
|
-
- [ValidationFormbitError](#validationformbiterror)
|
|
51
|
-
- [ValidationSchema](#validationschema)
|
|
52
|
-
- [Write](#write)
|
|
53
|
-
- [WriteAll](#writeall)
|
|
54
|
-
- [WriteAllValue](#writeallvalue)
|
|
55
|
-
- [WriteFnOptions](#writefnoptions)
|
|
56
|
-
- [Writer](#writer)
|
|
21
|
+
- [Core Types](#core-types)
|
|
22
|
+
- [Callback Types](#callback-types)
|
|
23
|
+
- [Method Types](#method-types)
|
|
24
|
+
- [Options Types](#options-types)
|
|
25
|
+
- [Yup Re-Exports](#yup-re-exports)
|
|
57
26
|
- [License](#license)
|
|
58
27
|
|
|
59
28
|
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
|
|
@@ -64,13 +33,10 @@ Formbit is a **lightweight React state form library** designed to simplify form
|
|
|
64
33
|
|
|
65
34
|
- Intuitive and easy-to-use form state management.
|
|
66
35
|
- Out of the box support for validation with [yup](https://github.com/jquense/yup).
|
|
67
|
-
-
|
|
68
|
-
-
|
|
69
|
-
-
|
|
70
|
-
|
|
71
|
-
## Abstract
|
|
72
|
-
|
|
73
|
-
The concept behind Formbit is to offer a lightweight library that assists you in managing all aspects of form state and error handling, while allowing you the flexibility to choose how to design the UI. It seamlessly integrates with various UI frameworks such as Antd, MaterialUI, or even plain HTML, as it provides solely a React hook that exposes methods to manage the form's React state. The responsibility of designing the UI remains entirely yours.
|
|
36
|
+
- Full **TypeScript generics** — `useFormbit<FormData>(...)` infers paths, values, and callbacks.
|
|
37
|
+
- Support for handling complex forms with dynamic and nested fields via **dot-path notation**.
|
|
38
|
+
- **Context Provider** for sharing form state across deeply nested component trees.
|
|
39
|
+
- Seamless and flexible integration with React — works with Antd, MaterialUI, or plain HTML.
|
|
74
40
|
|
|
75
41
|
## Install
|
|
76
42
|
|
|
@@ -82,65 +48,68 @@ npm install --save formbit
|
|
|
82
48
|
yarn add formbit
|
|
83
49
|
```
|
|
84
50
|
|
|
85
|
-
## Getting
|
|
51
|
+
## Getting Started
|
|
52
|
+
|
|
53
|
+
Three steps: **define a schema**, **call the hook**, **bind the UI**.
|
|
86
54
|
|
|
87
|
-
```
|
|
55
|
+
```tsx
|
|
88
56
|
import * as yup from 'yup';
|
|
89
|
-
import useFormbit from 'formbit';
|
|
57
|
+
import useFormbit from '@radicalbit/formbit';
|
|
90
58
|
|
|
91
|
-
|
|
59
|
+
// 1. Define a Yup schema and infer the TypeScript type from it
|
|
60
|
+
const schema = yup.object({
|
|
61
|
+
name: yup.string().max(25, 'Max 25 characters').required('Name is required'),
|
|
62
|
+
age: yup.number().max(120, 'Must be 0–120').required('Age is required'),
|
|
63
|
+
});
|
|
92
64
|
|
|
93
|
-
|
|
94
|
-
name: yup
|
|
95
|
-
.string()
|
|
96
|
-
.max(25, 'Name max length is 25 characters')
|
|
97
|
-
.required('Name is required'),
|
|
65
|
+
type FormData = yup.InferType<typeof schema>;
|
|
98
66
|
|
|
99
|
-
|
|
100
|
-
.number()
|
|
101
|
-
.max(120, 'Age must be between 0 and 120')
|
|
102
|
-
.required('Age is required')
|
|
103
|
-
});
|
|
67
|
+
const initialValues: Partial<FormData> = { name: undefined, age: undefined };
|
|
104
68
|
|
|
69
|
+
// 2. Call the hook with generics so every callback is fully typed
|
|
105
70
|
function Example() {
|
|
106
|
-
const { form, submitForm, write, error,
|
|
71
|
+
const { form, submitForm, write, error, isDirty } = useFormbit<FormData>({
|
|
107
72
|
initialValues,
|
|
108
|
-
yup: schema
|
|
73
|
+
yup: schema,
|
|
109
74
|
});
|
|
110
75
|
|
|
111
|
-
const handleChangeName = ({ target: { value } }) => {
|
|
112
|
-
|
|
76
|
+
const handleChangeName = ({ target: { value } }: React.ChangeEvent<HTMLInputElement>) => {
|
|
77
|
+
write('name', value);
|
|
78
|
+
};
|
|
79
|
+
|
|
80
|
+
const handleChangeAge = ({ target: { value } }: React.ChangeEvent<HTMLInputElement>) => {
|
|
81
|
+
write('age', Number(value));
|
|
82
|
+
};
|
|
83
|
+
|
|
113
84
|
const handleSubmit = () => {
|
|
114
85
|
submitForm(
|
|
115
|
-
(
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
console.error("The validation errors are: ", writer.errors)
|
|
120
|
-
});
|
|
121
|
-
}
|
|
86
|
+
({ form }) => console.log('Validated form:', form),
|
|
87
|
+
({ errors }) => console.error('Validation errors:', errors),
|
|
88
|
+
);
|
|
89
|
+
};
|
|
122
90
|
|
|
91
|
+
// 3. Bind inputs, errors, and submit — Formbit stays out of your UI
|
|
123
92
|
return (
|
|
124
93
|
<div>
|
|
125
|
-
<label
|
|
94
|
+
<label htmlFor="name">Name</label>
|
|
126
95
|
<input
|
|
127
|
-
|
|
128
|
-
onChange={handleChangeName}
|
|
96
|
+
id="name"
|
|
129
97
|
type="text"
|
|
130
|
-
value={form.name}
|
|
98
|
+
value={form.name ?? ''}
|
|
99
|
+
onChange={handleChangeName}
|
|
131
100
|
/>
|
|
132
101
|
<div>{error('name')}</div>
|
|
133
102
|
|
|
134
|
-
<label
|
|
103
|
+
<label htmlFor="age">Age</label>
|
|
135
104
|
<input
|
|
136
|
-
|
|
137
|
-
onChange={handleChangeAge}
|
|
105
|
+
id="age"
|
|
138
106
|
type="number"
|
|
139
|
-
value={form.age}
|
|
107
|
+
value={form.age ?? ''}
|
|
108
|
+
onChange={handleChangeAge}
|
|
140
109
|
/>
|
|
141
110
|
<div>{error('age')}</div>
|
|
142
111
|
|
|
143
|
-
<button disabled={
|
|
112
|
+
<button disabled={!isDirty} onClick={handleSubmit} type="button">
|
|
144
113
|
Submit
|
|
145
114
|
</button>
|
|
146
115
|
</div>
|
|
@@ -150,320 +119,368 @@ function Example() {
|
|
|
150
119
|
export default Example;
|
|
151
120
|
```
|
|
152
121
|
|
|
153
|
-
##
|
|
154
|
-
For local development we suggest using [Yalc](https://github.com/wclr/yalc) to test your local version of formbit in your projects.
|
|
155
|
-
|
|
156
|
-
<!-- START_TYPES_DOC -->
|
|
157
|
-
## Type Aliases
|
|
158
|
-
|
|
159
|
-
### Check
|
|
160
|
-
|
|
161
|
-
Ƭ **Check**\<`Values`\>: (`json`: [`Form`](#form), `options?`: [`CheckFnOptions`](#checkfnoptions)\<`Values`\>) => [`ValidationError`](#validationerror)[] \| `undefined`
|
|
162
|
-
|
|
163
|
-
Checks the given json against the form schema and returns and array of errors.
|
|
164
|
-
It returns undefined if the json is valid.
|
|
122
|
+
## Usage Patterns
|
|
165
123
|
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
| Name | Type |
|
|
169
|
-
| :------ | :------ |
|
|
170
|
-
| `Values` | extends [`InitialValues`](#initialvalues) |
|
|
124
|
+
### Context Provider
|
|
171
125
|
|
|
172
|
-
|
|
126
|
+
Use `FormbitContextProvider` when you need to share form state across deeply nested components without prop drilling.
|
|
173
127
|
|
|
174
|
-
|
|
128
|
+
```tsx
|
|
129
|
+
import { FormbitContextProvider, useFormbitContext } from '@radicalbit/formbit';
|
|
130
|
+
import * as yup from 'yup';
|
|
175
131
|
|
|
176
|
-
|
|
132
|
+
const schema = yup.object({
|
|
133
|
+
name: yup.string().required('Name is required'),
|
|
134
|
+
surname: yup.string().required('Surname is required'),
|
|
135
|
+
age: yup.number().required('Age is required'),
|
|
136
|
+
});
|
|
177
137
|
|
|
178
|
-
|
|
179
|
-
| :------ | :------ |
|
|
180
|
-
| `json` | [`Form`](#form) |
|
|
181
|
-
| `options?` | [`CheckFnOptions`](#checkfnoptions)\<`Values`\> |
|
|
138
|
+
type FormData = yup.InferType<typeof schema>;
|
|
182
139
|
|
|
183
|
-
|
|
140
|
+
const initialValues: Partial<FormData> = { name: undefined, surname: undefined, age: undefined };
|
|
184
141
|
|
|
185
|
-
|
|
142
|
+
// Wrap your form tree with the provider
|
|
143
|
+
function App() {
|
|
144
|
+
return (
|
|
145
|
+
<FormbitContextProvider<FormData>
|
|
146
|
+
initialValues={initialValues}
|
|
147
|
+
yup={schema}
|
|
148
|
+
>
|
|
149
|
+
<NameField />
|
|
150
|
+
<SubmitButton />
|
|
151
|
+
</FormbitContextProvider>
|
|
152
|
+
);
|
|
153
|
+
}
|
|
186
154
|
|
|
187
|
-
|
|
155
|
+
// Any child can access form state without props
|
|
156
|
+
function NameField() {
|
|
157
|
+
const { form, write, error } = useFormbitContext<FormData>();
|
|
188
158
|
|
|
189
|
-
|
|
159
|
+
const handleChangeName = ({ target: { value } }: React.ChangeEvent<HTMLInputElement>) => {
|
|
160
|
+
write('name', value);
|
|
161
|
+
};
|
|
190
162
|
|
|
191
|
-
|
|
163
|
+
return (
|
|
164
|
+
<div>
|
|
165
|
+
<input
|
|
166
|
+
value={form.name ?? ''}
|
|
167
|
+
onChange={handleChangeName}
|
|
168
|
+
/>
|
|
169
|
+
<span>{error('name')}</span>
|
|
170
|
+
</div>
|
|
171
|
+
);
|
|
172
|
+
}
|
|
192
173
|
|
|
193
|
-
|
|
174
|
+
function SubmitButton() {
|
|
175
|
+
const { submitForm, isDirty } = useFormbitContext<FormData>();
|
|
194
176
|
|
|
195
|
-
|
|
177
|
+
return (
|
|
178
|
+
<button
|
|
179
|
+
disabled={!isDirty}
|
|
180
|
+
onClick={() => submitForm(({ form }) => console.log(form))}
|
|
181
|
+
>
|
|
182
|
+
Submit
|
|
183
|
+
</button>
|
|
184
|
+
);
|
|
185
|
+
}
|
|
186
|
+
```
|
|
196
187
|
|
|
197
|
-
|
|
188
|
+
### Edit / Initialize Pattern
|
|
198
189
|
|
|
199
|
-
|
|
190
|
+
Start with empty initial values and call `initialize()` once data arrives from an API.
|
|
200
191
|
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
192
|
+
```tsx
|
|
193
|
+
import { useEffect, useState } from 'react';
|
|
194
|
+
import useFormbit from '@radicalbit/formbit';
|
|
195
|
+
import * as yup from 'yup';
|
|
204
196
|
|
|
205
|
-
|
|
197
|
+
const schema = yup.object({
|
|
198
|
+
name: yup.string().required(),
|
|
199
|
+
email: yup.string().email().required(),
|
|
200
|
+
});
|
|
206
201
|
|
|
207
|
-
|
|
208
|
-
| :------ | :------ |
|
|
209
|
-
| `errorCallback?` | [`ErrorCheckCallback`](#errorcheckcallback)\<`Values`\> |
|
|
210
|
-
| `options?` | [`ValidateOptions`](#validateoptions) |
|
|
211
|
-
| `successCallback?` | [`SuccessCheckCallback`](#successcheckcallback)\<`Values`\> |
|
|
202
|
+
type FormData = yup.InferType<typeof schema>;
|
|
212
203
|
|
|
213
|
-
|
|
204
|
+
const initialValues: Partial<FormData> = { name: undefined, email: undefined };
|
|
214
205
|
|
|
215
|
-
|
|
206
|
+
function EditUserForm({ userId }: { userId: string }) {
|
|
207
|
+
const { form, write, error, initialize, submitForm } = useFormbit<FormData>({
|
|
208
|
+
initialValues,
|
|
209
|
+
yup: schema,
|
|
210
|
+
});
|
|
216
211
|
|
|
217
|
-
|
|
212
|
+
const [loading, setLoading] = useState(true);
|
|
218
213
|
|
|
219
|
-
|
|
214
|
+
// Fetch and initialize — resetForm() will revert to these values
|
|
215
|
+
useEffect(() => {
|
|
216
|
+
fetch(`/api/users/${userId}`)
|
|
217
|
+
.then((res) => res.json())
|
|
218
|
+
.then((user) => { initialize(user); setLoading(false); });
|
|
219
|
+
}, [userId]);
|
|
220
220
|
|
|
221
|
-
|
|
221
|
+
const handleChangeName = ({ target: { value } }: React.ChangeEvent<HTMLInputElement>) => {
|
|
222
|
+
write('name', value);
|
|
223
|
+
};
|
|
222
224
|
|
|
223
|
-
|
|
225
|
+
const handleChangeEmail = ({ target: { value } }: React.ChangeEvent<HTMLInputElement>) => {
|
|
226
|
+
write('email', value);
|
|
227
|
+
};
|
|
224
228
|
|
|
225
|
-
|
|
229
|
+
const handleSubmit = (e: React.FormEvent) => {
|
|
230
|
+
e.preventDefault();
|
|
231
|
+
submitForm(({ form }) => console.log(form));
|
|
232
|
+
};
|
|
226
233
|
|
|
227
|
-
|
|
234
|
+
if (loading) return <p>Loading...</p>;
|
|
228
235
|
|
|
229
|
-
|
|
236
|
+
return (
|
|
237
|
+
<form onSubmit={handleSubmit}>
|
|
238
|
+
<input value={form.name ?? ''} onChange={handleChangeName} />
|
|
239
|
+
<div>{error('name')}</div>
|
|
230
240
|
|
|
231
|
-
|
|
241
|
+
<input value={form.email ?? ''} onChange={handleChangeEmail} />
|
|
242
|
+
<div>{error('email')}</div>
|
|
232
243
|
|
|
233
|
-
|
|
244
|
+
<button type="submit">Save</button>
|
|
245
|
+
</form>
|
|
246
|
+
);
|
|
247
|
+
}
|
|
248
|
+
```
|
|
234
249
|
|
|
235
|
-
|
|
250
|
+
### Multi-Step Form
|
|
236
251
|
|
|
237
|
-
|
|
252
|
+
Use `__metadata` to store step state and `validateAll` to gate navigation between steps.
|
|
238
253
|
|
|
239
|
-
|
|
254
|
+
```tsx
|
|
255
|
+
import useFormbit from '@radicalbit/formbit';
|
|
256
|
+
import * as yup from 'yup';
|
|
240
257
|
|
|
241
|
-
|
|
258
|
+
const schema = yup.object({
|
|
259
|
+
name: yup.string().required('Name is required'),
|
|
260
|
+
age: yup.number().required('Age is required'),
|
|
261
|
+
email: yup.string().email().required('Email is required'),
|
|
262
|
+
});
|
|
242
263
|
|
|
243
|
-
|
|
264
|
+
type FormData = yup.InferType<typeof schema>;
|
|
244
265
|
|
|
245
|
-
|
|
266
|
+
const initialValues: Partial<FormData> & { __metadata: { step: number } } = {
|
|
267
|
+
name: undefined,
|
|
268
|
+
age: undefined,
|
|
269
|
+
email: undefined,
|
|
270
|
+
__metadata: { step: 0 },
|
|
271
|
+
};
|
|
246
272
|
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
273
|
+
function MultiStepForm() {
|
|
274
|
+
const { form, write, error, validateAll, submitForm } = useFormbit<FormData>({
|
|
275
|
+
initialValues,
|
|
276
|
+
yup: schema,
|
|
277
|
+
});
|
|
250
278
|
|
|
251
|
-
|
|
279
|
+
const step = (form.__metadata?.step as number) ?? 0;
|
|
280
|
+
const goTo = (n: number) => write('__metadata.step', n);
|
|
252
281
|
|
|
253
|
-
|
|
282
|
+
// Validate only the current step's fields before advancing
|
|
283
|
+
const next = (paths: string[]) => {
|
|
284
|
+
validateAll(paths, {
|
|
285
|
+
successCallback: () => goTo(step + 1),
|
|
286
|
+
});
|
|
287
|
+
};
|
|
254
288
|
|
|
255
|
-
|
|
289
|
+
const handleChangeName = ({ target: { value } }: React.ChangeEvent<HTMLInputElement>) => {
|
|
290
|
+
write('name', value);
|
|
291
|
+
};
|
|
256
292
|
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
| `setError` | [`SetError`](#seterror) |
|
|
293
|
+
const handleChangeAge = ({ target: { value } }: React.ChangeEvent<HTMLInputElement>) => {
|
|
294
|
+
write('age', Number(value));
|
|
295
|
+
};
|
|
261
296
|
|
|
262
|
-
|
|
297
|
+
const handleChangeEmail = ({ target: { value } }: React.ChangeEvent<HTMLInputElement>) => {
|
|
298
|
+
write('email', value);
|
|
299
|
+
};
|
|
263
300
|
|
|
264
|
-
|
|
301
|
+
const handleSubmit = () => {
|
|
302
|
+
submitForm(({ form }) => console.log('Submit:', form));
|
|
303
|
+
};
|
|
265
304
|
|
|
266
|
-
|
|
305
|
+
return (
|
|
306
|
+
<div>
|
|
307
|
+
{step === 0 && (
|
|
308
|
+
<div>
|
|
309
|
+
<input value={form.name ?? ''} onChange={handleChangeName} />
|
|
310
|
+
<div>{error('name')}</div>
|
|
311
|
+
<button onClick={() => next(['name'])}>Next</button>
|
|
312
|
+
</div>
|
|
313
|
+
)}
|
|
314
|
+
|
|
315
|
+
{step === 1 && (
|
|
316
|
+
<div>
|
|
317
|
+
<input type="number" value={form.age ?? ''} onChange={handleChangeAge} />
|
|
318
|
+
<div>{error('age')}</div>
|
|
319
|
+
<button onClick={() => goTo(0)}>Back</button>
|
|
320
|
+
<button onClick={() => next(['age'])}>Next</button>
|
|
321
|
+
</div>
|
|
322
|
+
)}
|
|
323
|
+
|
|
324
|
+
{step === 2 && (
|
|
325
|
+
<div>
|
|
326
|
+
<input value={form.email ?? ''} onChange={handleChangeEmail} />
|
|
327
|
+
<div>{error('email')}</div>
|
|
328
|
+
<button onClick={() => goTo(1)}>Back</button>
|
|
329
|
+
<button onClick={handleSubmit}>Submit</button>
|
|
330
|
+
</div>
|
|
331
|
+
)}
|
|
332
|
+
</div>
|
|
333
|
+
);
|
|
334
|
+
}
|
|
335
|
+
```
|
|
267
336
|
|
|
268
|
-
|
|
337
|
+
## Local Development
|
|
338
|
+
For local development we suggest using [Yalc](https://github.com/wclr/yalc) to test your local version of formbit in your projects.
|
|
269
339
|
|
|
270
|
-
|
|
340
|
+
<!-- START_TYPES_DOC -->
|
|
341
|
+
## API Reference
|
|
271
342
|
|
|
272
|
-
###
|
|
343
|
+
### FormbitObject
|
|
273
344
|
|
|
274
|
-
Ƭ **
|
|
345
|
+
Ƭ **FormbitObject**\<`T`\>: `Object`
|
|
275
346
|
|
|
276
|
-
|
|
347
|
+
The object returned by `useFormbit()` and `useFormbitContext()`. Holds the form
|
|
348
|
+
state and every method needed to read, mutate and validate the form.
|
|
277
349
|
|
|
278
350
|
#### Type parameters
|
|
279
351
|
|
|
280
352
|
| Name | Type |
|
|
281
353
|
| :------ | :------ |
|
|
282
|
-
| `
|
|
354
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
283
355
|
|
|
284
356
|
#### Type declaration
|
|
285
357
|
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
|
291
|
-
|
|
|
292
|
-
| `
|
|
293
|
-
| `
|
|
294
|
-
| `
|
|
295
|
-
| `
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
`void`
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
[
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
Ƭ **ErrorFn**: (`path`: `string`) => `string` \| `undefined`
|
|
310
|
-
|
|
311
|
-
Returns the error message for the given path if any.
|
|
312
|
-
It doesn't trigger any validation
|
|
313
|
-
|
|
314
|
-
#### Type declaration
|
|
315
|
-
|
|
316
|
-
▸ (`path`): `string` \| `undefined`
|
|
317
|
-
|
|
318
|
-
##### Parameters
|
|
319
|
-
|
|
320
|
-
| Name | Type |
|
|
321
|
-
| :------ | :------ |
|
|
322
|
-
| `path` | `string` |
|
|
323
|
-
|
|
324
|
-
##### Returns
|
|
325
|
-
|
|
326
|
-
`string` \| `undefined`
|
|
358
|
+
| Name | Type | Description |
|
|
359
|
+
| :------ | :------ | :------ |
|
|
360
|
+
| `check` | [`Check`](#check)\<`Partial`\<`T`\>\> | Validates `json` against the current schema; returns the errors, or undefined if valid. |
|
|
361
|
+
| `error` | (`path`: `string`) => `string` \| `undefined` | - |
|
|
362
|
+
| `errors` | [`Errors`](#errors) | Error messages registered since the last validation, keyed by the value's dot-path. **`Example`** ```ts form: { age: 1 } errors: { age: "Age must be greater than 18" } ``` |
|
|
363
|
+
| `form` | `Partial`\<`T`\> | The current form values. Partial: fields may be missing until validated. |
|
|
364
|
+
| `initialize` | [`Initialize`](#initialize)\<`T`\> | Re-initializes the form with new initial values. |
|
|
365
|
+
| `isDirty` | `boolean` | True once the user has interacted with the form. |
|
|
366
|
+
| `isFormInvalid` | () => `boolean` | - |
|
|
367
|
+
| `isFormValid` | () => `boolean` | - |
|
|
368
|
+
| `liveValidation` | (`path`: `string`) => ``true`` \| `undefined` | - |
|
|
369
|
+
| `remove` | [`Remove`](#remove)\<`T`\> | Removes the value at `path`, sets `isDirty`, then validates `pathsToValidate` plus every live-validated field. |
|
|
370
|
+
| `removeAll` | [`RemoveAll`](#removeall)\<`T`\> | Removes every given path, sets `isDirty`, then validates `pathsToValidate` plus every live-validated field. |
|
|
371
|
+
| `resetForm` | () => `void` | - |
|
|
372
|
+
| `setError` | [`SetError`](#seterror) | Sets the error message at `path`. |
|
|
373
|
+
| `setSchema` | [`SetSchema`](#setschema)\<`T`\> | Replaces the current validation schema. |
|
|
374
|
+
| `submitForm` | [`SubmitForm`](#submitform)\<`T`\> | Validates the whole form and, if valid, runs the success callback to submit. |
|
|
375
|
+
| `validate` | [`Validate`](#validate)\<`T`\> | Validates only `path` (ignores live-validated fields). |
|
|
376
|
+
| `validateAll` | [`ValidateAll`](#validateall)\<`T`\> | Validates only the given `paths` (ignores live-validated fields). |
|
|
377
|
+
| `validateForm` | [`ValidateForm`](#validateform)\<`Partial`\<`T`\>\> | Validates the whole form and registers any error. |
|
|
378
|
+
| `write` | [`Write`](#write)\<`T`\> | Writes `value` at `path`, sets `isDirty`, then validates `pathsToValidate` plus every live-validated field. |
|
|
379
|
+
| `writeAll` | [`WriteAll`](#writeall)\<`T`\> | Writes every `[path, value]` pair, sets `isDirty`, then validates `pathsToValidate` plus every live-validated field. |
|
|
327
380
|
|
|
328
381
|
#### Defined in
|
|
329
382
|
|
|
330
|
-
[index.ts:
|
|
331
|
-
|
|
332
|
-
___
|
|
383
|
+
[index.ts:186](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L186)
|
|
384
|
+
### Core Types
|
|
333
385
|
|
|
334
|
-
|
|
386
|
+
#### Errors
|
|
335
387
|
|
|
336
388
|
Ƭ **Errors**: `Record`\<`string`, `string`\>
|
|
337
389
|
|
|
338
|
-
|
|
339
|
-
|
|
390
|
+
Error messages registered since the last validation, stored under the same
|
|
391
|
+
dot-path as the corresponding form value.
|
|
340
392
|
|
|
341
393
|
**`Example`**
|
|
342
394
|
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
{
|
|
346
|
-
"age": 1
|
|
347
|
-
}
|
|
348
|
-
```
|
|
349
|
-
and age is a non valid field, errors object will look like this
|
|
350
|
-
```json
|
|
351
|
-
{
|
|
352
|
-
"age": "Age must be greater then 18"
|
|
353
|
-
}
|
|
395
|
+
```ts
|
|
396
|
+
form: { age: 1 }
|
|
397
|
+
errors: { age: "Age must be greater than 18" }
|
|
354
398
|
```
|
|
355
399
|
|
|
356
400
|
#### Defined in
|
|
357
401
|
|
|
358
|
-
[index.ts:
|
|
402
|
+
[index.ts:23](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L23)
|
|
403
|
+
#### FormState
|
|
359
404
|
|
|
360
|
-
|
|
405
|
+
Ƭ **FormState**\<`T`\>: `Object`
|
|
361
406
|
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
Ƭ **Form**: \{ `__metadata?`: [`Object`](#object) } & [`Object`](#object)
|
|
365
|
-
|
|
366
|
-
Object containing the updated form
|
|
367
|
-
|
|
368
|
-
#### Defined in
|
|
369
|
-
|
|
370
|
-
[index.ts:65](https://github.com/radicalbit/formbit/blob/a28ef40/src/types/index.ts#L65)
|
|
371
|
-
|
|
372
|
-
___
|
|
373
|
-
|
|
374
|
-
### FormbitObject
|
|
375
|
-
|
|
376
|
-
Ƭ **FormbitObject**\<`Values`\>: `Object`
|
|
377
|
-
|
|
378
|
-
Object returned by useFormbit() and useFormbitContextHook()
|
|
379
|
-
It contains all the data and methods needed to handle the form.
|
|
407
|
+
The whole internal state of the form (everything except the validation schema).
|
|
380
408
|
|
|
381
409
|
#### Type parameters
|
|
382
410
|
|
|
383
411
|
| Name | Type |
|
|
384
412
|
| :------ | :------ |
|
|
385
|
-
| `
|
|
413
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
386
414
|
|
|
387
415
|
#### Type declaration
|
|
388
416
|
|
|
389
|
-
| Name | Type |
|
|
390
|
-
| :------ | :------ |
|
|
391
|
-
| `
|
|
392
|
-
| `
|
|
393
|
-
| `
|
|
394
|
-
| `
|
|
395
|
-
| `
|
|
396
|
-
| `isDirty` | `boolean` | Returns true if the form is Dirty (user already interacted with the form), false otherwise. |
|
|
397
|
-
| `isFormInvalid` | [`IsFormInvalid`](#isforminvalid) | Returns true if the form is NOT valid It doesn't perform any validation, it checks if any errors are present |
|
|
398
|
-
| `isFormValid` | [`IsFormValid`](#isformvalid) | Returns true id the form is valid It doesn't perform any validation, it checks if any errors are present |
|
|
399
|
-
| `liveValidation` | [`LiveValidationFn`](#livevalidationfn) | Returns true if live validation is active for the given path |
|
|
400
|
-
| `remove` | [`Remove`](#remove)\<`Values`\> | This method updates the form state deleting value, setting isDirty to true. After writing, it validates all the paths contained into pathsToValidate (if any) and all the fields that have the live validation active. |
|
|
401
|
-
| `removeAll` | [`RemoveAll`](#removeall)\<`Values`\> | This method updates the form state deleting multiple values, setting isDirty to true. |
|
|
402
|
-
| `resetForm` | [`ResetForm`](#resetform) | Reset form to the initial state. Errors and liveValidation are set back to empty objects. isDirty is set back to false |
|
|
403
|
-
| `setError` | [`SetError`](#seterror) | Set a message(value) to the given error path. |
|
|
404
|
-
| `setSchema` | [`SetSchema`](#setschema)\<`Values`\> | Override the current schema with the given one. |
|
|
405
|
-
| `submitForm` | [`SubmitForm`](#submitform)\<`Values`\> | Perform a validation against the current form object, and execute the successCallback if the validation pass otherwise it executes the errorCallback |
|
|
406
|
-
| `validate` | [`Validate`](#validate)\<`Values`\> | This method only validate the specified path. Do not check for fields that have the live validation active. |
|
|
407
|
-
| `validateAll` | [`ValidateAll`](#validateall)\<`Values`\> | This method only validate the specified paths. Do not check for fields that have the live validation active. |
|
|
408
|
-
| `validateForm` | [`ValidateForm`](#validateform)\<`Partial`\<`Values`\>\> | This method validates the entire form and set the corresponding errors if any. |
|
|
409
|
-
| `write` | [`Write`](#write)\<`Values`\> | This method update the form state writing $value into the $path, setting isDirty to true. After writing, it validates all the paths contained into $pathsToValidate (if any) and all the fields that have the live validation active. |
|
|
410
|
-
| `writeAll` | [`WriteAll`](#writeall)\<`Values`\> | This method takes an array of [path, value] and update the form state writing all those values into the specified paths. It set isDirty to true. After writing, it validate all the paths contained into $pathToValidate and all the fields that have the live validation active. |
|
|
417
|
+
| Name | Type |
|
|
418
|
+
| :------ | :------ |
|
|
419
|
+
| `errors` | [`Errors`](#errors) |
|
|
420
|
+
| `form` | `T` |
|
|
421
|
+
| `initialValues` | `T` |
|
|
422
|
+
| `isDirty` | `boolean` |
|
|
423
|
+
| `liveValidation` | [`LiveValidation`](#livevalidation) |
|
|
411
424
|
|
|
412
425
|
#### Defined in
|
|
413
426
|
|
|
414
|
-
[index.ts:
|
|
415
|
-
|
|
416
|
-
___
|
|
417
|
-
|
|
418
|
-
### GenericCallback
|
|
427
|
+
[index.ts:38](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L38)
|
|
428
|
+
#### FormbitValues
|
|
419
429
|
|
|
420
|
-
Ƭ **
|
|
430
|
+
Ƭ **FormbitValues**: `Record`\<`string`, `unknown`\> & \{ `__metadata?`: `Record`\<`string`, `unknown`\> }
|
|
421
431
|
|
|
422
|
-
|
|
432
|
+
Base shape of every form handled by formbit: an open record of values, plus an
|
|
433
|
+
optional `__metadata` field formbit uses to carry data that must survive a
|
|
434
|
+
reset/initialize but must NOT be submitted.
|
|
423
435
|
|
|
424
|
-
|
|
425
|
-
| :------ | :------ |
|
|
426
|
-
| `Values` | extends [`InitialValues`](#initialvalues) |
|
|
436
|
+
The generic `T` you pass to `useFormbit<T>()` must extend this type.
|
|
427
437
|
|
|
428
438
|
#### Defined in
|
|
429
439
|
|
|
430
|
-
[index.ts:
|
|
440
|
+
[index.ts:13](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L13)
|
|
441
|
+
#### LiveValidation
|
|
431
442
|
|
|
432
|
-
|
|
443
|
+
Ƭ **LiveValidation**: `Record`\<`string`, ``true``\>
|
|
433
444
|
|
|
434
|
-
|
|
445
|
+
Fields currently under live-validation (re-validated on every form change).
|
|
446
|
+
A field is added here automatically when it fails a validation. Empty by default.
|
|
435
447
|
|
|
436
|
-
|
|
448
|
+
**`Example`**
|
|
437
449
|
|
|
438
|
-
|
|
450
|
+
```ts
|
|
451
|
+
form: { age: 1 }
|
|
452
|
+
liveValidation: { age: true }
|
|
453
|
+
```
|
|
439
454
|
|
|
440
455
|
#### Defined in
|
|
441
456
|
|
|
442
|
-
[index.ts:
|
|
457
|
+
[index.ts:33](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L33)
|
|
458
|
+
### Callback Types
|
|
443
459
|
|
|
444
|
-
|
|
460
|
+
#### CheckErrorCallback
|
|
445
461
|
|
|
446
|
-
|
|
462
|
+
Ƭ **CheckErrorCallback**\<`T`\>: (`json`: [`FormbitValues`](#formbitvalues), `inner`: [`ValidationError`](#validationerror)[], `writer`: [`FormState`](#formstate)\<`T`\>, `setError`: [`SetError`](#seterror)) => `void`
|
|
447
463
|
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
Initialize the form with new initial values
|
|
464
|
+
Invoked by `check()` when the given json is invalid.
|
|
451
465
|
|
|
452
466
|
#### Type parameters
|
|
453
467
|
|
|
454
468
|
| Name | Type |
|
|
455
469
|
| :------ | :------ |
|
|
456
|
-
| `
|
|
470
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
457
471
|
|
|
458
472
|
#### Type declaration
|
|
459
473
|
|
|
460
|
-
▸ (`
|
|
474
|
+
▸ (`json`, `inner`, `writer`, `setError`): `void`
|
|
461
475
|
|
|
462
476
|
##### Parameters
|
|
463
477
|
|
|
464
478
|
| Name | Type |
|
|
465
479
|
| :------ | :------ |
|
|
466
|
-
| `
|
|
480
|
+
| `json` | [`FormbitValues`](#formbitvalues) |
|
|
481
|
+
| `inner` | [`ValidationError`](#validationerror)[] |
|
|
482
|
+
| `writer` | [`FormState`](#formstate)\<`T`\> |
|
|
483
|
+
| `setError` | [`SetError`](#seterror) |
|
|
467
484
|
|
|
468
485
|
##### Returns
|
|
469
486
|
|
|
@@ -471,160 +488,92 @@ Initialize the form with new initial values
|
|
|
471
488
|
|
|
472
489
|
#### Defined in
|
|
473
490
|
|
|
474
|
-
[index.ts:
|
|
475
|
-
|
|
476
|
-
___
|
|
477
|
-
|
|
478
|
-
### IsDirty
|
|
479
|
-
|
|
480
|
-
Ƭ **IsDirty**: `boolean`
|
|
481
|
-
|
|
482
|
-
Returns true if the form is Dirty (user already interacted with the form), false otherwise.
|
|
483
|
-
|
|
484
|
-
#### Defined in
|
|
485
|
-
|
|
486
|
-
[index.ts:83](https://github.com/radicalbit/formbit/blob/a28ef40/src/types/index.ts#L83)
|
|
491
|
+
[index.ts:72](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L72)
|
|
492
|
+
#### CheckSuccessCallback
|
|
487
493
|
|
|
488
|
-
|
|
494
|
+
Ƭ **CheckSuccessCallback**\<`T`\>: (`json`: [`FormbitValues`](#formbitvalues), `writer`: [`FormState`](#formstate)\<`T`\>, `setError`: [`SetError`](#seterror)) => `void`
|
|
489
495
|
|
|
490
|
-
|
|
496
|
+
Invoked by `check()` when the given json is valid.
|
|
491
497
|
|
|
492
|
-
|
|
498
|
+
#### Type parameters
|
|
493
499
|
|
|
494
|
-
|
|
495
|
-
|
|
500
|
+
| Name | Type |
|
|
501
|
+
| :------ | :------ |
|
|
502
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
496
503
|
|
|
497
504
|
#### Type declaration
|
|
498
505
|
|
|
499
|
-
▸ (): `
|
|
500
|
-
|
|
501
|
-
##### Returns
|
|
502
|
-
|
|
503
|
-
`boolean`
|
|
504
|
-
|
|
505
|
-
#### Defined in
|
|
506
|
-
|
|
507
|
-
[index.ts:89](https://github.com/radicalbit/formbit/blob/a28ef40/src/types/index.ts#L89)
|
|
508
|
-
|
|
509
|
-
___
|
|
510
|
-
|
|
511
|
-
### IsFormValid
|
|
512
|
-
|
|
513
|
-
Ƭ **IsFormValid**: () => `boolean`
|
|
514
|
-
|
|
515
|
-
Returns true id the form is valid
|
|
516
|
-
It doesn't perform any validation, it checks if any errors are present
|
|
506
|
+
▸ (`json`, `writer`, `setError`): `void`
|
|
517
507
|
|
|
518
|
-
|
|
508
|
+
##### Parameters
|
|
519
509
|
|
|
520
|
-
|
|
510
|
+
| Name | Type |
|
|
511
|
+
| :------ | :------ |
|
|
512
|
+
| `json` | [`FormbitValues`](#formbitvalues) |
|
|
513
|
+
| `writer` | [`FormState`](#formstate)\<`T`\> |
|
|
514
|
+
| `setError` | [`SetError`](#seterror) |
|
|
521
515
|
|
|
522
516
|
##### Returns
|
|
523
517
|
|
|
524
|
-
`
|
|
525
|
-
|
|
526
|
-
#### Defined in
|
|
527
|
-
|
|
528
|
-
[index.ts:95](https://github.com/radicalbit/formbit/blob/a28ef40/src/types/index.ts#L95)
|
|
529
|
-
|
|
530
|
-
___
|
|
531
|
-
|
|
532
|
-
### LiveValidation
|
|
533
|
-
|
|
534
|
-
Ƭ **LiveValidation**: `Record`\<`string`, ``true``\>
|
|
535
|
-
|
|
536
|
-
Object including all the values that are being live validated.
|
|
537
|
-
Usually fields that fail validation (using one of the method that triggers validation)
|
|
538
|
-
will automatically set to be live-validated.
|
|
539
|
-
|
|
540
|
-
A value/path is live-validated when validated at every change of the form.
|
|
541
|
-
|
|
542
|
-
By default no field is live-validated
|
|
543
|
-
|
|
544
|
-
**`Example`**
|
|
545
|
-
|
|
546
|
-
If the form object has this structure:
|
|
547
|
-
```json
|
|
548
|
-
{
|
|
549
|
-
"age": 1
|
|
550
|
-
}
|
|
551
|
-
```
|
|
552
|
-
and age is a field that is being live-validated, liveValidation object will look like this
|
|
553
|
-
```json
|
|
554
|
-
{
|
|
555
|
-
"age": "Age must be greater then 18"
|
|
556
|
-
}
|
|
557
|
-
```
|
|
518
|
+
`void`
|
|
558
519
|
|
|
559
520
|
#### Defined in
|
|
560
521
|
|
|
561
|
-
[index.ts:
|
|
522
|
+
[index.ts:68](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L68)
|
|
523
|
+
#### ErrorCallback
|
|
562
524
|
|
|
563
|
-
|
|
525
|
+
Ƭ **ErrorCallback**\<`T`\>: (`writer`: [`FormState`](#formstate)\<`T`\>, `setError`: [`SetError`](#seterror)) => `void`
|
|
564
526
|
|
|
565
|
-
|
|
527
|
+
Invoked by validation methods when validation fails.
|
|
566
528
|
|
|
567
|
-
|
|
529
|
+
#### Type parameters
|
|
568
530
|
|
|
569
|
-
|
|
531
|
+
| Name | Type |
|
|
532
|
+
| :------ | :------ |
|
|
533
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
570
534
|
|
|
571
535
|
#### Type declaration
|
|
572
536
|
|
|
573
|
-
▸ (`
|
|
537
|
+
▸ (`writer`, `setError`): `void`
|
|
574
538
|
|
|
575
539
|
##### Parameters
|
|
576
540
|
|
|
577
541
|
| Name | Type |
|
|
578
542
|
| :------ | :------ |
|
|
579
|
-
| `
|
|
543
|
+
| `writer` | [`FormState`](#formstate)\<`T`\> |
|
|
544
|
+
| `setError` | [`SetError`](#seterror) |
|
|
580
545
|
|
|
581
546
|
##### Returns
|
|
582
547
|
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
#### Defined in
|
|
586
|
-
|
|
587
|
-
[index.ts:127](https://github.com/radicalbit/formbit/blob/a28ef40/src/types/index.ts#L127)
|
|
588
|
-
|
|
589
|
-
___
|
|
590
|
-
|
|
591
|
-
### Object
|
|
592
|
-
|
|
593
|
-
Ƭ **Object**: `Record`\<`string`, `unknown`\>
|
|
594
|
-
|
|
595
|
-
Generic object with string as keys
|
|
548
|
+
`void`
|
|
596
549
|
|
|
597
550
|
#### Defined in
|
|
598
551
|
|
|
599
|
-
[index.ts:
|
|
600
|
-
|
|
601
|
-
___
|
|
602
|
-
|
|
603
|
-
### Remove
|
|
552
|
+
[index.ts:64](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L64)
|
|
553
|
+
#### SubmitSuccessCallback
|
|
604
554
|
|
|
605
|
-
Ƭ **
|
|
555
|
+
Ƭ **SubmitSuccessCallback**\<`T`\>: (`writer`: [`FormState`](#formstate)\<`Omit`\<`T`, ``"__metadata"``\>\>, `setError`: [`SetError`](#seterror), `clearIsDirty`: () => `void`) => `void`
|
|
606
556
|
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
After writing, it validates all the paths contained into pathsToValidate (if any)
|
|
610
|
-
and all the fields that have the live validation active.
|
|
557
|
+
Invoked by `submitForm()` once the whole form is valid — the place to send data
|
|
558
|
+
to the backend. `__metadata` is stripped from `writer.form` before this runs.
|
|
611
559
|
|
|
612
560
|
#### Type parameters
|
|
613
561
|
|
|
614
562
|
| Name | Type |
|
|
615
563
|
| :------ | :------ |
|
|
616
|
-
| `
|
|
564
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
617
565
|
|
|
618
566
|
#### Type declaration
|
|
619
567
|
|
|
620
|
-
▸ (`
|
|
568
|
+
▸ (`writer`, `setError`, `clearIsDirty`): `void`
|
|
621
569
|
|
|
622
570
|
##### Parameters
|
|
623
571
|
|
|
624
572
|
| Name | Type |
|
|
625
573
|
| :------ | :------ |
|
|
626
|
-
| `
|
|
627
|
-
| `
|
|
574
|
+
| `writer` | [`FormState`](#formstate)\<`Omit`\<`T`, ``"__metadata"``\>\> |
|
|
575
|
+
| `setError` | [`SetError`](#seterror) |
|
|
576
|
+
| `clearIsDirty` | () => `void` |
|
|
628
577
|
|
|
629
578
|
##### Returns
|
|
630
579
|
|
|
@@ -632,32 +581,29 @@ and all the fields that have the live validation active.
|
|
|
632
581
|
|
|
633
582
|
#### Defined in
|
|
634
583
|
|
|
635
|
-
[index.ts:
|
|
636
|
-
|
|
637
|
-
___
|
|
584
|
+
[index.ts:79](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L79)
|
|
585
|
+
#### SuccessCallback
|
|
638
586
|
|
|
639
|
-
|
|
587
|
+
Ƭ **SuccessCallback**\<`T`\>: (`writer`: [`FormState`](#formstate)\<`T`\>, `setError`: [`SetError`](#seterror)) => `void`
|
|
640
588
|
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
This method updates the form state deleting multiple values, setting isDirty to true.
|
|
589
|
+
Invoked by validation methods when the form (or the validated paths) are valid.
|
|
644
590
|
|
|
645
591
|
#### Type parameters
|
|
646
592
|
|
|
647
593
|
| Name | Type |
|
|
648
594
|
| :------ | :------ |
|
|
649
|
-
| `
|
|
595
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
650
596
|
|
|
651
597
|
#### Type declaration
|
|
652
598
|
|
|
653
|
-
▸ (`
|
|
599
|
+
▸ (`writer`, `setError`): `void`
|
|
654
600
|
|
|
655
601
|
##### Parameters
|
|
656
602
|
|
|
657
603
|
| Name | Type |
|
|
658
604
|
| :------ | :------ |
|
|
659
|
-
| `
|
|
660
|
-
| `
|
|
605
|
+
| `writer` | [`FormState`](#formstate)\<`T`\> |
|
|
606
|
+
| `setError` | [`SetError`](#seterror) |
|
|
661
607
|
|
|
662
608
|
##### Returns
|
|
663
609
|
|
|
@@ -665,48 +611,60 @@ This method updates the form state deleting multiple values, setting isDirty to
|
|
|
665
611
|
|
|
666
612
|
#### Defined in
|
|
667
613
|
|
|
668
|
-
[index.ts:
|
|
614
|
+
[index.ts:60](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L60)
|
|
615
|
+
### Method Types
|
|
616
|
+
|
|
617
|
+
#### Check
|
|
669
618
|
|
|
670
|
-
|
|
619
|
+
Ƭ **Check**\<`T`\>: (`json`: [`FormbitValues`](#formbitvalues), `options?`: [`CheckFnOptions`](#checkfnoptions)\<`T`\>) => [`ValidationError`](#validationerror)[] \| `undefined`
|
|
671
620
|
|
|
672
|
-
|
|
621
|
+
See [FormbitObject.check](#check).
|
|
673
622
|
|
|
674
|
-
|
|
623
|
+
#### Type parameters
|
|
675
624
|
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
625
|
+
| Name | Type |
|
|
626
|
+
| :------ | :------ |
|
|
627
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
679
628
|
|
|
680
629
|
#### Type declaration
|
|
681
630
|
|
|
682
|
-
▸ (): `
|
|
631
|
+
▸ (`json`, `options?`): [`ValidationError`](#validationerror)[] \| `undefined`
|
|
632
|
+
|
|
633
|
+
##### Parameters
|
|
634
|
+
|
|
635
|
+
| Name | Type |
|
|
636
|
+
| :------ | :------ |
|
|
637
|
+
| `json` | [`FormbitValues`](#formbitvalues) |
|
|
638
|
+
| `options?` | [`CheckFnOptions`](#checkfnoptions)\<`T`\> |
|
|
683
639
|
|
|
684
640
|
##### Returns
|
|
685
641
|
|
|
686
|
-
`
|
|
642
|
+
[`ValidationError`](#validationerror)[] \| `undefined`
|
|
687
643
|
|
|
688
644
|
#### Defined in
|
|
689
645
|
|
|
690
|
-
[index.ts:
|
|
646
|
+
[index.ts:89](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L89)
|
|
647
|
+
#### Initialize
|
|
691
648
|
|
|
692
|
-
|
|
649
|
+
Ƭ **Initialize**\<`T`\>: (`values`: `Partial`\<`T`\>) => `void`
|
|
693
650
|
|
|
694
|
-
|
|
651
|
+
See [FormbitObject.initialize](#initialize).
|
|
695
652
|
|
|
696
|
-
|
|
653
|
+
#### Type parameters
|
|
697
654
|
|
|
698
|
-
|
|
655
|
+
| Name | Type |
|
|
656
|
+
| :------ | :------ |
|
|
657
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
699
658
|
|
|
700
659
|
#### Type declaration
|
|
701
660
|
|
|
702
|
-
▸ (`
|
|
661
|
+
▸ (`values`): `void`
|
|
703
662
|
|
|
704
663
|
##### Parameters
|
|
705
664
|
|
|
706
665
|
| Name | Type |
|
|
707
666
|
| :------ | :------ |
|
|
708
|
-
| `
|
|
709
|
-
| `value` | `string` |
|
|
667
|
+
| `values` | `Partial`\<`T`\> |
|
|
710
668
|
|
|
711
669
|
##### Returns
|
|
712
670
|
|
|
@@ -714,31 +672,29 @@ Set a message(value) to the given error path.
|
|
|
714
672
|
|
|
715
673
|
#### Defined in
|
|
716
674
|
|
|
717
|
-
[index.ts:
|
|
718
|
-
|
|
719
|
-
___
|
|
720
|
-
|
|
721
|
-
### SetSchema
|
|
675
|
+
[index.ts:93](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L93)
|
|
676
|
+
#### Remove
|
|
722
677
|
|
|
723
|
-
Ƭ **
|
|
678
|
+
Ƭ **Remove**\<`T`\>: (`path`: `string`, `options?`: [`WriteFnOptions`](#writefnoptions)\<`T`\>) => `void`
|
|
724
679
|
|
|
725
|
-
|
|
680
|
+
See [FormbitObject.remove](#remove).
|
|
726
681
|
|
|
727
682
|
#### Type parameters
|
|
728
683
|
|
|
729
684
|
| Name | Type |
|
|
730
685
|
| :------ | :------ |
|
|
731
|
-
| `
|
|
686
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
732
687
|
|
|
733
688
|
#### Type declaration
|
|
734
689
|
|
|
735
|
-
▸ (`
|
|
690
|
+
▸ (`path`, `options?`): `void`
|
|
736
691
|
|
|
737
692
|
##### Parameters
|
|
738
693
|
|
|
739
694
|
| Name | Type |
|
|
740
695
|
| :------ | :------ |
|
|
741
|
-
| `
|
|
696
|
+
| `path` | `string` |
|
|
697
|
+
| `options?` | [`WriteFnOptions`](#writefnoptions)\<`T`\> |
|
|
742
698
|
|
|
743
699
|
##### Returns
|
|
744
700
|
|
|
@@ -746,34 +702,29 @@ Override the current schema with the given one.
|
|
|
746
702
|
|
|
747
703
|
#### Defined in
|
|
748
704
|
|
|
749
|
-
[index.ts:
|
|
705
|
+
[index.ts:96](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L96)
|
|
706
|
+
#### RemoveAll
|
|
750
707
|
|
|
751
|
-
|
|
708
|
+
Ƭ **RemoveAll**\<`T`\>: (`arr`: `string`[], `options?`: [`WriteFnOptions`](#writefnoptions)\<`T`\>) => `void`
|
|
752
709
|
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
Ƭ **SubmitForm**\<`Values`\>: (`successCallback`: [`SuccessSubmitCallback`](#successsubmitcallback)\<`Values`\>, `errorCallback?`: [`ErrorCallback`](#errorcallback)\<`Partial`\<`Values`\>\>, `options?`: [`ValidateOptions`](#validateoptions)) => `void`
|
|
756
|
-
|
|
757
|
-
Perform a validation against the current form object, and execute the successCallback if the validation pass
|
|
758
|
-
otherwise it executes the errorCallback
|
|
710
|
+
See [FormbitObject.removeAll](#removeall).
|
|
759
711
|
|
|
760
712
|
#### Type parameters
|
|
761
713
|
|
|
762
714
|
| Name | Type |
|
|
763
715
|
| :------ | :------ |
|
|
764
|
-
| `
|
|
716
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
765
717
|
|
|
766
718
|
#### Type declaration
|
|
767
719
|
|
|
768
|
-
▸ (`
|
|
720
|
+
▸ (`arr`, `options?`): `void`
|
|
769
721
|
|
|
770
722
|
##### Parameters
|
|
771
723
|
|
|
772
724
|
| Name | Type |
|
|
773
725
|
| :------ | :------ |
|
|
774
|
-
| `
|
|
775
|
-
| `
|
|
776
|
-
| `options?` | [`ValidateOptions`](#validateoptions) |
|
|
726
|
+
| `arr` | `string`[] |
|
|
727
|
+
| `options?` | [`WriteFnOptions`](#writefnoptions)\<`T`\> |
|
|
777
728
|
|
|
778
729
|
##### Returns
|
|
779
730
|
|
|
@@ -781,32 +732,23 @@ otherwise it executes the errorCallback
|
|
|
781
732
|
|
|
782
733
|
#### Defined in
|
|
783
734
|
|
|
784
|
-
[index.ts:
|
|
735
|
+
[index.ts:116](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L116)
|
|
736
|
+
#### SetError
|
|
785
737
|
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
### SuccessCallback
|
|
789
|
-
|
|
790
|
-
Ƭ **SuccessCallback**\<`Values`\>: (`writer`: [`Writer`](#writer)\<`Values`\>, `setError`: [`SetError`](#seterror)) => `void`
|
|
791
|
-
|
|
792
|
-
Success callback invoked by some formbit methods when the operation is successful.
|
|
793
|
-
|
|
794
|
-
#### Type parameters
|
|
738
|
+
Ƭ **SetError**: (`path`: `string`, `value`: `string`) => `void`
|
|
795
739
|
|
|
796
|
-
|
|
797
|
-
| :------ | :------ |
|
|
798
|
-
| `Values` | extends [`InitialValues`](#initialvalues) |
|
|
740
|
+
See [FormbitObject.setError](#seterror).
|
|
799
741
|
|
|
800
742
|
#### Type declaration
|
|
801
743
|
|
|
802
|
-
▸ (`
|
|
744
|
+
▸ (`path`, `value`): `void`
|
|
803
745
|
|
|
804
746
|
##### Parameters
|
|
805
747
|
|
|
806
748
|
| Name | Type |
|
|
807
749
|
| :------ | :------ |
|
|
808
|
-
| `
|
|
809
|
-
| `
|
|
750
|
+
| `path` | `string` |
|
|
751
|
+
| `value` | `string` |
|
|
810
752
|
|
|
811
753
|
##### Returns
|
|
812
754
|
|
|
@@ -814,33 +756,28 @@ Success callback invoked by some formbit methods when the operation is successfu
|
|
|
814
756
|
|
|
815
757
|
#### Defined in
|
|
816
758
|
|
|
817
|
-
[index.ts:
|
|
818
|
-
|
|
819
|
-
___
|
|
820
|
-
|
|
821
|
-
### SuccessCheckCallback
|
|
759
|
+
[index.ts:99](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L99)
|
|
760
|
+
#### SetSchema
|
|
822
761
|
|
|
823
|
-
Ƭ **
|
|
762
|
+
Ƭ **SetSchema**\<`T`\>: (`newSchema`: [`ValidationSchema`](#validationschema)\<`T`\>) => `void`
|
|
824
763
|
|
|
825
|
-
|
|
764
|
+
See [FormbitObject.setSchema](#setschema).
|
|
826
765
|
|
|
827
766
|
#### Type parameters
|
|
828
767
|
|
|
829
768
|
| Name | Type |
|
|
830
769
|
| :------ | :------ |
|
|
831
|
-
| `
|
|
770
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
832
771
|
|
|
833
772
|
#### Type declaration
|
|
834
773
|
|
|
835
|
-
▸ (`
|
|
774
|
+
▸ (`newSchema`): `void`
|
|
836
775
|
|
|
837
776
|
##### Parameters
|
|
838
777
|
|
|
839
778
|
| Name | Type |
|
|
840
779
|
| :------ | :------ |
|
|
841
|
-
| `
|
|
842
|
-
| `writer` | [`Writer`](#writer)\<`Values`\> |
|
|
843
|
-
| `setError` | [`SetError`](#seterror) |
|
|
780
|
+
| `newSchema` | [`ValidationSchema`](#validationschema)\<`T`\> |
|
|
844
781
|
|
|
845
782
|
##### Returns
|
|
846
783
|
|
|
@@ -848,34 +785,30 @@ Success callback invoked by the check method when the operation is successful.
|
|
|
848
785
|
|
|
849
786
|
#### Defined in
|
|
850
787
|
|
|
851
|
-
[index.ts:
|
|
788
|
+
[index.ts:102](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L102)
|
|
789
|
+
#### SubmitForm
|
|
852
790
|
|
|
853
|
-
|
|
791
|
+
Ƭ **SubmitForm**\<`T`\>: (`successCallback`: [`SubmitSuccessCallback`](#submitsuccesscallback)\<`T`\>, `errorCallback?`: [`ErrorCallback`](#errorcallback)\<`Partial`\<`T`\>\>, `options?`: [`ValidateOptions`](#validateoptions)) => `void`
|
|
854
792
|
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
Ƭ **SuccessSubmitCallback**\<`Values`\>: (`writer`: [`Writer`](#writer)\<`Values` \| `Omit`\<`Values`, ``"__metadata"``\>\>, `setError`: [`SetError`](#seterror), `clearIsDirty`: [`ClearIsDirty`](#clearisdirty)) => `void`
|
|
858
|
-
|
|
859
|
-
Success callback invoked by the submit method when the validation is successful.
|
|
860
|
-
Is the right place to send your data to the backend.
|
|
793
|
+
See [FormbitObject.submitForm](#submitform).
|
|
861
794
|
|
|
862
795
|
#### Type parameters
|
|
863
796
|
|
|
864
797
|
| Name | Type |
|
|
865
798
|
| :------ | :------ |
|
|
866
|
-
| `
|
|
799
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
867
800
|
|
|
868
801
|
#### Type declaration
|
|
869
802
|
|
|
870
|
-
▸ (`
|
|
803
|
+
▸ (`successCallback`, `errorCallback?`, `options?`): `void`
|
|
871
804
|
|
|
872
805
|
##### Parameters
|
|
873
806
|
|
|
874
807
|
| Name | Type |
|
|
875
808
|
| :------ | :------ |
|
|
876
|
-
| `
|
|
877
|
-
| `
|
|
878
|
-
| `
|
|
809
|
+
| `successCallback` | [`SubmitSuccessCallback`](#submitsuccesscallback)\<`T`\> |
|
|
810
|
+
| `errorCallback?` | [`ErrorCallback`](#errorcallback)\<`Partial`\<`T`\>\> |
|
|
811
|
+
| `options?` | [`ValidateOptions`](#validateoptions) |
|
|
879
812
|
|
|
880
813
|
##### Returns
|
|
881
814
|
|
|
@@ -883,22 +816,18 @@ Is the right place to send your data to the backend.
|
|
|
883
816
|
|
|
884
817
|
#### Defined in
|
|
885
818
|
|
|
886
|
-
[index.ts:
|
|
887
|
-
|
|
888
|
-
___
|
|
889
|
-
|
|
890
|
-
### Validate
|
|
819
|
+
[index.ts:132](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L132)
|
|
820
|
+
#### Validate
|
|
891
821
|
|
|
892
|
-
Ƭ **Validate**\<`
|
|
822
|
+
Ƭ **Validate**\<`T`\>: (`path`: `string`, `options?`: [`ValidateFnOptions`](#validatefnoptions)\<`T`\>) => `void`
|
|
893
823
|
|
|
894
|
-
|
|
895
|
-
live validation active.
|
|
824
|
+
See [FormbitObject.validate](#validate).
|
|
896
825
|
|
|
897
826
|
#### Type parameters
|
|
898
827
|
|
|
899
828
|
| Name | Type |
|
|
900
829
|
| :------ | :------ |
|
|
901
|
-
| `
|
|
830
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
902
831
|
|
|
903
832
|
#### Type declaration
|
|
904
833
|
|
|
@@ -909,7 +838,7 @@ live validation active.
|
|
|
909
838
|
| Name | Type |
|
|
910
839
|
| :------ | :------ |
|
|
911
840
|
| `path` | `string` |
|
|
912
|
-
| `options?` | [`ValidateFnOptions`](#validatefnoptions)\<`
|
|
841
|
+
| `options?` | [`ValidateFnOptions`](#validatefnoptions)\<`T`\> |
|
|
913
842
|
|
|
914
843
|
##### Returns
|
|
915
844
|
|
|
@@ -917,22 +846,18 @@ live validation active.
|
|
|
917
846
|
|
|
918
847
|
#### Defined in
|
|
919
848
|
|
|
920
|
-
[index.ts:
|
|
849
|
+
[index.ts:120](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L120)
|
|
850
|
+
#### ValidateAll
|
|
921
851
|
|
|
922
|
-
|
|
852
|
+
Ƭ **ValidateAll**\<`T`\>: (`paths`: `string`[], `options?`: [`ValidateFnOptions`](#validatefnoptions)\<`T`\>) => `void`
|
|
923
853
|
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
Ƭ **ValidateAll**\<`Values`\>: (`paths`: `string`[], `options?`: [`ValidateFnOptions`](#validatefnoptions)\<`Values`\>) => `void`
|
|
927
|
-
|
|
928
|
-
This method only validate the specified paths. Do not check for fields that have the
|
|
929
|
-
live validation active.
|
|
854
|
+
See [FormbitObject.validateAll](#validateall).
|
|
930
855
|
|
|
931
856
|
#### Type parameters
|
|
932
857
|
|
|
933
858
|
| Name | Type |
|
|
934
859
|
| :------ | :------ |
|
|
935
|
-
| `
|
|
860
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
936
861
|
|
|
937
862
|
#### Type declaration
|
|
938
863
|
|
|
@@ -943,7 +868,7 @@ live validation active.
|
|
|
943
868
|
| Name | Type |
|
|
944
869
|
| :------ | :------ |
|
|
945
870
|
| `paths` | `string`[] |
|
|
946
|
-
| `options?` | [`ValidateFnOptions`](#validatefnoptions)\<`
|
|
871
|
+
| `options?` | [`ValidateFnOptions`](#validatefnoptions)\<`T`\> |
|
|
947
872
|
|
|
948
873
|
##### Returns
|
|
949
874
|
|
|
@@ -951,59 +876,61 @@ live validation active.
|
|
|
951
876
|
|
|
952
877
|
#### Defined in
|
|
953
878
|
|
|
954
|
-
[index.ts:
|
|
955
|
-
|
|
956
|
-
___
|
|
879
|
+
[index.ts:123](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L123)
|
|
880
|
+
#### ValidateForm
|
|
957
881
|
|
|
958
|
-
|
|
882
|
+
Ƭ **ValidateForm**\<`T`\>: (`successCallback?`: [`SuccessCallback`](#successcallback)\<`T`\>, `errorCallback?`: [`ErrorCallback`](#errorcallback)\<`T`\>, `options?`: [`ValidateOptions`](#validateoptions)) => `void`
|
|
959
883
|
|
|
960
|
-
|
|
961
|
-
|
|
962
|
-
Options object to change the behavior of the validate methods
|
|
884
|
+
See [FormbitObject.validateForm](#validateform).
|
|
963
885
|
|
|
964
886
|
#### Type parameters
|
|
965
887
|
|
|
966
888
|
| Name | Type |
|
|
967
889
|
| :------ | :------ |
|
|
968
|
-
| `
|
|
890
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
969
891
|
|
|
970
892
|
#### Type declaration
|
|
971
893
|
|
|
894
|
+
▸ (`successCallback?`, `errorCallback?`, `options?`): `void`
|
|
895
|
+
|
|
896
|
+
##### Parameters
|
|
897
|
+
|
|
972
898
|
| Name | Type |
|
|
973
899
|
| :------ | :------ |
|
|
974
|
-
| `
|
|
900
|
+
| `successCallback?` | [`SuccessCallback`](#successcallback)\<`T`\> |
|
|
901
|
+
| `errorCallback?` | [`ErrorCallback`](#errorcallback)\<`T`\> |
|
|
975
902
|
| `options?` | [`ValidateOptions`](#validateoptions) |
|
|
976
|
-
| `successCallback?` | [`SuccessCallback`](#successcallback)\<`Partial`\<`Values`\>\> |
|
|
977
903
|
|
|
978
|
-
|
|
904
|
+
##### Returns
|
|
979
905
|
|
|
980
|
-
|
|
906
|
+
`void`
|
|
981
907
|
|
|
982
|
-
|
|
908
|
+
#### Defined in
|
|
983
909
|
|
|
984
|
-
|
|
910
|
+
[index.ts:126](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L126)
|
|
911
|
+
#### Write
|
|
985
912
|
|
|
986
|
-
Ƭ **
|
|
913
|
+
Ƭ **Write**\<`T`\>: (`path`: keyof `T` \| `string`, `value`: `unknown`, `options?`: [`WriteFnOptions`](#writefnoptions)\<`T`\>) => `void`
|
|
987
914
|
|
|
988
|
-
|
|
915
|
+
See [FormbitObject.write](#write).
|
|
989
916
|
|
|
990
917
|
#### Type parameters
|
|
991
918
|
|
|
992
919
|
| Name | Type |
|
|
993
920
|
| :------ | :------ |
|
|
994
|
-
| `
|
|
921
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
995
922
|
|
|
996
923
|
#### Type declaration
|
|
997
924
|
|
|
998
|
-
▸ (`
|
|
925
|
+
▸ (`path`, `value`, `options?`): `void`
|
|
999
926
|
|
|
1000
927
|
##### Parameters
|
|
1001
928
|
|
|
1002
929
|
| Name | Type |
|
|
1003
930
|
| :------ | :------ |
|
|
1004
|
-
| `
|
|
1005
|
-
| `
|
|
1006
|
-
| `options?` | [`
|
|
931
|
+
| `path` | keyof `T` \| `string` |
|
|
932
|
+
| `value` | `unknown` |
|
|
933
|
+
| `options?` | [`WriteFnOptions`](#writefnoptions)\<`T`\> |
|
|
1007
934
|
|
|
1008
935
|
##### Returns
|
|
1009
936
|
|
|
@@ -1011,209 +938,150 @@ This method validates the entire form and set the corresponding errors if any.
|
|
|
1011
938
|
|
|
1012
939
|
#### Defined in
|
|
1013
940
|
|
|
1014
|
-
[index.ts:
|
|
1015
|
-
|
|
1016
|
-
___
|
|
1017
|
-
|
|
1018
|
-
### ValidateOptions
|
|
1019
|
-
|
|
1020
|
-
Ƭ **ValidateOptions**: `YupValidateOptions`
|
|
1021
|
-
|
|
1022
|
-
Type imported from the yup library.
|
|
1023
|
-
It represents the object with all the options that can be passed to the internal yup validation method,
|
|
1024
|
-
|
|
1025
|
-
Link to the Yup documentation [https://github.com/jquense/yup](https://github.com/jquense/yup)
|
|
1026
|
-
|
|
1027
|
-
#### Defined in
|
|
1028
|
-
|
|
1029
|
-
[index.ts:249](https://github.com/radicalbit/formbit/blob/a28ef40/src/types/index.ts#L249)
|
|
941
|
+
[index.ts:108](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L108)
|
|
942
|
+
#### WriteAll
|
|
1030
943
|
|
|
1031
|
-
|
|
944
|
+
Ƭ **WriteAll**\<`T`\>: (`arr`: [`WriteAllValue`](#writeallvalue)\<`T`\>[], `options?`: [`WriteFnOptions`](#writefnoptions)\<`T`\>) => `void`
|
|
1032
945
|
|
|
1033
|
-
|
|
946
|
+
See [FormbitObject.writeAll](#writeall).
|
|
1034
947
|
|
|
1035
|
-
|
|
948
|
+
#### Type parameters
|
|
1036
949
|
|
|
1037
|
-
|
|
1038
|
-
|
|
950
|
+
| Name | Type |
|
|
951
|
+
| :------ | :------ |
|
|
952
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
1039
953
|
|
|
1040
|
-
|
|
954
|
+
#### Type declaration
|
|
1041
955
|
|
|
1042
|
-
|
|
956
|
+
▸ (`arr`, `options?`): `void`
|
|
1043
957
|
|
|
1044
|
-
|
|
958
|
+
##### Parameters
|
|
1045
959
|
|
|
1046
|
-
|
|
960
|
+
| Name | Type |
|
|
961
|
+
| :------ | :------ |
|
|
962
|
+
| `arr` | [`WriteAllValue`](#writeallvalue)\<`T`\>[] |
|
|
963
|
+
| `options?` | [`WriteFnOptions`](#writefnoptions)\<`T`\> |
|
|
1047
964
|
|
|
1048
|
-
|
|
965
|
+
##### Returns
|
|
1049
966
|
|
|
1050
|
-
|
|
967
|
+
`void`
|
|
1051
968
|
|
|
1052
969
|
#### Defined in
|
|
1053
970
|
|
|
1054
|
-
[index.ts:
|
|
1055
|
-
|
|
1056
|
-
___
|
|
1057
|
-
|
|
1058
|
-
### ValidationSchema
|
|
971
|
+
[index.ts:112](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L112)
|
|
972
|
+
### Options Types
|
|
1059
973
|
|
|
1060
|
-
|
|
974
|
+
#### CheckFnOptions
|
|
1061
975
|
|
|
1062
|
-
|
|
1063
|
-
It represents any validation schema created with the yup.object() method
|
|
976
|
+
Ƭ **CheckFnOptions**\<`T`\>: `Object`
|
|
1064
977
|
|
|
1065
|
-
|
|
978
|
+
Options accepted by `check()`.
|
|
1066
979
|
|
|
1067
980
|
#### Type parameters
|
|
1068
981
|
|
|
1069
982
|
| Name | Type |
|
|
1070
983
|
| :------ | :------ |
|
|
1071
|
-
| `
|
|
984
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
1072
985
|
|
|
1073
|
-
####
|
|
1074
|
-
|
|
1075
|
-
[index.ts:169](https://github.com/radicalbit/formbit/blob/a28ef40/src/types/index.ts#L169)
|
|
986
|
+
#### Type declaration
|
|
1076
987
|
|
|
1077
|
-
|
|
988
|
+
| Name | Type |
|
|
989
|
+
| :------ | :------ |
|
|
990
|
+
| `errorCallback?` | [`CheckErrorCallback`](#checkerrorcallback)\<`T`\> |
|
|
991
|
+
| `options?` | [`ValidateOptions`](#validateoptions) |
|
|
992
|
+
| `successCallback?` | [`CheckSuccessCallback`](#checksuccesscallback)\<`T`\> |
|
|
1078
993
|
|
|
1079
|
-
|
|
994
|
+
#### Defined in
|
|
1080
995
|
|
|
1081
|
-
|
|
996
|
+
[index.ts:140](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L140)
|
|
997
|
+
#### ValidateFnOptions
|
|
1082
998
|
|
|
1083
|
-
|
|
999
|
+
Ƭ **ValidateFnOptions**\<`T`\>: `Object`
|
|
1084
1000
|
|
|
1085
|
-
|
|
1086
|
-
and all the fields that have the live validation active.
|
|
1001
|
+
Options accepted by the `validate` methods.
|
|
1087
1002
|
|
|
1088
1003
|
#### Type parameters
|
|
1089
1004
|
|
|
1090
1005
|
| Name | Type |
|
|
1091
1006
|
| :------ | :------ |
|
|
1092
|
-
| `
|
|
1007
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
1093
1008
|
|
|
1094
1009
|
#### Type declaration
|
|
1095
1010
|
|
|
1096
|
-
▸ (`path`, `value`, `options?`): `void`
|
|
1097
|
-
|
|
1098
|
-
##### Parameters
|
|
1099
|
-
|
|
1100
1011
|
| Name | Type |
|
|
1101
1012
|
| :------ | :------ |
|
|
1102
|
-
| `
|
|
1103
|
-
| `
|
|
1104
|
-
| `
|
|
1105
|
-
|
|
1106
|
-
##### Returns
|
|
1107
|
-
|
|
1108
|
-
`void`
|
|
1013
|
+
| `errorCallback?` | [`ErrorCallback`](#errorcallback)\<`Partial`\<`T`\>\> |
|
|
1014
|
+
| `options?` | [`ValidateOptions`](#validateoptions) |
|
|
1015
|
+
| `successCallback?` | [`SuccessCallback`](#successcallback)\<`Partial`\<`T`\>\> |
|
|
1109
1016
|
|
|
1110
1017
|
#### Defined in
|
|
1111
1018
|
|
|
1112
|
-
[index.ts:
|
|
1113
|
-
|
|
1114
|
-
___
|
|
1019
|
+
[index.ts:147](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L147)
|
|
1020
|
+
#### WriteAllValue
|
|
1115
1021
|
|
|
1116
|
-
|
|
1022
|
+
Ƭ **WriteAllValue**\<`T`\>: [keyof `T` \| `string`, `unknown`]
|
|
1117
1023
|
|
|
1118
|
-
|
|
1119
|
-
|
|
1120
|
-
This method takes an array of [path, value] and update the form state writing
|
|
1121
|
-
all those values into the specified paths.
|
|
1122
|
-
|
|
1123
|
-
It set isDirty to true.
|
|
1124
|
-
|
|
1125
|
-
After writing, it validate all the paths contained into $pathToValidate and all
|
|
1126
|
-
the fields that have the live validation active.
|
|
1024
|
+
A single `[path, value]` pair accepted by `writeAll`.
|
|
1127
1025
|
|
|
1128
1026
|
#### Type parameters
|
|
1129
1027
|
|
|
1130
1028
|
| Name | Type |
|
|
1131
1029
|
| :------ | :------ |
|
|
1132
|
-
| `
|
|
1133
|
-
|
|
1134
|
-
#### Type declaration
|
|
1135
|
-
|
|
1136
|
-
▸ (`arr`, `options?`): `void`
|
|
1137
|
-
|
|
1138
|
-
##### Parameters
|
|
1139
|
-
|
|
1140
|
-
| Name | Type |
|
|
1141
|
-
| :------ | :------ |
|
|
1142
|
-
| `arr` | [`WriteAllValue`](#writeallvalue)\<`Values`\>[] |
|
|
1143
|
-
| `options?` | [`WriteFnOptions`](#writefnoptions)\<`Values`\> |
|
|
1144
|
-
|
|
1145
|
-
##### Returns
|
|
1146
|
-
|
|
1147
|
-
`void`
|
|
1030
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
1148
1031
|
|
|
1149
1032
|
#### Defined in
|
|
1150
1033
|
|
|
1151
|
-
[index.ts:
|
|
1152
|
-
|
|
1153
|
-
___
|
|
1154
|
-
|
|
1155
|
-
### WriteAllValue
|
|
1034
|
+
[index.ts:105](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L105)
|
|
1035
|
+
#### WriteFnOptions
|
|
1156
1036
|
|
|
1157
|
-
Ƭ **
|
|
1037
|
+
Ƭ **WriteFnOptions**\<`T`\>: \{ `noLiveValidation?`: `boolean` ; `pathsToValidate?`: `string`[] } & [`ValidateFnOptions`](#validatefnoptions)\<`T`\>
|
|
1158
1038
|
|
|
1159
|
-
|
|
1039
|
+
Options accepted by the `write`/`remove` methods (validate options plus path control).
|
|
1160
1040
|
|
|
1161
1041
|
#### Type parameters
|
|
1162
1042
|
|
|
1163
1043
|
| Name | Type |
|
|
1164
1044
|
| :------ | :------ |
|
|
1165
|
-
| `
|
|
1045
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
1166
1046
|
|
|
1167
1047
|
#### Defined in
|
|
1168
1048
|
|
|
1169
|
-
[index.ts:
|
|
1049
|
+
[index.ts:154](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L154)
|
|
1050
|
+
### Yup Re-Exports
|
|
1170
1051
|
|
|
1171
|
-
|
|
1052
|
+
#### ValidateOptions
|
|
1172
1053
|
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
Ƭ **WriteFnOptions**\<`Values`\>: \{ `noLiveValidation?`: `boolean` ; `pathsToValidate?`: `string`[] } & [`ValidateFnOptions`](#validatefnoptions)\<`Values`\>
|
|
1176
|
-
|
|
1177
|
-
Options object to change the behavior of the write methods
|
|
1054
|
+
Ƭ **ValidateOptions**: `YupValidateOptions`
|
|
1178
1055
|
|
|
1179
|
-
|
|
1180
|
-
|
|
1181
|
-
| Name | Type |
|
|
1182
|
-
| :------ | :------ |
|
|
1183
|
-
| `Values` | extends [`InitialValues`](#initialvalues) |
|
|
1056
|
+
Options forwarded to yup's validation methods. See [https://github.com/jquense/yup](https://github.com/jquense/yup).
|
|
1184
1057
|
|
|
1185
1058
|
#### Defined in
|
|
1186
1059
|
|
|
1187
|
-
[index.ts:
|
|
1060
|
+
[index.ts:52](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L52)
|
|
1061
|
+
#### ValidationError
|
|
1188
1062
|
|
|
1189
|
-
|
|
1063
|
+
Ƭ **ValidationError**: `YupValidationError`
|
|
1190
1064
|
|
|
1191
|
-
|
|
1065
|
+
The error object yup throws when a validation fails. See [https://github.com/jquense/yup](https://github.com/jquense/yup).
|
|
1192
1066
|
|
|
1193
|
-
|
|
1067
|
+
#### Defined in
|
|
1194
1068
|
|
|
1195
|
-
|
|
1069
|
+
[index.ts:55](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L55)
|
|
1070
|
+
#### ValidationSchema
|
|
1196
1071
|
|
|
1197
|
-
|
|
1072
|
+
Ƭ **ValidationSchema**\<`T`\>: `ObjectSchema`\<`T`\>
|
|
1198
1073
|
|
|
1199
|
-
|
|
1200
|
-
| :------ | :------ |
|
|
1201
|
-
| `Values` | extends [`InitialValues`](#initialvalues) |
|
|
1074
|
+
A validation schema built with `yup.object()`. See [https://github.com/jquense/yup](https://github.com/jquense/yup).
|
|
1202
1075
|
|
|
1203
|
-
#### Type
|
|
1076
|
+
#### Type parameters
|
|
1204
1077
|
|
|
1205
1078
|
| Name | Type |
|
|
1206
1079
|
| :------ | :------ |
|
|
1207
|
-
| `
|
|
1208
|
-
| `form` | `Values` |
|
|
1209
|
-
| `initialValues` | `Values` |
|
|
1210
|
-
| `isDirty` | [`IsDirty`](#isdirty) |
|
|
1211
|
-
| `liveValidation` | [`LiveValidation`](#livevalidation) |
|
|
1080
|
+
| `T` | extends [`FormbitValues`](#formbitvalues) |
|
|
1212
1081
|
|
|
1213
1082
|
#### Defined in
|
|
1214
1083
|
|
|
1215
|
-
[index.ts:
|
|
1216
|
-
|
|
1084
|
+
[index.ts:49](https://github.com/radicalbit/formbit/blob/2ca1a8a/src/types/index.ts#L49)
|
|
1217
1085
|
<!-- END_TYPES_DOC -->
|
|
1218
1086
|
|
|
1219
1087
|
## License
|