tp-react-elements-dev 0.2.0 → 0.4.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/components/Form/FormConstants.d.ts +17 -0
- package/dist/components/Form/FormRender.d.ts +2 -2
- package/dist/components/Form/FormRenderWrapper.d.ts +3 -2
- package/dist/components/index.d.ts +1 -0
- package/dist/index.css +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.esm.css +1 -1
- package/dist/index.esm.js +209 -1744
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +207 -1741
- package/dist/index.js.map +1 -1
- package/dist/styles/theme.d.ts +9 -0
- package/dist/theme.d.ts +10 -0
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -4955,6 +4955,41 @@ if (process.env.NODE_ENV !== 'production') {
|
|
|
4955
4955
|
ThemeContext$1.displayName = 'EmotionThemeContext';
|
|
4956
4956
|
}
|
|
4957
4957
|
|
|
4958
|
+
var getTheme = function getTheme(outerTheme, theme) {
|
|
4959
|
+
if (typeof theme === 'function') {
|
|
4960
|
+
var mergedTheme = theme(outerTheme);
|
|
4961
|
+
|
|
4962
|
+
if (process.env.NODE_ENV !== 'production' && (mergedTheme == null || typeof mergedTheme !== 'object' || Array.isArray(mergedTheme))) {
|
|
4963
|
+
throw new Error('[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!');
|
|
4964
|
+
}
|
|
4965
|
+
|
|
4966
|
+
return mergedTheme;
|
|
4967
|
+
}
|
|
4968
|
+
|
|
4969
|
+
if (process.env.NODE_ENV !== 'production' && (theme == null || typeof theme !== 'object' || Array.isArray(theme))) {
|
|
4970
|
+
throw new Error('[ThemeProvider] Please make your theme prop a plain object');
|
|
4971
|
+
}
|
|
4972
|
+
|
|
4973
|
+
return _extends$1({}, outerTheme, theme);
|
|
4974
|
+
};
|
|
4975
|
+
|
|
4976
|
+
var createCacheWithTheme = /* #__PURE__ */weakMemoize(function (outerTheme) {
|
|
4977
|
+
return weakMemoize(function (theme) {
|
|
4978
|
+
return getTheme(outerTheme, theme);
|
|
4979
|
+
});
|
|
4980
|
+
});
|
|
4981
|
+
var ThemeProvider = function ThemeProvider(props) {
|
|
4982
|
+
var theme = React__namespace.useContext(ThemeContext$1);
|
|
4983
|
+
|
|
4984
|
+
if (props.theme !== theme) {
|
|
4985
|
+
theme = createCacheWithTheme(theme)(props.theme);
|
|
4986
|
+
}
|
|
4987
|
+
|
|
4988
|
+
return /*#__PURE__*/React__namespace.createElement(ThemeContext$1.Provider, {
|
|
4989
|
+
value: theme
|
|
4990
|
+
}, props.children);
|
|
4991
|
+
};
|
|
4992
|
+
|
|
4958
4993
|
var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';
|
|
4959
4994
|
var labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';
|
|
4960
4995
|
|
|
@@ -10782,7 +10817,7 @@ function isElement(node) {
|
|
|
10782
10817
|
return node instanceof OwnElement || node instanceof Element;
|
|
10783
10818
|
}
|
|
10784
10819
|
|
|
10785
|
-
function isHTMLElement$
|
|
10820
|
+
function isHTMLElement$1(node) {
|
|
10786
10821
|
var OwnElement = getWindow(node).HTMLElement;
|
|
10787
10822
|
return node instanceof OwnElement || node instanceof HTMLElement;
|
|
10788
10823
|
}
|
|
@@ -10806,7 +10841,7 @@ function applyStyles(_ref) {
|
|
|
10806
10841
|
var attributes = state.attributes[name] || {};
|
|
10807
10842
|
var element = state.elements[name]; // arrow is optional + virtual elements
|
|
10808
10843
|
|
|
10809
|
-
if (!isHTMLElement$
|
|
10844
|
+
if (!isHTMLElement$1(element) || !getNodeName(element)) {
|
|
10810
10845
|
return;
|
|
10811
10846
|
} // Flow doesn't support to extend this property, but it's the most
|
|
10812
10847
|
// effective way to apply styles to an HTMLElement
|
|
@@ -10858,7 +10893,7 @@ function effect$2(_ref2) {
|
|
|
10858
10893
|
return style;
|
|
10859
10894
|
}, {}); // arrow is optional + virtual elements
|
|
10860
10895
|
|
|
10861
|
-
if (!isHTMLElement$
|
|
10896
|
+
if (!isHTMLElement$1(element) || !getNodeName(element)) {
|
|
10862
10897
|
return;
|
|
10863
10898
|
}
|
|
10864
10899
|
|
|
@@ -10917,7 +10952,7 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy) {
|
|
|
10917
10952
|
var scaleX = 1;
|
|
10918
10953
|
var scaleY = 1;
|
|
10919
10954
|
|
|
10920
|
-
if (includeScale && isHTMLElement$
|
|
10955
|
+
if (includeScale && isHTMLElement$1(element)) {
|
|
10921
10956
|
scaleX = element.offsetWidth > 0 ? round$1(clientRect.width) / element.offsetWidth || 1 : 1;
|
|
10922
10957
|
scaleY = element.offsetHeight > 0 ? round$1(clientRect.height) / element.offsetHeight || 1 : 1;
|
|
10923
10958
|
}
|
|
@@ -11022,7 +11057,7 @@ function getParentNode(element) {
|
|
|
11022
11057
|
}
|
|
11023
11058
|
|
|
11024
11059
|
function getTrueOffsetParent(element) {
|
|
11025
|
-
if (!isHTMLElement$
|
|
11060
|
+
if (!isHTMLElement$1(element) || // https://github.com/popperjs/popper-core/issues/837
|
|
11026
11061
|
getComputedStyle(element).position === 'fixed') {
|
|
11027
11062
|
return null;
|
|
11028
11063
|
}
|
|
@@ -11036,7 +11071,7 @@ function getContainingBlock(element) {
|
|
|
11036
11071
|
var isFirefox = /firefox/i.test(getUAString());
|
|
11037
11072
|
var isIE = /Trident/i.test(getUAString());
|
|
11038
11073
|
|
|
11039
|
-
if (isIE && isHTMLElement$
|
|
11074
|
+
if (isIE && isHTMLElement$1(element)) {
|
|
11040
11075
|
// In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
|
|
11041
11076
|
var elementCss = getComputedStyle(element);
|
|
11042
11077
|
|
|
@@ -11051,7 +11086,7 @@ function getContainingBlock(element) {
|
|
|
11051
11086
|
currentNode = currentNode.host;
|
|
11052
11087
|
}
|
|
11053
11088
|
|
|
11054
|
-
while (isHTMLElement$
|
|
11089
|
+
while (isHTMLElement$1(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {
|
|
11055
11090
|
var css = getComputedStyle(currentNode); // This is non-exhaustive but covers the most common CSS properties that
|
|
11056
11091
|
// create a containing block.
|
|
11057
11092
|
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
@@ -11521,7 +11556,7 @@ function getScrollParent(node) {
|
|
|
11521
11556
|
return node.ownerDocument.body;
|
|
11522
11557
|
}
|
|
11523
11558
|
|
|
11524
|
-
if (isHTMLElement$
|
|
11559
|
+
if (isHTMLElement$1(node) && isScrollParent(node)) {
|
|
11525
11560
|
return node;
|
|
11526
11561
|
}
|
|
11527
11562
|
|
|
@@ -11583,7 +11618,7 @@ function getClientRectFromMixedType(element, clippingParent, strategy) {
|
|
|
11583
11618
|
function getClippingParents(element) {
|
|
11584
11619
|
var clippingParents = listScrollParents(getParentNode(element));
|
|
11585
11620
|
var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle(element).position) >= 0;
|
|
11586
|
-
var clipperElement = canEscapeClipping && isHTMLElement$
|
|
11621
|
+
var clipperElement = canEscapeClipping && isHTMLElement$1(element) ? getOffsetParent(element) : element;
|
|
11587
11622
|
|
|
11588
11623
|
if (!isElement(clipperElement)) {
|
|
11589
11624
|
return [];
|
|
@@ -12195,7 +12230,7 @@ function getHTMLElementScroll(element) {
|
|
|
12195
12230
|
}
|
|
12196
12231
|
|
|
12197
12232
|
function getNodeScroll(node) {
|
|
12198
|
-
if (node === getWindow(node) || !isHTMLElement$
|
|
12233
|
+
if (node === getWindow(node) || !isHTMLElement$1(node)) {
|
|
12199
12234
|
return getWindowScroll(node);
|
|
12200
12235
|
} else {
|
|
12201
12236
|
return getHTMLElementScroll(node);
|
|
@@ -12216,8 +12251,8 @@ function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
|
|
|
12216
12251
|
isFixed = false;
|
|
12217
12252
|
}
|
|
12218
12253
|
|
|
12219
|
-
var isOffsetParentAnElement = isHTMLElement$
|
|
12220
|
-
var offsetParentIsScaled = isHTMLElement$
|
|
12254
|
+
var isOffsetParentAnElement = isHTMLElement$1(offsetParent);
|
|
12255
|
+
var offsetParentIsScaled = isHTMLElement$1(offsetParent) && isElementScaled(offsetParent);
|
|
12221
12256
|
var documentElement = getDocumentElement(offsetParent);
|
|
12222
12257
|
var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled, isFixed);
|
|
12223
12258
|
var scroll = {
|
|
@@ -12235,7 +12270,7 @@ function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
|
|
|
12235
12270
|
scroll = getNodeScroll(offsetParent);
|
|
12236
12271
|
}
|
|
12237
12272
|
|
|
12238
|
-
if (isHTMLElement$
|
|
12273
|
+
if (isHTMLElement$1(offsetParent)) {
|
|
12239
12274
|
offsets = getBoundingClientRect(offsetParent, true);
|
|
12240
12275
|
offsets.x += offsetParent.clientLeft;
|
|
12241
12276
|
offsets.y += offsetParent.clientTop;
|
|
@@ -12547,11 +12582,11 @@ function flipPlacement(placement, direction) {
|
|
|
12547
12582
|
function resolveAnchorEl$1(anchorEl) {
|
|
12548
12583
|
return typeof anchorEl === 'function' ? anchorEl() : anchorEl;
|
|
12549
12584
|
}
|
|
12550
|
-
function isHTMLElement
|
|
12585
|
+
function isHTMLElement(element) {
|
|
12551
12586
|
return element.nodeType !== undefined;
|
|
12552
12587
|
}
|
|
12553
12588
|
function isVirtualElement(element) {
|
|
12554
|
-
return !isHTMLElement
|
|
12589
|
+
return !isHTMLElement(element);
|
|
12555
12590
|
}
|
|
12556
12591
|
const useUtilityClasses$U = () => {
|
|
12557
12592
|
const slots = {
|
|
@@ -12613,7 +12648,7 @@ const PopperTooltip = /*#__PURE__*/React__namespace.forwardRef(function PopperTo
|
|
|
12613
12648
|
setPlacement(data.placement);
|
|
12614
12649
|
};
|
|
12615
12650
|
if (process.env.NODE_ENV !== 'production') {
|
|
12616
|
-
if (resolvedAnchorElement && isHTMLElement
|
|
12651
|
+
if (resolvedAnchorElement && isHTMLElement(resolvedAnchorElement) && resolvedAnchorElement.nodeType === 1) {
|
|
12617
12652
|
const box = resolvedAnchorElement.getBoundingClientRect();
|
|
12618
12653
|
if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
|
|
12619
12654
|
console.warn(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
|
|
@@ -12730,7 +12765,7 @@ const Popper$1 = /*#__PURE__*/React__namespace.forwardRef(function Popper(props,
|
|
|
12730
12765
|
container = containerProp;
|
|
12731
12766
|
} else if (anchorEl) {
|
|
12732
12767
|
const resolvedAnchorEl = resolveAnchorEl$1(anchorEl);
|
|
12733
|
-
container = resolvedAnchorEl && isHTMLElement
|
|
12768
|
+
container = resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) ? ownerDocument(resolvedAnchorEl).body : ownerDocument(null).body;
|
|
12734
12769
|
}
|
|
12735
12770
|
const display = !open && keepMounted && (!transition || exited) ? 'none' : undefined;
|
|
12736
12771
|
const transitionProps = transition ? {
|
|
@@ -12781,7 +12816,7 @@ process.env.NODE_ENV !== "production" ? Popper$1.propTypes /* remove-proptypes *
|
|
|
12781
12816
|
anchorEl: chainPropTypes(PropTypes.oneOfType([HTMLElementType, PropTypes.object, PropTypes.func]), props => {
|
|
12782
12817
|
if (props.open) {
|
|
12783
12818
|
const resolvedAnchorEl = resolveAnchorEl$1(props.anchorEl);
|
|
12784
|
-
if (resolvedAnchorEl && isHTMLElement
|
|
12819
|
+
if (resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) && resolvedAnchorEl.nodeType === 1) {
|
|
12785
12820
|
const box = resolvedAnchorEl.getBoundingClientRect();
|
|
12786
12821
|
if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
|
|
12787
12822
|
return new Error(['MUI: The `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', "Make sure the element is present in the document or that it's not display none."].join('\n'));
|
|
@@ -23458,15 +23493,6 @@ const VALIDATION_MODE = {
|
|
|
23458
23493
|
onTouched: 'onTouched',
|
|
23459
23494
|
all: 'all',
|
|
23460
23495
|
};
|
|
23461
|
-
const INPUT_VALIDATION_RULES = {
|
|
23462
|
-
max: 'max',
|
|
23463
|
-
min: 'min',
|
|
23464
|
-
maxLength: 'maxLength',
|
|
23465
|
-
minLength: 'minLength',
|
|
23466
|
-
pattern: 'pattern',
|
|
23467
|
-
required: 'required',
|
|
23468
|
-
validate: 'validate',
|
|
23469
|
-
};
|
|
23470
23496
|
|
|
23471
23497
|
const HookFormContext = React$1.createContext(null);
|
|
23472
23498
|
/**
|
|
@@ -23528,7 +23554,7 @@ var shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, is
|
|
|
23528
23554
|
return (isEmptyObject(formState) ||
|
|
23529
23555
|
Object.keys(formState).length >= Object.keys(_proxyFormState).length ||
|
|
23530
23556
|
Object.keys(formState).find((key) => _proxyFormState[key] ===
|
|
23531
|
-
(!isRoot
|
|
23557
|
+
(!isRoot )));
|
|
23532
23558
|
};
|
|
23533
23559
|
|
|
23534
23560
|
var convertToArrayPayload = (value) => (Array.isArray(value) ? value : [value]);
|
|
@@ -23629,13 +23655,11 @@ var isString = (value) => typeof value === 'string';
|
|
|
23629
23655
|
|
|
23630
23656
|
var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) => {
|
|
23631
23657
|
if (isString(names)) {
|
|
23632
|
-
isGlobal && _names.watch.add(names);
|
|
23633
23658
|
return get(formValues, names, defaultValue);
|
|
23634
23659
|
}
|
|
23635
23660
|
if (Array.isArray(names)) {
|
|
23636
|
-
return names.map((fieldName) => (
|
|
23661
|
+
return names.map((fieldName) => (get(formValues, fieldName)));
|
|
23637
23662
|
}
|
|
23638
|
-
isGlobal && (_names.watchAll = true);
|
|
23639
23663
|
return formValues;
|
|
23640
23664
|
};
|
|
23641
23665
|
|
|
@@ -23854,1656 +23878,7 @@ function useController(props) {
|
|
|
23854
23878
|
*/
|
|
23855
23879
|
const Controller = (props) => props.render(useController(props));
|
|
23856
23880
|
|
|
23857
|
-
var
|
|
23858
|
-
? {
|
|
23859
|
-
...errors[name],
|
|
23860
|
-
types: {
|
|
23861
|
-
...(errors[name] && errors[name].types ? errors[name].types : {}),
|
|
23862
|
-
[type]: message || true,
|
|
23863
|
-
},
|
|
23864
|
-
}
|
|
23865
|
-
: {};
|
|
23866
|
-
|
|
23867
|
-
var getValidationModes = (mode) => ({
|
|
23868
|
-
isOnSubmit: !mode || mode === VALIDATION_MODE.onSubmit,
|
|
23869
|
-
isOnBlur: mode === VALIDATION_MODE.onBlur,
|
|
23870
|
-
isOnChange: mode === VALIDATION_MODE.onChange,
|
|
23871
|
-
isOnAll: mode === VALIDATION_MODE.all,
|
|
23872
|
-
isOnTouch: mode === VALIDATION_MODE.onTouched,
|
|
23873
|
-
});
|
|
23874
|
-
|
|
23875
|
-
var isWatched = (name, _names, isBlurEvent) => !isBlurEvent &&
|
|
23876
|
-
(_names.watchAll ||
|
|
23877
|
-
_names.watch.has(name) ||
|
|
23878
|
-
[..._names.watch].some((watchName) => name.startsWith(watchName) &&
|
|
23879
|
-
/^\.\w+/.test(name.slice(watchName.length))));
|
|
23880
|
-
|
|
23881
|
-
const iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => {
|
|
23882
|
-
for (const key of fieldsNames || Object.keys(fields)) {
|
|
23883
|
-
const field = get(fields, key);
|
|
23884
|
-
if (field) {
|
|
23885
|
-
const { _f, ...currentField } = field;
|
|
23886
|
-
if (_f) {
|
|
23887
|
-
if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) {
|
|
23888
|
-
break;
|
|
23889
|
-
}
|
|
23890
|
-
else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) {
|
|
23891
|
-
break;
|
|
23892
|
-
}
|
|
23893
|
-
else {
|
|
23894
|
-
iterateFieldsByAction(currentField, action);
|
|
23895
|
-
}
|
|
23896
|
-
}
|
|
23897
|
-
else if (isObject$1(currentField)) {
|
|
23898
|
-
iterateFieldsByAction(currentField, action);
|
|
23899
|
-
}
|
|
23900
|
-
}
|
|
23901
|
-
}
|
|
23902
|
-
};
|
|
23903
|
-
|
|
23904
|
-
var updateFieldArrayRootError = (errors, error, name) => {
|
|
23905
|
-
const fieldArrayErrors = compact(get(errors, name));
|
|
23906
|
-
set(fieldArrayErrors, 'root', error[name]);
|
|
23907
|
-
set(errors, name, fieldArrayErrors);
|
|
23908
|
-
return errors;
|
|
23909
|
-
};
|
|
23910
|
-
|
|
23911
|
-
var isFileInput = (element) => element.type === 'file';
|
|
23912
|
-
|
|
23913
|
-
var isFunction = (value) => typeof value === 'function';
|
|
23914
|
-
|
|
23915
|
-
var isHTMLElement = (value) => {
|
|
23916
|
-
if (!isWeb) {
|
|
23917
|
-
return false;
|
|
23918
|
-
}
|
|
23919
|
-
const owner = value ? value.ownerDocument : 0;
|
|
23920
|
-
return (value instanceof
|
|
23921
|
-
(owner && owner.defaultView ? owner.defaultView.HTMLElement : HTMLElement));
|
|
23922
|
-
};
|
|
23923
|
-
|
|
23924
|
-
var isMessage = (value) => isString(value);
|
|
23925
|
-
|
|
23926
|
-
var isRadioInput = (element) => element.type === 'radio';
|
|
23927
|
-
|
|
23928
|
-
var isRegex = (value) => value instanceof RegExp;
|
|
23929
|
-
|
|
23930
|
-
const defaultResult = {
|
|
23931
|
-
value: false,
|
|
23932
|
-
isValid: false,
|
|
23933
|
-
};
|
|
23934
|
-
const validResult = { value: true, isValid: true };
|
|
23935
|
-
var getCheckboxValue = (options) => {
|
|
23936
|
-
if (Array.isArray(options)) {
|
|
23937
|
-
if (options.length > 1) {
|
|
23938
|
-
const values = options
|
|
23939
|
-
.filter((option) => option && option.checked && !option.disabled)
|
|
23940
|
-
.map((option) => option.value);
|
|
23941
|
-
return { value: values, isValid: !!values.length };
|
|
23942
|
-
}
|
|
23943
|
-
return options[0].checked && !options[0].disabled
|
|
23944
|
-
? // @ts-expect-error expected to work in the browser
|
|
23945
|
-
options[0].attributes && !isUndefined(options[0].attributes.value)
|
|
23946
|
-
? isUndefined(options[0].value) || options[0].value === ''
|
|
23947
|
-
? validResult
|
|
23948
|
-
: { value: options[0].value, isValid: true }
|
|
23949
|
-
: validResult
|
|
23950
|
-
: defaultResult;
|
|
23951
|
-
}
|
|
23952
|
-
return defaultResult;
|
|
23953
|
-
};
|
|
23954
|
-
|
|
23955
|
-
const defaultReturn = {
|
|
23956
|
-
isValid: false,
|
|
23957
|
-
value: null,
|
|
23958
|
-
};
|
|
23959
|
-
var getRadioValue = (options) => Array.isArray(options)
|
|
23960
|
-
? options.reduce((previous, option) => option && option.checked && !option.disabled
|
|
23961
|
-
? {
|
|
23962
|
-
isValid: true,
|
|
23963
|
-
value: option.value,
|
|
23964
|
-
}
|
|
23965
|
-
: previous, defaultReturn)
|
|
23966
|
-
: defaultReturn;
|
|
23967
|
-
|
|
23968
|
-
function getValidateError(result, ref, type = 'validate') {
|
|
23969
|
-
if (isMessage(result) ||
|
|
23970
|
-
(Array.isArray(result) && result.every(isMessage)) ||
|
|
23971
|
-
(isBoolean(result) && !result)) {
|
|
23972
|
-
return {
|
|
23973
|
-
type,
|
|
23974
|
-
message: isMessage(result) ? result : '',
|
|
23975
|
-
ref,
|
|
23976
|
-
};
|
|
23977
|
-
}
|
|
23978
|
-
}
|
|
23979
|
-
|
|
23980
|
-
var getValueAndMessage = (validationData) => isObject$1(validationData) && !isRegex(validationData)
|
|
23981
|
-
? validationData
|
|
23982
|
-
: {
|
|
23983
|
-
value: validationData,
|
|
23984
|
-
message: '',
|
|
23985
|
-
};
|
|
23986
|
-
|
|
23987
|
-
var validateField = async (field, formValues, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => {
|
|
23988
|
-
const { ref, refs, required, maxLength, minLength, min, max, pattern, validate, name, valueAsNumber, mount, disabled, } = field._f;
|
|
23989
|
-
const inputValue = get(formValues, name);
|
|
23990
|
-
if (!mount || disabled) {
|
|
23991
|
-
return {};
|
|
23992
|
-
}
|
|
23993
|
-
const inputRef = refs ? refs[0] : ref;
|
|
23994
|
-
const setCustomValidity = (message) => {
|
|
23995
|
-
if (shouldUseNativeValidation && inputRef.reportValidity) {
|
|
23996
|
-
inputRef.setCustomValidity(isBoolean(message) ? '' : message || '');
|
|
23997
|
-
inputRef.reportValidity();
|
|
23998
|
-
}
|
|
23999
|
-
};
|
|
24000
|
-
const error = {};
|
|
24001
|
-
const isRadio = isRadioInput(ref);
|
|
24002
|
-
const isCheckBox = isCheckBoxInput(ref);
|
|
24003
|
-
const isRadioOrCheckbox = isRadio || isCheckBox;
|
|
24004
|
-
const isEmpty = ((valueAsNumber || isFileInput(ref)) &&
|
|
24005
|
-
isUndefined(ref.value) &&
|
|
24006
|
-
isUndefined(inputValue)) ||
|
|
24007
|
-
(isHTMLElement(ref) && ref.value === '') ||
|
|
24008
|
-
inputValue === '' ||
|
|
24009
|
-
(Array.isArray(inputValue) && !inputValue.length);
|
|
24010
|
-
const appendErrorsCurry = appendErrors.bind(null, name, validateAllFieldCriteria, error);
|
|
24011
|
-
const getMinMaxMessage = (exceedMax, maxLengthMessage, minLengthMessage, maxType = INPUT_VALIDATION_RULES.maxLength, minType = INPUT_VALIDATION_RULES.minLength) => {
|
|
24012
|
-
const message = exceedMax ? maxLengthMessage : minLengthMessage;
|
|
24013
|
-
error[name] = {
|
|
24014
|
-
type: exceedMax ? maxType : minType,
|
|
24015
|
-
message,
|
|
24016
|
-
ref,
|
|
24017
|
-
...appendErrorsCurry(exceedMax ? maxType : minType, message),
|
|
24018
|
-
};
|
|
24019
|
-
};
|
|
24020
|
-
if (isFieldArray
|
|
24021
|
-
? !Array.isArray(inputValue) || !inputValue.length
|
|
24022
|
-
: required &&
|
|
24023
|
-
((!isRadioOrCheckbox && (isEmpty || isNullOrUndefined(inputValue))) ||
|
|
24024
|
-
(isBoolean(inputValue) && !inputValue) ||
|
|
24025
|
-
(isCheckBox && !getCheckboxValue(refs).isValid) ||
|
|
24026
|
-
(isRadio && !getRadioValue(refs).isValid))) {
|
|
24027
|
-
const { value, message } = isMessage(required)
|
|
24028
|
-
? { value: !!required, message: required }
|
|
24029
|
-
: getValueAndMessage(required);
|
|
24030
|
-
if (value) {
|
|
24031
|
-
error[name] = {
|
|
24032
|
-
type: INPUT_VALIDATION_RULES.required,
|
|
24033
|
-
message,
|
|
24034
|
-
ref: inputRef,
|
|
24035
|
-
...appendErrorsCurry(INPUT_VALIDATION_RULES.required, message),
|
|
24036
|
-
};
|
|
24037
|
-
if (!validateAllFieldCriteria) {
|
|
24038
|
-
setCustomValidity(message);
|
|
24039
|
-
return error;
|
|
24040
|
-
}
|
|
24041
|
-
}
|
|
24042
|
-
}
|
|
24043
|
-
if (!isEmpty && (!isNullOrUndefined(min) || !isNullOrUndefined(max))) {
|
|
24044
|
-
let exceedMax;
|
|
24045
|
-
let exceedMin;
|
|
24046
|
-
const maxOutput = getValueAndMessage(max);
|
|
24047
|
-
const minOutput = getValueAndMessage(min);
|
|
24048
|
-
if (!isNullOrUndefined(inputValue) && !isNaN(inputValue)) {
|
|
24049
|
-
const valueNumber = ref.valueAsNumber ||
|
|
24050
|
-
(inputValue ? +inputValue : inputValue);
|
|
24051
|
-
if (!isNullOrUndefined(maxOutput.value)) {
|
|
24052
|
-
exceedMax = valueNumber > maxOutput.value;
|
|
24053
|
-
}
|
|
24054
|
-
if (!isNullOrUndefined(minOutput.value)) {
|
|
24055
|
-
exceedMin = valueNumber < minOutput.value;
|
|
24056
|
-
}
|
|
24057
|
-
}
|
|
24058
|
-
else {
|
|
24059
|
-
const valueDate = ref.valueAsDate || new Date(inputValue);
|
|
24060
|
-
const convertTimeToDate = (time) => new Date(new Date().toDateString() + ' ' + time);
|
|
24061
|
-
const isTime = ref.type == 'time';
|
|
24062
|
-
const isWeek = ref.type == 'week';
|
|
24063
|
-
if (isString(maxOutput.value) && inputValue) {
|
|
24064
|
-
exceedMax = isTime
|
|
24065
|
-
? convertTimeToDate(inputValue) > convertTimeToDate(maxOutput.value)
|
|
24066
|
-
: isWeek
|
|
24067
|
-
? inputValue > maxOutput.value
|
|
24068
|
-
: valueDate > new Date(maxOutput.value);
|
|
24069
|
-
}
|
|
24070
|
-
if (isString(minOutput.value) && inputValue) {
|
|
24071
|
-
exceedMin = isTime
|
|
24072
|
-
? convertTimeToDate(inputValue) < convertTimeToDate(minOutput.value)
|
|
24073
|
-
: isWeek
|
|
24074
|
-
? inputValue < minOutput.value
|
|
24075
|
-
: valueDate < new Date(minOutput.value);
|
|
24076
|
-
}
|
|
24077
|
-
}
|
|
24078
|
-
if (exceedMax || exceedMin) {
|
|
24079
|
-
getMinMaxMessage(!!exceedMax, maxOutput.message, minOutput.message, INPUT_VALIDATION_RULES.max, INPUT_VALIDATION_RULES.min);
|
|
24080
|
-
if (!validateAllFieldCriteria) {
|
|
24081
|
-
setCustomValidity(error[name].message);
|
|
24082
|
-
return error;
|
|
24083
|
-
}
|
|
24084
|
-
}
|
|
24085
|
-
}
|
|
24086
|
-
if ((maxLength || minLength) &&
|
|
24087
|
-
!isEmpty &&
|
|
24088
|
-
(isString(inputValue) || (isFieldArray && Array.isArray(inputValue)))) {
|
|
24089
|
-
const maxLengthOutput = getValueAndMessage(maxLength);
|
|
24090
|
-
const minLengthOutput = getValueAndMessage(minLength);
|
|
24091
|
-
const exceedMax = !isNullOrUndefined(maxLengthOutput.value) &&
|
|
24092
|
-
inputValue.length > +maxLengthOutput.value;
|
|
24093
|
-
const exceedMin = !isNullOrUndefined(minLengthOutput.value) &&
|
|
24094
|
-
inputValue.length < +minLengthOutput.value;
|
|
24095
|
-
if (exceedMax || exceedMin) {
|
|
24096
|
-
getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message);
|
|
24097
|
-
if (!validateAllFieldCriteria) {
|
|
24098
|
-
setCustomValidity(error[name].message);
|
|
24099
|
-
return error;
|
|
24100
|
-
}
|
|
24101
|
-
}
|
|
24102
|
-
}
|
|
24103
|
-
if (pattern && !isEmpty && isString(inputValue)) {
|
|
24104
|
-
const { value: patternValue, message } = getValueAndMessage(pattern);
|
|
24105
|
-
if (isRegex(patternValue) && !inputValue.match(patternValue)) {
|
|
24106
|
-
error[name] = {
|
|
24107
|
-
type: INPUT_VALIDATION_RULES.pattern,
|
|
24108
|
-
message,
|
|
24109
|
-
ref,
|
|
24110
|
-
...appendErrorsCurry(INPUT_VALIDATION_RULES.pattern, message),
|
|
24111
|
-
};
|
|
24112
|
-
if (!validateAllFieldCriteria) {
|
|
24113
|
-
setCustomValidity(message);
|
|
24114
|
-
return error;
|
|
24115
|
-
}
|
|
24116
|
-
}
|
|
24117
|
-
}
|
|
24118
|
-
if (validate) {
|
|
24119
|
-
if (isFunction(validate)) {
|
|
24120
|
-
const result = await validate(inputValue, formValues);
|
|
24121
|
-
const validateError = getValidateError(result, inputRef);
|
|
24122
|
-
if (validateError) {
|
|
24123
|
-
error[name] = {
|
|
24124
|
-
...validateError,
|
|
24125
|
-
...appendErrorsCurry(INPUT_VALIDATION_RULES.validate, validateError.message),
|
|
24126
|
-
};
|
|
24127
|
-
if (!validateAllFieldCriteria) {
|
|
24128
|
-
setCustomValidity(validateError.message);
|
|
24129
|
-
return error;
|
|
24130
|
-
}
|
|
24131
|
-
}
|
|
24132
|
-
}
|
|
24133
|
-
else if (isObject$1(validate)) {
|
|
24134
|
-
let validationResult = {};
|
|
24135
|
-
for (const key in validate) {
|
|
24136
|
-
if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) {
|
|
24137
|
-
break;
|
|
24138
|
-
}
|
|
24139
|
-
const validateError = getValidateError(await validate[key](inputValue, formValues), inputRef, key);
|
|
24140
|
-
if (validateError) {
|
|
24141
|
-
validationResult = {
|
|
24142
|
-
...validateError,
|
|
24143
|
-
...appendErrorsCurry(key, validateError.message),
|
|
24144
|
-
};
|
|
24145
|
-
setCustomValidity(validateError.message);
|
|
24146
|
-
if (validateAllFieldCriteria) {
|
|
24147
|
-
error[name] = validationResult;
|
|
24148
|
-
}
|
|
24149
|
-
}
|
|
24150
|
-
}
|
|
24151
|
-
if (!isEmptyObject(validationResult)) {
|
|
24152
|
-
error[name] = {
|
|
24153
|
-
ref: inputRef,
|
|
24154
|
-
...validationResult,
|
|
24155
|
-
};
|
|
24156
|
-
if (!validateAllFieldCriteria) {
|
|
24157
|
-
return error;
|
|
24158
|
-
}
|
|
24159
|
-
}
|
|
24160
|
-
}
|
|
24161
|
-
}
|
|
24162
|
-
setCustomValidity(true);
|
|
24163
|
-
return error;
|
|
24164
|
-
};
|
|
24165
|
-
|
|
24166
|
-
function baseGet(object, updatePath) {
|
|
24167
|
-
const length = updatePath.slice(0, -1).length;
|
|
24168
|
-
let index = 0;
|
|
24169
|
-
while (index < length) {
|
|
24170
|
-
object = isUndefined(object) ? index++ : object[updatePath[index++]];
|
|
24171
|
-
}
|
|
24172
|
-
return object;
|
|
24173
|
-
}
|
|
24174
|
-
function isEmptyArray(obj) {
|
|
24175
|
-
for (const key in obj) {
|
|
24176
|
-
if (obj.hasOwnProperty(key) && !isUndefined(obj[key])) {
|
|
24177
|
-
return false;
|
|
24178
|
-
}
|
|
24179
|
-
}
|
|
24180
|
-
return true;
|
|
24181
|
-
}
|
|
24182
|
-
function unset(object, path) {
|
|
24183
|
-
const paths = Array.isArray(path)
|
|
24184
|
-
? path
|
|
24185
|
-
: isKey(path)
|
|
24186
|
-
? [path]
|
|
24187
|
-
: stringToPath(path);
|
|
24188
|
-
const childObject = paths.length === 1 ? object : baseGet(object, paths);
|
|
24189
|
-
const index = paths.length - 1;
|
|
24190
|
-
const key = paths[index];
|
|
24191
|
-
if (childObject) {
|
|
24192
|
-
delete childObject[key];
|
|
24193
|
-
}
|
|
24194
|
-
if (index !== 0 &&
|
|
24195
|
-
((isObject$1(childObject) && isEmptyObject(childObject)) ||
|
|
24196
|
-
(Array.isArray(childObject) && isEmptyArray(childObject)))) {
|
|
24197
|
-
unset(object, paths.slice(0, -1));
|
|
24198
|
-
}
|
|
24199
|
-
return object;
|
|
24200
|
-
}
|
|
24201
|
-
|
|
24202
|
-
var createSubject = () => {
|
|
24203
|
-
let _observers = [];
|
|
24204
|
-
const next = (value) => {
|
|
24205
|
-
for (const observer of _observers) {
|
|
24206
|
-
observer.next && observer.next(value);
|
|
24207
|
-
}
|
|
24208
|
-
};
|
|
24209
|
-
const subscribe = (observer) => {
|
|
24210
|
-
_observers.push(observer);
|
|
24211
|
-
return {
|
|
24212
|
-
unsubscribe: () => {
|
|
24213
|
-
_observers = _observers.filter((o) => o !== observer);
|
|
24214
|
-
},
|
|
24215
|
-
};
|
|
24216
|
-
};
|
|
24217
|
-
const unsubscribe = () => {
|
|
24218
|
-
_observers = [];
|
|
24219
|
-
};
|
|
24220
|
-
return {
|
|
24221
|
-
get observers() {
|
|
24222
|
-
return _observers;
|
|
24223
|
-
},
|
|
24224
|
-
next,
|
|
24225
|
-
subscribe,
|
|
24226
|
-
unsubscribe,
|
|
24227
|
-
};
|
|
24228
|
-
};
|
|
24229
|
-
|
|
24230
|
-
var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);
|
|
24231
|
-
|
|
24232
|
-
function deepEqual(object1, object2) {
|
|
24233
|
-
if (isPrimitive(object1) || isPrimitive(object2)) {
|
|
24234
|
-
return object1 === object2;
|
|
24235
|
-
}
|
|
24236
|
-
if (isDateObject(object1) && isDateObject(object2)) {
|
|
24237
|
-
return object1.getTime() === object2.getTime();
|
|
24238
|
-
}
|
|
24239
|
-
const keys1 = Object.keys(object1);
|
|
24240
|
-
const keys2 = Object.keys(object2);
|
|
24241
|
-
if (keys1.length !== keys2.length) {
|
|
24242
|
-
return false;
|
|
24243
|
-
}
|
|
24244
|
-
for (const key of keys1) {
|
|
24245
|
-
const val1 = object1[key];
|
|
24246
|
-
if (!keys2.includes(key)) {
|
|
24247
|
-
return false;
|
|
24248
|
-
}
|
|
24249
|
-
if (key !== 'ref') {
|
|
24250
|
-
const val2 = object2[key];
|
|
24251
|
-
if ((isDateObject(val1) && isDateObject(val2)) ||
|
|
24252
|
-
(isObject$1(val1) && isObject$1(val2)) ||
|
|
24253
|
-
(Array.isArray(val1) && Array.isArray(val2))
|
|
24254
|
-
? !deepEqual(val1, val2)
|
|
24255
|
-
: val1 !== val2) {
|
|
24256
|
-
return false;
|
|
24257
|
-
}
|
|
24258
|
-
}
|
|
24259
|
-
}
|
|
24260
|
-
return true;
|
|
24261
|
-
}
|
|
24262
|
-
|
|
24263
|
-
var isMultipleSelect = (element) => element.type === `select-multiple`;
|
|
24264
|
-
|
|
24265
|
-
var isRadioOrCheckbox = (ref) => isRadioInput(ref) || isCheckBoxInput(ref);
|
|
24266
|
-
|
|
24267
|
-
var live = (ref) => isHTMLElement(ref) && ref.isConnected;
|
|
24268
|
-
|
|
24269
|
-
var objectHasFunction = (data) => {
|
|
24270
|
-
for (const key in data) {
|
|
24271
|
-
if (isFunction(data[key])) {
|
|
24272
|
-
return true;
|
|
24273
|
-
}
|
|
24274
|
-
}
|
|
24275
|
-
return false;
|
|
24276
|
-
};
|
|
24277
|
-
|
|
24278
|
-
function markFieldsDirty(data, fields = {}) {
|
|
24279
|
-
const isParentNodeArray = Array.isArray(data);
|
|
24280
|
-
if (isObject$1(data) || isParentNodeArray) {
|
|
24281
|
-
for (const key in data) {
|
|
24282
|
-
if (Array.isArray(data[key]) ||
|
|
24283
|
-
(isObject$1(data[key]) && !objectHasFunction(data[key]))) {
|
|
24284
|
-
fields[key] = Array.isArray(data[key]) ? [] : {};
|
|
24285
|
-
markFieldsDirty(data[key], fields[key]);
|
|
24286
|
-
}
|
|
24287
|
-
else if (!isNullOrUndefined(data[key])) {
|
|
24288
|
-
fields[key] = true;
|
|
24289
|
-
}
|
|
24290
|
-
}
|
|
24291
|
-
}
|
|
24292
|
-
return fields;
|
|
24293
|
-
}
|
|
24294
|
-
function getDirtyFieldsFromDefaultValues(data, formValues, dirtyFieldsFromValues) {
|
|
24295
|
-
const isParentNodeArray = Array.isArray(data);
|
|
24296
|
-
if (isObject$1(data) || isParentNodeArray) {
|
|
24297
|
-
for (const key in data) {
|
|
24298
|
-
if (Array.isArray(data[key]) ||
|
|
24299
|
-
(isObject$1(data[key]) && !objectHasFunction(data[key]))) {
|
|
24300
|
-
if (isUndefined(formValues) ||
|
|
24301
|
-
isPrimitive(dirtyFieldsFromValues[key])) {
|
|
24302
|
-
dirtyFieldsFromValues[key] = Array.isArray(data[key])
|
|
24303
|
-
? markFieldsDirty(data[key], [])
|
|
24304
|
-
: { ...markFieldsDirty(data[key]) };
|
|
24305
|
-
}
|
|
24306
|
-
else {
|
|
24307
|
-
getDirtyFieldsFromDefaultValues(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);
|
|
24308
|
-
}
|
|
24309
|
-
}
|
|
24310
|
-
else {
|
|
24311
|
-
dirtyFieldsFromValues[key] = !deepEqual(data[key], formValues[key]);
|
|
24312
|
-
}
|
|
24313
|
-
}
|
|
24314
|
-
}
|
|
24315
|
-
return dirtyFieldsFromValues;
|
|
24316
|
-
}
|
|
24317
|
-
var getDirtyFields = (defaultValues, formValues) => getDirtyFieldsFromDefaultValues(defaultValues, formValues, markFieldsDirty(formValues));
|
|
24318
|
-
|
|
24319
|
-
var getFieldValueAs = (value, { valueAsNumber, valueAsDate, setValueAs }) => isUndefined(value)
|
|
24320
|
-
? value
|
|
24321
|
-
: valueAsNumber
|
|
24322
|
-
? value === ''
|
|
24323
|
-
? NaN
|
|
24324
|
-
: value
|
|
24325
|
-
? +value
|
|
24326
|
-
: value
|
|
24327
|
-
: valueAsDate && isString(value)
|
|
24328
|
-
? new Date(value)
|
|
24329
|
-
: setValueAs
|
|
24330
|
-
? setValueAs(value)
|
|
24331
|
-
: value;
|
|
24332
|
-
|
|
24333
|
-
function getFieldValue(_f) {
|
|
24334
|
-
const ref = _f.ref;
|
|
24335
|
-
if (_f.refs ? _f.refs.every((ref) => ref.disabled) : ref.disabled) {
|
|
24336
|
-
return;
|
|
24337
|
-
}
|
|
24338
|
-
if (isFileInput(ref)) {
|
|
24339
|
-
return ref.files;
|
|
24340
|
-
}
|
|
24341
|
-
if (isRadioInput(ref)) {
|
|
24342
|
-
return getRadioValue(_f.refs).value;
|
|
24343
|
-
}
|
|
24344
|
-
if (isMultipleSelect(ref)) {
|
|
24345
|
-
return [...ref.selectedOptions].map(({ value }) => value);
|
|
24346
|
-
}
|
|
24347
|
-
if (isCheckBoxInput(ref)) {
|
|
24348
|
-
return getCheckboxValue(_f.refs).value;
|
|
24349
|
-
}
|
|
24350
|
-
return getFieldValueAs(isUndefined(ref.value) ? _f.ref.value : ref.value, _f);
|
|
24351
|
-
}
|
|
24352
|
-
|
|
24353
|
-
var getResolverOptions = (fieldsNames, _fields, criteriaMode, shouldUseNativeValidation) => {
|
|
24354
|
-
const fields = {};
|
|
24355
|
-
for (const name of fieldsNames) {
|
|
24356
|
-
const field = get(_fields, name);
|
|
24357
|
-
field && set(fields, name, field._f);
|
|
24358
|
-
}
|
|
24359
|
-
return {
|
|
24360
|
-
criteriaMode,
|
|
24361
|
-
names: [...fieldsNames],
|
|
24362
|
-
fields,
|
|
24363
|
-
shouldUseNativeValidation,
|
|
24364
|
-
};
|
|
24365
|
-
};
|
|
24366
|
-
|
|
24367
|
-
var getRuleValue = (rule) => isUndefined(rule)
|
|
24368
|
-
? rule
|
|
24369
|
-
: isRegex(rule)
|
|
24370
|
-
? rule.source
|
|
24371
|
-
: isObject$1(rule)
|
|
24372
|
-
? isRegex(rule.value)
|
|
24373
|
-
? rule.value.source
|
|
24374
|
-
: rule.value
|
|
24375
|
-
: rule;
|
|
24376
|
-
|
|
24377
|
-
var hasValidation = (options) => options.mount &&
|
|
24378
|
-
(options.required ||
|
|
24379
|
-
options.min ||
|
|
24380
|
-
options.max ||
|
|
24381
|
-
options.maxLength ||
|
|
24382
|
-
options.minLength ||
|
|
24383
|
-
options.pattern ||
|
|
24384
|
-
options.validate);
|
|
24385
|
-
|
|
24386
|
-
function schemaErrorLookup(errors, _fields, name) {
|
|
24387
|
-
const error = get(errors, name);
|
|
24388
|
-
if (error || isKey(name)) {
|
|
24389
|
-
return {
|
|
24390
|
-
error,
|
|
24391
|
-
name,
|
|
24392
|
-
};
|
|
24393
|
-
}
|
|
24394
|
-
const names = name.split('.');
|
|
24395
|
-
while (names.length) {
|
|
24396
|
-
const fieldName = names.join('.');
|
|
24397
|
-
const field = get(_fields, fieldName);
|
|
24398
|
-
const foundError = get(errors, fieldName);
|
|
24399
|
-
if (field && !Array.isArray(field) && name !== fieldName) {
|
|
24400
|
-
return { name };
|
|
24401
|
-
}
|
|
24402
|
-
if (foundError && foundError.type) {
|
|
24403
|
-
return {
|
|
24404
|
-
name: fieldName,
|
|
24405
|
-
error: foundError,
|
|
24406
|
-
};
|
|
24407
|
-
}
|
|
24408
|
-
names.pop();
|
|
24409
|
-
}
|
|
24410
|
-
return {
|
|
24411
|
-
name,
|
|
24412
|
-
};
|
|
24413
|
-
}
|
|
24414
|
-
|
|
24415
|
-
var skipValidation = (isBlurEvent, isTouched, isSubmitted, reValidateMode, mode) => {
|
|
24416
|
-
if (mode.isOnAll) {
|
|
24417
|
-
return false;
|
|
24418
|
-
}
|
|
24419
|
-
else if (!isSubmitted && mode.isOnTouch) {
|
|
24420
|
-
return !(isTouched || isBlurEvent);
|
|
24421
|
-
}
|
|
24422
|
-
else if (isSubmitted ? reValidateMode.isOnBlur : mode.isOnBlur) {
|
|
24423
|
-
return !isBlurEvent;
|
|
24424
|
-
}
|
|
24425
|
-
else if (isSubmitted ? reValidateMode.isOnChange : mode.isOnChange) {
|
|
24426
|
-
return isBlurEvent;
|
|
24427
|
-
}
|
|
24428
|
-
return true;
|
|
24429
|
-
};
|
|
24430
|
-
|
|
24431
|
-
var unsetEmptyArray = (ref, name) => !compact(get(ref, name)).length && unset(ref, name);
|
|
24432
|
-
|
|
24433
|
-
const defaultOptions$2 = {
|
|
24434
|
-
mode: VALIDATION_MODE.onSubmit,
|
|
24435
|
-
reValidateMode: VALIDATION_MODE.onChange,
|
|
24436
|
-
shouldFocusError: true,
|
|
24437
|
-
};
|
|
24438
|
-
function createFormControl(props = {}) {
|
|
24439
|
-
let _options = {
|
|
24440
|
-
...defaultOptions$2,
|
|
24441
|
-
...props,
|
|
24442
|
-
};
|
|
24443
|
-
let _formState = {
|
|
24444
|
-
submitCount: 0,
|
|
24445
|
-
isDirty: false,
|
|
24446
|
-
isLoading: isFunction(_options.defaultValues),
|
|
24447
|
-
isValidating: false,
|
|
24448
|
-
isSubmitted: false,
|
|
24449
|
-
isSubmitting: false,
|
|
24450
|
-
isSubmitSuccessful: false,
|
|
24451
|
-
isValid: false,
|
|
24452
|
-
touchedFields: {},
|
|
24453
|
-
dirtyFields: {},
|
|
24454
|
-
validatingFields: {},
|
|
24455
|
-
errors: _options.errors || {},
|
|
24456
|
-
disabled: _options.disabled || false,
|
|
24457
|
-
};
|
|
24458
|
-
let _fields = {};
|
|
24459
|
-
let _defaultValues = isObject$1(_options.defaultValues) || isObject$1(_options.values)
|
|
24460
|
-
? cloneObject(_options.defaultValues || _options.values) || {}
|
|
24461
|
-
: {};
|
|
24462
|
-
let _formValues = _options.shouldUnregister
|
|
24463
|
-
? {}
|
|
24464
|
-
: cloneObject(_defaultValues);
|
|
24465
|
-
let _state = {
|
|
24466
|
-
action: false,
|
|
24467
|
-
mount: false,
|
|
24468
|
-
watch: false,
|
|
24469
|
-
};
|
|
24470
|
-
let _names = {
|
|
24471
|
-
mount: new Set(),
|
|
24472
|
-
unMount: new Set(),
|
|
24473
|
-
array: new Set(),
|
|
24474
|
-
watch: new Set(),
|
|
24475
|
-
};
|
|
24476
|
-
let delayErrorCallback;
|
|
24477
|
-
let timer = 0;
|
|
24478
|
-
const _proxyFormState = {
|
|
24479
|
-
isDirty: false,
|
|
24480
|
-
dirtyFields: false,
|
|
24481
|
-
validatingFields: false,
|
|
24482
|
-
touchedFields: false,
|
|
24483
|
-
isValidating: false,
|
|
24484
|
-
isValid: false,
|
|
24485
|
-
errors: false,
|
|
24486
|
-
};
|
|
24487
|
-
const _subjects = {
|
|
24488
|
-
values: createSubject(),
|
|
24489
|
-
array: createSubject(),
|
|
24490
|
-
state: createSubject(),
|
|
24491
|
-
};
|
|
24492
|
-
const validationModeBeforeSubmit = getValidationModes(_options.mode);
|
|
24493
|
-
const validationModeAfterSubmit = getValidationModes(_options.reValidateMode);
|
|
24494
|
-
const shouldDisplayAllAssociatedErrors = _options.criteriaMode === VALIDATION_MODE.all;
|
|
24495
|
-
const debounce = (callback) => (wait) => {
|
|
24496
|
-
clearTimeout(timer);
|
|
24497
|
-
timer = setTimeout(callback, wait);
|
|
24498
|
-
};
|
|
24499
|
-
const _updateValid = async (shouldUpdateValid) => {
|
|
24500
|
-
if (_proxyFormState.isValid || shouldUpdateValid) {
|
|
24501
|
-
const isValid = _options.resolver
|
|
24502
|
-
? isEmptyObject((await _executeSchema()).errors)
|
|
24503
|
-
: await executeBuiltInValidation(_fields, true);
|
|
24504
|
-
if (isValid !== _formState.isValid) {
|
|
24505
|
-
_subjects.state.next({
|
|
24506
|
-
isValid,
|
|
24507
|
-
});
|
|
24508
|
-
}
|
|
24509
|
-
}
|
|
24510
|
-
};
|
|
24511
|
-
const _updateIsValidating = (names, isValidating) => {
|
|
24512
|
-
if (_proxyFormState.isValidating || _proxyFormState.validatingFields) {
|
|
24513
|
-
(names || Array.from(_names.mount)).forEach((name) => {
|
|
24514
|
-
if (name) {
|
|
24515
|
-
isValidating
|
|
24516
|
-
? set(_formState.validatingFields, name, isValidating)
|
|
24517
|
-
: unset(_formState.validatingFields, name);
|
|
24518
|
-
}
|
|
24519
|
-
});
|
|
24520
|
-
_subjects.state.next({
|
|
24521
|
-
validatingFields: _formState.validatingFields,
|
|
24522
|
-
isValidating: !isEmptyObject(_formState.validatingFields),
|
|
24523
|
-
});
|
|
24524
|
-
}
|
|
24525
|
-
};
|
|
24526
|
-
const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
|
|
24527
|
-
if (args && method) {
|
|
24528
|
-
_state.action = true;
|
|
24529
|
-
if (shouldUpdateFieldsAndState && Array.isArray(get(_fields, name))) {
|
|
24530
|
-
const fieldValues = method(get(_fields, name), args.argA, args.argB);
|
|
24531
|
-
shouldSetValues && set(_fields, name, fieldValues);
|
|
24532
|
-
}
|
|
24533
|
-
if (shouldUpdateFieldsAndState &&
|
|
24534
|
-
Array.isArray(get(_formState.errors, name))) {
|
|
24535
|
-
const errors = method(get(_formState.errors, name), args.argA, args.argB);
|
|
24536
|
-
shouldSetValues && set(_formState.errors, name, errors);
|
|
24537
|
-
unsetEmptyArray(_formState.errors, name);
|
|
24538
|
-
}
|
|
24539
|
-
if (_proxyFormState.touchedFields &&
|
|
24540
|
-
shouldUpdateFieldsAndState &&
|
|
24541
|
-
Array.isArray(get(_formState.touchedFields, name))) {
|
|
24542
|
-
const touchedFields = method(get(_formState.touchedFields, name), args.argA, args.argB);
|
|
24543
|
-
shouldSetValues && set(_formState.touchedFields, name, touchedFields);
|
|
24544
|
-
}
|
|
24545
|
-
if (_proxyFormState.dirtyFields) {
|
|
24546
|
-
_formState.dirtyFields = getDirtyFields(_defaultValues, _formValues);
|
|
24547
|
-
}
|
|
24548
|
-
_subjects.state.next({
|
|
24549
|
-
name,
|
|
24550
|
-
isDirty: _getDirty(name, values),
|
|
24551
|
-
dirtyFields: _formState.dirtyFields,
|
|
24552
|
-
errors: _formState.errors,
|
|
24553
|
-
isValid: _formState.isValid,
|
|
24554
|
-
});
|
|
24555
|
-
}
|
|
24556
|
-
else {
|
|
24557
|
-
set(_formValues, name, values);
|
|
24558
|
-
}
|
|
24559
|
-
};
|
|
24560
|
-
const updateErrors = (name, error) => {
|
|
24561
|
-
set(_formState.errors, name, error);
|
|
24562
|
-
_subjects.state.next({
|
|
24563
|
-
errors: _formState.errors,
|
|
24564
|
-
});
|
|
24565
|
-
};
|
|
24566
|
-
const _setErrors = (errors) => {
|
|
24567
|
-
_formState.errors = errors;
|
|
24568
|
-
_subjects.state.next({
|
|
24569
|
-
errors: _formState.errors,
|
|
24570
|
-
isValid: false,
|
|
24571
|
-
});
|
|
24572
|
-
};
|
|
24573
|
-
const updateValidAndValue = (name, shouldSkipSetValueAs, value, ref) => {
|
|
24574
|
-
const field = get(_fields, name);
|
|
24575
|
-
if (field) {
|
|
24576
|
-
const defaultValue = get(_formValues, name, isUndefined(value) ? get(_defaultValues, name) : value);
|
|
24577
|
-
isUndefined(defaultValue) ||
|
|
24578
|
-
(ref && ref.defaultChecked) ||
|
|
24579
|
-
shouldSkipSetValueAs
|
|
24580
|
-
? set(_formValues, name, shouldSkipSetValueAs ? defaultValue : getFieldValue(field._f))
|
|
24581
|
-
: setFieldValue(name, defaultValue);
|
|
24582
|
-
_state.mount && _updateValid();
|
|
24583
|
-
}
|
|
24584
|
-
};
|
|
24585
|
-
const updateTouchAndDirty = (name, fieldValue, isBlurEvent, shouldDirty, shouldRender) => {
|
|
24586
|
-
let shouldUpdateField = false;
|
|
24587
|
-
let isPreviousDirty = false;
|
|
24588
|
-
const output = {
|
|
24589
|
-
name,
|
|
24590
|
-
};
|
|
24591
|
-
const disabledField = !!(get(_fields, name) && get(_fields, name)._f.disabled);
|
|
24592
|
-
if (!isBlurEvent || shouldDirty) {
|
|
24593
|
-
if (_proxyFormState.isDirty) {
|
|
24594
|
-
isPreviousDirty = _formState.isDirty;
|
|
24595
|
-
_formState.isDirty = output.isDirty = _getDirty();
|
|
24596
|
-
shouldUpdateField = isPreviousDirty !== output.isDirty;
|
|
24597
|
-
}
|
|
24598
|
-
const isCurrentFieldPristine = disabledField || deepEqual(get(_defaultValues, name), fieldValue);
|
|
24599
|
-
isPreviousDirty = !!(!disabledField && get(_formState.dirtyFields, name));
|
|
24600
|
-
isCurrentFieldPristine || disabledField
|
|
24601
|
-
? unset(_formState.dirtyFields, name)
|
|
24602
|
-
: set(_formState.dirtyFields, name, true);
|
|
24603
|
-
output.dirtyFields = _formState.dirtyFields;
|
|
24604
|
-
shouldUpdateField =
|
|
24605
|
-
shouldUpdateField ||
|
|
24606
|
-
(_proxyFormState.dirtyFields &&
|
|
24607
|
-
isPreviousDirty !== !isCurrentFieldPristine);
|
|
24608
|
-
}
|
|
24609
|
-
if (isBlurEvent) {
|
|
24610
|
-
const isPreviousFieldTouched = get(_formState.touchedFields, name);
|
|
24611
|
-
if (!isPreviousFieldTouched) {
|
|
24612
|
-
set(_formState.touchedFields, name, isBlurEvent);
|
|
24613
|
-
output.touchedFields = _formState.touchedFields;
|
|
24614
|
-
shouldUpdateField =
|
|
24615
|
-
shouldUpdateField ||
|
|
24616
|
-
(_proxyFormState.touchedFields &&
|
|
24617
|
-
isPreviousFieldTouched !== isBlurEvent);
|
|
24618
|
-
}
|
|
24619
|
-
}
|
|
24620
|
-
shouldUpdateField && shouldRender && _subjects.state.next(output);
|
|
24621
|
-
return shouldUpdateField ? output : {};
|
|
24622
|
-
};
|
|
24623
|
-
const shouldRenderByError = (name, isValid, error, fieldState) => {
|
|
24624
|
-
const previousFieldError = get(_formState.errors, name);
|
|
24625
|
-
const shouldUpdateValid = _proxyFormState.isValid &&
|
|
24626
|
-
isBoolean(isValid) &&
|
|
24627
|
-
_formState.isValid !== isValid;
|
|
24628
|
-
if (props.delayError && error) {
|
|
24629
|
-
delayErrorCallback = debounce(() => updateErrors(name, error));
|
|
24630
|
-
delayErrorCallback(props.delayError);
|
|
24631
|
-
}
|
|
24632
|
-
else {
|
|
24633
|
-
clearTimeout(timer);
|
|
24634
|
-
delayErrorCallback = null;
|
|
24635
|
-
error
|
|
24636
|
-
? set(_formState.errors, name, error)
|
|
24637
|
-
: unset(_formState.errors, name);
|
|
24638
|
-
}
|
|
24639
|
-
if ((error ? !deepEqual(previousFieldError, error) : previousFieldError) ||
|
|
24640
|
-
!isEmptyObject(fieldState) ||
|
|
24641
|
-
shouldUpdateValid) {
|
|
24642
|
-
const updatedFormState = {
|
|
24643
|
-
...fieldState,
|
|
24644
|
-
...(shouldUpdateValid && isBoolean(isValid) ? { isValid } : {}),
|
|
24645
|
-
errors: _formState.errors,
|
|
24646
|
-
name,
|
|
24647
|
-
};
|
|
24648
|
-
_formState = {
|
|
24649
|
-
..._formState,
|
|
24650
|
-
...updatedFormState,
|
|
24651
|
-
};
|
|
24652
|
-
_subjects.state.next(updatedFormState);
|
|
24653
|
-
}
|
|
24654
|
-
};
|
|
24655
|
-
const _executeSchema = async (name) => {
|
|
24656
|
-
_updateIsValidating(name, true);
|
|
24657
|
-
const result = await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
|
|
24658
|
-
_updateIsValidating(name);
|
|
24659
|
-
return result;
|
|
24660
|
-
};
|
|
24661
|
-
const executeSchemaAndUpdateState = async (names) => {
|
|
24662
|
-
const { errors } = await _executeSchema(names);
|
|
24663
|
-
if (names) {
|
|
24664
|
-
for (const name of names) {
|
|
24665
|
-
const error = get(errors, name);
|
|
24666
|
-
error
|
|
24667
|
-
? set(_formState.errors, name, error)
|
|
24668
|
-
: unset(_formState.errors, name);
|
|
24669
|
-
}
|
|
24670
|
-
}
|
|
24671
|
-
else {
|
|
24672
|
-
_formState.errors = errors;
|
|
24673
|
-
}
|
|
24674
|
-
return errors;
|
|
24675
|
-
};
|
|
24676
|
-
const executeBuiltInValidation = async (fields, shouldOnlyCheckValid, context = {
|
|
24677
|
-
valid: true,
|
|
24678
|
-
}) => {
|
|
24679
|
-
for (const name in fields) {
|
|
24680
|
-
const field = fields[name];
|
|
24681
|
-
if (field) {
|
|
24682
|
-
const { _f, ...fieldValue } = field;
|
|
24683
|
-
if (_f) {
|
|
24684
|
-
const isFieldArrayRoot = _names.array.has(_f.name);
|
|
24685
|
-
_updateIsValidating([name], true);
|
|
24686
|
-
const fieldError = await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !shouldOnlyCheckValid, isFieldArrayRoot);
|
|
24687
|
-
_updateIsValidating([name]);
|
|
24688
|
-
if (fieldError[_f.name]) {
|
|
24689
|
-
context.valid = false;
|
|
24690
|
-
if (shouldOnlyCheckValid) {
|
|
24691
|
-
break;
|
|
24692
|
-
}
|
|
24693
|
-
}
|
|
24694
|
-
!shouldOnlyCheckValid &&
|
|
24695
|
-
(get(fieldError, _f.name)
|
|
24696
|
-
? isFieldArrayRoot
|
|
24697
|
-
? updateFieldArrayRootError(_formState.errors, fieldError, _f.name)
|
|
24698
|
-
: set(_formState.errors, _f.name, fieldError[_f.name])
|
|
24699
|
-
: unset(_formState.errors, _f.name));
|
|
24700
|
-
}
|
|
24701
|
-
fieldValue &&
|
|
24702
|
-
(await executeBuiltInValidation(fieldValue, shouldOnlyCheckValid, context));
|
|
24703
|
-
}
|
|
24704
|
-
}
|
|
24705
|
-
return context.valid;
|
|
24706
|
-
};
|
|
24707
|
-
const _removeUnmounted = () => {
|
|
24708
|
-
for (const name of _names.unMount) {
|
|
24709
|
-
const field = get(_fields, name);
|
|
24710
|
-
field &&
|
|
24711
|
-
(field._f.refs
|
|
24712
|
-
? field._f.refs.every((ref) => !live(ref))
|
|
24713
|
-
: !live(field._f.ref)) &&
|
|
24714
|
-
unregister(name);
|
|
24715
|
-
}
|
|
24716
|
-
_names.unMount = new Set();
|
|
24717
|
-
};
|
|
24718
|
-
const _getDirty = (name, data) => (name && data && set(_formValues, name, data),
|
|
24719
|
-
!deepEqual(getValues(), _defaultValues));
|
|
24720
|
-
const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
|
|
24721
|
-
...(_state.mount
|
|
24722
|
-
? _formValues
|
|
24723
|
-
: isUndefined(defaultValue)
|
|
24724
|
-
? _defaultValues
|
|
24725
|
-
: isString(names)
|
|
24726
|
-
? { [names]: defaultValue }
|
|
24727
|
-
: defaultValue),
|
|
24728
|
-
}, isGlobal, defaultValue);
|
|
24729
|
-
const _getFieldArray = (name) => compact(get(_state.mount ? _formValues : _defaultValues, name, props.shouldUnregister ? get(_defaultValues, name, []) : []));
|
|
24730
|
-
const setFieldValue = (name, value, options = {}) => {
|
|
24731
|
-
const field = get(_fields, name);
|
|
24732
|
-
let fieldValue = value;
|
|
24733
|
-
if (field) {
|
|
24734
|
-
const fieldReference = field._f;
|
|
24735
|
-
if (fieldReference) {
|
|
24736
|
-
!fieldReference.disabled &&
|
|
24737
|
-
set(_formValues, name, getFieldValueAs(value, fieldReference));
|
|
24738
|
-
fieldValue =
|
|
24739
|
-
isHTMLElement(fieldReference.ref) && isNullOrUndefined(value)
|
|
24740
|
-
? ''
|
|
24741
|
-
: value;
|
|
24742
|
-
if (isMultipleSelect(fieldReference.ref)) {
|
|
24743
|
-
[...fieldReference.ref.options].forEach((optionRef) => (optionRef.selected = fieldValue.includes(optionRef.value)));
|
|
24744
|
-
}
|
|
24745
|
-
else if (fieldReference.refs) {
|
|
24746
|
-
if (isCheckBoxInput(fieldReference.ref)) {
|
|
24747
|
-
fieldReference.refs.length > 1
|
|
24748
|
-
? fieldReference.refs.forEach((checkboxRef) => (!checkboxRef.defaultChecked || !checkboxRef.disabled) &&
|
|
24749
|
-
(checkboxRef.checked = Array.isArray(fieldValue)
|
|
24750
|
-
? !!fieldValue.find((data) => data === checkboxRef.value)
|
|
24751
|
-
: fieldValue === checkboxRef.value))
|
|
24752
|
-
: fieldReference.refs[0] &&
|
|
24753
|
-
(fieldReference.refs[0].checked = !!fieldValue);
|
|
24754
|
-
}
|
|
24755
|
-
else {
|
|
24756
|
-
fieldReference.refs.forEach((radioRef) => (radioRef.checked = radioRef.value === fieldValue));
|
|
24757
|
-
}
|
|
24758
|
-
}
|
|
24759
|
-
else if (isFileInput(fieldReference.ref)) {
|
|
24760
|
-
fieldReference.ref.value = '';
|
|
24761
|
-
}
|
|
24762
|
-
else {
|
|
24763
|
-
fieldReference.ref.value = fieldValue;
|
|
24764
|
-
if (!fieldReference.ref.type) {
|
|
24765
|
-
_subjects.values.next({
|
|
24766
|
-
name,
|
|
24767
|
-
values: { ..._formValues },
|
|
24768
|
-
});
|
|
24769
|
-
}
|
|
24770
|
-
}
|
|
24771
|
-
}
|
|
24772
|
-
}
|
|
24773
|
-
(options.shouldDirty || options.shouldTouch) &&
|
|
24774
|
-
updateTouchAndDirty(name, fieldValue, options.shouldTouch, options.shouldDirty, true);
|
|
24775
|
-
options.shouldValidate && trigger(name);
|
|
24776
|
-
};
|
|
24777
|
-
const setValues = (name, value, options) => {
|
|
24778
|
-
for (const fieldKey in value) {
|
|
24779
|
-
const fieldValue = value[fieldKey];
|
|
24780
|
-
const fieldName = `${name}.${fieldKey}`;
|
|
24781
|
-
const field = get(_fields, fieldName);
|
|
24782
|
-
(_names.array.has(name) ||
|
|
24783
|
-
!isPrimitive(fieldValue) ||
|
|
24784
|
-
(field && !field._f)) &&
|
|
24785
|
-
!isDateObject(fieldValue)
|
|
24786
|
-
? setValues(fieldName, fieldValue, options)
|
|
24787
|
-
: setFieldValue(fieldName, fieldValue, options);
|
|
24788
|
-
}
|
|
24789
|
-
};
|
|
24790
|
-
const setValue = (name, value, options = {}) => {
|
|
24791
|
-
const field = get(_fields, name);
|
|
24792
|
-
const isFieldArray = _names.array.has(name);
|
|
24793
|
-
const cloneValue = cloneObject(value);
|
|
24794
|
-
set(_formValues, name, cloneValue);
|
|
24795
|
-
if (isFieldArray) {
|
|
24796
|
-
_subjects.array.next({
|
|
24797
|
-
name,
|
|
24798
|
-
values: { ..._formValues },
|
|
24799
|
-
});
|
|
24800
|
-
if ((_proxyFormState.isDirty || _proxyFormState.dirtyFields) &&
|
|
24801
|
-
options.shouldDirty) {
|
|
24802
|
-
_subjects.state.next({
|
|
24803
|
-
name,
|
|
24804
|
-
dirtyFields: getDirtyFields(_defaultValues, _formValues),
|
|
24805
|
-
isDirty: _getDirty(name, cloneValue),
|
|
24806
|
-
});
|
|
24807
|
-
}
|
|
24808
|
-
}
|
|
24809
|
-
else {
|
|
24810
|
-
field && !field._f && !isNullOrUndefined(cloneValue)
|
|
24811
|
-
? setValues(name, cloneValue, options)
|
|
24812
|
-
: setFieldValue(name, cloneValue, options);
|
|
24813
|
-
}
|
|
24814
|
-
isWatched(name, _names) && _subjects.state.next({ ..._formState });
|
|
24815
|
-
_subjects.values.next({
|
|
24816
|
-
name: _state.mount ? name : undefined,
|
|
24817
|
-
values: { ..._formValues },
|
|
24818
|
-
});
|
|
24819
|
-
};
|
|
24820
|
-
const onChange = async (event) => {
|
|
24821
|
-
_state.mount = true;
|
|
24822
|
-
const target = event.target;
|
|
24823
|
-
let name = target.name;
|
|
24824
|
-
let isFieldValueUpdated = true;
|
|
24825
|
-
const field = get(_fields, name);
|
|
24826
|
-
const getCurrentFieldValue = () => target.type ? getFieldValue(field._f) : getEventValue(event);
|
|
24827
|
-
const _updateIsFieldValueUpdated = (fieldValue) => {
|
|
24828
|
-
isFieldValueUpdated =
|
|
24829
|
-
Number.isNaN(fieldValue) ||
|
|
24830
|
-
fieldValue === get(_formValues, name, fieldValue);
|
|
24831
|
-
};
|
|
24832
|
-
if (field) {
|
|
24833
|
-
let error;
|
|
24834
|
-
let isValid;
|
|
24835
|
-
const fieldValue = getCurrentFieldValue();
|
|
24836
|
-
const isBlurEvent = event.type === EVENTS.BLUR || event.type === EVENTS.FOCUS_OUT;
|
|
24837
|
-
const shouldSkipValidation = (!hasValidation(field._f) &&
|
|
24838
|
-
!_options.resolver &&
|
|
24839
|
-
!get(_formState.errors, name) &&
|
|
24840
|
-
!field._f.deps) ||
|
|
24841
|
-
skipValidation(isBlurEvent, get(_formState.touchedFields, name), _formState.isSubmitted, validationModeAfterSubmit, validationModeBeforeSubmit);
|
|
24842
|
-
const watched = isWatched(name, _names, isBlurEvent);
|
|
24843
|
-
set(_formValues, name, fieldValue);
|
|
24844
|
-
if (isBlurEvent) {
|
|
24845
|
-
field._f.onBlur && field._f.onBlur(event);
|
|
24846
|
-
delayErrorCallback && delayErrorCallback(0);
|
|
24847
|
-
}
|
|
24848
|
-
else if (field._f.onChange) {
|
|
24849
|
-
field._f.onChange(event);
|
|
24850
|
-
}
|
|
24851
|
-
const fieldState = updateTouchAndDirty(name, fieldValue, isBlurEvent, false);
|
|
24852
|
-
const shouldRender = !isEmptyObject(fieldState) || watched;
|
|
24853
|
-
!isBlurEvent &&
|
|
24854
|
-
_subjects.values.next({
|
|
24855
|
-
name,
|
|
24856
|
-
type: event.type,
|
|
24857
|
-
values: { ..._formValues },
|
|
24858
|
-
});
|
|
24859
|
-
if (shouldSkipValidation) {
|
|
24860
|
-
_proxyFormState.isValid && _updateValid();
|
|
24861
|
-
return (shouldRender &&
|
|
24862
|
-
_subjects.state.next({ name, ...(watched ? {} : fieldState) }));
|
|
24863
|
-
}
|
|
24864
|
-
!isBlurEvent && watched && _subjects.state.next({ ..._formState });
|
|
24865
|
-
if (_options.resolver) {
|
|
24866
|
-
const { errors } = await _executeSchema([name]);
|
|
24867
|
-
_updateIsFieldValueUpdated(fieldValue);
|
|
24868
|
-
if (isFieldValueUpdated) {
|
|
24869
|
-
const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);
|
|
24870
|
-
const errorLookupResult = schemaErrorLookup(errors, _fields, previousErrorLookupResult.name || name);
|
|
24871
|
-
error = errorLookupResult.error;
|
|
24872
|
-
name = errorLookupResult.name;
|
|
24873
|
-
isValid = isEmptyObject(errors);
|
|
24874
|
-
}
|
|
24875
|
-
}
|
|
24876
|
-
else {
|
|
24877
|
-
_updateIsValidating([name], true);
|
|
24878
|
-
error = (await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name];
|
|
24879
|
-
_updateIsValidating([name]);
|
|
24880
|
-
_updateIsFieldValueUpdated(fieldValue);
|
|
24881
|
-
if (isFieldValueUpdated) {
|
|
24882
|
-
if (error) {
|
|
24883
|
-
isValid = false;
|
|
24884
|
-
}
|
|
24885
|
-
else if (_proxyFormState.isValid) {
|
|
24886
|
-
isValid = await executeBuiltInValidation(_fields, true);
|
|
24887
|
-
}
|
|
24888
|
-
}
|
|
24889
|
-
}
|
|
24890
|
-
if (isFieldValueUpdated) {
|
|
24891
|
-
field._f.deps &&
|
|
24892
|
-
trigger(field._f.deps);
|
|
24893
|
-
shouldRenderByError(name, isValid, error, fieldState);
|
|
24894
|
-
}
|
|
24895
|
-
}
|
|
24896
|
-
};
|
|
24897
|
-
const _focusInput = (ref, key) => {
|
|
24898
|
-
if (get(_formState.errors, key) && ref.focus) {
|
|
24899
|
-
ref.focus();
|
|
24900
|
-
return 1;
|
|
24901
|
-
}
|
|
24902
|
-
return;
|
|
24903
|
-
};
|
|
24904
|
-
const trigger = async (name, options = {}) => {
|
|
24905
|
-
let isValid;
|
|
24906
|
-
let validationResult;
|
|
24907
|
-
const fieldNames = convertToArrayPayload(name);
|
|
24908
|
-
if (_options.resolver) {
|
|
24909
|
-
const errors = await executeSchemaAndUpdateState(isUndefined(name) ? name : fieldNames);
|
|
24910
|
-
isValid = isEmptyObject(errors);
|
|
24911
|
-
validationResult = name
|
|
24912
|
-
? !fieldNames.some((name) => get(errors, name))
|
|
24913
|
-
: isValid;
|
|
24914
|
-
}
|
|
24915
|
-
else if (name) {
|
|
24916
|
-
validationResult = (await Promise.all(fieldNames.map(async (fieldName) => {
|
|
24917
|
-
const field = get(_fields, fieldName);
|
|
24918
|
-
return await executeBuiltInValidation(field && field._f ? { [fieldName]: field } : field);
|
|
24919
|
-
}))).every(Boolean);
|
|
24920
|
-
!(!validationResult && !_formState.isValid) && _updateValid();
|
|
24921
|
-
}
|
|
24922
|
-
else {
|
|
24923
|
-
validationResult = isValid = await executeBuiltInValidation(_fields);
|
|
24924
|
-
}
|
|
24925
|
-
_subjects.state.next({
|
|
24926
|
-
...(!isString(name) ||
|
|
24927
|
-
(_proxyFormState.isValid && isValid !== _formState.isValid)
|
|
24928
|
-
? {}
|
|
24929
|
-
: { name }),
|
|
24930
|
-
...(_options.resolver || !name ? { isValid } : {}),
|
|
24931
|
-
errors: _formState.errors,
|
|
24932
|
-
});
|
|
24933
|
-
options.shouldFocus &&
|
|
24934
|
-
!validationResult &&
|
|
24935
|
-
iterateFieldsByAction(_fields, _focusInput, name ? fieldNames : _names.mount);
|
|
24936
|
-
return validationResult;
|
|
24937
|
-
};
|
|
24938
|
-
const getValues = (fieldNames) => {
|
|
24939
|
-
const values = {
|
|
24940
|
-
...(_state.mount ? _formValues : _defaultValues),
|
|
24941
|
-
};
|
|
24942
|
-
return isUndefined(fieldNames)
|
|
24943
|
-
? values
|
|
24944
|
-
: isString(fieldNames)
|
|
24945
|
-
? get(values, fieldNames)
|
|
24946
|
-
: fieldNames.map((name) => get(values, name));
|
|
24947
|
-
};
|
|
24948
|
-
const getFieldState = (name, formState) => ({
|
|
24949
|
-
invalid: !!get((formState || _formState).errors, name),
|
|
24950
|
-
isDirty: !!get((formState || _formState).dirtyFields, name),
|
|
24951
|
-
isTouched: !!get((formState || _formState).touchedFields, name),
|
|
24952
|
-
isValidating: !!get((formState || _formState).validatingFields, name),
|
|
24953
|
-
error: get((formState || _formState).errors, name),
|
|
24954
|
-
});
|
|
24955
|
-
const clearErrors = (name) => {
|
|
24956
|
-
name &&
|
|
24957
|
-
convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName));
|
|
24958
|
-
_subjects.state.next({
|
|
24959
|
-
errors: name ? _formState.errors : {},
|
|
24960
|
-
});
|
|
24961
|
-
};
|
|
24962
|
-
const setError = (name, error, options) => {
|
|
24963
|
-
const ref = (get(_fields, name, { _f: {} })._f || {}).ref;
|
|
24964
|
-
const currentError = get(_formState.errors, name) || {};
|
|
24965
|
-
// Don't override existing error messages elsewhere in the object tree.
|
|
24966
|
-
const { ref: currentRef, message, type, ...restOfErrorTree } = currentError;
|
|
24967
|
-
set(_formState.errors, name, {
|
|
24968
|
-
...restOfErrorTree,
|
|
24969
|
-
...error,
|
|
24970
|
-
ref,
|
|
24971
|
-
});
|
|
24972
|
-
_subjects.state.next({
|
|
24973
|
-
name,
|
|
24974
|
-
errors: _formState.errors,
|
|
24975
|
-
isValid: false,
|
|
24976
|
-
});
|
|
24977
|
-
options && options.shouldFocus && ref && ref.focus && ref.focus();
|
|
24978
|
-
};
|
|
24979
|
-
const watch = (name, defaultValue) => isFunction(name)
|
|
24980
|
-
? _subjects.values.subscribe({
|
|
24981
|
-
next: (payload) => name(_getWatch(undefined, defaultValue), payload),
|
|
24982
|
-
})
|
|
24983
|
-
: _getWatch(name, defaultValue, true);
|
|
24984
|
-
const unregister = (name, options = {}) => {
|
|
24985
|
-
for (const fieldName of name ? convertToArrayPayload(name) : _names.mount) {
|
|
24986
|
-
_names.mount.delete(fieldName);
|
|
24987
|
-
_names.array.delete(fieldName);
|
|
24988
|
-
if (!options.keepValue) {
|
|
24989
|
-
unset(_fields, fieldName);
|
|
24990
|
-
unset(_formValues, fieldName);
|
|
24991
|
-
}
|
|
24992
|
-
!options.keepError && unset(_formState.errors, fieldName);
|
|
24993
|
-
!options.keepDirty && unset(_formState.dirtyFields, fieldName);
|
|
24994
|
-
!options.keepTouched && unset(_formState.touchedFields, fieldName);
|
|
24995
|
-
!options.keepIsValidating &&
|
|
24996
|
-
unset(_formState.validatingFields, fieldName);
|
|
24997
|
-
!_options.shouldUnregister &&
|
|
24998
|
-
!options.keepDefaultValue &&
|
|
24999
|
-
unset(_defaultValues, fieldName);
|
|
25000
|
-
}
|
|
25001
|
-
_subjects.values.next({
|
|
25002
|
-
values: { ..._formValues },
|
|
25003
|
-
});
|
|
25004
|
-
_subjects.state.next({
|
|
25005
|
-
..._formState,
|
|
25006
|
-
...(!options.keepDirty ? {} : { isDirty: _getDirty() }),
|
|
25007
|
-
});
|
|
25008
|
-
!options.keepIsValid && _updateValid();
|
|
25009
|
-
};
|
|
25010
|
-
const _updateDisabledField = ({ disabled, name, field, fields, value, }) => {
|
|
25011
|
-
if ((isBoolean(disabled) && _state.mount) || !!disabled) {
|
|
25012
|
-
const inputValue = disabled
|
|
25013
|
-
? undefined
|
|
25014
|
-
: isUndefined(value)
|
|
25015
|
-
? getFieldValue(field ? field._f : get(fields, name)._f)
|
|
25016
|
-
: value;
|
|
25017
|
-
set(_formValues, name, inputValue);
|
|
25018
|
-
updateTouchAndDirty(name, inputValue, false, false, true);
|
|
25019
|
-
}
|
|
25020
|
-
};
|
|
25021
|
-
const register = (name, options = {}) => {
|
|
25022
|
-
let field = get(_fields, name);
|
|
25023
|
-
const disabledIsDefined = isBoolean(options.disabled);
|
|
25024
|
-
set(_fields, name, {
|
|
25025
|
-
...(field || {}),
|
|
25026
|
-
_f: {
|
|
25027
|
-
...(field && field._f ? field._f : { ref: { name } }),
|
|
25028
|
-
name,
|
|
25029
|
-
mount: true,
|
|
25030
|
-
...options,
|
|
25031
|
-
},
|
|
25032
|
-
});
|
|
25033
|
-
_names.mount.add(name);
|
|
25034
|
-
if (field) {
|
|
25035
|
-
_updateDisabledField({
|
|
25036
|
-
field,
|
|
25037
|
-
disabled: options.disabled,
|
|
25038
|
-
name,
|
|
25039
|
-
value: options.value,
|
|
25040
|
-
});
|
|
25041
|
-
}
|
|
25042
|
-
else {
|
|
25043
|
-
updateValidAndValue(name, true, options.value);
|
|
25044
|
-
}
|
|
25045
|
-
return {
|
|
25046
|
-
...(disabledIsDefined ? { disabled: options.disabled } : {}),
|
|
25047
|
-
...(_options.progressive
|
|
25048
|
-
? {
|
|
25049
|
-
required: !!options.required,
|
|
25050
|
-
min: getRuleValue(options.min),
|
|
25051
|
-
max: getRuleValue(options.max),
|
|
25052
|
-
minLength: getRuleValue(options.minLength),
|
|
25053
|
-
maxLength: getRuleValue(options.maxLength),
|
|
25054
|
-
pattern: getRuleValue(options.pattern),
|
|
25055
|
-
}
|
|
25056
|
-
: {}),
|
|
25057
|
-
name,
|
|
25058
|
-
onChange,
|
|
25059
|
-
onBlur: onChange,
|
|
25060
|
-
ref: (ref) => {
|
|
25061
|
-
if (ref) {
|
|
25062
|
-
register(name, options);
|
|
25063
|
-
field = get(_fields, name);
|
|
25064
|
-
const fieldRef = isUndefined(ref.value)
|
|
25065
|
-
? ref.querySelectorAll
|
|
25066
|
-
? ref.querySelectorAll('input,select,textarea')[0] || ref
|
|
25067
|
-
: ref
|
|
25068
|
-
: ref;
|
|
25069
|
-
const radioOrCheckbox = isRadioOrCheckbox(fieldRef);
|
|
25070
|
-
const refs = field._f.refs || [];
|
|
25071
|
-
if (radioOrCheckbox
|
|
25072
|
-
? refs.find((option) => option === fieldRef)
|
|
25073
|
-
: fieldRef === field._f.ref) {
|
|
25074
|
-
return;
|
|
25075
|
-
}
|
|
25076
|
-
set(_fields, name, {
|
|
25077
|
-
_f: {
|
|
25078
|
-
...field._f,
|
|
25079
|
-
...(radioOrCheckbox
|
|
25080
|
-
? {
|
|
25081
|
-
refs: [
|
|
25082
|
-
...refs.filter(live),
|
|
25083
|
-
fieldRef,
|
|
25084
|
-
...(Array.isArray(get(_defaultValues, name)) ? [{}] : []),
|
|
25085
|
-
],
|
|
25086
|
-
ref: { type: fieldRef.type, name },
|
|
25087
|
-
}
|
|
25088
|
-
: { ref: fieldRef }),
|
|
25089
|
-
},
|
|
25090
|
-
});
|
|
25091
|
-
updateValidAndValue(name, false, undefined, fieldRef);
|
|
25092
|
-
}
|
|
25093
|
-
else {
|
|
25094
|
-
field = get(_fields, name, {});
|
|
25095
|
-
if (field._f) {
|
|
25096
|
-
field._f.mount = false;
|
|
25097
|
-
}
|
|
25098
|
-
(_options.shouldUnregister || options.shouldUnregister) &&
|
|
25099
|
-
!(isNameInFieldArray(_names.array, name) && _state.action) &&
|
|
25100
|
-
_names.unMount.add(name);
|
|
25101
|
-
}
|
|
25102
|
-
},
|
|
25103
|
-
};
|
|
25104
|
-
};
|
|
25105
|
-
const _focusError = () => _options.shouldFocusError &&
|
|
25106
|
-
iterateFieldsByAction(_fields, _focusInput, _names.mount);
|
|
25107
|
-
const _disableForm = (disabled) => {
|
|
25108
|
-
if (isBoolean(disabled)) {
|
|
25109
|
-
_subjects.state.next({ disabled });
|
|
25110
|
-
iterateFieldsByAction(_fields, (ref, name) => {
|
|
25111
|
-
const currentField = get(_fields, name);
|
|
25112
|
-
if (currentField) {
|
|
25113
|
-
ref.disabled = currentField._f.disabled || disabled;
|
|
25114
|
-
if (Array.isArray(currentField._f.refs)) {
|
|
25115
|
-
currentField._f.refs.forEach((inputRef) => {
|
|
25116
|
-
inputRef.disabled = currentField._f.disabled || disabled;
|
|
25117
|
-
});
|
|
25118
|
-
}
|
|
25119
|
-
}
|
|
25120
|
-
}, 0, false);
|
|
25121
|
-
}
|
|
25122
|
-
};
|
|
25123
|
-
const handleSubmit = (onValid, onInvalid) => async (e) => {
|
|
25124
|
-
let onValidError = undefined;
|
|
25125
|
-
if (e) {
|
|
25126
|
-
e.preventDefault && e.preventDefault();
|
|
25127
|
-
e.persist && e.persist();
|
|
25128
|
-
}
|
|
25129
|
-
let fieldValues = cloneObject(_formValues);
|
|
25130
|
-
_subjects.state.next({
|
|
25131
|
-
isSubmitting: true,
|
|
25132
|
-
});
|
|
25133
|
-
if (_options.resolver) {
|
|
25134
|
-
const { errors, values } = await _executeSchema();
|
|
25135
|
-
_formState.errors = errors;
|
|
25136
|
-
fieldValues = values;
|
|
25137
|
-
}
|
|
25138
|
-
else {
|
|
25139
|
-
await executeBuiltInValidation(_fields);
|
|
25140
|
-
}
|
|
25141
|
-
unset(_formState.errors, 'root');
|
|
25142
|
-
if (isEmptyObject(_formState.errors)) {
|
|
25143
|
-
_subjects.state.next({
|
|
25144
|
-
errors: {},
|
|
25145
|
-
});
|
|
25146
|
-
try {
|
|
25147
|
-
await onValid(fieldValues, e);
|
|
25148
|
-
}
|
|
25149
|
-
catch (error) {
|
|
25150
|
-
onValidError = error;
|
|
25151
|
-
}
|
|
25152
|
-
}
|
|
25153
|
-
else {
|
|
25154
|
-
if (onInvalid) {
|
|
25155
|
-
await onInvalid({ ..._formState.errors }, e);
|
|
25156
|
-
}
|
|
25157
|
-
_focusError();
|
|
25158
|
-
setTimeout(_focusError);
|
|
25159
|
-
}
|
|
25160
|
-
_subjects.state.next({
|
|
25161
|
-
isSubmitted: true,
|
|
25162
|
-
isSubmitting: false,
|
|
25163
|
-
isSubmitSuccessful: isEmptyObject(_formState.errors) && !onValidError,
|
|
25164
|
-
submitCount: _formState.submitCount + 1,
|
|
25165
|
-
errors: _formState.errors,
|
|
25166
|
-
});
|
|
25167
|
-
if (onValidError) {
|
|
25168
|
-
throw onValidError;
|
|
25169
|
-
}
|
|
25170
|
-
};
|
|
25171
|
-
const resetField = (name, options = {}) => {
|
|
25172
|
-
if (get(_fields, name)) {
|
|
25173
|
-
if (isUndefined(options.defaultValue)) {
|
|
25174
|
-
setValue(name, cloneObject(get(_defaultValues, name)));
|
|
25175
|
-
}
|
|
25176
|
-
else {
|
|
25177
|
-
setValue(name, options.defaultValue);
|
|
25178
|
-
set(_defaultValues, name, cloneObject(options.defaultValue));
|
|
25179
|
-
}
|
|
25180
|
-
if (!options.keepTouched) {
|
|
25181
|
-
unset(_formState.touchedFields, name);
|
|
25182
|
-
}
|
|
25183
|
-
if (!options.keepDirty) {
|
|
25184
|
-
unset(_formState.dirtyFields, name);
|
|
25185
|
-
_formState.isDirty = options.defaultValue
|
|
25186
|
-
? _getDirty(name, cloneObject(get(_defaultValues, name)))
|
|
25187
|
-
: _getDirty();
|
|
25188
|
-
}
|
|
25189
|
-
if (!options.keepError) {
|
|
25190
|
-
unset(_formState.errors, name);
|
|
25191
|
-
_proxyFormState.isValid && _updateValid();
|
|
25192
|
-
}
|
|
25193
|
-
_subjects.state.next({ ..._formState });
|
|
25194
|
-
}
|
|
25195
|
-
};
|
|
25196
|
-
const _reset = (formValues, keepStateOptions = {}) => {
|
|
25197
|
-
const updatedValues = formValues ? cloneObject(formValues) : _defaultValues;
|
|
25198
|
-
const cloneUpdatedValues = cloneObject(updatedValues);
|
|
25199
|
-
const isEmptyResetValues = isEmptyObject(formValues);
|
|
25200
|
-
const values = isEmptyResetValues ? _defaultValues : cloneUpdatedValues;
|
|
25201
|
-
if (!keepStateOptions.keepDefaultValues) {
|
|
25202
|
-
_defaultValues = updatedValues;
|
|
25203
|
-
}
|
|
25204
|
-
if (!keepStateOptions.keepValues) {
|
|
25205
|
-
if (keepStateOptions.keepDirtyValues) {
|
|
25206
|
-
for (const fieldName of _names.mount) {
|
|
25207
|
-
get(_formState.dirtyFields, fieldName)
|
|
25208
|
-
? set(values, fieldName, get(_formValues, fieldName))
|
|
25209
|
-
: setValue(fieldName, get(values, fieldName));
|
|
25210
|
-
}
|
|
25211
|
-
}
|
|
25212
|
-
else {
|
|
25213
|
-
if (isWeb && isUndefined(formValues)) {
|
|
25214
|
-
for (const name of _names.mount) {
|
|
25215
|
-
const field = get(_fields, name);
|
|
25216
|
-
if (field && field._f) {
|
|
25217
|
-
const fieldReference = Array.isArray(field._f.refs)
|
|
25218
|
-
? field._f.refs[0]
|
|
25219
|
-
: field._f.ref;
|
|
25220
|
-
if (isHTMLElement(fieldReference)) {
|
|
25221
|
-
const form = fieldReference.closest('form');
|
|
25222
|
-
if (form) {
|
|
25223
|
-
form.reset();
|
|
25224
|
-
break;
|
|
25225
|
-
}
|
|
25226
|
-
}
|
|
25227
|
-
}
|
|
25228
|
-
}
|
|
25229
|
-
}
|
|
25230
|
-
_fields = {};
|
|
25231
|
-
}
|
|
25232
|
-
_formValues = props.shouldUnregister
|
|
25233
|
-
? keepStateOptions.keepDefaultValues
|
|
25234
|
-
? cloneObject(_defaultValues)
|
|
25235
|
-
: {}
|
|
25236
|
-
: cloneObject(values);
|
|
25237
|
-
_subjects.array.next({
|
|
25238
|
-
values: { ...values },
|
|
25239
|
-
});
|
|
25240
|
-
_subjects.values.next({
|
|
25241
|
-
values: { ...values },
|
|
25242
|
-
});
|
|
25243
|
-
}
|
|
25244
|
-
_names = {
|
|
25245
|
-
mount: keepStateOptions.keepDirtyValues ? _names.mount : new Set(),
|
|
25246
|
-
unMount: new Set(),
|
|
25247
|
-
array: new Set(),
|
|
25248
|
-
watch: new Set(),
|
|
25249
|
-
watchAll: false,
|
|
25250
|
-
focus: '',
|
|
25251
|
-
};
|
|
25252
|
-
_state.mount =
|
|
25253
|
-
!_proxyFormState.isValid ||
|
|
25254
|
-
!!keepStateOptions.keepIsValid ||
|
|
25255
|
-
!!keepStateOptions.keepDirtyValues;
|
|
25256
|
-
_state.watch = !!props.shouldUnregister;
|
|
25257
|
-
_subjects.state.next({
|
|
25258
|
-
submitCount: keepStateOptions.keepSubmitCount
|
|
25259
|
-
? _formState.submitCount
|
|
25260
|
-
: 0,
|
|
25261
|
-
isDirty: isEmptyResetValues
|
|
25262
|
-
? false
|
|
25263
|
-
: keepStateOptions.keepDirty
|
|
25264
|
-
? _formState.isDirty
|
|
25265
|
-
: !!(keepStateOptions.keepDefaultValues &&
|
|
25266
|
-
!deepEqual(formValues, _defaultValues)),
|
|
25267
|
-
isSubmitted: keepStateOptions.keepIsSubmitted
|
|
25268
|
-
? _formState.isSubmitted
|
|
25269
|
-
: false,
|
|
25270
|
-
dirtyFields: isEmptyResetValues
|
|
25271
|
-
? []
|
|
25272
|
-
: keepStateOptions.keepDirtyValues
|
|
25273
|
-
? keepStateOptions.keepDefaultValues && _formValues
|
|
25274
|
-
? getDirtyFields(_defaultValues, _formValues)
|
|
25275
|
-
: _formState.dirtyFields
|
|
25276
|
-
: keepStateOptions.keepDefaultValues && formValues
|
|
25277
|
-
? getDirtyFields(_defaultValues, formValues)
|
|
25278
|
-
: {},
|
|
25279
|
-
touchedFields: keepStateOptions.keepTouched
|
|
25280
|
-
? _formState.touchedFields
|
|
25281
|
-
: {},
|
|
25282
|
-
errors: keepStateOptions.keepErrors ? _formState.errors : {},
|
|
25283
|
-
isSubmitSuccessful: keepStateOptions.keepIsSubmitSuccessful
|
|
25284
|
-
? _formState.isSubmitSuccessful
|
|
25285
|
-
: false,
|
|
25286
|
-
isSubmitting: false,
|
|
25287
|
-
});
|
|
25288
|
-
};
|
|
25289
|
-
const reset = (formValues, keepStateOptions) => _reset(isFunction(formValues)
|
|
25290
|
-
? formValues(_formValues)
|
|
25291
|
-
: formValues, keepStateOptions);
|
|
25292
|
-
const setFocus = (name, options = {}) => {
|
|
25293
|
-
const field = get(_fields, name);
|
|
25294
|
-
const fieldReference = field && field._f;
|
|
25295
|
-
if (fieldReference) {
|
|
25296
|
-
const fieldRef = fieldReference.refs
|
|
25297
|
-
? fieldReference.refs[0]
|
|
25298
|
-
: fieldReference.ref;
|
|
25299
|
-
if (fieldRef.focus) {
|
|
25300
|
-
fieldRef.focus();
|
|
25301
|
-
options.shouldSelect && fieldRef.select();
|
|
25302
|
-
}
|
|
25303
|
-
}
|
|
25304
|
-
};
|
|
25305
|
-
const _updateFormState = (updatedFormState) => {
|
|
25306
|
-
_formState = {
|
|
25307
|
-
..._formState,
|
|
25308
|
-
...updatedFormState,
|
|
25309
|
-
};
|
|
25310
|
-
};
|
|
25311
|
-
const _resetDefaultValues = () => isFunction(_options.defaultValues) &&
|
|
25312
|
-
_options.defaultValues().then((values) => {
|
|
25313
|
-
reset(values, _options.resetOptions);
|
|
25314
|
-
_subjects.state.next({
|
|
25315
|
-
isLoading: false,
|
|
25316
|
-
});
|
|
25317
|
-
});
|
|
25318
|
-
return {
|
|
25319
|
-
control: {
|
|
25320
|
-
register,
|
|
25321
|
-
unregister,
|
|
25322
|
-
getFieldState,
|
|
25323
|
-
handleSubmit,
|
|
25324
|
-
setError,
|
|
25325
|
-
_executeSchema,
|
|
25326
|
-
_getWatch,
|
|
25327
|
-
_getDirty,
|
|
25328
|
-
_updateValid,
|
|
25329
|
-
_removeUnmounted,
|
|
25330
|
-
_updateFieldArray,
|
|
25331
|
-
_updateDisabledField,
|
|
25332
|
-
_getFieldArray,
|
|
25333
|
-
_reset,
|
|
25334
|
-
_resetDefaultValues,
|
|
25335
|
-
_updateFormState,
|
|
25336
|
-
_disableForm,
|
|
25337
|
-
_subjects,
|
|
25338
|
-
_proxyFormState,
|
|
25339
|
-
_setErrors,
|
|
25340
|
-
get _fields() {
|
|
25341
|
-
return _fields;
|
|
25342
|
-
},
|
|
25343
|
-
get _formValues() {
|
|
25344
|
-
return _formValues;
|
|
25345
|
-
},
|
|
25346
|
-
get _state() {
|
|
25347
|
-
return _state;
|
|
25348
|
-
},
|
|
25349
|
-
set _state(value) {
|
|
25350
|
-
_state = value;
|
|
25351
|
-
},
|
|
25352
|
-
get _defaultValues() {
|
|
25353
|
-
return _defaultValues;
|
|
25354
|
-
},
|
|
25355
|
-
get _names() {
|
|
25356
|
-
return _names;
|
|
25357
|
-
},
|
|
25358
|
-
set _names(value) {
|
|
25359
|
-
_names = value;
|
|
25360
|
-
},
|
|
25361
|
-
get _formState() {
|
|
25362
|
-
return _formState;
|
|
25363
|
-
},
|
|
25364
|
-
set _formState(value) {
|
|
25365
|
-
_formState = value;
|
|
25366
|
-
},
|
|
25367
|
-
get _options() {
|
|
25368
|
-
return _options;
|
|
25369
|
-
},
|
|
25370
|
-
set _options(value) {
|
|
25371
|
-
_options = {
|
|
25372
|
-
..._options,
|
|
25373
|
-
...value,
|
|
25374
|
-
};
|
|
25375
|
-
},
|
|
25376
|
-
},
|
|
25377
|
-
trigger,
|
|
25378
|
-
register,
|
|
25379
|
-
handleSubmit,
|
|
25380
|
-
watch,
|
|
25381
|
-
setValue,
|
|
25382
|
-
getValues,
|
|
25383
|
-
reset,
|
|
25384
|
-
resetField,
|
|
25385
|
-
clearErrors,
|
|
25386
|
-
unregister,
|
|
25387
|
-
setError,
|
|
25388
|
-
setFocus,
|
|
25389
|
-
getFieldState,
|
|
25390
|
-
};
|
|
25391
|
-
}
|
|
25392
|
-
|
|
25393
|
-
/**
|
|
25394
|
-
* Custom hook to manage the entire form.
|
|
25395
|
-
*
|
|
25396
|
-
* @remarks
|
|
25397
|
-
* [API](https://react-hook-form.com/docs/useform) • [Demo](https://codesandbox.io/s/react-hook-form-get-started-ts-5ksmm) • [Video](https://www.youtube.com/watch?v=RkXv4AXXC_4)
|
|
25398
|
-
*
|
|
25399
|
-
* @param props - form configuration and validation parameters.
|
|
25400
|
-
*
|
|
25401
|
-
* @returns methods - individual functions to manage the form state. {@link UseFormReturn}
|
|
25402
|
-
*
|
|
25403
|
-
* @example
|
|
25404
|
-
* ```tsx
|
|
25405
|
-
* function App() {
|
|
25406
|
-
* const { register, handleSubmit, watch, formState: { errors } } = useForm();
|
|
25407
|
-
* const onSubmit = data => console.log(data);
|
|
25408
|
-
*
|
|
25409
|
-
* console.log(watch("example"));
|
|
25410
|
-
*
|
|
25411
|
-
* return (
|
|
25412
|
-
* <form onSubmit={handleSubmit(onSubmit)}>
|
|
25413
|
-
* <input defaultValue="test" {...register("example")} />
|
|
25414
|
-
* <input {...register("exampleRequired", { required: true })} />
|
|
25415
|
-
* {errors.exampleRequired && <span>This field is required</span>}
|
|
25416
|
-
* <button>Submit</button>
|
|
25417
|
-
* </form>
|
|
25418
|
-
* );
|
|
25419
|
-
* }
|
|
25420
|
-
* ```
|
|
25421
|
-
*/
|
|
25422
|
-
function useForm(props = {}) {
|
|
25423
|
-
const _formControl = React$1.useRef();
|
|
25424
|
-
const _values = React$1.useRef();
|
|
25425
|
-
const [formState, updateFormState] = React$1.useState({
|
|
25426
|
-
isDirty: false,
|
|
25427
|
-
isValidating: false,
|
|
25428
|
-
isLoading: isFunction(props.defaultValues),
|
|
25429
|
-
isSubmitted: false,
|
|
25430
|
-
isSubmitting: false,
|
|
25431
|
-
isSubmitSuccessful: false,
|
|
25432
|
-
isValid: false,
|
|
25433
|
-
submitCount: 0,
|
|
25434
|
-
dirtyFields: {},
|
|
25435
|
-
touchedFields: {},
|
|
25436
|
-
validatingFields: {},
|
|
25437
|
-
errors: props.errors || {},
|
|
25438
|
-
disabled: props.disabled || false,
|
|
25439
|
-
defaultValues: isFunction(props.defaultValues)
|
|
25440
|
-
? undefined
|
|
25441
|
-
: props.defaultValues,
|
|
25442
|
-
});
|
|
25443
|
-
if (!_formControl.current) {
|
|
25444
|
-
_formControl.current = {
|
|
25445
|
-
...createFormControl(props),
|
|
25446
|
-
formState,
|
|
25447
|
-
};
|
|
25448
|
-
}
|
|
25449
|
-
const control = _formControl.current.control;
|
|
25450
|
-
control._options = props;
|
|
25451
|
-
useSubscribe({
|
|
25452
|
-
subject: control._subjects.state,
|
|
25453
|
-
next: (value) => {
|
|
25454
|
-
if (shouldRenderFormState(value, control._proxyFormState, control._updateFormState, true)) {
|
|
25455
|
-
updateFormState({ ...control._formState });
|
|
25456
|
-
}
|
|
25457
|
-
},
|
|
25458
|
-
});
|
|
25459
|
-
React$1.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]);
|
|
25460
|
-
React$1.useEffect(() => {
|
|
25461
|
-
if (control._proxyFormState.isDirty) {
|
|
25462
|
-
const isDirty = control._getDirty();
|
|
25463
|
-
if (isDirty !== formState.isDirty) {
|
|
25464
|
-
control._subjects.state.next({
|
|
25465
|
-
isDirty,
|
|
25466
|
-
});
|
|
25467
|
-
}
|
|
25468
|
-
}
|
|
25469
|
-
}, [control, formState.isDirty]);
|
|
25470
|
-
React$1.useEffect(() => {
|
|
25471
|
-
if (props.values && !deepEqual(props.values, _values.current)) {
|
|
25472
|
-
control._reset(props.values, control._options.resetOptions);
|
|
25473
|
-
_values.current = props.values;
|
|
25474
|
-
updateFormState((state) => ({ ...state }));
|
|
25475
|
-
}
|
|
25476
|
-
else {
|
|
25477
|
-
control._resetDefaultValues();
|
|
25478
|
-
}
|
|
25479
|
-
}, [props.values, control]);
|
|
25480
|
-
React$1.useEffect(() => {
|
|
25481
|
-
if (props.errors) {
|
|
25482
|
-
control._setErrors(props.errors);
|
|
25483
|
-
}
|
|
25484
|
-
}, [props.errors, control]);
|
|
25485
|
-
React$1.useEffect(() => {
|
|
25486
|
-
if (!control._state.mount) {
|
|
25487
|
-
control._updateValid();
|
|
25488
|
-
control._state.mount = true;
|
|
25489
|
-
}
|
|
25490
|
-
if (control._state.watch) {
|
|
25491
|
-
control._state.watch = false;
|
|
25492
|
-
control._subjects.state.next({ ...control._formState });
|
|
25493
|
-
}
|
|
25494
|
-
control._removeUnmounted();
|
|
25495
|
-
});
|
|
25496
|
-
React$1.useEffect(() => {
|
|
25497
|
-
props.shouldUnregister &&
|
|
25498
|
-
control._subjects.values.next({
|
|
25499
|
-
values: control._getWatch(),
|
|
25500
|
-
});
|
|
25501
|
-
}, [props.shouldUnregister, control]);
|
|
25502
|
-
_formControl.current.formState = getProxyFormState(formState, control);
|
|
25503
|
-
return _formControl.current;
|
|
25504
|
-
}
|
|
25505
|
-
|
|
25506
|
-
var s$1=function(s){var t=s.as,a=s.errors,m=s.name,o=s.message,i=s.render,l=function(e,r){if(null==e)return {};var n,s,t={},a=Object.keys(e);for(s=0;s<a.length;s++)r.indexOf(n=a[s])>=0||(t[n]=e[n]);return t}(s,["as","errors","name","message","render"]),f=useFormContext(),c=get(a||f.formState.errors,m);if(!c)return null;var g=c.message,u=c.types,d=Object.assign({},l,{children:g||o});return React__namespace.isValidElement(t)?React__namespace.cloneElement(t,d):i?i({message:g||o,messages:u}):React__namespace.createElement(t||React__namespace.Fragment,d)};
|
|
23881
|
+
var s=function(s){var t=s.as,a=s.errors,m=s.name,o=s.message,i=s.render,l=function(e,r){if(null==e)return {};var n,s,t={},a=Object.keys(e);for(s=0;s<a.length;s++)r.indexOf(n=a[s])>=0||(t[n]=e[n]);return t}(s,["as","errors","name","message","render"]),f=useFormContext(),c=get(a||f.formState.errors,m);if(!c)return null;var g=c.message,u=c.types,d=Object.assign({},l,{children:g||o});return React__namespace.isValidElement(t)?React__namespace.cloneElement(t,d):i?i({message:g||o,messages:u}):React__namespace.createElement(t||React__namespace.Fragment,d)};
|
|
25507
23882
|
|
|
25508
23883
|
// TODO: remove this export once ClassNameGenerator is stable
|
|
25509
23884
|
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
@@ -42466,7 +40841,7 @@ function MultiSelectV1({ props }) {
|
|
|
42466
40841
|
} }), jsxRuntimeExports.jsx(ListItemText, { primary: "Select All", sx: { fontSize: "5px" } })] })), (filterOptions === null || filterOptions === void 0 ? void 0 : filterOptions.length) !== 0 ? (filterOptions === null || filterOptions === void 0 ? void 0 : filterOptions.map((name) => {
|
|
42467
40842
|
var _a;
|
|
42468
40843
|
return (jsxRuntimeExports.jsxs(MenuItem, Object.assign({ value: name, sx: { zIndex: 0, fontSize: "5px !important" } }, { children: [jsxRuntimeExports.jsx(Checkbox, { checked: ((_a = extractValuesToArray(fieldValue)) === null || _a === void 0 ? void 0 : _a.indexOf(name)) > -1, size: "small" }), jsxRuntimeExports.jsx(ListItemText, { primary: name, sx: { fontSize: "5px" } })] }), name));
|
|
42469
|
-
})) : (jsxRuntimeExports.jsx(MenuItem, Object.assign({ disabled: true, value: "NA" }, { children: "No data Found" }), "NA"))] })), jsxRuntimeExports.jsx(s
|
|
40844
|
+
})) : (jsxRuntimeExports.jsx(MenuItem, Object.assign({ disabled: true, value: "NA" }, { children: "No data Found" }), "NA"))] })), jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name, render: ({ message }) => (jsxRuntimeExports.jsx(ErrorMessageComponent, { children: message })) })] })) }));
|
|
42470
40845
|
}
|
|
42471
40846
|
|
|
42472
40847
|
var dayjs_min = {exports: {}};
|
|
@@ -47383,6 +45758,7 @@ const DateRangePickerComponent = ({ props }) => {
|
|
|
47383
45758
|
setOpen(false);
|
|
47384
45759
|
}
|
|
47385
45760
|
}, [props.getValues('ToDate')]);
|
|
45761
|
+
console.log(props.getValues('ToDate'), 'props.getValues');
|
|
47386
45762
|
console.log(props.getValues('FromDate'), props.getValues('FromDate'), 'from date range picker');
|
|
47387
45763
|
const value = props.getValues('FromDate') && props.getValues('ToDate')
|
|
47388
45764
|
? `${props.getValues('FromDate')} - ${props.getValues('ToDate')}`
|
|
@@ -47393,7 +45769,7 @@ const DateRangePickerComponent = ({ props }) => {
|
|
|
47393
45769
|
"& .css-1holvmy, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
|
|
47394
45770
|
top: "-10px",
|
|
47395
45771
|
},
|
|
47396
|
-
} }, { children: [jsxRuntimeExports.jsx(TextField, { label: props.item.label, value: value, className: "read-only", inputRef: textRef, sx: { width: '100%', '& input': { cursor: 'pointer' } }, onClick: () => {
|
|
45772
|
+
} }, { children: [jsxRuntimeExports.jsx(TextField, { label: props.item.label, value: value || null, className: "read-only", inputRef: textRef, sx: { width: '100%', '& input': { cursor: 'pointer' } }, onClick: () => {
|
|
47397
45773
|
setOpen(true);
|
|
47398
45774
|
} }), open && (jsxRuntimeExports.jsx(Box, Object.assign({ sx: {
|
|
47399
45775
|
position: "absolute",
|
|
@@ -51638,7 +50014,7 @@ const SingleSelect = ({ props }) => {
|
|
|
51638
50014
|
},
|
|
51639
50015
|
}, getOptionLabel: (option) => option.label, renderInput: (params) => {
|
|
51640
50016
|
return (jsxRuntimeExports.jsx(Tooltip, Object.assign({ title: params.inputProps.value && params.inputProps.value }, { children: jsxRuntimeExports.jsx(TextField, Object.assign({}, params, { placeholder: props.item.Placeholder, label: props.item.label })) })));
|
|
51641
|
-
}, isOptionEqualToValue: isOptionEqualToValue })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50017
|
+
}, isOptionEqualToValue: isOptionEqualToValue })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
|
|
51642
50018
|
} }));
|
|
51643
50019
|
};
|
|
51644
50020
|
|
|
@@ -51655,7 +50031,7 @@ const PasswordField = ({ props }) => {
|
|
|
51655
50031
|
const handleTogglePasswordVisibility = () => {
|
|
51656
50032
|
setShowPassword((prevShowPassword) => !prevShowPassword);
|
|
51657
50033
|
};
|
|
51658
|
-
return (jsxRuntimeExports.jsxs(FormControl, Object.assign({ fullWidth: true }, { children: [" ", jsxRuntimeExports.jsx(Controller, { control: props.control, name: props.item.name, render: ({ field }) => (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsxs(Box, Object.assign({ sx: { position:
|
|
50034
|
+
return (jsxRuntimeExports.jsxs(FormControl, Object.assign({ fullWidth: true }, { children: [" ", jsxRuntimeExports.jsx(Controller, { control: props.control, name: props.item.name, render: ({ field }) => (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsxs(Box, Object.assign({ sx: { position: "relative" } }, { children: [" ", jsxRuntimeExports.jsx(TextField, Object.assign({ size: "small", type: showPassword ? "text" : "password" }, field, { label: props.item.label, sx: {
|
|
51659
50035
|
width: "100%",
|
|
51660
50036
|
"& .css-kichxs-MuiFormLabel-root-MuiInputLabel-root,.css-1holvmy": {
|
|
51661
50037
|
top: "-8px",
|
|
@@ -51665,7 +50041,17 @@ const PasswordField = ({ props }) => {
|
|
|
51665
50041
|
right: "14px",
|
|
51666
50042
|
top: "50%",
|
|
51667
50043
|
transform: "translateY(-50%)",
|
|
51668
|
-
}, "aria-label": "toggle password visibility", onClick: handleTogglePasswordVisibility, edge: "end" }, { children: showPassword ? (jsxRuntimeExports.jsx(Visibility, { sx: {
|
|
50044
|
+
}, "aria-label": "toggle password visibility", onClick: handleTogglePasswordVisibility, edge: "end" }, { children: showPassword ? (jsxRuntimeExports.jsx(Visibility, { sx: {
|
|
50045
|
+
fontSize: "12px",
|
|
50046
|
+
position: "absolute",
|
|
50047
|
+
top: "22%",
|
|
50048
|
+
right: 10,
|
|
50049
|
+
} })) : (jsxRuntimeExports.jsx(VisibilityOff, { sx: {
|
|
50050
|
+
fontSize: "12px",
|
|
50051
|
+
position: "absolute",
|
|
50052
|
+
top: "22%",
|
|
50053
|
+
right: 10,
|
|
50054
|
+
} })) }))] })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) })] })));
|
|
51669
50055
|
};
|
|
51670
50056
|
|
|
51671
50057
|
const Monthpickerrender = ({ props }) => {
|
|
@@ -51734,7 +50120,7 @@ const Monthpickerrender = ({ props }) => {
|
|
|
51734
50120
|
fontFamily: "Roboto-Reg",
|
|
51735
50121
|
fontSize: "11px",
|
|
51736
50122
|
color: "#3651d3",
|
|
51737
|
-
} }, { children: ["(", (_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.helperText, ")"] }))), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50123
|
+
} }, { children: ["(", (_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.helperText, ")"] }))), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
|
|
51738
50124
|
} }));
|
|
51739
50125
|
};
|
|
51740
50126
|
|
|
@@ -51764,7 +50150,7 @@ const DatepickerWrapperV2 = ({ props }) => {
|
|
|
51764
50150
|
// onFocus: () => inputTextRef.current?.blur(),
|
|
51765
50151
|
},
|
|
51766
50152
|
}, sx: {
|
|
51767
|
-
"& .css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root,.css-zy8vme,.css-1holvmy": {
|
|
50153
|
+
"& .css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root,.css-zy8vme,.css-1holvmy,.css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
|
|
51768
50154
|
top: "-10px !important",
|
|
51769
50155
|
},
|
|
51770
50156
|
"& input:hover": {
|
|
@@ -51774,7 +50160,7 @@ const DatepickerWrapperV2 = ({ props }) => {
|
|
|
51774
50160
|
fontFamily: "Roboto-Reg",
|
|
51775
50161
|
fontSize: "11px",
|
|
51776
50162
|
color: "#3651d3",
|
|
51777
|
-
} }, { children: ["(", (_d = props === null || props === void 0 ? void 0 : props.item) === null || _d === void 0 ? void 0 : _d.helperText, ")"] }))), !(props === null || props === void 0 ? void 0 : props.getValues(props.item.name)) && (jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50163
|
+
} }, { children: ["(", (_d = props === null || props === void 0 ? void 0 : props.item) === null || _d === void 0 ? void 0 : _d.helperText, ")"] }))), !(props === null || props === void 0 ? void 0 : props.getValues(props.item.name)) && (jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) }))] }));
|
|
51778
50164
|
} }));
|
|
51779
50165
|
};
|
|
51780
50166
|
|
|
@@ -51795,7 +50181,7 @@ const FormRenderFileUpload = ({ props }) => {
|
|
|
51795
50181
|
[props.item.name]: file,
|
|
51796
50182
|
[props.item.name + "Name"]: fileName,
|
|
51797
50183
|
});
|
|
51798
|
-
}, sx: { width: "100%" } }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50184
|
+
}, sx: { width: "100%" } }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
|
|
51799
50185
|
};
|
|
51800
50186
|
|
|
51801
50187
|
const useStyles = makeStyles((theme) => ({
|
|
@@ -51818,7 +50204,7 @@ const SingleSelectNonAutoComplete = ({ props }) => {
|
|
|
51818
50204
|
fontSize: "11px",
|
|
51819
50205
|
fontFamily: "Roboto-Reg",
|
|
51820
50206
|
zIndex: 2000,
|
|
51821
|
-
}, value: item.value }, { children: item.label })))) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50207
|
+
}, value: item.value }, { children: item.label })))) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })));
|
|
51822
50208
|
};
|
|
51823
50209
|
|
|
51824
50210
|
function formatDateMonthAndYear(date) {
|
|
@@ -51865,11 +50251,11 @@ const RenderForm = (props) => {
|
|
|
51865
50251
|
},
|
|
51866
50252
|
},
|
|
51867
50253
|
// classes={{ option: { color: "red !important" } }}
|
|
51868
|
-
value: field.value || "", disabled: props.item.disable })), ((_a = props === null || props === void 0 ? void 0 : props.item) === null || _a === void 0 ? void 0 : _a.helperText) && (jsxRuntimeExports.jsxs("span", Object.assign({ style: {
|
|
50254
|
+
value: field.value || "", size: "small", disabled: props.item.disable })), ((_a = props === null || props === void 0 ? void 0 : props.item) === null || _a === void 0 ? void 0 : _a.helperText) && (jsxRuntimeExports.jsxs("span", Object.assign({ style: {
|
|
51869
50255
|
fontFamily: "Roboto-Reg",
|
|
51870
50256
|
fontSize: "11px",
|
|
51871
50257
|
color: "#3651d3",
|
|
51872
|
-
} }, { children: ["(", (_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.helperText, ")"] }))), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50258
|
+
} }, { children: ["(", (_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.helperText, ")"] }))), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
|
|
51873
50259
|
} }) }));
|
|
51874
50260
|
case "register-number":
|
|
51875
50261
|
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(Controller, { control: props.control, name: props.item.name, render: ({ field }) => {
|
|
@@ -51880,7 +50266,9 @@ const RenderForm = (props) => {
|
|
|
51880
50266
|
border: "none",
|
|
51881
50267
|
},
|
|
51882
50268
|
}, onInput: (e) => {
|
|
51883
|
-
e.target.value = e.target.value
|
|
50269
|
+
e.target.value = e.target.value
|
|
50270
|
+
.replace(/\s/g, "")
|
|
50271
|
+
.replace(/[^a-zA-Z0-9!@#$%^&*()_+{}\[\]:;<>,.?/~`|\\-]/g, "");
|
|
51884
50272
|
}, sx: {
|
|
51885
50273
|
fontFamily: "Roboto-Reg",
|
|
51886
50274
|
"& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
|
|
@@ -51908,7 +50296,7 @@ const RenderForm = (props) => {
|
|
|
51908
50296
|
fontFamily: "Roboto-Reg",
|
|
51909
50297
|
fontSize: "11px",
|
|
51910
50298
|
color: "#3651d3",
|
|
51911
|
-
} }, { children: ["(", (_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.helperText, ")"] }))), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50299
|
+
} }, { children: ["(", (_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.helperText, ")"] }))), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
|
|
51912
50300
|
} }) }));
|
|
51913
50301
|
case "password":
|
|
51914
50302
|
return (jsxRuntimeExports.jsx(Box, Object.assign({ position: "relative" }, { children: jsxRuntimeExports.jsx(PasswordField, { props: props }) })));
|
|
@@ -51924,10 +50312,11 @@ const RenderForm = (props) => {
|
|
|
51924
50312
|
// );
|
|
51925
50313
|
case "number":
|
|
51926
50314
|
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(Controller, { control: props.control, name: props.item.name, render: ({ field }) => {
|
|
51927
|
-
return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(TextField, Object.assign({}, field, { label: props.item.label, value: props.getValues(props.item.name) || "", defaultValue: props.getValues(props.item.name) || null, onInput: (e) => {
|
|
50315
|
+
return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(TextField, Object.assign({}, field, { size: "small", label: props.item.label, value: props.getValues(props.item.name) || "", defaultValue: props.getValues(props.item.name) || null, onInput: (e) => {
|
|
51928
50316
|
var _a, _b;
|
|
51929
50317
|
e.target.value = e.target.value.replace(/[^0-9]/g, "");
|
|
51930
|
-
((_a = props === null || props === void 0 ? void 0 : props.item) === null || _a === void 0 ? void 0 : _a.onChangeFn) &&
|
|
50318
|
+
((_a = props === null || props === void 0 ? void 0 : props.item) === null || _a === void 0 ? void 0 : _a.onChangeFn) &&
|
|
50319
|
+
((_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.onChangeFn(e.target.value));
|
|
51931
50320
|
(props === null || props === void 0 ? void 0 : props.clearErrors) && (props === null || props === void 0 ? void 0 : props.clearErrors(props.item.name));
|
|
51932
50321
|
}, sx: {
|
|
51933
50322
|
"& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root,.css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
|
|
@@ -51936,7 +50325,7 @@ const RenderForm = (props) => {
|
|
|
51936
50325
|
}, inputProps: {
|
|
51937
50326
|
pattern: "[0-9]*",
|
|
51938
50327
|
maxLength: props.item.maxLength || 20,
|
|
51939
|
-
}, disabled: props.item.disable })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50328
|
+
}, disabled: props.item.disable })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
|
|
51940
50329
|
} }) }));
|
|
51941
50330
|
case "decimal":
|
|
51942
50331
|
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(Controller, { name: props.item.name, control: props.control, disabled: (_b = props.item) === null || _b === void 0 ? void 0 : _b.disable, render: ({ field }) => (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(TextField, Object.assign({ type: "text", size: "small", label: props.item.label }, field, { onChange: (e) => (props === null || props === void 0 ? void 0 : props.clearErrors) && (props === null || props === void 0 ? void 0 : props.clearErrors(props.item.name)), sx: {
|
|
@@ -51964,7 +50353,7 @@ const RenderForm = (props) => {
|
|
|
51964
50353
|
pattern: "[1-9]",
|
|
51965
50354
|
maxLength: 7,
|
|
51966
50355
|
},
|
|
51967
|
-
} })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50356
|
+
} })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }) }));
|
|
51968
50357
|
// case "alpha-numerical":
|
|
51969
50358
|
// return (
|
|
51970
50359
|
// <>
|
|
@@ -52173,12 +50562,12 @@ const RenderForm = (props) => {
|
|
|
52173
50562
|
},
|
|
52174
50563
|
}, label: props.item.label, views: ["year"], value: dayjs(field.value), onChange: (date) => field.onChange(date), slots: {
|
|
52175
50564
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
52176
|
-
textField: (textFieldProps) => jsxRuntimeExports.jsx(TextField, Object.assign({}, textFieldProps, { fullWidth: true, disabled: props.item.disable || false, InputLabelProps: {
|
|
50565
|
+
textField: (textFieldProps) => (jsxRuntimeExports.jsx(TextField, Object.assign({}, textFieldProps, { fullWidth: true, disabled: props.item.disable || false, InputLabelProps: {
|
|
52177
50566
|
shrink: true,
|
|
52178
50567
|
}, error: props.errors, inputProps: {
|
|
52179
50568
|
min: props.item.minDate,
|
|
52180
|
-
} }))
|
|
52181
|
-
} }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50569
|
+
} }))),
|
|
50570
|
+
} }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }) }));
|
|
52182
50571
|
case "dateRangePicker":
|
|
52183
50572
|
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(DateRangePickerComponent, { props: props }) }));
|
|
52184
50573
|
case "monthpicker":
|
|
@@ -52222,7 +50611,7 @@ const RenderForm = (props) => {
|
|
|
52222
50611
|
},
|
|
52223
50612
|
}, minRows: props.item.minRows || 1,
|
|
52224
50613
|
// maxRows={2}
|
|
52225
|
-
placeholder: props.item.placeholder || "Type Something..." }, field, { label: props.item.label, value: field.value || "", disabled: props.item.disable })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50614
|
+
placeholder: props.item.placeholder || "Type Something..." }, field, { label: props.item.label, value: field.value || "", disabled: props.item.disable })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }) }));
|
|
52226
50615
|
// case "textarea-normal":
|
|
52227
50616
|
// return (
|
|
52228
50617
|
// <>
|
|
@@ -52296,9 +50685,86 @@ const RenderForm = (props) => {
|
|
|
52296
50685
|
// </ErrorMessageComponent>
|
|
52297
50686
|
// </>
|
|
52298
50687
|
// );
|
|
50688
|
+
default:
|
|
50689
|
+
return jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {});
|
|
52299
50690
|
}
|
|
52300
50691
|
};
|
|
52301
50692
|
|
|
50693
|
+
const customTheme = createTheme({
|
|
50694
|
+
breakpoints: {
|
|
50695
|
+
values: {
|
|
50696
|
+
xs: 0,
|
|
50697
|
+
sm: 600,
|
|
50698
|
+
md: 900,
|
|
50699
|
+
lg: 1200,
|
|
50700
|
+
xl: 1536,
|
|
50701
|
+
},
|
|
50702
|
+
},
|
|
50703
|
+
typography: {
|
|
50704
|
+
fontFamily: 'Roboto-Reg'
|
|
50705
|
+
},
|
|
50706
|
+
palette: {
|
|
50707
|
+
// primary: {
|
|
50708
|
+
// // main: 'linear-gradient(135deg, #6379c3 0%, #546ee5 60%)',
|
|
50709
|
+
// },
|
|
50710
|
+
// secondary: {
|
|
50711
|
+
// main: 'linear-gradient(135deg, #6379c3 0%, #546ee5 60%)',
|
|
50712
|
+
// },
|
|
50713
|
+
},
|
|
50714
|
+
components: {
|
|
50715
|
+
MuiInputLabel: {
|
|
50716
|
+
styleOverrides: {
|
|
50717
|
+
root: {
|
|
50718
|
+
fontSize: '12px',
|
|
50719
|
+
},
|
|
50720
|
+
},
|
|
50721
|
+
},
|
|
50722
|
+
MuiInputBase: {
|
|
50723
|
+
styleOverrides: {
|
|
50724
|
+
root: {
|
|
50725
|
+
fontSize: '12px',
|
|
50726
|
+
input: {
|
|
50727
|
+
padding: '6.38px 14px',
|
|
50728
|
+
}
|
|
50729
|
+
}
|
|
50730
|
+
}
|
|
50731
|
+
},
|
|
50732
|
+
MuiRadio: {
|
|
50733
|
+
styleOverrides: {
|
|
50734
|
+
root: {
|
|
50735
|
+
padding: '4px 4px 0 8px'
|
|
50736
|
+
}
|
|
50737
|
+
}
|
|
50738
|
+
},
|
|
50739
|
+
MuiSelect: {
|
|
50740
|
+
styleOverrides: {
|
|
50741
|
+
select: {
|
|
50742
|
+
padding: '6.38px 32px 6.38px 14px'
|
|
50743
|
+
}
|
|
50744
|
+
}
|
|
50745
|
+
},
|
|
50746
|
+
MuiButton: {
|
|
50747
|
+
styleOverrides: {
|
|
50748
|
+
root: {
|
|
50749
|
+
fontFamily: 'Roboto-Reg',
|
|
50750
|
+
textTransform: 'none'
|
|
50751
|
+
}
|
|
50752
|
+
}
|
|
50753
|
+
}
|
|
50754
|
+
}
|
|
50755
|
+
});
|
|
50756
|
+
|
|
50757
|
+
const FormRenderWrapper = ({ formArray, name, numberOfColumns = 3, form, }) => {
|
|
50758
|
+
// const formContext=useFormControl({
|
|
50759
|
+
// })
|
|
50760
|
+
// useEffect(() => {
|
|
50761
|
+
// // form.reset(initialValues, { resolver: yupResolver(validationSchema) });
|
|
50762
|
+
// }, [formArray, validationSchema, initialValues]);
|
|
50763
|
+
return (jsxRuntimeExports.jsx(ThemeProvider, Object.assign({ theme: customTheme }, { children: jsxRuntimeExports.jsx(FormComponent, Object.assign({ container: true, margin: "auto" }, { children: formArray.map((item, i) => {
|
|
50764
|
+
return (jsxRuntimeExports.jsx(Formitem, Object.assign({ container: true, sx: item.CustomProps, noOfColumn: item.numberOfColumns || numberOfColumns }, { children: jsxRuntimeExports.jsx(RenderForm, { item: item, register: form.register, control: form.control, errors: form.formState.errors, getValues: form.getValues, clearErrors: form.clearErrors, setValue: form.setValue }) }), i));
|
|
50765
|
+
}) })) })));
|
|
50766
|
+
};
|
|
50767
|
+
|
|
52302
50768
|
/**
|
|
52303
50769
|
* Based on Kendo UI Core expression code <https://github.com/telerik/kendo-ui-core#license-information>
|
|
52304
50770
|
*/
|
|
@@ -54536,11 +53002,7 @@ class ObjectSchema extends Schema {
|
|
|
54536
53002
|
}
|
|
54537
53003
|
create$3.prototype = ObjectSchema.prototype;
|
|
54538
53004
|
|
|
54539
|
-
|
|
54540
|
-
|
|
54541
|
-
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)}}}
|
|
54542
|
-
|
|
54543
|
-
const FormRenderWrapper = ({ formArray, name, setFormFunctions, numberOfColumns = 3 }) => {
|
|
53005
|
+
const useFormValidatingContext = (formArray) => {
|
|
54544
53006
|
const initialValues = {};
|
|
54545
53007
|
const validationShape = {};
|
|
54546
53008
|
formArray.forEach((field) => {
|
|
@@ -54563,7 +53025,7 @@ const FormRenderWrapper = ({ formArray, name, setFormFunctions, numberOfColumns
|
|
|
54563
53025
|
}
|
|
54564
53026
|
break;
|
|
54565
53027
|
case "password":
|
|
54566
|
-
initialValues[field.name] =
|
|
53028
|
+
initialValues[field.name] = "";
|
|
54567
53029
|
if (field.required) {
|
|
54568
53030
|
validationShape[field.name] = create$5()
|
|
54569
53031
|
.nullable()
|
|
@@ -54582,9 +53044,40 @@ const FormRenderWrapper = ({ formArray, name, setFormFunctions, numberOfColumns
|
|
|
54582
53044
|
case "multiselect":
|
|
54583
53045
|
initialValues[field.name] = null;
|
|
54584
53046
|
if (field.required) {
|
|
54585
|
-
validationShape[field.name] = validationShape[field.name] =
|
|
54586
|
-
|
|
54587
|
-
|
|
53047
|
+
validationShape[field.name] = validationShape[field.name] =
|
|
53048
|
+
create$6()
|
|
53049
|
+
.typeError(`Select atleast one ${field.label}`)
|
|
53050
|
+
.required(field.errorMessage);
|
|
53051
|
+
}
|
|
53052
|
+
break;
|
|
53053
|
+
case "datepicker":
|
|
53054
|
+
initialValues[field.name] = null;
|
|
53055
|
+
if (field.required) {
|
|
53056
|
+
validationShape[field.name] = validationShape[field.name] =
|
|
53057
|
+
create$6()
|
|
53058
|
+
.typeError(`Select ${field.label}`)
|
|
53059
|
+
.required(field.errorMessage);
|
|
53060
|
+
}
|
|
53061
|
+
break;
|
|
53062
|
+
case "dateRangePicker":
|
|
53063
|
+
const today = new Date();
|
|
53064
|
+
const day = String(today.getDate()).padStart(2, "0");
|
|
53065
|
+
const month = String(today.getMonth() + 1).padStart(2, "0"); // January is 0!
|
|
53066
|
+
const year = today.getFullYear();
|
|
53067
|
+
const formattedDate = `${day}/${month}/${year}`;
|
|
53068
|
+
const threeMonthsAgo = new Date(today);
|
|
53069
|
+
threeMonthsAgo.setMonth(today.getMonth() - 3);
|
|
53070
|
+
const dayBeforeThreeMonths = String(threeMonthsAgo.getDate()).padStart(2, "0");
|
|
53071
|
+
const monthBeforeThreeMonths = String(threeMonthsAgo.getMonth() + 1).padStart(2, "0"); // January is 0!
|
|
53072
|
+
const yearBeforeThreeMonths = threeMonthsAgo.getFullYear();
|
|
53073
|
+
const formattedDateForThreeMonths = `${dayBeforeThreeMonths}/${monthBeforeThreeMonths}/${yearBeforeThreeMonths}`;
|
|
53074
|
+
initialValues["FromDate"] = formattedDateForThreeMonths;
|
|
53075
|
+
initialValues["ToDate"] = formattedDate;
|
|
53076
|
+
if (field.required) {
|
|
53077
|
+
validationShape[field.name] = validationShape[field.name] =
|
|
53078
|
+
create$6()
|
|
53079
|
+
.typeError(`Select ${field.label}`)
|
|
53080
|
+
.required(field.errorMessage);
|
|
54588
53081
|
}
|
|
54589
53082
|
break;
|
|
54590
53083
|
default:
|
|
@@ -54596,37 +53089,10 @@ const FormRenderWrapper = ({ formArray, name, setFormFunctions, numberOfColumns
|
|
|
54596
53089
|
}
|
|
54597
53090
|
});
|
|
54598
53091
|
const validationSchema = create$3().shape(validationShape);
|
|
54599
|
-
|
|
54600
|
-
defaultValues: initialValues,
|
|
54601
|
-
resolver: o(validationSchema),
|
|
54602
|
-
});
|
|
54603
|
-
React$1.useEffect(() => {
|
|
54604
|
-
setFormFunctions({
|
|
54605
|
-
handleSubmit,
|
|
54606
|
-
setValue,
|
|
54607
|
-
clearErrors,
|
|
54608
|
-
watch,
|
|
54609
|
-
control,
|
|
54610
|
-
getValues,
|
|
54611
|
-
reset,
|
|
54612
|
-
});
|
|
54613
|
-
}, [
|
|
54614
|
-
handleSubmit,
|
|
54615
|
-
setFormFunctions,
|
|
54616
|
-
setValue,
|
|
54617
|
-
watch,
|
|
54618
|
-
register,
|
|
54619
|
-
control,
|
|
54620
|
-
errors,
|
|
54621
|
-
getValues,
|
|
54622
|
-
reset,
|
|
54623
|
-
clearErrors,
|
|
54624
|
-
]);
|
|
54625
|
-
return jsxRuntimeExports.jsx(FormComponent, Object.assign({ container: true, margin: "auto" }, { children: formArray.map((item, i) => {
|
|
54626
|
-
return (jsxRuntimeExports.jsx(Formitem, Object.assign({ container: true, sx: item.CustomProps, noOfColumn: item.numberOfColumns || numberOfColumns }, { children: jsxRuntimeExports.jsx(RenderForm, { item: item, register: register, control: control, errors: errors, getValues: getValues, clearErrors: clearErrors, setValue: setValue }) }), i));
|
|
54627
|
-
}) }));
|
|
53092
|
+
return { validationSchema, initialValues };
|
|
54628
53093
|
};
|
|
54629
53094
|
|
|
54630
53095
|
exports.Button = Button$1;
|
|
54631
53096
|
exports.RenderForm = FormRenderWrapper;
|
|
53097
|
+
exports.useFormValidatingContext = useFormValidatingContext;
|
|
54632
53098
|
//# sourceMappingURL=index.js.map
|