@keysdown/form-wrapper 0.0.5 → 0.0.6
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 +14 -15
- package/dist/form-wrapper.d.ts +6 -0
- package/dist/main.d.ts +3 -4
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -17,7 +17,6 @@ npm install @keysdown/form-wrapper --save
|
|
|
17
17
|
Basic example using Vue.
|
|
18
18
|
|
|
19
19
|
```vue
|
|
20
|
-
|
|
21
20
|
<template>
|
|
22
21
|
<form @submit.prevent="submit">
|
|
23
22
|
<input type="text" v-model="form.first_name"/>
|
|
@@ -30,9 +29,9 @@ Basic example using Vue.
|
|
|
30
29
|
<script setup lang="ts">
|
|
31
30
|
import axios from 'axios'
|
|
32
31
|
import {ref} from 'vue'
|
|
33
|
-
import
|
|
32
|
+
import {createForm} from '@keysdown/form-wrapper'
|
|
34
33
|
|
|
35
|
-
const form = ref(
|
|
34
|
+
const form = ref(createForm({
|
|
36
35
|
first_name: null,
|
|
37
36
|
last_name: null,
|
|
38
37
|
username: null
|
|
@@ -73,9 +72,9 @@ Basic example with validation using Vue.
|
|
|
73
72
|
<script setup lang="ts">
|
|
74
73
|
import axios from 'axios'
|
|
75
74
|
import {ref} from 'vue'
|
|
76
|
-
import
|
|
75
|
+
import {createForm} from '@keysdown/form-wrapper'
|
|
77
76
|
|
|
78
|
-
const form = ref(
|
|
77
|
+
const form = ref(createForm({
|
|
79
78
|
first_name: {
|
|
80
79
|
value: null,
|
|
81
80
|
rules: ['required'],
|
|
@@ -179,7 +178,7 @@ form.addFields({
|
|
|
179
178
|
Method used when you want to fill in several form fields at once.
|
|
180
179
|
|
|
181
180
|
```js
|
|
182
|
-
const form =
|
|
181
|
+
const form = createForm({
|
|
183
182
|
username: null
|
|
184
183
|
})
|
|
185
184
|
|
|
@@ -197,7 +196,7 @@ console.log(form.values()) // {username: 'keysdown'}
|
|
|
197
196
|
Method used when you want to remove a field from the form.
|
|
198
197
|
|
|
199
198
|
```js
|
|
200
|
-
const form =
|
|
199
|
+
const form = createForm({
|
|
201
200
|
username: null
|
|
202
201
|
})
|
|
203
202
|
|
|
@@ -213,7 +212,7 @@ console.log(form.values()) // {}
|
|
|
213
212
|
Method used to remove multiple fields to the form.
|
|
214
213
|
|
|
215
214
|
```js
|
|
216
|
-
const form =
|
|
215
|
+
const form = createForm({
|
|
217
216
|
username: null
|
|
218
217
|
})
|
|
219
218
|
|
|
@@ -229,7 +228,7 @@ console.log(form.values()) // {}
|
|
|
229
228
|
Method used to reset all form values to original state.
|
|
230
229
|
|
|
231
230
|
```js
|
|
232
|
-
const form =
|
|
231
|
+
const form = createForm({
|
|
233
232
|
username: null
|
|
234
233
|
})
|
|
235
234
|
|
|
@@ -247,7 +246,7 @@ console.log(form.values()) // {username: null}
|
|
|
247
246
|
Method used to change the form loading state.
|
|
248
247
|
|
|
249
248
|
```js
|
|
250
|
-
const form =
|
|
249
|
+
const form = createForm({
|
|
251
250
|
username: null
|
|
252
251
|
})
|
|
253
252
|
|
|
@@ -267,7 +266,7 @@ console.log(form.awaiting) // false
|
|
|
267
266
|
Method used to validate the entire form or a specific field.
|
|
268
267
|
|
|
269
268
|
```js
|
|
270
|
-
const form =
|
|
269
|
+
const form = createForm({
|
|
271
270
|
username: {
|
|
272
271
|
value: null,
|
|
273
272
|
rules: ['required'],
|
|
@@ -301,7 +300,7 @@ form.validate()
|
|
|
301
300
|
Method used to validate a specific field.
|
|
302
301
|
|
|
303
302
|
```js
|
|
304
|
-
const form =
|
|
303
|
+
const form = createForm({
|
|
305
304
|
username: {
|
|
306
305
|
value: null,
|
|
307
306
|
rules: ['required'],
|
|
@@ -335,7 +334,7 @@ form.validate('username')
|
|
|
335
334
|
Method used to validate the entire form.
|
|
336
335
|
|
|
337
336
|
```js
|
|
338
|
-
const form =
|
|
337
|
+
const form = createForm({
|
|
339
338
|
username: {
|
|
340
339
|
value: null,
|
|
341
340
|
rules: ['required'],
|
|
@@ -371,7 +370,7 @@ form.validate()
|
|
|
371
370
|
Method used to access all form values in json format.
|
|
372
371
|
|
|
373
372
|
```js
|
|
374
|
-
const form =
|
|
373
|
+
const form = createForm({
|
|
375
374
|
username: null
|
|
376
375
|
})
|
|
377
376
|
|
|
@@ -385,7 +384,7 @@ axios.post('some-api', form.values())
|
|
|
385
384
|
Method used to access all form values as form data.
|
|
386
385
|
|
|
387
386
|
```js
|
|
388
|
-
const form =
|
|
387
|
+
const form = createForm({
|
|
389
388
|
username: null
|
|
390
389
|
})
|
|
391
390
|
|
package/dist/main.d.ts
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { Form } from './core/Form';
|
|
2
|
-
declare const createForm: (data: any) =>
|
|
3
|
-
export
|
|
4
|
-
export default Form;
|
|
1
|
+
import { Form as FormWrapper } from './core/Form';
|
|
2
|
+
export declare const createForm: (data: any) => FormWrapper;
|
|
3
|
+
export default FormWrapper;
|
package/package.json
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@keysdown/form-wrapper",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.6",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist/*"
|
|
7
7
|
],
|
|
8
8
|
"main": "./dist/form-wrapper.umd.cjs",
|
|
9
9
|
"module": "./dist/form-wrapper.js",
|
|
10
|
-
"types": "./dist/
|
|
10
|
+
"types": "./dist/form-wrapper.d.ts",
|
|
11
11
|
"exports": {
|
|
12
12
|
".": {
|
|
13
13
|
"import": "./dist/form-wrapper.js",
|
|
14
14
|
"require": "./dist/form-wrapper.umd.cjs",
|
|
15
|
-
"types": "./dist/
|
|
15
|
+
"types": "./dist/form-wrapper.d.ts"
|
|
16
16
|
}
|
|
17
17
|
},
|
|
18
18
|
"scripts": {
|