@rolster/react-forms 18.8.2 → 18.9.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/dist/cjs/index.js CHANGED
@@ -7,435 +7,435 @@ var helpers = require('@rolster/forms/helpers');
7
7
  var uuid = require('uuid');
8
8
  var react = require('react');
9
9
 
10
- class RolsterReactArrayControl {
11
- constructor(options) {
12
- this.initialValue = options.initialValue;
13
- this.uuid = options.uuid;
14
- this.focused = !!options.focused;
15
- this.unfocused = !this.focused;
16
- this.touched = !!options.touched;
17
- this.untouched = !this.touched;
18
- this.dirty = !!options.dirty;
19
- this.pristine = !this.dirty;
20
- this.disabled = !!options.disabled;
21
- this.enabled = !this.disabled;
22
- const { value, validators } = options;
23
- this.value = value;
24
- this.validators = validators;
25
- this.errors = validators ? helpers.controlIsValid({ value, validators }) : [];
26
- this.error = this.errors[0];
27
- }
28
- focus() {
29
- this.unfocused && this.refresh({ focused: true });
30
- }
31
- blur() {
32
- this.focused && this.refresh({ focused: false, touched: true });
33
- }
34
- disable() {
35
- this.enabled && this.refresh({ disabled: true });
36
- }
37
- enable() {
38
- this.disabled && this.refresh({ disabled: false });
39
- }
40
- touch() {
41
- this.untouched && this.refresh({ touched: true });
42
- }
43
- setValue(value) {
44
- this.refresh({ value });
45
- }
46
- setValidators(validators) {
47
- this.refresh({ validators });
48
- }
49
- subscribe(subscriber) {
50
- this.subscriber = subscriber;
51
- }
52
- hasError(key) {
53
- return helpers.hasError(this.errors, key);
54
- }
55
- someErrors(keys) {
56
- return helpers.someErrors(this.errors, keys);
57
- }
58
- reset() {
59
- this.refresh({
60
- dirty: false,
61
- touched: false,
62
- value: this.initialValue
63
- });
64
- }
65
- refresh(changes) {
66
- this.subscriber &&
67
- this.subscriber({
68
- ...this,
69
- ...changes,
70
- initialValue: this.initialValue
71
- });
72
- }
73
- }
74
- class RolsterArrayControl extends RolsterReactArrayControl {
75
- constructor(options) {
76
- super(options);
77
- this.valid = this.errors.length === 0;
78
- this.invalid = !this.valid;
79
- this.wrong = this.touched && this.invalid;
80
- }
81
- clone(options) {
82
- return new RolsterArrayControl(options);
83
- }
84
- }
85
- function rolsterArrayControl(options, validators) {
86
- const controlOptions = _arguments.createFormControlOptions(options, validators);
87
- return new RolsterArrayControl({
88
- ...controlOptions,
89
- initialValue: controlOptions.value,
90
- uuid: uuid.v4()
91
- });
92
- }
93
- function reactArrayControl(options, validators) {
94
- return rolsterArrayControl(options, validators);
95
- }
96
- function formArrayControl(options, validators) {
97
- return rolsterArrayControl(options, validators);
98
- }
99
- function inputArrayControl(options, validators) {
100
- return rolsterArrayControl(options, validators);
10
+ class RolsterReactArrayControl {
11
+ constructor(options) {
12
+ this.initialValue = options.initialValue;
13
+ this.uuid = options.uuid;
14
+ this.focused = !!options.focused;
15
+ this.unfocused = !this.focused;
16
+ this.touched = !!options.touched;
17
+ this.untouched = !this.touched;
18
+ this.dirty = !!options.dirty;
19
+ this.pristine = !this.dirty;
20
+ this.disabled = !!options.disabled;
21
+ this.enabled = !this.disabled;
22
+ const { value, validators } = options;
23
+ this.value = value;
24
+ this.validators = validators;
25
+ this.errors = validators ? helpers.controlIsValid({ value, validators }) : [];
26
+ this.error = this.errors[0];
27
+ }
28
+ focus() {
29
+ this.unfocused && this.refresh({ focused: true });
30
+ }
31
+ blur() {
32
+ this.focused && this.refresh({ focused: false, touched: true });
33
+ }
34
+ disable() {
35
+ this.enabled && this.refresh({ disabled: true });
36
+ }
37
+ enable() {
38
+ this.disabled && this.refresh({ disabled: false });
39
+ }
40
+ touch() {
41
+ this.untouched && this.refresh({ touched: true });
42
+ }
43
+ setValue(value) {
44
+ this.refresh({ value });
45
+ }
46
+ setValidators(validators) {
47
+ this.refresh({ validators });
48
+ }
49
+ subscribe(subscriber) {
50
+ this.subscriber = subscriber;
51
+ }
52
+ hasError(key) {
53
+ return helpers.hasError(this.errors, key);
54
+ }
55
+ someErrors(keys) {
56
+ return helpers.someErrors(this.errors, keys);
57
+ }
58
+ reset() {
59
+ this.refresh({
60
+ dirty: false,
61
+ touched: false,
62
+ value: this.initialValue
63
+ });
64
+ }
65
+ refresh(changes) {
66
+ this.subscriber &&
67
+ this.subscriber({
68
+ ...this,
69
+ ...changes,
70
+ initialValue: this.initialValue
71
+ });
72
+ }
73
+ }
74
+ class RolsterArrayControl extends RolsterReactArrayControl {
75
+ constructor(options) {
76
+ super(options);
77
+ this.valid = this.errors.length === 0;
78
+ this.invalid = !this.valid;
79
+ this.wrong = this.touched && this.invalid;
80
+ }
81
+ clone(options) {
82
+ return new RolsterArrayControl(options);
83
+ }
84
+ }
85
+ function rolsterArrayControl(options, validators) {
86
+ const controlOptions = _arguments.createFormControlOptions(options, validators);
87
+ return new RolsterArrayControl({
88
+ ...controlOptions,
89
+ initialValue: controlOptions.value,
90
+ uuid: uuid.v4()
91
+ });
92
+ }
93
+ function reactArrayControl(options, validators) {
94
+ return rolsterArrayControl(options, validators);
95
+ }
96
+ function formArrayControl(options, validators) {
97
+ return rolsterArrayControl(options, validators);
98
+ }
99
+ function inputArrayControl(options, validators) {
100
+ return rolsterArrayControl(options, validators);
101
101
  }
102
102
 
103
- class RolsterArrayGroup {
104
- constructor(options) {
105
- const { controls, resource, uuid, validators } = options;
106
- this.uuid = uuid;
107
- this.controls = controls;
108
- this.validators = validators;
109
- this.resource = resource;
110
- this.errors = validators ? helpers.groupIsValid({ controls, validators }) : [];
111
- this.error = this.errors[0];
112
- this.valid =
113
- this.errors.length === 0 && helpers.controlsAllChecked(controls, 'valid');
114
- this.invalid = !this.valid;
115
- this.dirty = helpers.controlsPartialChecked(controls, 'dirty');
116
- this.dirtyAll = helpers.controlsAllChecked(controls, 'dirty');
117
- this.touched = helpers.controlsPartialChecked(controls, 'touched');
118
- this.touchedAll = helpers.controlsAllChecked(controls, 'touched');
119
- this.untouched = !this.touched;
120
- this.untouchedAll = !this.touchedAll;
121
- this.pristine = !this.dirty;
122
- this.pristineAll = !this.dirtyAll;
123
- this.wrong = this.touched && this.invalid;
124
- this.value = helpers.controlsToValue(controls);
125
- const subscriber = (options) => {
126
- this.refresh({
127
- controls: Object.entries(this.controls).reduce((controls, [key, control]) => {
128
- controls[key] =
129
- control.uuid === options.uuid ? control.clone(options) : control;
130
- return controls;
131
- }, {})
132
- });
133
- };
134
- Object.values(controls).forEach((control) => {
135
- control.subscribe(subscriber);
136
- });
137
- }
138
- setValidators(validators) {
139
- this.refresh({ validators });
140
- }
141
- subscribe(subscriber) {
142
- this.subscriber = subscriber;
143
- }
144
- refresh(changes) {
145
- this.subscriber && this.subscriber({ ...this, ...changes });
146
- }
147
- }
148
- function formArrayGroup(options, validators) {
149
- return new RolsterArrayGroup({
150
- ..._arguments.createFormGroupOptions(options, validators),
151
- uuid: uuid.v4()
152
- });
103
+ class RolsterArrayGroup {
104
+ constructor(options) {
105
+ const { controls, resource, uuid, validators } = options;
106
+ this.uuid = uuid;
107
+ this.controls = controls;
108
+ this.validators = validators;
109
+ this.resource = resource;
110
+ this.errors = validators ? helpers.groupIsValid({ controls, validators }) : [];
111
+ this.error = this.errors[0];
112
+ this.valid =
113
+ this.errors.length === 0 && helpers.controlsAllChecked(controls, 'valid');
114
+ this.invalid = !this.valid;
115
+ this.dirty = helpers.controlsPartialChecked(controls, 'dirty');
116
+ this.dirtyAll = helpers.controlsAllChecked(controls, 'dirty');
117
+ this.touched = helpers.controlsPartialChecked(controls, 'touched');
118
+ this.touchedAll = helpers.controlsAllChecked(controls, 'touched');
119
+ this.untouched = !this.touched;
120
+ this.untouchedAll = !this.touchedAll;
121
+ this.pristine = !this.dirty;
122
+ this.pristineAll = !this.dirtyAll;
123
+ this.wrong = this.touched && this.invalid;
124
+ this.value = helpers.controlsToValue(controls);
125
+ const subscriber = (options) => {
126
+ this.refresh({
127
+ controls: Object.entries(this.controls).reduce((controls, [key, control]) => {
128
+ controls[key] =
129
+ control.uuid === options.uuid ? control.clone(options) : control;
130
+ return controls;
131
+ }, {})
132
+ });
133
+ };
134
+ Object.values(controls).forEach((control) => {
135
+ control.subscribe(subscriber);
136
+ });
137
+ }
138
+ setValidators(validators) {
139
+ this.refresh({ validators });
140
+ }
141
+ subscribe(subscriber) {
142
+ this.subscriber = subscriber;
143
+ }
144
+ refresh(changes) {
145
+ this.subscriber && this.subscriber({ ...this, ...changes });
146
+ }
147
+ }
148
+ function formArrayGroup(options, validators) {
149
+ return new RolsterArrayGroup({
150
+ ..._arguments.createFormGroupOptions(options, validators),
151
+ uuid: uuid.v4()
152
+ });
153
153
  }
154
154
 
155
- class RolsterArrayList extends RolsterReactArrayControl {
156
- constructor(options) {
157
- const value = options.controls.map((controls) => helpers.controlsToValue(controls));
158
- super({ ...options, value });
159
- this.valueToControls = options.valueToControls;
160
- this.controls = options.controls;
161
- this.valid =
162
- this.errors.length === 0 &&
163
- this.controls.reduce((valid, controls) => valid && helpers.controlsAllChecked(controls, 'valid'), true);
164
- this.invalid = !this.valid;
165
- this.wrong = this.touched && this.invalid;
166
- options.controls.forEach((controls) => {
167
- this.subscribeControls(controls);
168
- });
169
- }
170
- setValue(value) {
171
- this.refresh({
172
- controls: value.map((value) => this.valueToControls(value))
173
- });
174
- }
175
- clone(options) {
176
- return new RolsterArrayList(options);
177
- }
178
- push(controls) {
179
- this.refresh({
180
- controls: [...this.controls, controls]
181
- });
182
- }
183
- remove(controls) {
184
- this.refresh({
185
- controls: this.controls.filter((currentControls) => currentControls !== controls)
186
- });
187
- }
188
- refresh(changes) {
189
- super.refresh(changes);
190
- }
191
- subscribeControls(newControls) {
192
- Object.values(newControls).forEach((control) => {
193
- control.subscribe((options) => {
194
- const controls = this.controls.map((currentControls) => currentControls !== newControls
195
- ? currentControls
196
- : Object.entries(newControls).reduce((controls, [key, control]) => {
197
- controls[key] =
198
- control.uuid === options.uuid
199
- ? control.clone(options)
200
- : control;
201
- return controls;
202
- }, {}));
203
- this.refresh({ controls });
204
- });
205
- });
206
- }
207
- }
208
- function formArrayList(valueToControls, options) {
209
- const value = options?.value || [];
210
- return new RolsterArrayList({
211
- ...options,
212
- valueToControls,
213
- controls: value.map((value) => valueToControls(value)),
214
- initialValue: value,
215
- uuid: uuid.v4()
216
- });
155
+ class RolsterArrayList extends RolsterReactArrayControl {
156
+ constructor(options) {
157
+ const value = options.controls.map((controls) => helpers.controlsToValue(controls));
158
+ super({ ...options, value });
159
+ this.valueToControls = options.valueToControls;
160
+ this.controls = options.controls;
161
+ this.valid =
162
+ this.errors.length === 0 &&
163
+ this.controls.reduce((valid, controls) => valid && helpers.controlsAllChecked(controls, 'valid'), true);
164
+ this.invalid = !this.valid;
165
+ this.wrong = this.touched && this.invalid;
166
+ options.controls.forEach((controls) => {
167
+ this.subscribeControls(controls);
168
+ });
169
+ }
170
+ setValue(value) {
171
+ this.refresh({
172
+ controls: value.map((value) => this.valueToControls(value))
173
+ });
174
+ }
175
+ clone(options) {
176
+ return new RolsterArrayList(options);
177
+ }
178
+ push(controls) {
179
+ this.refresh({
180
+ controls: [...this.controls, controls]
181
+ });
182
+ }
183
+ remove(controls) {
184
+ this.refresh({
185
+ controls: this.controls.filter((currentControls) => currentControls !== controls)
186
+ });
187
+ }
188
+ refresh(changes) {
189
+ super.refresh(changes);
190
+ }
191
+ subscribeControls(newControls) {
192
+ Object.values(newControls).forEach((control) => {
193
+ control.subscribe((options) => {
194
+ const controls = this.controls.map((currentControls) => currentControls !== newControls
195
+ ? currentControls
196
+ : Object.entries(newControls).reduce((controls, [key, control]) => {
197
+ controls[key] =
198
+ control.uuid === options.uuid
199
+ ? control.clone(options)
200
+ : control;
201
+ return controls;
202
+ }, {}));
203
+ this.refresh({ controls });
204
+ });
205
+ });
206
+ }
207
+ }
208
+ function formArrayList(valueToControls, options) {
209
+ const value = options?.value || [];
210
+ return new RolsterArrayList({
211
+ ...options,
212
+ valueToControls,
213
+ controls: value.map((value) => valueToControls(value)),
214
+ initialValue: value,
215
+ uuid: uuid.v4()
216
+ });
217
217
  }
218
218
 
219
- function useFormArray(options, arrayValidators) {
220
- const arrayOptions = _arguments.createFormArrayOptions(options, arrayValidators);
221
- const groups = arrayOptions.groups || [];
222
- const currentState = react.useRef(groups);
223
- const [state, setState] = react.useState({
224
- controls: groups.map(({ controls }) => controls),
225
- disabled: false,
226
- groups,
227
- value: groups.map(({ controls }) => helpers.controlsToValue(controls)),
228
- validators: arrayOptions.validators
229
- });
230
- const errors = state.validators
231
- ? helpers.arrayIsValid({ groups, validators: state.validators })
232
- : [];
233
- const error = errors[0];
234
- const valid = errors.length === 0 && helpers.groupAllChecked(state.groups, 'valid');
235
- const dirty = helpers.groupPartialChecked(state.groups, 'dirty');
236
- const dirtyAll = helpers.groupAllChecked(state.groups, 'dirty');
237
- const touched = helpers.groupPartialChecked(state.groups, 'touched');
238
- const touchedAll = helpers.groupAllChecked(state.groups, 'touched');
239
- react.useEffect(() => {
240
- const subscriber = (options) => {
241
- setGroups(state.groups.map((group) => group.uuid === options.uuid
242
- ? new RolsterArrayGroup(options)
243
- : group));
244
- };
245
- state.groups.forEach((group) => {
246
- group.subscribe(subscriber);
247
- });
248
- }, [state.groups]);
249
- function disable() {
250
- setState((state) => ({ ...state, disabled: true }));
251
- }
252
- function enable() {
253
- setState((state) => ({ ...state, disabled: false }));
254
- }
255
- function setGroups(groups) {
256
- setState((currentState) => ({
257
- ...currentState,
258
- groups,
259
- controls: groups.map(({ controls }) => controls),
260
- value: groups.map(({ controls }) => helpers.controlsToValue(controls))
261
- }));
262
- }
263
- function push(group) {
264
- setGroups([...state.groups, group]);
265
- }
266
- function merge(groups) {
267
- setGroups([...state.groups, ...groups]);
268
- }
269
- function set(groups) {
270
- setGroups(groups);
271
- }
272
- function remove({ uuid }) {
273
- setGroups(state.groups.filter((group) => group.uuid !== uuid));
274
- }
275
- function hasError(key) {
276
- return helpers.hasError(errors, key);
277
- }
278
- function someErrors(keys) {
279
- return helpers.someErrors(errors, keys);
280
- }
281
- function reset() {
282
- setGroups(currentState.current);
283
- }
284
- function setValidators(validators) {
285
- setState((state) => ({ ...state, validators }));
286
- }
287
- return {
288
- ...state,
289
- dirty,
290
- dirtyAll,
291
- disable,
292
- enable,
293
- enabled: !state.disabled,
294
- error,
295
- errors,
296
- hasError,
297
- invalid: !valid,
298
- merge,
299
- pristine: !dirty,
300
- pristineAll: !dirtyAll,
301
- push,
302
- remove,
303
- reset,
304
- set,
305
- setValidators,
306
- someErrors,
307
- touched,
308
- touchedAll,
309
- untouched: !touched,
310
- untouchedAll: !touchedAll,
311
- valid,
312
- wrong: touched && !valid
313
- };
219
+ function useFormArray(options, arrayValidators) {
220
+ const arrayOptions = _arguments.createFormArrayOptions(options, arrayValidators);
221
+ const groups = arrayOptions.groups || [];
222
+ const currentState = react.useRef(groups);
223
+ const [state, setState] = react.useState({
224
+ controls: groups.map(({ controls }) => controls),
225
+ disabled: false,
226
+ groups,
227
+ value: groups.map(({ controls }) => helpers.controlsToValue(controls)),
228
+ validators: arrayOptions.validators
229
+ });
230
+ const errors = state.validators
231
+ ? helpers.arrayIsValid({ groups, validators: state.validators })
232
+ : [];
233
+ const error = errors[0];
234
+ const valid = errors.length === 0 && helpers.groupAllChecked(state.groups, 'valid');
235
+ const dirty = helpers.groupPartialChecked(state.groups, 'dirty');
236
+ const dirtyAll = helpers.groupAllChecked(state.groups, 'dirty');
237
+ const touched = helpers.groupPartialChecked(state.groups, 'touched');
238
+ const touchedAll = helpers.groupAllChecked(state.groups, 'touched');
239
+ react.useEffect(() => {
240
+ const subscriber = (options) => {
241
+ setGroups(state.groups.map((group) => group.uuid === options.uuid
242
+ ? new RolsterArrayGroup(options)
243
+ : group));
244
+ };
245
+ state.groups.forEach((group) => {
246
+ group.subscribe(subscriber);
247
+ });
248
+ }, [state.groups]);
249
+ function disable() {
250
+ setState((state) => ({ ...state, disabled: true }));
251
+ }
252
+ function enable() {
253
+ setState((state) => ({ ...state, disabled: false }));
254
+ }
255
+ function setGroups(groups) {
256
+ setState((currentState) => ({
257
+ ...currentState,
258
+ groups,
259
+ controls: groups.map(({ controls }) => controls),
260
+ value: groups.map(({ controls }) => helpers.controlsToValue(controls))
261
+ }));
262
+ }
263
+ function push(group) {
264
+ setGroups([...state.groups, group]);
265
+ }
266
+ function merge(groups) {
267
+ setGroups([...state.groups, ...groups]);
268
+ }
269
+ function set(groups) {
270
+ setGroups(groups);
271
+ }
272
+ function remove({ uuid }) {
273
+ setGroups(state.groups.filter((group) => group.uuid !== uuid));
274
+ }
275
+ function hasError(key) {
276
+ return helpers.hasError(errors, key);
277
+ }
278
+ function someErrors(keys) {
279
+ return helpers.someErrors(errors, keys);
280
+ }
281
+ function reset() {
282
+ setGroups(currentState.current);
283
+ }
284
+ function setValidators(validators) {
285
+ setState((state) => ({ ...state, validators }));
286
+ }
287
+ return {
288
+ ...state,
289
+ dirty,
290
+ dirtyAll,
291
+ disable,
292
+ enable,
293
+ enabled: !state.disabled,
294
+ error,
295
+ errors,
296
+ hasError,
297
+ invalid: !valid,
298
+ merge,
299
+ pristine: !dirty,
300
+ pristineAll: !dirtyAll,
301
+ push,
302
+ remove,
303
+ reset,
304
+ set,
305
+ setValidators,
306
+ someErrors,
307
+ touched,
308
+ touchedAll,
309
+ untouched: !touched,
310
+ untouchedAll: !touchedAll,
311
+ valid,
312
+ wrong: touched && !valid
313
+ };
314
314
  }
315
315
 
316
- function useControl(controlOptions, controlValidators) {
317
- const { value, touched, validators } = _arguments.createFormControlOptions(controlOptions, controlValidators);
318
- const [state, setState] = react.useState({
319
- dirty: false,
320
- disabled: false,
321
- focused: false,
322
- touched: !!touched,
323
- validators,
324
- value
325
- });
326
- const initialValue = react.useRef(value);
327
- const elementRef = react.useRef(null);
328
- const errors = state.validators
329
- ? helpers.controlIsValid({
330
- value: state.value,
331
- validators: state.validators
332
- })
333
- : [];
334
- const valid = errors.length === 0;
335
- function focus() {
336
- setState((state) => ({ ...state, focused: true }));
337
- }
338
- function blur() {
339
- setState((state) => ({ ...state, focused: false, touched: true }));
340
- }
341
- function disable() {
342
- setState((state) => ({ ...state, disabled: true }));
343
- }
344
- function enable() {
345
- setState((state) => ({ ...state, disabled: false }));
346
- }
347
- function touch() {
348
- setState((state) => ({ ...state, touched: true }));
349
- }
350
- function setValue(value) {
351
- setState((state) => ({ ...state, dirty: true, value }));
352
- }
353
- function setValidators(validators) {
354
- setState((state) => ({ ...state, validators }));
355
- }
356
- function hasError(key) {
357
- return helpers.hasError(errors, key);
358
- }
359
- function someErrors(keys) {
360
- return helpers.someErrors(errors, keys);
361
- }
362
- function reset() {
363
- setState((state) => ({
364
- ...state,
365
- dirty: false,
366
- value: initialValue.current,
367
- touched: false
368
- }));
369
- }
370
- return {
371
- ...state,
372
- blur,
373
- disable,
374
- elementRef,
375
- enable,
376
- enabled: !state.disabled,
377
- error: errors[0],
378
- errors,
379
- focus,
380
- hasError,
381
- invalid: !valid,
382
- pristine: !state.dirty,
383
- reset,
384
- setValidators,
385
- setValue,
386
- someErrors,
387
- touch,
388
- unfocused: !state.focused,
389
- untouched: !state.touched,
390
- valid,
391
- wrong: state.touched && !valid
392
- };
393
- }
394
- function useReactControl(options, validators) {
395
- return useControl(options, validators);
396
- }
397
- function useFormControl(options, validators) {
398
- return useControl(options, validators);
399
- }
400
- function useInputControl(options, validators) {
401
- return useControl(options, validators);
316
+ function useControl(controlOptions, controlValidators) {
317
+ const { value, touched, validators } = _arguments.createFormControlOptions(controlOptions, controlValidators);
318
+ const [state, setState] = react.useState({
319
+ dirty: false,
320
+ disabled: false,
321
+ focused: false,
322
+ touched: !!touched,
323
+ validators,
324
+ value
325
+ });
326
+ const initialValue = react.useRef(value);
327
+ const elementRef = react.useRef(null);
328
+ const errors = state.validators
329
+ ? helpers.controlIsValid({
330
+ value: state.value,
331
+ validators: state.validators
332
+ })
333
+ : [];
334
+ const valid = errors.length === 0;
335
+ function focus() {
336
+ setState((state) => ({ ...state, focused: true }));
337
+ }
338
+ function blur() {
339
+ setState((state) => ({ ...state, focused: false, touched: true }));
340
+ }
341
+ function disable() {
342
+ setState((state) => ({ ...state, disabled: true }));
343
+ }
344
+ function enable() {
345
+ setState((state) => ({ ...state, disabled: false }));
346
+ }
347
+ function touch() {
348
+ setState((state) => ({ ...state, touched: true }));
349
+ }
350
+ function setValue(value) {
351
+ setState((state) => ({ ...state, dirty: true, value }));
352
+ }
353
+ function setValidators(validators) {
354
+ setState((state) => ({ ...state, validators }));
355
+ }
356
+ function hasError(key) {
357
+ return helpers.hasError(errors, key);
358
+ }
359
+ function someErrors(keys) {
360
+ return helpers.someErrors(errors, keys);
361
+ }
362
+ function reset() {
363
+ setState((state) => ({
364
+ ...state,
365
+ dirty: false,
366
+ value: initialValue.current,
367
+ touched: false
368
+ }));
369
+ }
370
+ return {
371
+ ...state,
372
+ blur,
373
+ disable,
374
+ elementRef,
375
+ enable,
376
+ enabled: !state.disabled,
377
+ error: errors[0],
378
+ errors,
379
+ focus,
380
+ hasError,
381
+ invalid: !valid,
382
+ pristine: !state.dirty,
383
+ reset,
384
+ setValidators,
385
+ setValue,
386
+ someErrors,
387
+ touch,
388
+ unfocused: !state.focused,
389
+ untouched: !state.touched,
390
+ valid,
391
+ wrong: state.touched && !valid
392
+ };
393
+ }
394
+ function useReactControl(options, validators) {
395
+ return useControl(options, validators);
396
+ }
397
+ function useFormControl(options, validators) {
398
+ return useControl(options, validators);
399
+ }
400
+ function useInputControl(options, validators) {
401
+ return useControl(options, validators);
402
402
  }
403
403
 
404
- function useFormGroup(options, groupValidators) {
405
- const groupOptions = _arguments.createFormGroupOptions(options, groupValidators);
406
- const [validators, setValidators] = react.useState(groupOptions.validators);
407
- const { controls } = groupOptions;
408
- const errors = validators ? helpers.groupIsValid({ controls, validators }) : [];
409
- const valid = errors.length === 0 && helpers.controlsAllChecked(controls, 'valid');
410
- const value = helpers.controlsToValue(controls);
411
- const dirty = helpers.controlsPartialChecked(controls, 'dirty');
412
- const dirtyAll = helpers.controlsAllChecked(controls, 'dirty');
413
- const touched = helpers.controlsPartialChecked(controls, 'touched');
414
- const touchedAll = helpers.controlsAllChecked(controls, 'touched');
415
- function reset() {
416
- Object.values(controls).forEach((control) => {
417
- control.reset();
418
- });
419
- }
420
- return {
421
- controls,
422
- dirty,
423
- dirtyAll,
424
- error: errors[0],
425
- errors,
426
- invalid: !valid,
427
- pristine: !dirty,
428
- pristineAll: !dirtyAll,
429
- reset,
430
- setValidators,
431
- touched,
432
- touchedAll,
433
- untouched: !touched,
434
- untouchedAll: !touchedAll,
435
- valid,
436
- value,
437
- wrong: touched && !valid
438
- };
404
+ function useFormGroup(options, groupValidators) {
405
+ const groupOptions = _arguments.createFormGroupOptions(options, groupValidators);
406
+ const [validators, setValidators] = react.useState(groupOptions.validators);
407
+ const { controls } = groupOptions;
408
+ const errors = validators ? helpers.groupIsValid({ controls, validators }) : [];
409
+ const valid = errors.length === 0 && helpers.controlsAllChecked(controls, 'valid');
410
+ const value = helpers.controlsToValue(controls);
411
+ const dirty = helpers.controlsPartialChecked(controls, 'dirty');
412
+ const dirtyAll = helpers.controlsAllChecked(controls, 'dirty');
413
+ const touched = helpers.controlsPartialChecked(controls, 'touched');
414
+ const touchedAll = helpers.controlsAllChecked(controls, 'touched');
415
+ function reset() {
416
+ Object.values(controls).forEach((control) => {
417
+ control.reset();
418
+ });
419
+ }
420
+ return {
421
+ controls,
422
+ dirty,
423
+ dirtyAll,
424
+ error: errors[0],
425
+ errors,
426
+ invalid: !valid,
427
+ pristine: !dirty,
428
+ pristineAll: !dirtyAll,
429
+ reset,
430
+ setValidators,
431
+ touched,
432
+ touchedAll,
433
+ untouched: !touched,
434
+ untouchedAll: !touchedAll,
435
+ valid,
436
+ value,
437
+ wrong: touched && !valid
438
+ };
439
439
  }
440
440
 
441
441
  exports.formArrayControl = formArrayControl;