tp-react-elements-dev 1.10.5 → 1.10.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/dist/index.d.ts +2 -0
- package/dist/index.esm.js +681 -601
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +681 -600
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.esm.js
CHANGED
|
@@ -37,13 +37,14 @@ var isWeb = typeof window !== 'undefined' &&
|
|
|
37
37
|
function cloneObject(data) {
|
|
38
38
|
let copy;
|
|
39
39
|
const isArray = Array.isArray(data);
|
|
40
|
+
const isFileListInstance = typeof FileList !== 'undefined' ? data instanceof FileList : false;
|
|
40
41
|
if (data instanceof Date) {
|
|
41
42
|
copy = new Date(data);
|
|
42
43
|
}
|
|
43
44
|
else if (data instanceof Set) {
|
|
44
45
|
copy = new Set(data);
|
|
45
46
|
}
|
|
46
|
-
else if (!(isWeb && (data instanceof Blob ||
|
|
47
|
+
else if (!(isWeb && (data instanceof Blob || isFileListInstance)) &&
|
|
47
48
|
(isArray || isObject$1(data))) {
|
|
48
49
|
copy = isArray ? [] : {};
|
|
49
50
|
if (!isArray && !isPlainObject$1(data)) {
|
|
@@ -102,13 +103,12 @@ var set = (object, path, value) => {
|
|
|
102
103
|
? []
|
|
103
104
|
: {};
|
|
104
105
|
}
|
|
105
|
-
if (key === '__proto__') {
|
|
106
|
+
if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
|
|
106
107
|
return;
|
|
107
108
|
}
|
|
108
109
|
object[key] = newValue;
|
|
109
110
|
object = object[key];
|
|
110
111
|
}
|
|
111
|
-
return object;
|
|
112
112
|
};
|
|
113
113
|
|
|
114
114
|
const EVENTS = {
|
|
@@ -185,43 +185,6 @@ var getProxyFormState = (formState, control, localProxyFormState, isRoot = true)
|
|
|
185
185
|
return result;
|
|
186
186
|
};
|
|
187
187
|
|
|
188
|
-
var isEmptyObject = (value) => isObject$1(value) && !Object.keys(value).length;
|
|
189
|
-
|
|
190
|
-
var shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, isRoot) => {
|
|
191
|
-
updateFormState(formStateData);
|
|
192
|
-
const { name, ...formState } = formStateData;
|
|
193
|
-
return (isEmptyObject(formState) ||
|
|
194
|
-
Object.keys(formState).length >= Object.keys(_proxyFormState).length ||
|
|
195
|
-
Object.keys(formState).find((key) => _proxyFormState[key] ===
|
|
196
|
-
(!isRoot || VALIDATION_MODE.all)));
|
|
197
|
-
};
|
|
198
|
-
|
|
199
|
-
var convertToArrayPayload = (value) => (Array.isArray(value) ? value : [value]);
|
|
200
|
-
|
|
201
|
-
var shouldSubscribeByName = (name, signalName, exact) => !name ||
|
|
202
|
-
!signalName ||
|
|
203
|
-
name === signalName ||
|
|
204
|
-
convertToArrayPayload(name).some((currentName) => currentName &&
|
|
205
|
-
(exact
|
|
206
|
-
? currentName === signalName
|
|
207
|
-
: currentName.startsWith(signalName) ||
|
|
208
|
-
signalName.startsWith(currentName)));
|
|
209
|
-
|
|
210
|
-
function useSubscribe(props) {
|
|
211
|
-
const _props = React__default.useRef(props);
|
|
212
|
-
_props.current = props;
|
|
213
|
-
React__default.useEffect(() => {
|
|
214
|
-
const subscription = !props.disabled &&
|
|
215
|
-
_props.current.subject &&
|
|
216
|
-
_props.current.subject.subscribe({
|
|
217
|
-
next: _props.current.next,
|
|
218
|
-
});
|
|
219
|
-
return () => {
|
|
220
|
-
subscription && subscription.unsubscribe();
|
|
221
|
-
};
|
|
222
|
-
}, [props.disabled]);
|
|
223
|
-
}
|
|
224
|
-
|
|
225
188
|
/**
|
|
226
189
|
* This custom hook allows you to subscribe to each form state, and isolate the re-render at the custom hook level. It has its scope in terms of form state subscription, so it would not affect other useFormState and useForm. Using this hook can reduce the re-render impact on large and complex form application.
|
|
227
190
|
*
|
|
@@ -256,7 +219,6 @@ function useFormState(props) {
|
|
|
256
219
|
const methods = useFormContext();
|
|
257
220
|
const { control = methods.control, disabled, name, exact } = props || {};
|
|
258
221
|
const [formState, updateFormState] = React__default.useState(control._formState);
|
|
259
|
-
const _mounted = React__default.useRef(true);
|
|
260
222
|
const _localProxyFormState = React__default.useRef({
|
|
261
223
|
isDirty: false,
|
|
262
224
|
isLoading: false,
|
|
@@ -269,25 +231,22 @@ function useFormState(props) {
|
|
|
269
231
|
});
|
|
270
232
|
const _name = React__default.useRef(name);
|
|
271
233
|
_name.current = name;
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
234
|
+
React__default.useEffect(() => control._subscribe({
|
|
235
|
+
name: _name.current,
|
|
236
|
+
formState: _localProxyFormState.current,
|
|
237
|
+
exact,
|
|
238
|
+
callback: (formState) => {
|
|
239
|
+
!disabled &&
|
|
240
|
+
updateFormState({
|
|
241
|
+
...control._formState,
|
|
242
|
+
...formState,
|
|
243
|
+
});
|
|
244
|
+
},
|
|
245
|
+
}), [control, disabled, exact]);
|
|
283
246
|
React__default.useEffect(() => {
|
|
284
|
-
|
|
285
|
-
_localProxyFormState.current.isValid && control._updateValid(true);
|
|
286
|
-
return () => {
|
|
287
|
-
_mounted.current = false;
|
|
288
|
-
};
|
|
247
|
+
_localProxyFormState.current.isValid && control._setValid(true);
|
|
289
248
|
}, [control]);
|
|
290
|
-
return getProxyFormState(formState, control, _localProxyFormState.current, false);
|
|
249
|
+
return React__default.useMemo(() => getProxyFormState(formState, control, _localProxyFormState.current, false), [formState, control]);
|
|
291
250
|
}
|
|
292
251
|
|
|
293
252
|
var isString = (value) => typeof value === 'string';
|
|
@@ -324,16 +283,17 @@ function useWatch(props) {
|
|
|
324
283
|
const methods = useFormContext();
|
|
325
284
|
const { control = methods.control, name, defaultValue, disabled, exact, } = props || {};
|
|
326
285
|
const _name = React__default.useRef(name);
|
|
286
|
+
const _defaultValue = React__default.useRef(defaultValue);
|
|
327
287
|
_name.current = name;
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
if (shouldSubscribeByName(_name.current, formState.name, exact)) {
|
|
333
|
-
updateValue(cloneObject(generateWatchOutput(_name.current, control._names, formState.values || control._formValues, false, defaultValue)));
|
|
334
|
-
}
|
|
288
|
+
React__default.useEffect(() => control._subscribe({
|
|
289
|
+
name: _name.current,
|
|
290
|
+
formState: {
|
|
291
|
+
values: true,
|
|
335
292
|
},
|
|
336
|
-
|
|
293
|
+
exact,
|
|
294
|
+
callback: (formState) => !disabled &&
|
|
295
|
+
updateValue(generateWatchOutput(_name.current, control._names, formState.values || control._formValues, false, _defaultValue.current)),
|
|
296
|
+
}), [control, disabled, exact]);
|
|
337
297
|
const [value, updateValue] = React__default.useState(control._getWatch(name, defaultValue));
|
|
338
298
|
React__default.useEffect(() => control._removeUnmounted());
|
|
339
299
|
return value;
|
|
@@ -376,17 +336,82 @@ function useController(props) {
|
|
|
376
336
|
const formState = useFormState({
|
|
377
337
|
control,
|
|
378
338
|
name,
|
|
339
|
+
exact: true,
|
|
379
340
|
});
|
|
341
|
+
const _props = React__default.useRef(props);
|
|
380
342
|
const _registerProps = React__default.useRef(control.register(name, {
|
|
381
343
|
...props.rules,
|
|
382
344
|
value,
|
|
383
345
|
...(isBoolean(props.disabled) ? { disabled: props.disabled } : {}),
|
|
384
346
|
}));
|
|
347
|
+
const fieldState = React__default.useMemo(() => Object.defineProperties({}, {
|
|
348
|
+
invalid: {
|
|
349
|
+
enumerable: true,
|
|
350
|
+
get: () => !!get(formState.errors, name),
|
|
351
|
+
},
|
|
352
|
+
isDirty: {
|
|
353
|
+
enumerable: true,
|
|
354
|
+
get: () => !!get(formState.dirtyFields, name),
|
|
355
|
+
},
|
|
356
|
+
isTouched: {
|
|
357
|
+
enumerable: true,
|
|
358
|
+
get: () => !!get(formState.touchedFields, name),
|
|
359
|
+
},
|
|
360
|
+
isValidating: {
|
|
361
|
+
enumerable: true,
|
|
362
|
+
get: () => !!get(formState.validatingFields, name),
|
|
363
|
+
},
|
|
364
|
+
error: {
|
|
365
|
+
enumerable: true,
|
|
366
|
+
get: () => get(formState.errors, name),
|
|
367
|
+
},
|
|
368
|
+
}), [formState, name]);
|
|
369
|
+
const onChange = React__default.useCallback((event) => _registerProps.current.onChange({
|
|
370
|
+
target: {
|
|
371
|
+
value: getEventValue(event),
|
|
372
|
+
name: name,
|
|
373
|
+
},
|
|
374
|
+
type: EVENTS.CHANGE,
|
|
375
|
+
}), [name]);
|
|
376
|
+
const onBlur = React__default.useCallback(() => _registerProps.current.onBlur({
|
|
377
|
+
target: {
|
|
378
|
+
value: get(control._formValues, name),
|
|
379
|
+
name: name,
|
|
380
|
+
},
|
|
381
|
+
type: EVENTS.BLUR,
|
|
382
|
+
}), [name, control._formValues]);
|
|
383
|
+
const ref = React__default.useCallback((elm) => {
|
|
384
|
+
const field = get(control._fields, name);
|
|
385
|
+
if (field && elm) {
|
|
386
|
+
field._f.ref = {
|
|
387
|
+
focus: () => elm.focus(),
|
|
388
|
+
select: () => elm.select(),
|
|
389
|
+
setCustomValidity: (message) => elm.setCustomValidity(message),
|
|
390
|
+
reportValidity: () => elm.reportValidity(),
|
|
391
|
+
};
|
|
392
|
+
}
|
|
393
|
+
}, [control._fields, name]);
|
|
394
|
+
const field = React__default.useMemo(() => ({
|
|
395
|
+
name,
|
|
396
|
+
value,
|
|
397
|
+
...(isBoolean(disabled) || formState.disabled
|
|
398
|
+
? { disabled: formState.disabled || disabled }
|
|
399
|
+
: {}),
|
|
400
|
+
onChange,
|
|
401
|
+
onBlur,
|
|
402
|
+
ref,
|
|
403
|
+
}), [name, disabled, formState.disabled, onChange, onBlur, ref, value]);
|
|
385
404
|
React__default.useEffect(() => {
|
|
386
405
|
const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
|
|
406
|
+
control.register(name, {
|
|
407
|
+
..._props.current.rules,
|
|
408
|
+
...(isBoolean(_props.current.disabled)
|
|
409
|
+
? { disabled: _props.current.disabled }
|
|
410
|
+
: {}),
|
|
411
|
+
});
|
|
387
412
|
const updateMounted = (name, value) => {
|
|
388
413
|
const field = get(control._fields, name);
|
|
389
|
-
if (field) {
|
|
414
|
+
if (field && field._f) {
|
|
390
415
|
field._f.mount = value;
|
|
391
416
|
}
|
|
392
417
|
};
|
|
@@ -398,6 +423,7 @@ function useController(props) {
|
|
|
398
423
|
set(control._formValues, name, value);
|
|
399
424
|
}
|
|
400
425
|
}
|
|
426
|
+
!isArrayField && control.register(name);
|
|
401
427
|
return () => {
|
|
402
428
|
(isArrayField
|
|
403
429
|
? _shouldUnregisterField && !control._state.action
|
|
@@ -407,72 +433,16 @@ function useController(props) {
|
|
|
407
433
|
};
|
|
408
434
|
}, [name, control, isArrayField, shouldUnregister]);
|
|
409
435
|
React__default.useEffect(() => {
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
disabled,
|
|
413
|
-
fields: control._fields,
|
|
414
|
-
name,
|
|
415
|
-
value: get(control._fields, name)._f.value,
|
|
416
|
-
});
|
|
417
|
-
}
|
|
418
|
-
}, [disabled, name, control]);
|
|
419
|
-
return {
|
|
420
|
-
field: {
|
|
436
|
+
control._setDisabledField({
|
|
437
|
+
disabled,
|
|
421
438
|
name,
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
onChange: React__default.useCallback((event) => _registerProps.current.onChange({
|
|
427
|
-
target: {
|
|
428
|
-
value: getEventValue(event),
|
|
429
|
-
name: name,
|
|
430
|
-
},
|
|
431
|
-
type: EVENTS.CHANGE,
|
|
432
|
-
}), [name]),
|
|
433
|
-
onBlur: React__default.useCallback(() => _registerProps.current.onBlur({
|
|
434
|
-
target: {
|
|
435
|
-
value: get(control._formValues, name),
|
|
436
|
-
name: name,
|
|
437
|
-
},
|
|
438
|
-
type: EVENTS.BLUR,
|
|
439
|
-
}), [name, control]),
|
|
440
|
-
ref: (elm) => {
|
|
441
|
-
const field = get(control._fields, name);
|
|
442
|
-
if (field && elm) {
|
|
443
|
-
field._f.ref = {
|
|
444
|
-
focus: () => elm.focus(),
|
|
445
|
-
select: () => elm.select(),
|
|
446
|
-
setCustomValidity: (message) => elm.setCustomValidity(message),
|
|
447
|
-
reportValidity: () => elm.reportValidity(),
|
|
448
|
-
};
|
|
449
|
-
}
|
|
450
|
-
},
|
|
451
|
-
},
|
|
439
|
+
});
|
|
440
|
+
}, [disabled, name, control]);
|
|
441
|
+
return React__default.useMemo(() => ({
|
|
442
|
+
field,
|
|
452
443
|
formState,
|
|
453
|
-
fieldState
|
|
454
|
-
|
|
455
|
-
enumerable: true,
|
|
456
|
-
get: () => !!get(formState.errors, name),
|
|
457
|
-
},
|
|
458
|
-
isDirty: {
|
|
459
|
-
enumerable: true,
|
|
460
|
-
get: () => !!get(formState.dirtyFields, name),
|
|
461
|
-
},
|
|
462
|
-
isTouched: {
|
|
463
|
-
enumerable: true,
|
|
464
|
-
get: () => !!get(formState.touchedFields, name),
|
|
465
|
-
},
|
|
466
|
-
isValidating: {
|
|
467
|
-
enumerable: true,
|
|
468
|
-
get: () => !!get(formState.validatingFields, name),
|
|
469
|
-
},
|
|
470
|
-
error: {
|
|
471
|
-
enumerable: true,
|
|
472
|
-
get: () => get(formState.errors, name),
|
|
473
|
-
},
|
|
474
|
-
}),
|
|
475
|
-
};
|
|
444
|
+
fieldState,
|
|
445
|
+
}), [field, formState, fieldState]);
|
|
476
446
|
}
|
|
477
447
|
|
|
478
448
|
/**
|
|
@@ -529,340 +499,7 @@ var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => va
|
|
|
529
499
|
}
|
|
530
500
|
: {};
|
|
531
501
|
|
|
532
|
-
var
|
|
533
|
-
isOnSubmit: !mode || mode === VALIDATION_MODE.onSubmit,
|
|
534
|
-
isOnBlur: mode === VALIDATION_MODE.onBlur,
|
|
535
|
-
isOnChange: mode === VALIDATION_MODE.onChange,
|
|
536
|
-
isOnAll: mode === VALIDATION_MODE.all,
|
|
537
|
-
isOnTouch: mode === VALIDATION_MODE.onTouched,
|
|
538
|
-
});
|
|
539
|
-
|
|
540
|
-
var isWatched = (name, _names, isBlurEvent) => !isBlurEvent &&
|
|
541
|
-
(_names.watchAll ||
|
|
542
|
-
_names.watch.has(name) ||
|
|
543
|
-
[..._names.watch].some((watchName) => name.startsWith(watchName) &&
|
|
544
|
-
/^\.\w+/.test(name.slice(watchName.length))));
|
|
545
|
-
|
|
546
|
-
const iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => {
|
|
547
|
-
for (const key of fieldsNames || Object.keys(fields)) {
|
|
548
|
-
const field = get(fields, key);
|
|
549
|
-
if (field) {
|
|
550
|
-
const { _f, ...currentField } = field;
|
|
551
|
-
if (_f) {
|
|
552
|
-
if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) {
|
|
553
|
-
break;
|
|
554
|
-
}
|
|
555
|
-
else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) {
|
|
556
|
-
break;
|
|
557
|
-
}
|
|
558
|
-
else {
|
|
559
|
-
iterateFieldsByAction(currentField, action);
|
|
560
|
-
}
|
|
561
|
-
}
|
|
562
|
-
else if (isObject$1(currentField)) {
|
|
563
|
-
iterateFieldsByAction(currentField, action);
|
|
564
|
-
}
|
|
565
|
-
}
|
|
566
|
-
}
|
|
567
|
-
};
|
|
568
|
-
|
|
569
|
-
var updateFieldArrayRootError = (errors, error, name) => {
|
|
570
|
-
const fieldArrayErrors = compact(get(errors, name));
|
|
571
|
-
set(fieldArrayErrors, 'root', error[name]);
|
|
572
|
-
set(errors, name, fieldArrayErrors);
|
|
573
|
-
return errors;
|
|
574
|
-
};
|
|
575
|
-
|
|
576
|
-
var isFileInput = (element) => element.type === 'file';
|
|
577
|
-
|
|
578
|
-
var isFunction = (value) => typeof value === 'function';
|
|
579
|
-
|
|
580
|
-
var isHTMLElement$2 = (value) => {
|
|
581
|
-
if (!isWeb) {
|
|
582
|
-
return false;
|
|
583
|
-
}
|
|
584
|
-
const owner = value ? value.ownerDocument : 0;
|
|
585
|
-
return (value instanceof
|
|
586
|
-
(owner && owner.defaultView ? owner.defaultView.HTMLElement : HTMLElement));
|
|
587
|
-
};
|
|
588
|
-
|
|
589
|
-
var isMessage = (value) => isString(value);
|
|
590
|
-
|
|
591
|
-
var isRadioInput = (element) => element.type === 'radio';
|
|
592
|
-
|
|
593
|
-
var isRegex = (value) => value instanceof RegExp;
|
|
594
|
-
|
|
595
|
-
const defaultResult = {
|
|
596
|
-
value: false,
|
|
597
|
-
isValid: false,
|
|
598
|
-
};
|
|
599
|
-
const validResult = { value: true, isValid: true };
|
|
600
|
-
var getCheckboxValue = (options) => {
|
|
601
|
-
if (Array.isArray(options)) {
|
|
602
|
-
if (options.length > 1) {
|
|
603
|
-
const values = options
|
|
604
|
-
.filter((option) => option && option.checked && !option.disabled)
|
|
605
|
-
.map((option) => option.value);
|
|
606
|
-
return { value: values, isValid: !!values.length };
|
|
607
|
-
}
|
|
608
|
-
return options[0].checked && !options[0].disabled
|
|
609
|
-
? // @ts-expect-error expected to work in the browser
|
|
610
|
-
options[0].attributes && !isUndefined(options[0].attributes.value)
|
|
611
|
-
? isUndefined(options[0].value) || options[0].value === ''
|
|
612
|
-
? validResult
|
|
613
|
-
: { value: options[0].value, isValid: true }
|
|
614
|
-
: validResult
|
|
615
|
-
: defaultResult;
|
|
616
|
-
}
|
|
617
|
-
return defaultResult;
|
|
618
|
-
};
|
|
619
|
-
|
|
620
|
-
const defaultReturn = {
|
|
621
|
-
isValid: false,
|
|
622
|
-
value: null,
|
|
623
|
-
};
|
|
624
|
-
var getRadioValue = (options) => Array.isArray(options)
|
|
625
|
-
? options.reduce((previous, option) => option && option.checked && !option.disabled
|
|
626
|
-
? {
|
|
627
|
-
isValid: true,
|
|
628
|
-
value: option.value,
|
|
629
|
-
}
|
|
630
|
-
: previous, defaultReturn)
|
|
631
|
-
: defaultReturn;
|
|
632
|
-
|
|
633
|
-
function getValidateError(result, ref, type = 'validate') {
|
|
634
|
-
if (isMessage(result) ||
|
|
635
|
-
(Array.isArray(result) && result.every(isMessage)) ||
|
|
636
|
-
(isBoolean(result) && !result)) {
|
|
637
|
-
return {
|
|
638
|
-
type,
|
|
639
|
-
message: isMessage(result) ? result : '',
|
|
640
|
-
ref,
|
|
641
|
-
};
|
|
642
|
-
}
|
|
643
|
-
}
|
|
644
|
-
|
|
645
|
-
var getValueAndMessage = (validationData) => isObject$1(validationData) && !isRegex(validationData)
|
|
646
|
-
? validationData
|
|
647
|
-
: {
|
|
648
|
-
value: validationData,
|
|
649
|
-
message: '',
|
|
650
|
-
};
|
|
651
|
-
|
|
652
|
-
var validateField = async (field, formValues, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => {
|
|
653
|
-
const { ref, refs, required, maxLength, minLength, min, max, pattern, validate, name, valueAsNumber, mount, disabled, } = field._f;
|
|
654
|
-
const inputValue = get(formValues, name);
|
|
655
|
-
if (!mount || disabled) {
|
|
656
|
-
return {};
|
|
657
|
-
}
|
|
658
|
-
const inputRef = refs ? refs[0] : ref;
|
|
659
|
-
const setCustomValidity = (message) => {
|
|
660
|
-
if (shouldUseNativeValidation && inputRef.reportValidity) {
|
|
661
|
-
inputRef.setCustomValidity(isBoolean(message) ? '' : message || '');
|
|
662
|
-
inputRef.reportValidity();
|
|
663
|
-
}
|
|
664
|
-
};
|
|
665
|
-
const error = {};
|
|
666
|
-
const isRadio = isRadioInput(ref);
|
|
667
|
-
const isCheckBox = isCheckBoxInput(ref);
|
|
668
|
-
const isRadioOrCheckbox = isRadio || isCheckBox;
|
|
669
|
-
const isEmpty = ((valueAsNumber || isFileInput(ref)) &&
|
|
670
|
-
isUndefined(ref.value) &&
|
|
671
|
-
isUndefined(inputValue)) ||
|
|
672
|
-
(isHTMLElement$2(ref) && ref.value === '') ||
|
|
673
|
-
inputValue === '' ||
|
|
674
|
-
(Array.isArray(inputValue) && !inputValue.length);
|
|
675
|
-
const appendErrorsCurry = appendErrors.bind(null, name, validateAllFieldCriteria, error);
|
|
676
|
-
const getMinMaxMessage = (exceedMax, maxLengthMessage, minLengthMessage, maxType = INPUT_VALIDATION_RULES.maxLength, minType = INPUT_VALIDATION_RULES.minLength) => {
|
|
677
|
-
const message = exceedMax ? maxLengthMessage : minLengthMessage;
|
|
678
|
-
error[name] = {
|
|
679
|
-
type: exceedMax ? maxType : minType,
|
|
680
|
-
message,
|
|
681
|
-
ref,
|
|
682
|
-
...appendErrorsCurry(exceedMax ? maxType : minType, message),
|
|
683
|
-
};
|
|
684
|
-
};
|
|
685
|
-
if (isFieldArray
|
|
686
|
-
? !Array.isArray(inputValue) || !inputValue.length
|
|
687
|
-
: required &&
|
|
688
|
-
((!isRadioOrCheckbox && (isEmpty || isNullOrUndefined(inputValue))) ||
|
|
689
|
-
(isBoolean(inputValue) && !inputValue) ||
|
|
690
|
-
(isCheckBox && !getCheckboxValue(refs).isValid) ||
|
|
691
|
-
(isRadio && !getRadioValue(refs).isValid))) {
|
|
692
|
-
const { value, message } = isMessage(required)
|
|
693
|
-
? { value: !!required, message: required }
|
|
694
|
-
: getValueAndMessage(required);
|
|
695
|
-
if (value) {
|
|
696
|
-
error[name] = {
|
|
697
|
-
type: INPUT_VALIDATION_RULES.required,
|
|
698
|
-
message,
|
|
699
|
-
ref: inputRef,
|
|
700
|
-
...appendErrorsCurry(INPUT_VALIDATION_RULES.required, message),
|
|
701
|
-
};
|
|
702
|
-
if (!validateAllFieldCriteria) {
|
|
703
|
-
setCustomValidity(message);
|
|
704
|
-
return error;
|
|
705
|
-
}
|
|
706
|
-
}
|
|
707
|
-
}
|
|
708
|
-
if (!isEmpty && (!isNullOrUndefined(min) || !isNullOrUndefined(max))) {
|
|
709
|
-
let exceedMax;
|
|
710
|
-
let exceedMin;
|
|
711
|
-
const maxOutput = getValueAndMessage(max);
|
|
712
|
-
const minOutput = getValueAndMessage(min);
|
|
713
|
-
if (!isNullOrUndefined(inputValue) && !isNaN(inputValue)) {
|
|
714
|
-
const valueNumber = ref.valueAsNumber ||
|
|
715
|
-
(inputValue ? +inputValue : inputValue);
|
|
716
|
-
if (!isNullOrUndefined(maxOutput.value)) {
|
|
717
|
-
exceedMax = valueNumber > maxOutput.value;
|
|
718
|
-
}
|
|
719
|
-
if (!isNullOrUndefined(minOutput.value)) {
|
|
720
|
-
exceedMin = valueNumber < minOutput.value;
|
|
721
|
-
}
|
|
722
|
-
}
|
|
723
|
-
else {
|
|
724
|
-
const valueDate = ref.valueAsDate || new Date(inputValue);
|
|
725
|
-
const convertTimeToDate = (time) => new Date(new Date().toDateString() + ' ' + time);
|
|
726
|
-
const isTime = ref.type == 'time';
|
|
727
|
-
const isWeek = ref.type == 'week';
|
|
728
|
-
if (isString(maxOutput.value) && inputValue) {
|
|
729
|
-
exceedMax = isTime
|
|
730
|
-
? convertTimeToDate(inputValue) > convertTimeToDate(maxOutput.value)
|
|
731
|
-
: isWeek
|
|
732
|
-
? inputValue > maxOutput.value
|
|
733
|
-
: valueDate > new Date(maxOutput.value);
|
|
734
|
-
}
|
|
735
|
-
if (isString(minOutput.value) && inputValue) {
|
|
736
|
-
exceedMin = isTime
|
|
737
|
-
? convertTimeToDate(inputValue) < convertTimeToDate(minOutput.value)
|
|
738
|
-
: isWeek
|
|
739
|
-
? inputValue < minOutput.value
|
|
740
|
-
: valueDate < new Date(minOutput.value);
|
|
741
|
-
}
|
|
742
|
-
}
|
|
743
|
-
if (exceedMax || exceedMin) {
|
|
744
|
-
getMinMaxMessage(!!exceedMax, maxOutput.message, minOutput.message, INPUT_VALIDATION_RULES.max, INPUT_VALIDATION_RULES.min);
|
|
745
|
-
if (!validateAllFieldCriteria) {
|
|
746
|
-
setCustomValidity(error[name].message);
|
|
747
|
-
return error;
|
|
748
|
-
}
|
|
749
|
-
}
|
|
750
|
-
}
|
|
751
|
-
if ((maxLength || minLength) &&
|
|
752
|
-
!isEmpty &&
|
|
753
|
-
(isString(inputValue) || (isFieldArray && Array.isArray(inputValue)))) {
|
|
754
|
-
const maxLengthOutput = getValueAndMessage(maxLength);
|
|
755
|
-
const minLengthOutput = getValueAndMessage(minLength);
|
|
756
|
-
const exceedMax = !isNullOrUndefined(maxLengthOutput.value) &&
|
|
757
|
-
inputValue.length > +maxLengthOutput.value;
|
|
758
|
-
const exceedMin = !isNullOrUndefined(minLengthOutput.value) &&
|
|
759
|
-
inputValue.length < +minLengthOutput.value;
|
|
760
|
-
if (exceedMax || exceedMin) {
|
|
761
|
-
getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message);
|
|
762
|
-
if (!validateAllFieldCriteria) {
|
|
763
|
-
setCustomValidity(error[name].message);
|
|
764
|
-
return error;
|
|
765
|
-
}
|
|
766
|
-
}
|
|
767
|
-
}
|
|
768
|
-
if (pattern && !isEmpty && isString(inputValue)) {
|
|
769
|
-
const { value: patternValue, message } = getValueAndMessage(pattern);
|
|
770
|
-
if (isRegex(patternValue) && !inputValue.match(patternValue)) {
|
|
771
|
-
error[name] = {
|
|
772
|
-
type: INPUT_VALIDATION_RULES.pattern,
|
|
773
|
-
message,
|
|
774
|
-
ref,
|
|
775
|
-
...appendErrorsCurry(INPUT_VALIDATION_RULES.pattern, message),
|
|
776
|
-
};
|
|
777
|
-
if (!validateAllFieldCriteria) {
|
|
778
|
-
setCustomValidity(message);
|
|
779
|
-
return error;
|
|
780
|
-
}
|
|
781
|
-
}
|
|
782
|
-
}
|
|
783
|
-
if (validate) {
|
|
784
|
-
if (isFunction(validate)) {
|
|
785
|
-
const result = await validate(inputValue, formValues);
|
|
786
|
-
const validateError = getValidateError(result, inputRef);
|
|
787
|
-
if (validateError) {
|
|
788
|
-
error[name] = {
|
|
789
|
-
...validateError,
|
|
790
|
-
...appendErrorsCurry(INPUT_VALIDATION_RULES.validate, validateError.message),
|
|
791
|
-
};
|
|
792
|
-
if (!validateAllFieldCriteria) {
|
|
793
|
-
setCustomValidity(validateError.message);
|
|
794
|
-
return error;
|
|
795
|
-
}
|
|
796
|
-
}
|
|
797
|
-
}
|
|
798
|
-
else if (isObject$1(validate)) {
|
|
799
|
-
let validationResult = {};
|
|
800
|
-
for (const key in validate) {
|
|
801
|
-
if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) {
|
|
802
|
-
break;
|
|
803
|
-
}
|
|
804
|
-
const validateError = getValidateError(await validate[key](inputValue, formValues), inputRef, key);
|
|
805
|
-
if (validateError) {
|
|
806
|
-
validationResult = {
|
|
807
|
-
...validateError,
|
|
808
|
-
...appendErrorsCurry(key, validateError.message),
|
|
809
|
-
};
|
|
810
|
-
setCustomValidity(validateError.message);
|
|
811
|
-
if (validateAllFieldCriteria) {
|
|
812
|
-
error[name] = validationResult;
|
|
813
|
-
}
|
|
814
|
-
}
|
|
815
|
-
}
|
|
816
|
-
if (!isEmptyObject(validationResult)) {
|
|
817
|
-
error[name] = {
|
|
818
|
-
ref: inputRef,
|
|
819
|
-
...validationResult,
|
|
820
|
-
};
|
|
821
|
-
if (!validateAllFieldCriteria) {
|
|
822
|
-
return error;
|
|
823
|
-
}
|
|
824
|
-
}
|
|
825
|
-
}
|
|
826
|
-
}
|
|
827
|
-
setCustomValidity(true);
|
|
828
|
-
return error;
|
|
829
|
-
};
|
|
830
|
-
|
|
831
|
-
function baseGet(object, updatePath) {
|
|
832
|
-
const length = updatePath.slice(0, -1).length;
|
|
833
|
-
let index = 0;
|
|
834
|
-
while (index < length) {
|
|
835
|
-
object = isUndefined(object) ? index++ : object[updatePath[index++]];
|
|
836
|
-
}
|
|
837
|
-
return object;
|
|
838
|
-
}
|
|
839
|
-
function isEmptyArray(obj) {
|
|
840
|
-
for (const key in obj) {
|
|
841
|
-
if (obj.hasOwnProperty(key) && !isUndefined(obj[key])) {
|
|
842
|
-
return false;
|
|
843
|
-
}
|
|
844
|
-
}
|
|
845
|
-
return true;
|
|
846
|
-
}
|
|
847
|
-
function unset(object, path) {
|
|
848
|
-
const paths = Array.isArray(path)
|
|
849
|
-
? path
|
|
850
|
-
: isKey(path)
|
|
851
|
-
? [path]
|
|
852
|
-
: stringToPath(path);
|
|
853
|
-
const childObject = paths.length === 1 ? object : baseGet(object, paths);
|
|
854
|
-
const index = paths.length - 1;
|
|
855
|
-
const key = paths[index];
|
|
856
|
-
if (childObject) {
|
|
857
|
-
delete childObject[key];
|
|
858
|
-
}
|
|
859
|
-
if (index !== 0 &&
|
|
860
|
-
((isObject$1(childObject) && isEmptyObject(childObject)) ||
|
|
861
|
-
(Array.isArray(childObject) && isEmptyArray(childObject)))) {
|
|
862
|
-
unset(object, paths.slice(0, -1));
|
|
863
|
-
}
|
|
864
|
-
return object;
|
|
865
|
-
}
|
|
502
|
+
var convertToArrayPayload = (value) => (Array.isArray(value) ? value : [value]);
|
|
866
503
|
|
|
867
504
|
var createSubject = () => {
|
|
868
505
|
let _observers = [];
|
|
@@ -925,12 +562,65 @@ function deepEqual(object1, object2) {
|
|
|
925
562
|
return true;
|
|
926
563
|
}
|
|
927
564
|
|
|
565
|
+
var isEmptyObject = (value) => isObject$1(value) && !Object.keys(value).length;
|
|
566
|
+
|
|
567
|
+
var isFileInput = (element) => element.type === 'file';
|
|
568
|
+
|
|
569
|
+
var isFunction = (value) => typeof value === 'function';
|
|
570
|
+
|
|
571
|
+
var isHTMLElement$2 = (value) => {
|
|
572
|
+
if (!isWeb) {
|
|
573
|
+
return false;
|
|
574
|
+
}
|
|
575
|
+
const owner = value ? value.ownerDocument : 0;
|
|
576
|
+
return (value instanceof
|
|
577
|
+
(owner && owner.defaultView ? owner.defaultView.HTMLElement : HTMLElement));
|
|
578
|
+
};
|
|
579
|
+
|
|
928
580
|
var isMultipleSelect = (element) => element.type === `select-multiple`;
|
|
929
581
|
|
|
582
|
+
var isRadioInput = (element) => element.type === 'radio';
|
|
583
|
+
|
|
930
584
|
var isRadioOrCheckbox = (ref) => isRadioInput(ref) || isCheckBoxInput(ref);
|
|
931
585
|
|
|
932
586
|
var live = (ref) => isHTMLElement$2(ref) && ref.isConnected;
|
|
933
587
|
|
|
588
|
+
function baseGet(object, updatePath) {
|
|
589
|
+
const length = updatePath.slice(0, -1).length;
|
|
590
|
+
let index = 0;
|
|
591
|
+
while (index < length) {
|
|
592
|
+
object = isUndefined(object) ? index++ : object[updatePath[index++]];
|
|
593
|
+
}
|
|
594
|
+
return object;
|
|
595
|
+
}
|
|
596
|
+
function isEmptyArray(obj) {
|
|
597
|
+
for (const key in obj) {
|
|
598
|
+
if (obj.hasOwnProperty(key) && !isUndefined(obj[key])) {
|
|
599
|
+
return false;
|
|
600
|
+
}
|
|
601
|
+
}
|
|
602
|
+
return true;
|
|
603
|
+
}
|
|
604
|
+
function unset(object, path) {
|
|
605
|
+
const paths = Array.isArray(path)
|
|
606
|
+
? path
|
|
607
|
+
: isKey(path)
|
|
608
|
+
? [path]
|
|
609
|
+
: stringToPath(path);
|
|
610
|
+
const childObject = paths.length === 1 ? object : baseGet(object, paths);
|
|
611
|
+
const index = paths.length - 1;
|
|
612
|
+
const key = paths[index];
|
|
613
|
+
if (childObject) {
|
|
614
|
+
delete childObject[key];
|
|
615
|
+
}
|
|
616
|
+
if (index !== 0 &&
|
|
617
|
+
((isObject$1(childObject) && isEmptyObject(childObject)) ||
|
|
618
|
+
(Array.isArray(childObject) && isEmptyArray(childObject)))) {
|
|
619
|
+
unset(object, paths.slice(0, -1));
|
|
620
|
+
}
|
|
621
|
+
return object;
|
|
622
|
+
}
|
|
623
|
+
|
|
934
624
|
var objectHasFunction = (data) => {
|
|
935
625
|
for (const key in data) {
|
|
936
626
|
if (isFunction(data[key])) {
|
|
@@ -981,6 +671,31 @@ function getDirtyFieldsFromDefaultValues(data, formValues, dirtyFieldsFromValues
|
|
|
981
671
|
}
|
|
982
672
|
var getDirtyFields = (defaultValues, formValues) => getDirtyFieldsFromDefaultValues(defaultValues, formValues, markFieldsDirty(formValues));
|
|
983
673
|
|
|
674
|
+
const defaultResult = {
|
|
675
|
+
value: false,
|
|
676
|
+
isValid: false,
|
|
677
|
+
};
|
|
678
|
+
const validResult = { value: true, isValid: true };
|
|
679
|
+
var getCheckboxValue = (options) => {
|
|
680
|
+
if (Array.isArray(options)) {
|
|
681
|
+
if (options.length > 1) {
|
|
682
|
+
const values = options
|
|
683
|
+
.filter((option) => option && option.checked && !option.disabled)
|
|
684
|
+
.map((option) => option.value);
|
|
685
|
+
return { value: values, isValid: !!values.length };
|
|
686
|
+
}
|
|
687
|
+
return options[0].checked && !options[0].disabled
|
|
688
|
+
? // @ts-expect-error expected to work in the browser
|
|
689
|
+
options[0].attributes && !isUndefined(options[0].attributes.value)
|
|
690
|
+
? isUndefined(options[0].value) || options[0].value === ''
|
|
691
|
+
? validResult
|
|
692
|
+
: { value: options[0].value, isValid: true }
|
|
693
|
+
: validResult
|
|
694
|
+
: defaultResult;
|
|
695
|
+
}
|
|
696
|
+
return defaultResult;
|
|
697
|
+
};
|
|
698
|
+
|
|
984
699
|
var getFieldValueAs = (value, { valueAsNumber, valueAsDate, setValueAs }) => isUndefined(value)
|
|
985
700
|
? value
|
|
986
701
|
: valueAsNumber
|
|
@@ -995,11 +710,21 @@ var getFieldValueAs = (value, { valueAsNumber, valueAsDate, setValueAs }) => isU
|
|
|
995
710
|
? setValueAs(value)
|
|
996
711
|
: value;
|
|
997
712
|
|
|
713
|
+
const defaultReturn = {
|
|
714
|
+
isValid: false,
|
|
715
|
+
value: null,
|
|
716
|
+
};
|
|
717
|
+
var getRadioValue = (options) => Array.isArray(options)
|
|
718
|
+
? options.reduce((previous, option) => option && option.checked && !option.disabled
|
|
719
|
+
? {
|
|
720
|
+
isValid: true,
|
|
721
|
+
value: option.value,
|
|
722
|
+
}
|
|
723
|
+
: previous, defaultReturn)
|
|
724
|
+
: defaultReturn;
|
|
725
|
+
|
|
998
726
|
function getFieldValue(_f) {
|
|
999
727
|
const ref = _f.ref;
|
|
1000
|
-
if (_f.refs ? _f.refs.every((ref) => ref.disabled) : ref.disabled) {
|
|
1001
|
-
return;
|
|
1002
|
-
}
|
|
1003
728
|
if (isFileInput(ref)) {
|
|
1004
729
|
return ref.files;
|
|
1005
730
|
}
|
|
@@ -1029,6 +754,8 @@ var getResolverOptions = (fieldsNames, _fields, criteriaMode, shouldUseNativeVal
|
|
|
1029
754
|
};
|
|
1030
755
|
};
|
|
1031
756
|
|
|
757
|
+
var isRegex = (value) => value instanceof RegExp;
|
|
758
|
+
|
|
1032
759
|
var getRuleValue = (rule) => isUndefined(rule)
|
|
1033
760
|
? rule
|
|
1034
761
|
: isRegex(rule)
|
|
@@ -1039,6 +766,22 @@ var getRuleValue = (rule) => isUndefined(rule)
|
|
|
1039
766
|
: rule.value
|
|
1040
767
|
: rule;
|
|
1041
768
|
|
|
769
|
+
var getValidationModes = (mode) => ({
|
|
770
|
+
isOnSubmit: !mode || mode === VALIDATION_MODE.onSubmit,
|
|
771
|
+
isOnBlur: mode === VALIDATION_MODE.onBlur,
|
|
772
|
+
isOnChange: mode === VALIDATION_MODE.onChange,
|
|
773
|
+
isOnAll: mode === VALIDATION_MODE.all,
|
|
774
|
+
isOnTouch: mode === VALIDATION_MODE.onTouched,
|
|
775
|
+
});
|
|
776
|
+
|
|
777
|
+
const ASYNC_FUNCTION = 'AsyncFunction';
|
|
778
|
+
var hasPromiseValidation = (fieldReference) => !!fieldReference &&
|
|
779
|
+
!!fieldReference.validate &&
|
|
780
|
+
!!((isFunction(fieldReference.validate) &&
|
|
781
|
+
fieldReference.validate.constructor.name === ASYNC_FUNCTION) ||
|
|
782
|
+
(isObject$1(fieldReference.validate) &&
|
|
783
|
+
Object.values(fieldReference.validate).find((validateFunction) => validateFunction.constructor.name === ASYNC_FUNCTION)));
|
|
784
|
+
|
|
1042
785
|
var hasValidation = (options) => options.mount &&
|
|
1043
786
|
(options.required ||
|
|
1044
787
|
options.min ||
|
|
@@ -1048,6 +791,40 @@ var hasValidation = (options) => options.mount &&
|
|
|
1048
791
|
options.pattern ||
|
|
1049
792
|
options.validate);
|
|
1050
793
|
|
|
794
|
+
var isWatched = (name, _names, isBlurEvent) => !isBlurEvent &&
|
|
795
|
+
(_names.watchAll ||
|
|
796
|
+
_names.watch.has(name) ||
|
|
797
|
+
[..._names.watch].some((watchName) => name.startsWith(watchName) &&
|
|
798
|
+
/^\.\w+/.test(name.slice(watchName.length))));
|
|
799
|
+
|
|
800
|
+
const iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => {
|
|
801
|
+
for (const key of fieldsNames || Object.keys(fields)) {
|
|
802
|
+
const field = get(fields, key);
|
|
803
|
+
if (field) {
|
|
804
|
+
const { _f, ...currentField } = field;
|
|
805
|
+
if (_f) {
|
|
806
|
+
if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) {
|
|
807
|
+
return true;
|
|
808
|
+
}
|
|
809
|
+
else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) {
|
|
810
|
+
return true;
|
|
811
|
+
}
|
|
812
|
+
else {
|
|
813
|
+
if (iterateFieldsByAction(currentField, action)) {
|
|
814
|
+
break;
|
|
815
|
+
}
|
|
816
|
+
}
|
|
817
|
+
}
|
|
818
|
+
else if (isObject$1(currentField)) {
|
|
819
|
+
if (iterateFieldsByAction(currentField, action)) {
|
|
820
|
+
break;
|
|
821
|
+
}
|
|
822
|
+
}
|
|
823
|
+
}
|
|
824
|
+
}
|
|
825
|
+
return;
|
|
826
|
+
};
|
|
827
|
+
|
|
1051
828
|
function schemaErrorLookup(errors, _fields, name) {
|
|
1052
829
|
const error = get(errors, name);
|
|
1053
830
|
if (error || isKey(name)) {
|
|
@@ -1077,6 +854,24 @@ function schemaErrorLookup(errors, _fields, name) {
|
|
|
1077
854
|
};
|
|
1078
855
|
}
|
|
1079
856
|
|
|
857
|
+
var shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, isRoot) => {
|
|
858
|
+
updateFormState(formStateData);
|
|
859
|
+
const { name, ...formState } = formStateData;
|
|
860
|
+
return (isEmptyObject(formState) ||
|
|
861
|
+
Object.keys(formState).length >= Object.keys(_proxyFormState).length ||
|
|
862
|
+
Object.keys(formState).find((key) => _proxyFormState[key] ===
|
|
863
|
+
(!isRoot || VALIDATION_MODE.all)));
|
|
864
|
+
};
|
|
865
|
+
|
|
866
|
+
var shouldSubscribeByName = (name, signalName, exact) => !name ||
|
|
867
|
+
!signalName ||
|
|
868
|
+
name === signalName ||
|
|
869
|
+
convertToArrayPayload(name).some((currentName) => currentName &&
|
|
870
|
+
(exact
|
|
871
|
+
? currentName === signalName
|
|
872
|
+
: currentName.startsWith(signalName) ||
|
|
873
|
+
signalName.startsWith(currentName)));
|
|
874
|
+
|
|
1080
875
|
var skipValidation = (isBlurEvent, isTouched, isSubmitted, reValidateMode, mode) => {
|
|
1081
876
|
if (mode.isOnAll) {
|
|
1082
877
|
return false;
|
|
@@ -1095,6 +890,213 @@ var skipValidation = (isBlurEvent, isTouched, isSubmitted, reValidateMode, mode)
|
|
|
1095
890
|
|
|
1096
891
|
var unsetEmptyArray = (ref, name) => !compact(get(ref, name)).length && unset(ref, name);
|
|
1097
892
|
|
|
893
|
+
var updateFieldArrayRootError = (errors, error, name) => {
|
|
894
|
+
const fieldArrayErrors = convertToArrayPayload(get(errors, name));
|
|
895
|
+
set(fieldArrayErrors, 'root', error[name]);
|
|
896
|
+
set(errors, name, fieldArrayErrors);
|
|
897
|
+
return errors;
|
|
898
|
+
};
|
|
899
|
+
|
|
900
|
+
var isMessage = (value) => isString(value);
|
|
901
|
+
|
|
902
|
+
function getValidateError(result, ref, type = 'validate') {
|
|
903
|
+
if (isMessage(result) ||
|
|
904
|
+
(Array.isArray(result) && result.every(isMessage)) ||
|
|
905
|
+
(isBoolean(result) && !result)) {
|
|
906
|
+
return {
|
|
907
|
+
type,
|
|
908
|
+
message: isMessage(result) ? result : '',
|
|
909
|
+
ref,
|
|
910
|
+
};
|
|
911
|
+
}
|
|
912
|
+
}
|
|
913
|
+
|
|
914
|
+
var getValueAndMessage = (validationData) => isObject$1(validationData) && !isRegex(validationData)
|
|
915
|
+
? validationData
|
|
916
|
+
: {
|
|
917
|
+
value: validationData,
|
|
918
|
+
message: '',
|
|
919
|
+
};
|
|
920
|
+
|
|
921
|
+
var validateField = async (field, disabledFieldNames, formValues, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => {
|
|
922
|
+
const { ref, refs, required, maxLength, minLength, min, max, pattern, validate, name, valueAsNumber, mount, } = field._f;
|
|
923
|
+
const inputValue = get(formValues, name);
|
|
924
|
+
if (!mount || disabledFieldNames.has(name)) {
|
|
925
|
+
return {};
|
|
926
|
+
}
|
|
927
|
+
const inputRef = refs ? refs[0] : ref;
|
|
928
|
+
const setCustomValidity = (message) => {
|
|
929
|
+
if (shouldUseNativeValidation && inputRef.reportValidity) {
|
|
930
|
+
inputRef.setCustomValidity(isBoolean(message) ? '' : message || '');
|
|
931
|
+
inputRef.reportValidity();
|
|
932
|
+
}
|
|
933
|
+
};
|
|
934
|
+
const error = {};
|
|
935
|
+
const isRadio = isRadioInput(ref);
|
|
936
|
+
const isCheckBox = isCheckBoxInput(ref);
|
|
937
|
+
const isRadioOrCheckbox = isRadio || isCheckBox;
|
|
938
|
+
const isEmpty = ((valueAsNumber || isFileInput(ref)) &&
|
|
939
|
+
isUndefined(ref.value) &&
|
|
940
|
+
isUndefined(inputValue)) ||
|
|
941
|
+
(isHTMLElement$2(ref) && ref.value === '') ||
|
|
942
|
+
inputValue === '' ||
|
|
943
|
+
(Array.isArray(inputValue) && !inputValue.length);
|
|
944
|
+
const appendErrorsCurry = appendErrors.bind(null, name, validateAllFieldCriteria, error);
|
|
945
|
+
const getMinMaxMessage = (exceedMax, maxLengthMessage, minLengthMessage, maxType = INPUT_VALIDATION_RULES.maxLength, minType = INPUT_VALIDATION_RULES.minLength) => {
|
|
946
|
+
const message = exceedMax ? maxLengthMessage : minLengthMessage;
|
|
947
|
+
error[name] = {
|
|
948
|
+
type: exceedMax ? maxType : minType,
|
|
949
|
+
message,
|
|
950
|
+
ref,
|
|
951
|
+
...appendErrorsCurry(exceedMax ? maxType : minType, message),
|
|
952
|
+
};
|
|
953
|
+
};
|
|
954
|
+
if (isFieldArray
|
|
955
|
+
? !Array.isArray(inputValue) || !inputValue.length
|
|
956
|
+
: required &&
|
|
957
|
+
((!isRadioOrCheckbox && (isEmpty || isNullOrUndefined(inputValue))) ||
|
|
958
|
+
(isBoolean(inputValue) && !inputValue) ||
|
|
959
|
+
(isCheckBox && !getCheckboxValue(refs).isValid) ||
|
|
960
|
+
(isRadio && !getRadioValue(refs).isValid))) {
|
|
961
|
+
const { value, message } = isMessage(required)
|
|
962
|
+
? { value: !!required, message: required }
|
|
963
|
+
: getValueAndMessage(required);
|
|
964
|
+
if (value) {
|
|
965
|
+
error[name] = {
|
|
966
|
+
type: INPUT_VALIDATION_RULES.required,
|
|
967
|
+
message,
|
|
968
|
+
ref: inputRef,
|
|
969
|
+
...appendErrorsCurry(INPUT_VALIDATION_RULES.required, message),
|
|
970
|
+
};
|
|
971
|
+
if (!validateAllFieldCriteria) {
|
|
972
|
+
setCustomValidity(message);
|
|
973
|
+
return error;
|
|
974
|
+
}
|
|
975
|
+
}
|
|
976
|
+
}
|
|
977
|
+
if (!isEmpty && (!isNullOrUndefined(min) || !isNullOrUndefined(max))) {
|
|
978
|
+
let exceedMax;
|
|
979
|
+
let exceedMin;
|
|
980
|
+
const maxOutput = getValueAndMessage(max);
|
|
981
|
+
const minOutput = getValueAndMessage(min);
|
|
982
|
+
if (!isNullOrUndefined(inputValue) && !isNaN(inputValue)) {
|
|
983
|
+
const valueNumber = ref.valueAsNumber ||
|
|
984
|
+
(inputValue ? +inputValue : inputValue);
|
|
985
|
+
if (!isNullOrUndefined(maxOutput.value)) {
|
|
986
|
+
exceedMax = valueNumber > maxOutput.value;
|
|
987
|
+
}
|
|
988
|
+
if (!isNullOrUndefined(minOutput.value)) {
|
|
989
|
+
exceedMin = valueNumber < minOutput.value;
|
|
990
|
+
}
|
|
991
|
+
}
|
|
992
|
+
else {
|
|
993
|
+
const valueDate = ref.valueAsDate || new Date(inputValue);
|
|
994
|
+
const convertTimeToDate = (time) => new Date(new Date().toDateString() + ' ' + time);
|
|
995
|
+
const isTime = ref.type == 'time';
|
|
996
|
+
const isWeek = ref.type == 'week';
|
|
997
|
+
if (isString(maxOutput.value) && inputValue) {
|
|
998
|
+
exceedMax = isTime
|
|
999
|
+
? convertTimeToDate(inputValue) > convertTimeToDate(maxOutput.value)
|
|
1000
|
+
: isWeek
|
|
1001
|
+
? inputValue > maxOutput.value
|
|
1002
|
+
: valueDate > new Date(maxOutput.value);
|
|
1003
|
+
}
|
|
1004
|
+
if (isString(minOutput.value) && inputValue) {
|
|
1005
|
+
exceedMin = isTime
|
|
1006
|
+
? convertTimeToDate(inputValue) < convertTimeToDate(minOutput.value)
|
|
1007
|
+
: isWeek
|
|
1008
|
+
? inputValue < minOutput.value
|
|
1009
|
+
: valueDate < new Date(minOutput.value);
|
|
1010
|
+
}
|
|
1011
|
+
}
|
|
1012
|
+
if (exceedMax || exceedMin) {
|
|
1013
|
+
getMinMaxMessage(!!exceedMax, maxOutput.message, minOutput.message, INPUT_VALIDATION_RULES.max, INPUT_VALIDATION_RULES.min);
|
|
1014
|
+
if (!validateAllFieldCriteria) {
|
|
1015
|
+
setCustomValidity(error[name].message);
|
|
1016
|
+
return error;
|
|
1017
|
+
}
|
|
1018
|
+
}
|
|
1019
|
+
}
|
|
1020
|
+
if ((maxLength || minLength) &&
|
|
1021
|
+
!isEmpty &&
|
|
1022
|
+
(isString(inputValue) || (isFieldArray && Array.isArray(inputValue)))) {
|
|
1023
|
+
const maxLengthOutput = getValueAndMessage(maxLength);
|
|
1024
|
+
const minLengthOutput = getValueAndMessage(minLength);
|
|
1025
|
+
const exceedMax = !isNullOrUndefined(maxLengthOutput.value) &&
|
|
1026
|
+
inputValue.length > +maxLengthOutput.value;
|
|
1027
|
+
const exceedMin = !isNullOrUndefined(minLengthOutput.value) &&
|
|
1028
|
+
inputValue.length < +minLengthOutput.value;
|
|
1029
|
+
if (exceedMax || exceedMin) {
|
|
1030
|
+
getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message);
|
|
1031
|
+
if (!validateAllFieldCriteria) {
|
|
1032
|
+
setCustomValidity(error[name].message);
|
|
1033
|
+
return error;
|
|
1034
|
+
}
|
|
1035
|
+
}
|
|
1036
|
+
}
|
|
1037
|
+
if (pattern && !isEmpty && isString(inputValue)) {
|
|
1038
|
+
const { value: patternValue, message } = getValueAndMessage(pattern);
|
|
1039
|
+
if (isRegex(patternValue) && !inputValue.match(patternValue)) {
|
|
1040
|
+
error[name] = {
|
|
1041
|
+
type: INPUT_VALIDATION_RULES.pattern,
|
|
1042
|
+
message,
|
|
1043
|
+
ref,
|
|
1044
|
+
...appendErrorsCurry(INPUT_VALIDATION_RULES.pattern, message),
|
|
1045
|
+
};
|
|
1046
|
+
if (!validateAllFieldCriteria) {
|
|
1047
|
+
setCustomValidity(message);
|
|
1048
|
+
return error;
|
|
1049
|
+
}
|
|
1050
|
+
}
|
|
1051
|
+
}
|
|
1052
|
+
if (validate) {
|
|
1053
|
+
if (isFunction(validate)) {
|
|
1054
|
+
const result = await validate(inputValue, formValues);
|
|
1055
|
+
const validateError = getValidateError(result, inputRef);
|
|
1056
|
+
if (validateError) {
|
|
1057
|
+
error[name] = {
|
|
1058
|
+
...validateError,
|
|
1059
|
+
...appendErrorsCurry(INPUT_VALIDATION_RULES.validate, validateError.message),
|
|
1060
|
+
};
|
|
1061
|
+
if (!validateAllFieldCriteria) {
|
|
1062
|
+
setCustomValidity(validateError.message);
|
|
1063
|
+
return error;
|
|
1064
|
+
}
|
|
1065
|
+
}
|
|
1066
|
+
}
|
|
1067
|
+
else if (isObject$1(validate)) {
|
|
1068
|
+
let validationResult = {};
|
|
1069
|
+
for (const key in validate) {
|
|
1070
|
+
if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) {
|
|
1071
|
+
break;
|
|
1072
|
+
}
|
|
1073
|
+
const validateError = getValidateError(await validate[key](inputValue, formValues), inputRef, key);
|
|
1074
|
+
if (validateError) {
|
|
1075
|
+
validationResult = {
|
|
1076
|
+
...validateError,
|
|
1077
|
+
...appendErrorsCurry(key, validateError.message),
|
|
1078
|
+
};
|
|
1079
|
+
setCustomValidity(validateError.message);
|
|
1080
|
+
if (validateAllFieldCriteria) {
|
|
1081
|
+
error[name] = validationResult;
|
|
1082
|
+
}
|
|
1083
|
+
}
|
|
1084
|
+
}
|
|
1085
|
+
if (!isEmptyObject(validationResult)) {
|
|
1086
|
+
error[name] = {
|
|
1087
|
+
ref: inputRef,
|
|
1088
|
+
...validationResult,
|
|
1089
|
+
};
|
|
1090
|
+
if (!validateAllFieldCriteria) {
|
|
1091
|
+
return error;
|
|
1092
|
+
}
|
|
1093
|
+
}
|
|
1094
|
+
}
|
|
1095
|
+
}
|
|
1096
|
+
setCustomValidity(true);
|
|
1097
|
+
return error;
|
|
1098
|
+
};
|
|
1099
|
+
|
|
1098
1100
|
const defaultOptions$2 = {
|
|
1099
1101
|
mode: VALIDATION_MODE.onSubmit,
|
|
1100
1102
|
reValidateMode: VALIDATION_MODE.onChange,
|
|
@@ -1120,9 +1122,9 @@ function createFormControl(props = {}) {
|
|
|
1120
1122
|
errors: _options.errors || {},
|
|
1121
1123
|
disabled: _options.disabled || false,
|
|
1122
1124
|
};
|
|
1123
|
-
|
|
1125
|
+
const _fields = {};
|
|
1124
1126
|
let _defaultValues = isObject$1(_options.defaultValues) || isObject$1(_options.values)
|
|
1125
|
-
? cloneObject(_options.
|
|
1127
|
+
? cloneObject(_options.values || _options.defaultValues) || {}
|
|
1126
1128
|
: {};
|
|
1127
1129
|
let _formValues = _options.shouldUnregister
|
|
1128
1130
|
? {}
|
|
@@ -1134,6 +1136,7 @@ function createFormControl(props = {}) {
|
|
|
1134
1136
|
};
|
|
1135
1137
|
let _names = {
|
|
1136
1138
|
mount: new Set(),
|
|
1139
|
+
disabled: new Set(),
|
|
1137
1140
|
unMount: new Set(),
|
|
1138
1141
|
array: new Set(),
|
|
1139
1142
|
watch: new Set(),
|
|
@@ -1149,8 +1152,10 @@ function createFormControl(props = {}) {
|
|
|
1149
1152
|
isValid: false,
|
|
1150
1153
|
errors: false,
|
|
1151
1154
|
};
|
|
1155
|
+
let _proxySubscribeFormState = {
|
|
1156
|
+
..._proxyFormState,
|
|
1157
|
+
};
|
|
1152
1158
|
const _subjects = {
|
|
1153
|
-
values: createSubject(),
|
|
1154
1159
|
array: createSubject(),
|
|
1155
1160
|
state: createSubject(),
|
|
1156
1161
|
};
|
|
@@ -1161,10 +1166,13 @@ function createFormControl(props = {}) {
|
|
|
1161
1166
|
clearTimeout(timer);
|
|
1162
1167
|
timer = setTimeout(callback, wait);
|
|
1163
1168
|
};
|
|
1164
|
-
const
|
|
1165
|
-
if (
|
|
1169
|
+
const _setValid = async (shouldUpdateValid) => {
|
|
1170
|
+
if (!_options.disabled &&
|
|
1171
|
+
(_proxyFormState.isValid ||
|
|
1172
|
+
_proxySubscribeFormState.isValid ||
|
|
1173
|
+
shouldUpdateValid)) {
|
|
1166
1174
|
const isValid = _options.resolver
|
|
1167
|
-
? isEmptyObject((await
|
|
1175
|
+
? isEmptyObject((await _runSchema()).errors)
|
|
1168
1176
|
: await executeBuiltInValidation(_fields, true);
|
|
1169
1177
|
if (isValid !== _formState.isValid) {
|
|
1170
1178
|
_subjects.state.next({
|
|
@@ -1174,7 +1182,11 @@ function createFormControl(props = {}) {
|
|
|
1174
1182
|
}
|
|
1175
1183
|
};
|
|
1176
1184
|
const _updateIsValidating = (names, isValidating) => {
|
|
1177
|
-
if (
|
|
1185
|
+
if (!_options.disabled &&
|
|
1186
|
+
(_proxyFormState.isValidating ||
|
|
1187
|
+
_proxyFormState.validatingFields ||
|
|
1188
|
+
_proxySubscribeFormState.isValidating ||
|
|
1189
|
+
_proxySubscribeFormState.validatingFields)) {
|
|
1178
1190
|
(names || Array.from(_names.mount)).forEach((name) => {
|
|
1179
1191
|
if (name) {
|
|
1180
1192
|
isValidating
|
|
@@ -1188,8 +1200,8 @@ function createFormControl(props = {}) {
|
|
|
1188
1200
|
});
|
|
1189
1201
|
}
|
|
1190
1202
|
};
|
|
1191
|
-
const
|
|
1192
|
-
if (args && method) {
|
|
1203
|
+
const _setFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
|
|
1204
|
+
if (args && method && !_options.disabled) {
|
|
1193
1205
|
_state.action = true;
|
|
1194
1206
|
if (shouldUpdateFieldsAndState && Array.isArray(get(_fields, name))) {
|
|
1195
1207
|
const fieldValues = method(get(_fields, name), args.argA, args.argB);
|
|
@@ -1201,13 +1213,14 @@ function createFormControl(props = {}) {
|
|
|
1201
1213
|
shouldSetValues && set(_formState.errors, name, errors);
|
|
1202
1214
|
unsetEmptyArray(_formState.errors, name);
|
|
1203
1215
|
}
|
|
1204
|
-
if (_proxyFormState.touchedFields
|
|
1216
|
+
if ((_proxyFormState.touchedFields ||
|
|
1217
|
+
_proxySubscribeFormState.touchedFields) &&
|
|
1205
1218
|
shouldUpdateFieldsAndState &&
|
|
1206
1219
|
Array.isArray(get(_formState.touchedFields, name))) {
|
|
1207
1220
|
const touchedFields = method(get(_formState.touchedFields, name), args.argA, args.argB);
|
|
1208
1221
|
shouldSetValues && set(_formState.touchedFields, name, touchedFields);
|
|
1209
1222
|
}
|
|
1210
|
-
if (_proxyFormState.dirtyFields) {
|
|
1223
|
+
if (_proxyFormState.dirtyFields || _proxySubscribeFormState.dirtyFields) {
|
|
1211
1224
|
_formState.dirtyFields = getDirtyFields(_defaultValues, _formValues);
|
|
1212
1225
|
}
|
|
1213
1226
|
_subjects.state.next({
|
|
@@ -1244,7 +1257,7 @@ function createFormControl(props = {}) {
|
|
|
1244
1257
|
shouldSkipSetValueAs
|
|
1245
1258
|
? set(_formValues, name, shouldSkipSetValueAs ? defaultValue : getFieldValue(field._f))
|
|
1246
1259
|
: setFieldValue(name, defaultValue);
|
|
1247
|
-
_state.mount &&
|
|
1260
|
+
_state.mount && _setValid();
|
|
1248
1261
|
}
|
|
1249
1262
|
};
|
|
1250
1263
|
const updateTouchAndDirty = (name, fieldValue, isBlurEvent, shouldDirty, shouldRender) => {
|
|
@@ -1253,46 +1266,49 @@ function createFormControl(props = {}) {
|
|
|
1253
1266
|
const output = {
|
|
1254
1267
|
name,
|
|
1255
1268
|
};
|
|
1256
|
-
|
|
1257
|
-
|
|
1258
|
-
|
|
1259
|
-
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
|
|
1264
|
-
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
shouldUpdateField =
|
|
1270
|
-
shouldUpdateField ||
|
|
1271
|
-
(_proxyFormState.dirtyFields &&
|
|
1272
|
-
isPreviousDirty !== !isCurrentFieldPristine);
|
|
1273
|
-
}
|
|
1274
|
-
if (isBlurEvent) {
|
|
1275
|
-
const isPreviousFieldTouched = get(_formState.touchedFields, name);
|
|
1276
|
-
if (!isPreviousFieldTouched) {
|
|
1277
|
-
set(_formState.touchedFields, name, isBlurEvent);
|
|
1278
|
-
output.touchedFields = _formState.touchedFields;
|
|
1269
|
+
if (!_options.disabled) {
|
|
1270
|
+
if (!isBlurEvent || shouldDirty) {
|
|
1271
|
+
if (_proxyFormState.isDirty || _proxySubscribeFormState.isDirty) {
|
|
1272
|
+
isPreviousDirty = _formState.isDirty;
|
|
1273
|
+
_formState.isDirty = output.isDirty = _getDirty();
|
|
1274
|
+
shouldUpdateField = isPreviousDirty !== output.isDirty;
|
|
1275
|
+
}
|
|
1276
|
+
const isCurrentFieldPristine = deepEqual(get(_defaultValues, name), fieldValue);
|
|
1277
|
+
isPreviousDirty = !!get(_formState.dirtyFields, name);
|
|
1278
|
+
isCurrentFieldPristine
|
|
1279
|
+
? unset(_formState.dirtyFields, name)
|
|
1280
|
+
: set(_formState.dirtyFields, name, true);
|
|
1281
|
+
output.dirtyFields = _formState.dirtyFields;
|
|
1279
1282
|
shouldUpdateField =
|
|
1280
1283
|
shouldUpdateField ||
|
|
1281
|
-
(_proxyFormState.
|
|
1282
|
-
|
|
1284
|
+
((_proxyFormState.dirtyFields ||
|
|
1285
|
+
_proxySubscribeFormState.dirtyFields) &&
|
|
1286
|
+
isPreviousDirty !== !isCurrentFieldPristine);
|
|
1283
1287
|
}
|
|
1288
|
+
if (isBlurEvent) {
|
|
1289
|
+
const isPreviousFieldTouched = get(_formState.touchedFields, name);
|
|
1290
|
+
if (!isPreviousFieldTouched) {
|
|
1291
|
+
set(_formState.touchedFields, name, isBlurEvent);
|
|
1292
|
+
output.touchedFields = _formState.touchedFields;
|
|
1293
|
+
shouldUpdateField =
|
|
1294
|
+
shouldUpdateField ||
|
|
1295
|
+
((_proxyFormState.touchedFields ||
|
|
1296
|
+
_proxySubscribeFormState.touchedFields) &&
|
|
1297
|
+
isPreviousFieldTouched !== isBlurEvent);
|
|
1298
|
+
}
|
|
1299
|
+
}
|
|
1300
|
+
shouldUpdateField && shouldRender && _subjects.state.next(output);
|
|
1284
1301
|
}
|
|
1285
|
-
shouldUpdateField && shouldRender && _subjects.state.next(output);
|
|
1286
1302
|
return shouldUpdateField ? output : {};
|
|
1287
1303
|
};
|
|
1288
1304
|
const shouldRenderByError = (name, isValid, error, fieldState) => {
|
|
1289
1305
|
const previousFieldError = get(_formState.errors, name);
|
|
1290
|
-
const shouldUpdateValid = _proxyFormState.isValid &&
|
|
1306
|
+
const shouldUpdateValid = (_proxyFormState.isValid || _proxySubscribeFormState.isValid) &&
|
|
1291
1307
|
isBoolean(isValid) &&
|
|
1292
1308
|
_formState.isValid !== isValid;
|
|
1293
|
-
if (
|
|
1309
|
+
if (_options.delayError && error) {
|
|
1294
1310
|
delayErrorCallback = debounce(() => updateErrors(name, error));
|
|
1295
|
-
delayErrorCallback(
|
|
1311
|
+
delayErrorCallback(_options.delayError);
|
|
1296
1312
|
}
|
|
1297
1313
|
else {
|
|
1298
1314
|
clearTimeout(timer);
|
|
@@ -1317,14 +1333,14 @@ function createFormControl(props = {}) {
|
|
|
1317
1333
|
_subjects.state.next(updatedFormState);
|
|
1318
1334
|
}
|
|
1319
1335
|
};
|
|
1320
|
-
const
|
|
1336
|
+
const _runSchema = async (name) => {
|
|
1321
1337
|
_updateIsValidating(name, true);
|
|
1322
1338
|
const result = await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
|
|
1323
1339
|
_updateIsValidating(name);
|
|
1324
1340
|
return result;
|
|
1325
1341
|
};
|
|
1326
1342
|
const executeSchemaAndUpdateState = async (names) => {
|
|
1327
|
-
const { errors } = await
|
|
1343
|
+
const { errors } = await _runSchema(names);
|
|
1328
1344
|
if (names) {
|
|
1329
1345
|
for (const name of names) {
|
|
1330
1346
|
const error = get(errors, name);
|
|
@@ -1347,9 +1363,14 @@ function createFormControl(props = {}) {
|
|
|
1347
1363
|
const { _f, ...fieldValue } = field;
|
|
1348
1364
|
if (_f) {
|
|
1349
1365
|
const isFieldArrayRoot = _names.array.has(_f.name);
|
|
1350
|
-
|
|
1351
|
-
|
|
1352
|
-
|
|
1366
|
+
const isPromiseFunction = field._f && hasPromiseValidation(field._f);
|
|
1367
|
+
if (isPromiseFunction && _proxyFormState.validatingFields) {
|
|
1368
|
+
_updateIsValidating([name], true);
|
|
1369
|
+
}
|
|
1370
|
+
const fieldError = await validateField(field, _names.disabled, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !shouldOnlyCheckValid, isFieldArrayRoot);
|
|
1371
|
+
if (isPromiseFunction && _proxyFormState.validatingFields) {
|
|
1372
|
+
_updateIsValidating([name]);
|
|
1373
|
+
}
|
|
1353
1374
|
if (fieldError[_f.name]) {
|
|
1354
1375
|
context.valid = false;
|
|
1355
1376
|
if (shouldOnlyCheckValid) {
|
|
@@ -1363,7 +1384,7 @@ function createFormControl(props = {}) {
|
|
|
1363
1384
|
: set(_formState.errors, _f.name, fieldError[_f.name])
|
|
1364
1385
|
: unset(_formState.errors, _f.name));
|
|
1365
1386
|
}
|
|
1366
|
-
fieldValue &&
|
|
1387
|
+
!isEmptyObject(fieldValue) &&
|
|
1367
1388
|
(await executeBuiltInValidation(fieldValue, shouldOnlyCheckValid, context));
|
|
1368
1389
|
}
|
|
1369
1390
|
}
|
|
@@ -1380,8 +1401,9 @@ function createFormControl(props = {}) {
|
|
|
1380
1401
|
}
|
|
1381
1402
|
_names.unMount = new Set();
|
|
1382
1403
|
};
|
|
1383
|
-
const _getDirty = (name, data) =>
|
|
1384
|
-
|
|
1404
|
+
const _getDirty = (name, data) => !_options.disabled &&
|
|
1405
|
+
(name && data && set(_formValues, name, data),
|
|
1406
|
+
!deepEqual(getValues(), _defaultValues));
|
|
1385
1407
|
const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
|
|
1386
1408
|
...(_state.mount
|
|
1387
1409
|
? _formValues
|
|
@@ -1391,7 +1413,7 @@ function createFormControl(props = {}) {
|
|
|
1391
1413
|
? { [names]: defaultValue }
|
|
1392
1414
|
: defaultValue),
|
|
1393
1415
|
}, isGlobal, defaultValue);
|
|
1394
|
-
const _getFieldArray = (name) => compact(get(_state.mount ? _formValues : _defaultValues, name,
|
|
1416
|
+
const _getFieldArray = (name) => compact(get(_state.mount ? _formValues : _defaultValues, name, _options.shouldUnregister ? get(_defaultValues, name, []) : []));
|
|
1395
1417
|
const setFieldValue = (name, value, options = {}) => {
|
|
1396
1418
|
const field = get(_fields, name);
|
|
1397
1419
|
let fieldValue = value;
|
|
@@ -1427,9 +1449,9 @@ function createFormControl(props = {}) {
|
|
|
1427
1449
|
else {
|
|
1428
1450
|
fieldReference.ref.value = fieldValue;
|
|
1429
1451
|
if (!fieldReference.ref.type) {
|
|
1430
|
-
_subjects.
|
|
1452
|
+
_subjects.state.next({
|
|
1431
1453
|
name,
|
|
1432
|
-
values:
|
|
1454
|
+
values: cloneObject(_formValues),
|
|
1433
1455
|
});
|
|
1434
1456
|
}
|
|
1435
1457
|
}
|
|
@@ -1445,7 +1467,7 @@ function createFormControl(props = {}) {
|
|
|
1445
1467
|
const fieldName = `${name}.${fieldKey}`;
|
|
1446
1468
|
const field = get(_fields, fieldName);
|
|
1447
1469
|
(_names.array.has(name) ||
|
|
1448
|
-
|
|
1470
|
+
isObject$1(fieldValue) ||
|
|
1449
1471
|
(field && !field._f)) &&
|
|
1450
1472
|
!isDateObject(fieldValue)
|
|
1451
1473
|
? setValues(fieldName, fieldValue, options)
|
|
@@ -1460,9 +1482,12 @@ function createFormControl(props = {}) {
|
|
|
1460
1482
|
if (isFieldArray) {
|
|
1461
1483
|
_subjects.array.next({
|
|
1462
1484
|
name,
|
|
1463
|
-
values:
|
|
1485
|
+
values: cloneObject(_formValues),
|
|
1464
1486
|
});
|
|
1465
|
-
if ((_proxyFormState.isDirty ||
|
|
1487
|
+
if ((_proxyFormState.isDirty ||
|
|
1488
|
+
_proxyFormState.dirtyFields ||
|
|
1489
|
+
_proxySubscribeFormState.isDirty ||
|
|
1490
|
+
_proxySubscribeFormState.dirtyFields) &&
|
|
1466
1491
|
options.shouldDirty) {
|
|
1467
1492
|
_subjects.state.next({
|
|
1468
1493
|
name,
|
|
@@ -1477,9 +1502,9 @@ function createFormControl(props = {}) {
|
|
|
1477
1502
|
: setFieldValue(name, cloneValue, options);
|
|
1478
1503
|
}
|
|
1479
1504
|
isWatched(name, _names) && _subjects.state.next({ ..._formState });
|
|
1480
|
-
_subjects.
|
|
1505
|
+
_subjects.state.next({
|
|
1481
1506
|
name: _state.mount ? name : undefined,
|
|
1482
|
-
values:
|
|
1507
|
+
values: cloneObject(_formValues),
|
|
1483
1508
|
});
|
|
1484
1509
|
};
|
|
1485
1510
|
const onChange = async (event) => {
|
|
@@ -1488,16 +1513,18 @@ function createFormControl(props = {}) {
|
|
|
1488
1513
|
let name = target.name;
|
|
1489
1514
|
let isFieldValueUpdated = true;
|
|
1490
1515
|
const field = get(_fields, name);
|
|
1491
|
-
const getCurrentFieldValue = () => target.type ? getFieldValue(field._f) : getEventValue(event);
|
|
1492
1516
|
const _updateIsFieldValueUpdated = (fieldValue) => {
|
|
1493
1517
|
isFieldValueUpdated =
|
|
1494
1518
|
Number.isNaN(fieldValue) ||
|
|
1495
|
-
fieldValue
|
|
1519
|
+
(isDateObject(fieldValue) && isNaN(fieldValue.getTime())) ||
|
|
1520
|
+
deepEqual(fieldValue, get(_formValues, name, fieldValue));
|
|
1496
1521
|
};
|
|
1497
1522
|
if (field) {
|
|
1498
1523
|
let error;
|
|
1499
1524
|
let isValid;
|
|
1500
|
-
const fieldValue =
|
|
1525
|
+
const fieldValue = target.type
|
|
1526
|
+
? getFieldValue(field._f)
|
|
1527
|
+
: getEventValue(event);
|
|
1501
1528
|
const isBlurEvent = event.type === EVENTS.BLUR || event.type === EVENTS.FOCUS_OUT;
|
|
1502
1529
|
const shouldSkipValidation = (!hasValidation(field._f) &&
|
|
1503
1530
|
!_options.resolver &&
|
|
@@ -1513,22 +1540,31 @@ function createFormControl(props = {}) {
|
|
|
1513
1540
|
else if (field._f.onChange) {
|
|
1514
1541
|
field._f.onChange(event);
|
|
1515
1542
|
}
|
|
1516
|
-
const fieldState = updateTouchAndDirty(name, fieldValue, isBlurEvent
|
|
1543
|
+
const fieldState = updateTouchAndDirty(name, fieldValue, isBlurEvent);
|
|
1517
1544
|
const shouldRender = !isEmptyObject(fieldState) || watched;
|
|
1518
1545
|
!isBlurEvent &&
|
|
1519
|
-
_subjects.
|
|
1546
|
+
_subjects.state.next({
|
|
1520
1547
|
name,
|
|
1521
1548
|
type: event.type,
|
|
1522
|
-
values:
|
|
1549
|
+
values: cloneObject(_formValues),
|
|
1523
1550
|
});
|
|
1524
1551
|
if (shouldSkipValidation) {
|
|
1525
|
-
_proxyFormState.isValid
|
|
1552
|
+
if (_proxyFormState.isValid || _proxySubscribeFormState.isValid) {
|
|
1553
|
+
if (_options.mode === 'onBlur') {
|
|
1554
|
+
if (isBlurEvent) {
|
|
1555
|
+
_setValid();
|
|
1556
|
+
}
|
|
1557
|
+
}
|
|
1558
|
+
else if (!isBlurEvent) {
|
|
1559
|
+
_setValid();
|
|
1560
|
+
}
|
|
1561
|
+
}
|
|
1526
1562
|
return (shouldRender &&
|
|
1527
1563
|
_subjects.state.next({ name, ...(watched ? {} : fieldState) }));
|
|
1528
1564
|
}
|
|
1529
1565
|
!isBlurEvent && watched && _subjects.state.next({ ..._formState });
|
|
1530
1566
|
if (_options.resolver) {
|
|
1531
|
-
const { errors } = await
|
|
1567
|
+
const { errors } = await _runSchema([name]);
|
|
1532
1568
|
_updateIsFieldValueUpdated(fieldValue);
|
|
1533
1569
|
if (isFieldValueUpdated) {
|
|
1534
1570
|
const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);
|
|
@@ -1540,14 +1576,15 @@ function createFormControl(props = {}) {
|
|
|
1540
1576
|
}
|
|
1541
1577
|
else {
|
|
1542
1578
|
_updateIsValidating([name], true);
|
|
1543
|
-
error = (await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name];
|
|
1579
|
+
error = (await validateField(field, _names.disabled, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name];
|
|
1544
1580
|
_updateIsValidating([name]);
|
|
1545
1581
|
_updateIsFieldValueUpdated(fieldValue);
|
|
1546
1582
|
if (isFieldValueUpdated) {
|
|
1547
1583
|
if (error) {
|
|
1548
1584
|
isValid = false;
|
|
1549
1585
|
}
|
|
1550
|
-
else if (_proxyFormState.isValid
|
|
1586
|
+
else if (_proxyFormState.isValid ||
|
|
1587
|
+
_proxySubscribeFormState.isValid) {
|
|
1551
1588
|
isValid = await executeBuiltInValidation(_fields, true);
|
|
1552
1589
|
}
|
|
1553
1590
|
}
|
|
@@ -1582,14 +1619,15 @@ function createFormControl(props = {}) {
|
|
|
1582
1619
|
const field = get(_fields, fieldName);
|
|
1583
1620
|
return await executeBuiltInValidation(field && field._f ? { [fieldName]: field } : field);
|
|
1584
1621
|
}))).every(Boolean);
|
|
1585
|
-
!(!validationResult && !_formState.isValid) &&
|
|
1622
|
+
!(!validationResult && !_formState.isValid) && _setValid();
|
|
1586
1623
|
}
|
|
1587
1624
|
else {
|
|
1588
1625
|
validationResult = isValid = await executeBuiltInValidation(_fields);
|
|
1589
1626
|
}
|
|
1590
1627
|
_subjects.state.next({
|
|
1591
1628
|
...(!isString(name) ||
|
|
1592
|
-
(_proxyFormState.isValid
|
|
1629
|
+
((_proxyFormState.isValid || _proxySubscribeFormState.isValid) &&
|
|
1630
|
+
isValid !== _formState.isValid)
|
|
1593
1631
|
? {}
|
|
1594
1632
|
: { name }),
|
|
1595
1633
|
...(_options.resolver || !name ? { isValid } : {}),
|
|
@@ -1613,9 +1651,9 @@ function createFormControl(props = {}) {
|
|
|
1613
1651
|
const getFieldState = (name, formState) => ({
|
|
1614
1652
|
invalid: !!get((formState || _formState).errors, name),
|
|
1615
1653
|
isDirty: !!get((formState || _formState).dirtyFields, name),
|
|
1616
|
-
isTouched: !!get((formState || _formState).touchedFields, name),
|
|
1617
|
-
isValidating: !!get((formState || _formState).validatingFields, name),
|
|
1618
1654
|
error: get((formState || _formState).errors, name),
|
|
1655
|
+
isValidating: !!get(_formState.validatingFields, name),
|
|
1656
|
+
isTouched: !!get((formState || _formState).touchedFields, name),
|
|
1619
1657
|
});
|
|
1620
1658
|
const clearErrors = (name) => {
|
|
1621
1659
|
name &&
|
|
@@ -1642,10 +1680,33 @@ function createFormControl(props = {}) {
|
|
|
1642
1680
|
options && options.shouldFocus && ref && ref.focus && ref.focus();
|
|
1643
1681
|
};
|
|
1644
1682
|
const watch = (name, defaultValue) => isFunction(name)
|
|
1645
|
-
? _subjects.
|
|
1683
|
+
? _subjects.state.subscribe({
|
|
1646
1684
|
next: (payload) => name(_getWatch(undefined, defaultValue), payload),
|
|
1647
1685
|
})
|
|
1648
1686
|
: _getWatch(name, defaultValue, true);
|
|
1687
|
+
const _subscribe = (props) => _subjects.state.subscribe({
|
|
1688
|
+
next: (formState) => {
|
|
1689
|
+
if (shouldSubscribeByName(props.name, formState.name, props.exact) &&
|
|
1690
|
+
shouldRenderFormState(formState, props.formState || _proxyFormState, _setFormState, props.reRenderRoot)) {
|
|
1691
|
+
props.callback({
|
|
1692
|
+
values: { ..._formValues },
|
|
1693
|
+
..._formState,
|
|
1694
|
+
...formState,
|
|
1695
|
+
});
|
|
1696
|
+
}
|
|
1697
|
+
},
|
|
1698
|
+
}).unsubscribe;
|
|
1699
|
+
const subscribe = (props) => {
|
|
1700
|
+
_state.mount = true;
|
|
1701
|
+
_proxySubscribeFormState = {
|
|
1702
|
+
..._proxySubscribeFormState,
|
|
1703
|
+
...props.formState,
|
|
1704
|
+
};
|
|
1705
|
+
return _subscribe({
|
|
1706
|
+
...props,
|
|
1707
|
+
formState: _proxySubscribeFormState,
|
|
1708
|
+
});
|
|
1709
|
+
};
|
|
1649
1710
|
const unregister = (name, options = {}) => {
|
|
1650
1711
|
for (const fieldName of name ? convertToArrayPayload(name) : _names.mount) {
|
|
1651
1712
|
_names.mount.delete(fieldName);
|
|
@@ -1663,29 +1724,25 @@ function createFormControl(props = {}) {
|
|
|
1663
1724
|
!options.keepDefaultValue &&
|
|
1664
1725
|
unset(_defaultValues, fieldName);
|
|
1665
1726
|
}
|
|
1666
|
-
_subjects.
|
|
1667
|
-
values:
|
|
1727
|
+
_subjects.state.next({
|
|
1728
|
+
values: cloneObject(_formValues),
|
|
1668
1729
|
});
|
|
1669
1730
|
_subjects.state.next({
|
|
1670
1731
|
..._formState,
|
|
1671
1732
|
...(!options.keepDirty ? {} : { isDirty: _getDirty() }),
|
|
1672
1733
|
});
|
|
1673
|
-
!options.keepIsValid &&
|
|
1674
|
-
};
|
|
1675
|
-
const
|
|
1676
|
-
if ((isBoolean(disabled) && _state.mount) ||
|
|
1677
|
-
|
|
1678
|
-
|
|
1679
|
-
|
|
1680
|
-
? getFieldValue(field ? field._f : get(fields, name)._f)
|
|
1681
|
-
: value;
|
|
1682
|
-
set(_formValues, name, inputValue);
|
|
1683
|
-
updateTouchAndDirty(name, inputValue, false, false, true);
|
|
1734
|
+
!options.keepIsValid && _setValid();
|
|
1735
|
+
};
|
|
1736
|
+
const _setDisabledField = ({ disabled, name, }) => {
|
|
1737
|
+
if ((isBoolean(disabled) && _state.mount) ||
|
|
1738
|
+
!!disabled ||
|
|
1739
|
+
_names.disabled.has(name)) {
|
|
1740
|
+
disabled ? _names.disabled.add(name) : _names.disabled.delete(name);
|
|
1684
1741
|
}
|
|
1685
1742
|
};
|
|
1686
1743
|
const register = (name, options = {}) => {
|
|
1687
1744
|
let field = get(_fields, name);
|
|
1688
|
-
const disabledIsDefined = isBoolean(options.disabled);
|
|
1745
|
+
const disabledIsDefined = isBoolean(options.disabled) || isBoolean(_options.disabled);
|
|
1689
1746
|
set(_fields, name, {
|
|
1690
1747
|
...(field || {}),
|
|
1691
1748
|
_f: {
|
|
@@ -1697,18 +1754,20 @@ function createFormControl(props = {}) {
|
|
|
1697
1754
|
});
|
|
1698
1755
|
_names.mount.add(name);
|
|
1699
1756
|
if (field) {
|
|
1700
|
-
|
|
1701
|
-
|
|
1702
|
-
|
|
1757
|
+
_setDisabledField({
|
|
1758
|
+
disabled: isBoolean(options.disabled)
|
|
1759
|
+
? options.disabled
|
|
1760
|
+
: _options.disabled,
|
|
1703
1761
|
name,
|
|
1704
|
-
value: options.value,
|
|
1705
1762
|
});
|
|
1706
1763
|
}
|
|
1707
1764
|
else {
|
|
1708
1765
|
updateValidAndValue(name, true, options.value);
|
|
1709
1766
|
}
|
|
1710
1767
|
return {
|
|
1711
|
-
...(disabledIsDefined
|
|
1768
|
+
...(disabledIsDefined
|
|
1769
|
+
? { disabled: options.disabled || _options.disabled }
|
|
1770
|
+
: {}),
|
|
1712
1771
|
...(_options.progressive
|
|
1713
1772
|
? {
|
|
1714
1773
|
required: !!options.required,
|
|
@@ -1789,20 +1848,26 @@ function createFormControl(props = {}) {
|
|
|
1789
1848
|
let onValidError = undefined;
|
|
1790
1849
|
if (e) {
|
|
1791
1850
|
e.preventDefault && e.preventDefault();
|
|
1792
|
-
e.persist &&
|
|
1851
|
+
e.persist &&
|
|
1852
|
+
e.persist();
|
|
1793
1853
|
}
|
|
1794
1854
|
let fieldValues = cloneObject(_formValues);
|
|
1795
1855
|
_subjects.state.next({
|
|
1796
1856
|
isSubmitting: true,
|
|
1797
1857
|
});
|
|
1798
1858
|
if (_options.resolver) {
|
|
1799
|
-
const { errors, values } = await
|
|
1859
|
+
const { errors, values } = await _runSchema();
|
|
1800
1860
|
_formState.errors = errors;
|
|
1801
1861
|
fieldValues = values;
|
|
1802
1862
|
}
|
|
1803
1863
|
else {
|
|
1804
1864
|
await executeBuiltInValidation(_fields);
|
|
1805
1865
|
}
|
|
1866
|
+
if (_names.disabled.size) {
|
|
1867
|
+
for (const name of _names.disabled) {
|
|
1868
|
+
set(fieldValues, name, undefined);
|
|
1869
|
+
}
|
|
1870
|
+
}
|
|
1806
1871
|
unset(_formState.errors, 'root');
|
|
1807
1872
|
if (isEmptyObject(_formState.errors)) {
|
|
1808
1873
|
_subjects.state.next({
|
|
@@ -1853,7 +1918,7 @@ function createFormControl(props = {}) {
|
|
|
1853
1918
|
}
|
|
1854
1919
|
if (!options.keepError) {
|
|
1855
1920
|
unset(_formState.errors, name);
|
|
1856
|
-
_proxyFormState.isValid &&
|
|
1921
|
+
_proxyFormState.isValid && _setValid();
|
|
1857
1922
|
}
|
|
1858
1923
|
_subjects.state.next({ ..._formState });
|
|
1859
1924
|
}
|
|
@@ -1868,7 +1933,11 @@ function createFormControl(props = {}) {
|
|
|
1868
1933
|
}
|
|
1869
1934
|
if (!keepStateOptions.keepValues) {
|
|
1870
1935
|
if (keepStateOptions.keepDirtyValues) {
|
|
1871
|
-
|
|
1936
|
+
const fieldsToCheck = new Set([
|
|
1937
|
+
..._names.mount,
|
|
1938
|
+
...Object.keys(getDirtyFields(_defaultValues, _formValues)),
|
|
1939
|
+
]);
|
|
1940
|
+
for (const fieldName of Array.from(fieldsToCheck)) {
|
|
1872
1941
|
get(_formState.dirtyFields, fieldName)
|
|
1873
1942
|
? set(values, fieldName, get(_formValues, fieldName))
|
|
1874
1943
|
: setValue(fieldName, get(values, fieldName));
|
|
@@ -1892,17 +1961,15 @@ function createFormControl(props = {}) {
|
|
|
1892
1961
|
}
|
|
1893
1962
|
}
|
|
1894
1963
|
}
|
|
1895
|
-
|
|
1964
|
+
for (const fieldName of _names.mount) {
|
|
1965
|
+
setValue(fieldName, get(values, fieldName));
|
|
1966
|
+
}
|
|
1896
1967
|
}
|
|
1897
|
-
_formValues =
|
|
1898
|
-
? keepStateOptions.keepDefaultValues
|
|
1899
|
-
? cloneObject(_defaultValues)
|
|
1900
|
-
: {}
|
|
1901
|
-
: cloneObject(values);
|
|
1968
|
+
_formValues = cloneObject(values);
|
|
1902
1969
|
_subjects.array.next({
|
|
1903
1970
|
values: { ...values },
|
|
1904
1971
|
});
|
|
1905
|
-
_subjects.
|
|
1972
|
+
_subjects.state.next({
|
|
1906
1973
|
values: { ...values },
|
|
1907
1974
|
});
|
|
1908
1975
|
}
|
|
@@ -1910,6 +1977,7 @@ function createFormControl(props = {}) {
|
|
|
1910
1977
|
mount: keepStateOptions.keepDirtyValues ? _names.mount : new Set(),
|
|
1911
1978
|
unMount: new Set(),
|
|
1912
1979
|
array: new Set(),
|
|
1980
|
+
disabled: new Set(),
|
|
1913
1981
|
watch: new Set(),
|
|
1914
1982
|
watchAll: false,
|
|
1915
1983
|
focus: '',
|
|
@@ -1918,7 +1986,7 @@ function createFormControl(props = {}) {
|
|
|
1918
1986
|
!_proxyFormState.isValid ||
|
|
1919
1987
|
!!keepStateOptions.keepIsValid ||
|
|
1920
1988
|
!!keepStateOptions.keepDirtyValues;
|
|
1921
|
-
_state.watch = !!
|
|
1989
|
+
_state.watch = !!_options.shouldUnregister;
|
|
1922
1990
|
_subjects.state.next({
|
|
1923
1991
|
submitCount: keepStateOptions.keepSubmitCount
|
|
1924
1992
|
? _formState.submitCount
|
|
@@ -1933,14 +2001,16 @@ function createFormControl(props = {}) {
|
|
|
1933
2001
|
? _formState.isSubmitted
|
|
1934
2002
|
: false,
|
|
1935
2003
|
dirtyFields: isEmptyResetValues
|
|
1936
|
-
?
|
|
2004
|
+
? {}
|
|
1937
2005
|
: keepStateOptions.keepDirtyValues
|
|
1938
2006
|
? keepStateOptions.keepDefaultValues && _formValues
|
|
1939
2007
|
? getDirtyFields(_defaultValues, _formValues)
|
|
1940
2008
|
: _formState.dirtyFields
|
|
1941
2009
|
: keepStateOptions.keepDefaultValues && formValues
|
|
1942
2010
|
? getDirtyFields(_defaultValues, formValues)
|
|
1943
|
-
:
|
|
2011
|
+
: keepStateOptions.keepDirty
|
|
2012
|
+
? _formState.dirtyFields
|
|
2013
|
+
: {},
|
|
1944
2014
|
touchedFields: keepStateOptions.keepTouched
|
|
1945
2015
|
? _formState.touchedFields
|
|
1946
2016
|
: {},
|
|
@@ -1963,11 +2033,13 @@ function createFormControl(props = {}) {
|
|
|
1963
2033
|
: fieldReference.ref;
|
|
1964
2034
|
if (fieldRef.focus) {
|
|
1965
2035
|
fieldRef.focus();
|
|
1966
|
-
options.shouldSelect &&
|
|
2036
|
+
options.shouldSelect &&
|
|
2037
|
+
isFunction(fieldRef.select) &&
|
|
2038
|
+
fieldRef.select();
|
|
1967
2039
|
}
|
|
1968
2040
|
}
|
|
1969
2041
|
};
|
|
1970
|
-
const
|
|
2042
|
+
const _setFormState = (updatedFormState) => {
|
|
1971
2043
|
_formState = {
|
|
1972
2044
|
..._formState,
|
|
1973
2045
|
...updatedFormState,
|
|
@@ -1980,28 +2052,28 @@ function createFormControl(props = {}) {
|
|
|
1980
2052
|
isLoading: false,
|
|
1981
2053
|
});
|
|
1982
2054
|
});
|
|
1983
|
-
|
|
2055
|
+
const methods = {
|
|
1984
2056
|
control: {
|
|
1985
2057
|
register,
|
|
1986
2058
|
unregister,
|
|
1987
2059
|
getFieldState,
|
|
1988
2060
|
handleSubmit,
|
|
1989
2061
|
setError,
|
|
1990
|
-
|
|
2062
|
+
_subscribe,
|
|
2063
|
+
_runSchema,
|
|
1991
2064
|
_getWatch,
|
|
1992
2065
|
_getDirty,
|
|
1993
|
-
|
|
1994
|
-
|
|
1995
|
-
|
|
1996
|
-
|
|
2066
|
+
_setValid,
|
|
2067
|
+
_setFieldArray,
|
|
2068
|
+
_setDisabledField,
|
|
2069
|
+
_setErrors,
|
|
1997
2070
|
_getFieldArray,
|
|
1998
2071
|
_reset,
|
|
1999
2072
|
_resetDefaultValues,
|
|
2000
|
-
|
|
2073
|
+
_removeUnmounted,
|
|
2001
2074
|
_disableForm,
|
|
2002
2075
|
_subjects,
|
|
2003
2076
|
_proxyFormState,
|
|
2004
|
-
_setErrors,
|
|
2005
2077
|
get _fields() {
|
|
2006
2078
|
return _fields;
|
|
2007
2079
|
},
|
|
@@ -2026,9 +2098,6 @@ function createFormControl(props = {}) {
|
|
|
2026
2098
|
get _formState() {
|
|
2027
2099
|
return _formState;
|
|
2028
2100
|
},
|
|
2029
|
-
set _formState(value) {
|
|
2030
|
-
_formState = value;
|
|
2031
|
-
},
|
|
2032
2101
|
get _options() {
|
|
2033
2102
|
return _options;
|
|
2034
2103
|
},
|
|
@@ -2039,6 +2108,7 @@ function createFormControl(props = {}) {
|
|
|
2039
2108
|
};
|
|
2040
2109
|
},
|
|
2041
2110
|
},
|
|
2111
|
+
subscribe,
|
|
2042
2112
|
trigger,
|
|
2043
2113
|
register,
|
|
2044
2114
|
handleSubmit,
|
|
@@ -2053,6 +2123,10 @@ function createFormControl(props = {}) {
|
|
|
2053
2123
|
setFocus,
|
|
2054
2124
|
getFieldState,
|
|
2055
2125
|
};
|
|
2126
|
+
return {
|
|
2127
|
+
...methods,
|
|
2128
|
+
formControl: methods,
|
|
2129
|
+
};
|
|
2056
2130
|
}
|
|
2057
2131
|
|
|
2058
2132
|
/**
|
|
@@ -2085,8 +2159,8 @@ function createFormControl(props = {}) {
|
|
|
2085
2159
|
* ```
|
|
2086
2160
|
*/
|
|
2087
2161
|
function useForm(props = {}) {
|
|
2088
|
-
const _formControl = React__default.useRef();
|
|
2089
|
-
const _values = React__default.useRef();
|
|
2162
|
+
const _formControl = React__default.useRef(undefined);
|
|
2163
|
+
const _values = React__default.useRef(undefined);
|
|
2090
2164
|
const [formState, updateFormState] = React__default.useState({
|
|
2091
2165
|
isDirty: false,
|
|
2092
2166
|
isValidating: false,
|
|
@@ -2107,20 +2181,22 @@ function useForm(props = {}) {
|
|
|
2107
2181
|
});
|
|
2108
2182
|
if (!_formControl.current) {
|
|
2109
2183
|
_formControl.current = {
|
|
2110
|
-
...createFormControl(props),
|
|
2184
|
+
...(props.formControl ? props.formControl : createFormControl(props)),
|
|
2111
2185
|
formState,
|
|
2112
2186
|
};
|
|
2187
|
+
if (props.formControl &&
|
|
2188
|
+
props.defaultValues &&
|
|
2189
|
+
!isFunction(props.defaultValues)) {
|
|
2190
|
+
props.formControl.reset(props.defaultValues, props.resetOptions);
|
|
2191
|
+
}
|
|
2113
2192
|
}
|
|
2114
2193
|
const control = _formControl.current.control;
|
|
2115
2194
|
control._options = props;
|
|
2116
|
-
|
|
2117
|
-
|
|
2118
|
-
|
|
2119
|
-
|
|
2120
|
-
|
|
2121
|
-
}
|
|
2122
|
-
},
|
|
2123
|
-
});
|
|
2195
|
+
React__default.useLayoutEffect(() => control._subscribe({
|
|
2196
|
+
formState: control._proxyFormState,
|
|
2197
|
+
callback: () => updateFormState({ ...control._formState }),
|
|
2198
|
+
reRenderRoot: true,
|
|
2199
|
+
}), [control]);
|
|
2124
2200
|
React__default.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]);
|
|
2125
2201
|
React__default.useEffect(() => {
|
|
2126
2202
|
if (control._proxyFormState.isDirty) {
|
|
@@ -2143,13 +2219,13 @@ function useForm(props = {}) {
|
|
|
2143
2219
|
}
|
|
2144
2220
|
}, [props.values, control]);
|
|
2145
2221
|
React__default.useEffect(() => {
|
|
2146
|
-
if (props.errors) {
|
|
2222
|
+
if (props.errors && !isEmptyObject(props.errors)) {
|
|
2147
2223
|
control._setErrors(props.errors);
|
|
2148
2224
|
}
|
|
2149
2225
|
}, [props.errors, control]);
|
|
2150
2226
|
React__default.useEffect(() => {
|
|
2151
2227
|
if (!control._state.mount) {
|
|
2152
|
-
control.
|
|
2228
|
+
control._setValid();
|
|
2153
2229
|
control._state.mount = true;
|
|
2154
2230
|
}
|
|
2155
2231
|
if (control._state.watch) {
|
|
@@ -2160,7 +2236,7 @@ function useForm(props = {}) {
|
|
|
2160
2236
|
});
|
|
2161
2237
|
React__default.useEffect(() => {
|
|
2162
2238
|
props.shouldUnregister &&
|
|
2163
|
-
control._subjects.
|
|
2239
|
+
control._subjects.state.next({
|
|
2164
2240
|
values: control._getWatch(),
|
|
2165
2241
|
});
|
|
2166
2242
|
}, [props.shouldUnregister, control]);
|
|
@@ -2168,6 +2244,10 @@ function useForm(props = {}) {
|
|
|
2168
2244
|
return _formControl.current;
|
|
2169
2245
|
}
|
|
2170
2246
|
|
|
2247
|
+
var t=function(t,n,e){if(t&&"reportValidity"in t){var i=get(e,n);t.setCustomValidity(i&&i.message||""),t.reportValidity();}},n=function(r,n){var e=function(e){var i=n.fields[e];i&&i.ref&&"reportValidity"in i.ref?t(i.ref,e,r):i.refs&&i.refs.forEach(function(n){return t(n,e,r)});};for(var i in n.fields)e(i);},e=function(r){return r instanceof Date},i=function(r){return null==r},a=function(r){return "object"==typeof r},o$1=function(r){return !i(r)&&!Array.isArray(r)&&a(r)&&!e(r)},f=function(r){return /^\w*$/.test(r)},s$1=function(r,t,n){for(var e=-1,i=f(t)?[t]:function(r){return t=r.replace(/["|']|\]/g,"").split(/\.|\[/),Array.isArray(t)?t.filter(Boolean):[];var t;}(t),a=i.length,s=a-1;++e<a;){var u=i[e],c=n;if(e!==s){var l=r[u];c=o$1(l)||Array.isArray(l)?l:isNaN(+i[e+1])?{}:[];}r[u]=c,r=r[u];}return r},u=function(t,e){e.shouldUseNativeValidation&&n(t,e);var i={};for(var a in t){var o=get(e.fields,a),f=Object.assign(t[a]||{},{ref:o&&o.ref});if(c(e.names||Object.keys(t),a)){var u=Object.assign({},get(i,a));s$1(u,"root",f),s$1(i,a,u);}else s$1(i,a,f);}return i},c=function(r,t){return r.some(function(r){return r.startsWith(t+".")})};
|
|
2248
|
+
|
|
2249
|
+
function o(o,n$1,a){return void 0===n$1&&(n$1={}),void 0===a&&(a={}),function(s,i,c){try{return Promise.resolve(function(t,r){try{var u=(n$1.context&&"development"===process.env.NODE_ENV&&console.warn("You should not used the yup options context. Please, use the 'useForm' context object instead"),Promise.resolve(o["sync"===a.mode?"validateSync":"validate"](s,Object.assign({abortEarly:!1},n$1,{context:i}))).then(function(t){return c.shouldUseNativeValidation&&n({},c),{values:a.raw?s:t,errors:{}}}));}catch(e){return r(e)}return u&&u.then?u.then(void 0,r):u}(0,function(e){if(!e.inner)throw e;return {values:{},errors:u((o=e,n=!c.shouldUseNativeValidation&&"all"===c.criteriaMode,(o.inner||[]).reduce(function(e,t){if(e[t.path]||(e[t.path]={message:t.message,type:t.type}),n){var o=e[t.path].types,a=o&&o[t.type];e[t.path]=appendErrors(t.path,n,e,t.type,a?[].concat(a,t.message):t.message);}return e},{})),c)};var o,n;}))}catch(e){return Promise.reject(e)}}}
|
|
2250
|
+
|
|
2171
2251
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
2172
2252
|
|
|
2173
2253
|
function getDefaultExportFromCjs (x) {
|
|
@@ -63115,5 +63195,5 @@ const SessionTimeOut = ({ sessionTime, handleSubmitSession, onSessionExpire, han
|
|
|
63115
63195
|
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(ConfirmationDialog, { openConfirmDialog: openConfirmModal, handleCancel: handleCancel, onClickSubmit: handleSubmit, text: sessionMessage, Submit: SubmitButtonName, buttonStyleProps: buttonStyleProps }) }));
|
|
63116
63196
|
};
|
|
63117
63197
|
|
|
63118
|
-
export { Box as BoxTP, Button as ButtonTP, DeleteField, DeleteField as DeleteFieldTP, CssVarsProvider as Experimental_CssVarsProvider, Grid as GridTP, FormRenderWrapper as RenderForm, FormRenderWrapper as RenderFormTP, SessionTimeOut as SessionTimeoutField, SessionTimeOut as SessionTimeoutFieldTP, StyledEngineProvider, THEME_ID, ThemeProvider, ThemeProvider$3 as ThemeProviderTP, Typography as TypographyTP, adaptV4Theme, alpha, createMuiTheme, createStyles, createTheme, css$1 as css, darken, decomposeColor, duration, easing, emphasize, styled$1 as experimentalStyled, extendTheme as experimental_extendTheme, experimental_sx, getContrastRatio, getInitColorSchemeScript, getLuminance, getOverlayAlpha$1 as getOverlayAlpha, hexToRgb, hslToRgb, keyframes, lighten, makeStyles$1 as makeStyles, createMixins as private_createMixins, createTypography as private_createTypography, excludeVariablesFromRoot$1 as private_excludeVariablesFromRoot, recomposeColor, responsiveFontSizes, rgbToHex, shouldSkipGeneratingVar, styled$1 as styled, createMuiStrictModeTheme as unstable_createMuiStrictModeTheme, getUnit as unstable_getUnit, toUnitless as unstable_toUnitless, useColorScheme, useForm as useFormElement, useForm as useFormElementTP, useFormValidatingContext, useFormValidatingContext as useFormValidatingContextTP, useTheme$2 as useTheme, useThemeProps$1 as useThemeProps, withStyles, withTheme };
|
|
63198
|
+
export { Box as BoxTP, Button as ButtonTP, DeleteField, DeleteField as DeleteFieldTP, CssVarsProvider as Experimental_CssVarsProvider, Grid as GridTP, FormRenderWrapper as RenderForm, FormRenderWrapper as RenderFormTP, SessionTimeOut as SessionTimeoutField, SessionTimeOut as SessionTimeoutFieldTP, StyledEngineProvider, THEME_ID, ThemeProvider, ThemeProvider$3 as ThemeProviderTP, Typography as TypographyTP, adaptV4Theme, alpha, createMuiTheme, createStyles, createTheme, css$1 as css, darken, decomposeColor, duration, easing, emphasize, styled$1 as experimentalStyled, extendTheme as experimental_extendTheme, experimental_sx, getContrastRatio, getInitColorSchemeScript, getLuminance, getOverlayAlpha$1 as getOverlayAlpha, hexToRgb, hslToRgb, keyframes, lighten, makeStyles$1 as makeStyles, createMixins as private_createMixins, createTypography as private_createTypography, excludeVariablesFromRoot$1 as private_excludeVariablesFromRoot, recomposeColor, responsiveFontSizes, rgbToHex, shouldSkipGeneratingVar, styled$1 as styled, createMuiStrictModeTheme as unstable_createMuiStrictModeTheme, getUnit as unstable_getUnit, toUnitless as unstable_toUnitless, useColorScheme, useForm as useFormElement, useForm as useFormElementTP, useFormValidatingContext, useFormValidatingContext as useFormValidatingContextTP, useTheme$2 as useTheme, useThemeProps$1 as useThemeProps, withStyles, withTheme, o as yupResolverTP };
|
|
63119
63199
|
//# sourceMappingURL=index.esm.js.map
|