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