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.esm.js
CHANGED
|
@@ -4935,6 +4935,41 @@ if (process.env.NODE_ENV !== 'production') {
|
|
|
4935
4935
|
ThemeContext$1.displayName = 'EmotionThemeContext';
|
|
4936
4936
|
}
|
|
4937
4937
|
|
|
4938
|
+
var getTheme = function getTheme(outerTheme, theme) {
|
|
4939
|
+
if (typeof theme === 'function') {
|
|
4940
|
+
var mergedTheme = theme(outerTheme);
|
|
4941
|
+
|
|
4942
|
+
if (process.env.NODE_ENV !== 'production' && (mergedTheme == null || typeof mergedTheme !== 'object' || Array.isArray(mergedTheme))) {
|
|
4943
|
+
throw new Error('[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!');
|
|
4944
|
+
}
|
|
4945
|
+
|
|
4946
|
+
return mergedTheme;
|
|
4947
|
+
}
|
|
4948
|
+
|
|
4949
|
+
if (process.env.NODE_ENV !== 'production' && (theme == null || typeof theme !== 'object' || Array.isArray(theme))) {
|
|
4950
|
+
throw new Error('[ThemeProvider] Please make your theme prop a plain object');
|
|
4951
|
+
}
|
|
4952
|
+
|
|
4953
|
+
return _extends$1({}, outerTheme, theme);
|
|
4954
|
+
};
|
|
4955
|
+
|
|
4956
|
+
var createCacheWithTheme = /* #__PURE__ */weakMemoize(function (outerTheme) {
|
|
4957
|
+
return weakMemoize(function (theme) {
|
|
4958
|
+
return getTheme(outerTheme, theme);
|
|
4959
|
+
});
|
|
4960
|
+
});
|
|
4961
|
+
var ThemeProvider = function ThemeProvider(props) {
|
|
4962
|
+
var theme = React$1.useContext(ThemeContext$1);
|
|
4963
|
+
|
|
4964
|
+
if (props.theme !== theme) {
|
|
4965
|
+
theme = createCacheWithTheme(theme)(props.theme);
|
|
4966
|
+
}
|
|
4967
|
+
|
|
4968
|
+
return /*#__PURE__*/React$1.createElement(ThemeContext$1.Provider, {
|
|
4969
|
+
value: theme
|
|
4970
|
+
}, props.children);
|
|
4971
|
+
};
|
|
4972
|
+
|
|
4938
4973
|
var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';
|
|
4939
4974
|
var labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';
|
|
4940
4975
|
|
|
@@ -10762,7 +10797,7 @@ function isElement(node) {
|
|
|
10762
10797
|
return node instanceof OwnElement || node instanceof Element;
|
|
10763
10798
|
}
|
|
10764
10799
|
|
|
10765
|
-
function isHTMLElement$
|
|
10800
|
+
function isHTMLElement$1(node) {
|
|
10766
10801
|
var OwnElement = getWindow(node).HTMLElement;
|
|
10767
10802
|
return node instanceof OwnElement || node instanceof HTMLElement;
|
|
10768
10803
|
}
|
|
@@ -10786,7 +10821,7 @@ function applyStyles(_ref) {
|
|
|
10786
10821
|
var attributes = state.attributes[name] || {};
|
|
10787
10822
|
var element = state.elements[name]; // arrow is optional + virtual elements
|
|
10788
10823
|
|
|
10789
|
-
if (!isHTMLElement$
|
|
10824
|
+
if (!isHTMLElement$1(element) || !getNodeName(element)) {
|
|
10790
10825
|
return;
|
|
10791
10826
|
} // Flow doesn't support to extend this property, but it's the most
|
|
10792
10827
|
// effective way to apply styles to an HTMLElement
|
|
@@ -10838,7 +10873,7 @@ function effect$2(_ref2) {
|
|
|
10838
10873
|
return style;
|
|
10839
10874
|
}, {}); // arrow is optional + virtual elements
|
|
10840
10875
|
|
|
10841
|
-
if (!isHTMLElement$
|
|
10876
|
+
if (!isHTMLElement$1(element) || !getNodeName(element)) {
|
|
10842
10877
|
return;
|
|
10843
10878
|
}
|
|
10844
10879
|
|
|
@@ -10897,7 +10932,7 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy) {
|
|
|
10897
10932
|
var scaleX = 1;
|
|
10898
10933
|
var scaleY = 1;
|
|
10899
10934
|
|
|
10900
|
-
if (includeScale && isHTMLElement$
|
|
10935
|
+
if (includeScale && isHTMLElement$1(element)) {
|
|
10901
10936
|
scaleX = element.offsetWidth > 0 ? round$1(clientRect.width) / element.offsetWidth || 1 : 1;
|
|
10902
10937
|
scaleY = element.offsetHeight > 0 ? round$1(clientRect.height) / element.offsetHeight || 1 : 1;
|
|
10903
10938
|
}
|
|
@@ -11002,7 +11037,7 @@ function getParentNode(element) {
|
|
|
11002
11037
|
}
|
|
11003
11038
|
|
|
11004
11039
|
function getTrueOffsetParent(element) {
|
|
11005
|
-
if (!isHTMLElement$
|
|
11040
|
+
if (!isHTMLElement$1(element) || // https://github.com/popperjs/popper-core/issues/837
|
|
11006
11041
|
getComputedStyle(element).position === 'fixed') {
|
|
11007
11042
|
return null;
|
|
11008
11043
|
}
|
|
@@ -11016,7 +11051,7 @@ function getContainingBlock(element) {
|
|
|
11016
11051
|
var isFirefox = /firefox/i.test(getUAString());
|
|
11017
11052
|
var isIE = /Trident/i.test(getUAString());
|
|
11018
11053
|
|
|
11019
|
-
if (isIE && isHTMLElement$
|
|
11054
|
+
if (isIE && isHTMLElement$1(element)) {
|
|
11020
11055
|
// In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
|
|
11021
11056
|
var elementCss = getComputedStyle(element);
|
|
11022
11057
|
|
|
@@ -11031,7 +11066,7 @@ function getContainingBlock(element) {
|
|
|
11031
11066
|
currentNode = currentNode.host;
|
|
11032
11067
|
}
|
|
11033
11068
|
|
|
11034
|
-
while (isHTMLElement$
|
|
11069
|
+
while (isHTMLElement$1(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {
|
|
11035
11070
|
var css = getComputedStyle(currentNode); // This is non-exhaustive but covers the most common CSS properties that
|
|
11036
11071
|
// create a containing block.
|
|
11037
11072
|
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
@@ -11501,7 +11536,7 @@ function getScrollParent(node) {
|
|
|
11501
11536
|
return node.ownerDocument.body;
|
|
11502
11537
|
}
|
|
11503
11538
|
|
|
11504
|
-
if (isHTMLElement$
|
|
11539
|
+
if (isHTMLElement$1(node) && isScrollParent(node)) {
|
|
11505
11540
|
return node;
|
|
11506
11541
|
}
|
|
11507
11542
|
|
|
@@ -11563,7 +11598,7 @@ function getClientRectFromMixedType(element, clippingParent, strategy) {
|
|
|
11563
11598
|
function getClippingParents(element) {
|
|
11564
11599
|
var clippingParents = listScrollParents(getParentNode(element));
|
|
11565
11600
|
var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle(element).position) >= 0;
|
|
11566
|
-
var clipperElement = canEscapeClipping && isHTMLElement$
|
|
11601
|
+
var clipperElement = canEscapeClipping && isHTMLElement$1(element) ? getOffsetParent(element) : element;
|
|
11567
11602
|
|
|
11568
11603
|
if (!isElement(clipperElement)) {
|
|
11569
11604
|
return [];
|
|
@@ -12175,7 +12210,7 @@ function getHTMLElementScroll(element) {
|
|
|
12175
12210
|
}
|
|
12176
12211
|
|
|
12177
12212
|
function getNodeScroll(node) {
|
|
12178
|
-
if (node === getWindow(node) || !isHTMLElement$
|
|
12213
|
+
if (node === getWindow(node) || !isHTMLElement$1(node)) {
|
|
12179
12214
|
return getWindowScroll(node);
|
|
12180
12215
|
} else {
|
|
12181
12216
|
return getHTMLElementScroll(node);
|
|
@@ -12196,8 +12231,8 @@ function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
|
|
|
12196
12231
|
isFixed = false;
|
|
12197
12232
|
}
|
|
12198
12233
|
|
|
12199
|
-
var isOffsetParentAnElement = isHTMLElement$
|
|
12200
|
-
var offsetParentIsScaled = isHTMLElement$
|
|
12234
|
+
var isOffsetParentAnElement = isHTMLElement$1(offsetParent);
|
|
12235
|
+
var offsetParentIsScaled = isHTMLElement$1(offsetParent) && isElementScaled(offsetParent);
|
|
12201
12236
|
var documentElement = getDocumentElement(offsetParent);
|
|
12202
12237
|
var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled, isFixed);
|
|
12203
12238
|
var scroll = {
|
|
@@ -12215,7 +12250,7 @@ function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
|
|
|
12215
12250
|
scroll = getNodeScroll(offsetParent);
|
|
12216
12251
|
}
|
|
12217
12252
|
|
|
12218
|
-
if (isHTMLElement$
|
|
12253
|
+
if (isHTMLElement$1(offsetParent)) {
|
|
12219
12254
|
offsets = getBoundingClientRect(offsetParent, true);
|
|
12220
12255
|
offsets.x += offsetParent.clientLeft;
|
|
12221
12256
|
offsets.y += offsetParent.clientTop;
|
|
@@ -12527,11 +12562,11 @@ function flipPlacement(placement, direction) {
|
|
|
12527
12562
|
function resolveAnchorEl$1(anchorEl) {
|
|
12528
12563
|
return typeof anchorEl === 'function' ? anchorEl() : anchorEl;
|
|
12529
12564
|
}
|
|
12530
|
-
function isHTMLElement
|
|
12565
|
+
function isHTMLElement(element) {
|
|
12531
12566
|
return element.nodeType !== undefined;
|
|
12532
12567
|
}
|
|
12533
12568
|
function isVirtualElement(element) {
|
|
12534
|
-
return !isHTMLElement
|
|
12569
|
+
return !isHTMLElement(element);
|
|
12535
12570
|
}
|
|
12536
12571
|
const useUtilityClasses$U = () => {
|
|
12537
12572
|
const slots = {
|
|
@@ -12593,7 +12628,7 @@ const PopperTooltip = /*#__PURE__*/React$1.forwardRef(function PopperTooltip(pro
|
|
|
12593
12628
|
setPlacement(data.placement);
|
|
12594
12629
|
};
|
|
12595
12630
|
if (process.env.NODE_ENV !== 'production') {
|
|
12596
|
-
if (resolvedAnchorElement && isHTMLElement
|
|
12631
|
+
if (resolvedAnchorElement && isHTMLElement(resolvedAnchorElement) && resolvedAnchorElement.nodeType === 1) {
|
|
12597
12632
|
const box = resolvedAnchorElement.getBoundingClientRect();
|
|
12598
12633
|
if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
|
|
12599
12634
|
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'));
|
|
@@ -12710,7 +12745,7 @@ const Popper$1 = /*#__PURE__*/React$1.forwardRef(function Popper(props, forwarde
|
|
|
12710
12745
|
container = containerProp;
|
|
12711
12746
|
} else if (anchorEl) {
|
|
12712
12747
|
const resolvedAnchorEl = resolveAnchorEl$1(anchorEl);
|
|
12713
|
-
container = resolvedAnchorEl && isHTMLElement
|
|
12748
|
+
container = resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) ? ownerDocument(resolvedAnchorEl).body : ownerDocument(null).body;
|
|
12714
12749
|
}
|
|
12715
12750
|
const display = !open && keepMounted && (!transition || exited) ? 'none' : undefined;
|
|
12716
12751
|
const transitionProps = transition ? {
|
|
@@ -12761,7 +12796,7 @@ process.env.NODE_ENV !== "production" ? Popper$1.propTypes /* remove-proptypes *
|
|
|
12761
12796
|
anchorEl: chainPropTypes(PropTypes.oneOfType([HTMLElementType, PropTypes.object, PropTypes.func]), props => {
|
|
12762
12797
|
if (props.open) {
|
|
12763
12798
|
const resolvedAnchorEl = resolveAnchorEl$1(props.anchorEl);
|
|
12764
|
-
if (resolvedAnchorEl && isHTMLElement
|
|
12799
|
+
if (resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) && resolvedAnchorEl.nodeType === 1) {
|
|
12765
12800
|
const box = resolvedAnchorEl.getBoundingClientRect();
|
|
12766
12801
|
if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {
|
|
12767
12802
|
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'));
|
|
@@ -23438,15 +23473,6 @@ const VALIDATION_MODE = {
|
|
|
23438
23473
|
onTouched: 'onTouched',
|
|
23439
23474
|
all: 'all',
|
|
23440
23475
|
};
|
|
23441
|
-
const INPUT_VALIDATION_RULES = {
|
|
23442
|
-
max: 'max',
|
|
23443
|
-
min: 'min',
|
|
23444
|
-
maxLength: 'maxLength',
|
|
23445
|
-
minLength: 'minLength',
|
|
23446
|
-
pattern: 'pattern',
|
|
23447
|
-
required: 'required',
|
|
23448
|
-
validate: 'validate',
|
|
23449
|
-
};
|
|
23450
23476
|
|
|
23451
23477
|
const HookFormContext = React__default.createContext(null);
|
|
23452
23478
|
/**
|
|
@@ -23508,7 +23534,7 @@ var shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, is
|
|
|
23508
23534
|
return (isEmptyObject(formState) ||
|
|
23509
23535
|
Object.keys(formState).length >= Object.keys(_proxyFormState).length ||
|
|
23510
23536
|
Object.keys(formState).find((key) => _proxyFormState[key] ===
|
|
23511
|
-
(!isRoot
|
|
23537
|
+
(!isRoot )));
|
|
23512
23538
|
};
|
|
23513
23539
|
|
|
23514
23540
|
var convertToArrayPayload = (value) => (Array.isArray(value) ? value : [value]);
|
|
@@ -23609,13 +23635,11 @@ var isString = (value) => typeof value === 'string';
|
|
|
23609
23635
|
|
|
23610
23636
|
var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) => {
|
|
23611
23637
|
if (isString(names)) {
|
|
23612
|
-
isGlobal && _names.watch.add(names);
|
|
23613
23638
|
return get(formValues, names, defaultValue);
|
|
23614
23639
|
}
|
|
23615
23640
|
if (Array.isArray(names)) {
|
|
23616
|
-
return names.map((fieldName) => (
|
|
23641
|
+
return names.map((fieldName) => (get(formValues, fieldName)));
|
|
23617
23642
|
}
|
|
23618
|
-
isGlobal && (_names.watchAll = true);
|
|
23619
23643
|
return formValues;
|
|
23620
23644
|
};
|
|
23621
23645
|
|
|
@@ -23834,1656 +23858,7 @@ function useController(props) {
|
|
|
23834
23858
|
*/
|
|
23835
23859
|
const Controller = (props) => props.render(useController(props));
|
|
23836
23860
|
|
|
23837
|
-
var
|
|
23838
|
-
? {
|
|
23839
|
-
...errors[name],
|
|
23840
|
-
types: {
|
|
23841
|
-
...(errors[name] && errors[name].types ? errors[name].types : {}),
|
|
23842
|
-
[type]: message || true,
|
|
23843
|
-
},
|
|
23844
|
-
}
|
|
23845
|
-
: {};
|
|
23846
|
-
|
|
23847
|
-
var getValidationModes = (mode) => ({
|
|
23848
|
-
isOnSubmit: !mode || mode === VALIDATION_MODE.onSubmit,
|
|
23849
|
-
isOnBlur: mode === VALIDATION_MODE.onBlur,
|
|
23850
|
-
isOnChange: mode === VALIDATION_MODE.onChange,
|
|
23851
|
-
isOnAll: mode === VALIDATION_MODE.all,
|
|
23852
|
-
isOnTouch: mode === VALIDATION_MODE.onTouched,
|
|
23853
|
-
});
|
|
23854
|
-
|
|
23855
|
-
var isWatched = (name, _names, isBlurEvent) => !isBlurEvent &&
|
|
23856
|
-
(_names.watchAll ||
|
|
23857
|
-
_names.watch.has(name) ||
|
|
23858
|
-
[..._names.watch].some((watchName) => name.startsWith(watchName) &&
|
|
23859
|
-
/^\.\w+/.test(name.slice(watchName.length))));
|
|
23860
|
-
|
|
23861
|
-
const iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => {
|
|
23862
|
-
for (const key of fieldsNames || Object.keys(fields)) {
|
|
23863
|
-
const field = get(fields, key);
|
|
23864
|
-
if (field) {
|
|
23865
|
-
const { _f, ...currentField } = field;
|
|
23866
|
-
if (_f) {
|
|
23867
|
-
if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) {
|
|
23868
|
-
break;
|
|
23869
|
-
}
|
|
23870
|
-
else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) {
|
|
23871
|
-
break;
|
|
23872
|
-
}
|
|
23873
|
-
else {
|
|
23874
|
-
iterateFieldsByAction(currentField, action);
|
|
23875
|
-
}
|
|
23876
|
-
}
|
|
23877
|
-
else if (isObject$1(currentField)) {
|
|
23878
|
-
iterateFieldsByAction(currentField, action);
|
|
23879
|
-
}
|
|
23880
|
-
}
|
|
23881
|
-
}
|
|
23882
|
-
};
|
|
23883
|
-
|
|
23884
|
-
var updateFieldArrayRootError = (errors, error, name) => {
|
|
23885
|
-
const fieldArrayErrors = compact(get(errors, name));
|
|
23886
|
-
set(fieldArrayErrors, 'root', error[name]);
|
|
23887
|
-
set(errors, name, fieldArrayErrors);
|
|
23888
|
-
return errors;
|
|
23889
|
-
};
|
|
23890
|
-
|
|
23891
|
-
var isFileInput = (element) => element.type === 'file';
|
|
23892
|
-
|
|
23893
|
-
var isFunction = (value) => typeof value === 'function';
|
|
23894
|
-
|
|
23895
|
-
var isHTMLElement = (value) => {
|
|
23896
|
-
if (!isWeb) {
|
|
23897
|
-
return false;
|
|
23898
|
-
}
|
|
23899
|
-
const owner = value ? value.ownerDocument : 0;
|
|
23900
|
-
return (value instanceof
|
|
23901
|
-
(owner && owner.defaultView ? owner.defaultView.HTMLElement : HTMLElement));
|
|
23902
|
-
};
|
|
23903
|
-
|
|
23904
|
-
var isMessage = (value) => isString(value);
|
|
23905
|
-
|
|
23906
|
-
var isRadioInput = (element) => element.type === 'radio';
|
|
23907
|
-
|
|
23908
|
-
var isRegex = (value) => value instanceof RegExp;
|
|
23909
|
-
|
|
23910
|
-
const defaultResult = {
|
|
23911
|
-
value: false,
|
|
23912
|
-
isValid: false,
|
|
23913
|
-
};
|
|
23914
|
-
const validResult = { value: true, isValid: true };
|
|
23915
|
-
var getCheckboxValue = (options) => {
|
|
23916
|
-
if (Array.isArray(options)) {
|
|
23917
|
-
if (options.length > 1) {
|
|
23918
|
-
const values = options
|
|
23919
|
-
.filter((option) => option && option.checked && !option.disabled)
|
|
23920
|
-
.map((option) => option.value);
|
|
23921
|
-
return { value: values, isValid: !!values.length };
|
|
23922
|
-
}
|
|
23923
|
-
return options[0].checked && !options[0].disabled
|
|
23924
|
-
? // @ts-expect-error expected to work in the browser
|
|
23925
|
-
options[0].attributes && !isUndefined(options[0].attributes.value)
|
|
23926
|
-
? isUndefined(options[0].value) || options[0].value === ''
|
|
23927
|
-
? validResult
|
|
23928
|
-
: { value: options[0].value, isValid: true }
|
|
23929
|
-
: validResult
|
|
23930
|
-
: defaultResult;
|
|
23931
|
-
}
|
|
23932
|
-
return defaultResult;
|
|
23933
|
-
};
|
|
23934
|
-
|
|
23935
|
-
const defaultReturn = {
|
|
23936
|
-
isValid: false,
|
|
23937
|
-
value: null,
|
|
23938
|
-
};
|
|
23939
|
-
var getRadioValue = (options) => Array.isArray(options)
|
|
23940
|
-
? options.reduce((previous, option) => option && option.checked && !option.disabled
|
|
23941
|
-
? {
|
|
23942
|
-
isValid: true,
|
|
23943
|
-
value: option.value,
|
|
23944
|
-
}
|
|
23945
|
-
: previous, defaultReturn)
|
|
23946
|
-
: defaultReturn;
|
|
23947
|
-
|
|
23948
|
-
function getValidateError(result, ref, type = 'validate') {
|
|
23949
|
-
if (isMessage(result) ||
|
|
23950
|
-
(Array.isArray(result) && result.every(isMessage)) ||
|
|
23951
|
-
(isBoolean(result) && !result)) {
|
|
23952
|
-
return {
|
|
23953
|
-
type,
|
|
23954
|
-
message: isMessage(result) ? result : '',
|
|
23955
|
-
ref,
|
|
23956
|
-
};
|
|
23957
|
-
}
|
|
23958
|
-
}
|
|
23959
|
-
|
|
23960
|
-
var getValueAndMessage = (validationData) => isObject$1(validationData) && !isRegex(validationData)
|
|
23961
|
-
? validationData
|
|
23962
|
-
: {
|
|
23963
|
-
value: validationData,
|
|
23964
|
-
message: '',
|
|
23965
|
-
};
|
|
23966
|
-
|
|
23967
|
-
var validateField = async (field, formValues, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => {
|
|
23968
|
-
const { ref, refs, required, maxLength, minLength, min, max, pattern, validate, name, valueAsNumber, mount, disabled, } = field._f;
|
|
23969
|
-
const inputValue = get(formValues, name);
|
|
23970
|
-
if (!mount || disabled) {
|
|
23971
|
-
return {};
|
|
23972
|
-
}
|
|
23973
|
-
const inputRef = refs ? refs[0] : ref;
|
|
23974
|
-
const setCustomValidity = (message) => {
|
|
23975
|
-
if (shouldUseNativeValidation && inputRef.reportValidity) {
|
|
23976
|
-
inputRef.setCustomValidity(isBoolean(message) ? '' : message || '');
|
|
23977
|
-
inputRef.reportValidity();
|
|
23978
|
-
}
|
|
23979
|
-
};
|
|
23980
|
-
const error = {};
|
|
23981
|
-
const isRadio = isRadioInput(ref);
|
|
23982
|
-
const isCheckBox = isCheckBoxInput(ref);
|
|
23983
|
-
const isRadioOrCheckbox = isRadio || isCheckBox;
|
|
23984
|
-
const isEmpty = ((valueAsNumber || isFileInput(ref)) &&
|
|
23985
|
-
isUndefined(ref.value) &&
|
|
23986
|
-
isUndefined(inputValue)) ||
|
|
23987
|
-
(isHTMLElement(ref) && ref.value === '') ||
|
|
23988
|
-
inputValue === '' ||
|
|
23989
|
-
(Array.isArray(inputValue) && !inputValue.length);
|
|
23990
|
-
const appendErrorsCurry = appendErrors.bind(null, name, validateAllFieldCriteria, error);
|
|
23991
|
-
const getMinMaxMessage = (exceedMax, maxLengthMessage, minLengthMessage, maxType = INPUT_VALIDATION_RULES.maxLength, minType = INPUT_VALIDATION_RULES.minLength) => {
|
|
23992
|
-
const message = exceedMax ? maxLengthMessage : minLengthMessage;
|
|
23993
|
-
error[name] = {
|
|
23994
|
-
type: exceedMax ? maxType : minType,
|
|
23995
|
-
message,
|
|
23996
|
-
ref,
|
|
23997
|
-
...appendErrorsCurry(exceedMax ? maxType : minType, message),
|
|
23998
|
-
};
|
|
23999
|
-
};
|
|
24000
|
-
if (isFieldArray
|
|
24001
|
-
? !Array.isArray(inputValue) || !inputValue.length
|
|
24002
|
-
: required &&
|
|
24003
|
-
((!isRadioOrCheckbox && (isEmpty || isNullOrUndefined(inputValue))) ||
|
|
24004
|
-
(isBoolean(inputValue) && !inputValue) ||
|
|
24005
|
-
(isCheckBox && !getCheckboxValue(refs).isValid) ||
|
|
24006
|
-
(isRadio && !getRadioValue(refs).isValid))) {
|
|
24007
|
-
const { value, message } = isMessage(required)
|
|
24008
|
-
? { value: !!required, message: required }
|
|
24009
|
-
: getValueAndMessage(required);
|
|
24010
|
-
if (value) {
|
|
24011
|
-
error[name] = {
|
|
24012
|
-
type: INPUT_VALIDATION_RULES.required,
|
|
24013
|
-
message,
|
|
24014
|
-
ref: inputRef,
|
|
24015
|
-
...appendErrorsCurry(INPUT_VALIDATION_RULES.required, message),
|
|
24016
|
-
};
|
|
24017
|
-
if (!validateAllFieldCriteria) {
|
|
24018
|
-
setCustomValidity(message);
|
|
24019
|
-
return error;
|
|
24020
|
-
}
|
|
24021
|
-
}
|
|
24022
|
-
}
|
|
24023
|
-
if (!isEmpty && (!isNullOrUndefined(min) || !isNullOrUndefined(max))) {
|
|
24024
|
-
let exceedMax;
|
|
24025
|
-
let exceedMin;
|
|
24026
|
-
const maxOutput = getValueAndMessage(max);
|
|
24027
|
-
const minOutput = getValueAndMessage(min);
|
|
24028
|
-
if (!isNullOrUndefined(inputValue) && !isNaN(inputValue)) {
|
|
24029
|
-
const valueNumber = ref.valueAsNumber ||
|
|
24030
|
-
(inputValue ? +inputValue : inputValue);
|
|
24031
|
-
if (!isNullOrUndefined(maxOutput.value)) {
|
|
24032
|
-
exceedMax = valueNumber > maxOutput.value;
|
|
24033
|
-
}
|
|
24034
|
-
if (!isNullOrUndefined(minOutput.value)) {
|
|
24035
|
-
exceedMin = valueNumber < minOutput.value;
|
|
24036
|
-
}
|
|
24037
|
-
}
|
|
24038
|
-
else {
|
|
24039
|
-
const valueDate = ref.valueAsDate || new Date(inputValue);
|
|
24040
|
-
const convertTimeToDate = (time) => new Date(new Date().toDateString() + ' ' + time);
|
|
24041
|
-
const isTime = ref.type == 'time';
|
|
24042
|
-
const isWeek = ref.type == 'week';
|
|
24043
|
-
if (isString(maxOutput.value) && inputValue) {
|
|
24044
|
-
exceedMax = isTime
|
|
24045
|
-
? convertTimeToDate(inputValue) > convertTimeToDate(maxOutput.value)
|
|
24046
|
-
: isWeek
|
|
24047
|
-
? inputValue > maxOutput.value
|
|
24048
|
-
: valueDate > new Date(maxOutput.value);
|
|
24049
|
-
}
|
|
24050
|
-
if (isString(minOutput.value) && inputValue) {
|
|
24051
|
-
exceedMin = isTime
|
|
24052
|
-
? convertTimeToDate(inputValue) < convertTimeToDate(minOutput.value)
|
|
24053
|
-
: isWeek
|
|
24054
|
-
? inputValue < minOutput.value
|
|
24055
|
-
: valueDate < new Date(minOutput.value);
|
|
24056
|
-
}
|
|
24057
|
-
}
|
|
24058
|
-
if (exceedMax || exceedMin) {
|
|
24059
|
-
getMinMaxMessage(!!exceedMax, maxOutput.message, minOutput.message, INPUT_VALIDATION_RULES.max, INPUT_VALIDATION_RULES.min);
|
|
24060
|
-
if (!validateAllFieldCriteria) {
|
|
24061
|
-
setCustomValidity(error[name].message);
|
|
24062
|
-
return error;
|
|
24063
|
-
}
|
|
24064
|
-
}
|
|
24065
|
-
}
|
|
24066
|
-
if ((maxLength || minLength) &&
|
|
24067
|
-
!isEmpty &&
|
|
24068
|
-
(isString(inputValue) || (isFieldArray && Array.isArray(inputValue)))) {
|
|
24069
|
-
const maxLengthOutput = getValueAndMessage(maxLength);
|
|
24070
|
-
const minLengthOutput = getValueAndMessage(minLength);
|
|
24071
|
-
const exceedMax = !isNullOrUndefined(maxLengthOutput.value) &&
|
|
24072
|
-
inputValue.length > +maxLengthOutput.value;
|
|
24073
|
-
const exceedMin = !isNullOrUndefined(minLengthOutput.value) &&
|
|
24074
|
-
inputValue.length < +minLengthOutput.value;
|
|
24075
|
-
if (exceedMax || exceedMin) {
|
|
24076
|
-
getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message);
|
|
24077
|
-
if (!validateAllFieldCriteria) {
|
|
24078
|
-
setCustomValidity(error[name].message);
|
|
24079
|
-
return error;
|
|
24080
|
-
}
|
|
24081
|
-
}
|
|
24082
|
-
}
|
|
24083
|
-
if (pattern && !isEmpty && isString(inputValue)) {
|
|
24084
|
-
const { value: patternValue, message } = getValueAndMessage(pattern);
|
|
24085
|
-
if (isRegex(patternValue) && !inputValue.match(patternValue)) {
|
|
24086
|
-
error[name] = {
|
|
24087
|
-
type: INPUT_VALIDATION_RULES.pattern,
|
|
24088
|
-
message,
|
|
24089
|
-
ref,
|
|
24090
|
-
...appendErrorsCurry(INPUT_VALIDATION_RULES.pattern, message),
|
|
24091
|
-
};
|
|
24092
|
-
if (!validateAllFieldCriteria) {
|
|
24093
|
-
setCustomValidity(message);
|
|
24094
|
-
return error;
|
|
24095
|
-
}
|
|
24096
|
-
}
|
|
24097
|
-
}
|
|
24098
|
-
if (validate) {
|
|
24099
|
-
if (isFunction(validate)) {
|
|
24100
|
-
const result = await validate(inputValue, formValues);
|
|
24101
|
-
const validateError = getValidateError(result, inputRef);
|
|
24102
|
-
if (validateError) {
|
|
24103
|
-
error[name] = {
|
|
24104
|
-
...validateError,
|
|
24105
|
-
...appendErrorsCurry(INPUT_VALIDATION_RULES.validate, validateError.message),
|
|
24106
|
-
};
|
|
24107
|
-
if (!validateAllFieldCriteria) {
|
|
24108
|
-
setCustomValidity(validateError.message);
|
|
24109
|
-
return error;
|
|
24110
|
-
}
|
|
24111
|
-
}
|
|
24112
|
-
}
|
|
24113
|
-
else if (isObject$1(validate)) {
|
|
24114
|
-
let validationResult = {};
|
|
24115
|
-
for (const key in validate) {
|
|
24116
|
-
if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) {
|
|
24117
|
-
break;
|
|
24118
|
-
}
|
|
24119
|
-
const validateError = getValidateError(await validate[key](inputValue, formValues), inputRef, key);
|
|
24120
|
-
if (validateError) {
|
|
24121
|
-
validationResult = {
|
|
24122
|
-
...validateError,
|
|
24123
|
-
...appendErrorsCurry(key, validateError.message),
|
|
24124
|
-
};
|
|
24125
|
-
setCustomValidity(validateError.message);
|
|
24126
|
-
if (validateAllFieldCriteria) {
|
|
24127
|
-
error[name] = validationResult;
|
|
24128
|
-
}
|
|
24129
|
-
}
|
|
24130
|
-
}
|
|
24131
|
-
if (!isEmptyObject(validationResult)) {
|
|
24132
|
-
error[name] = {
|
|
24133
|
-
ref: inputRef,
|
|
24134
|
-
...validationResult,
|
|
24135
|
-
};
|
|
24136
|
-
if (!validateAllFieldCriteria) {
|
|
24137
|
-
return error;
|
|
24138
|
-
}
|
|
24139
|
-
}
|
|
24140
|
-
}
|
|
24141
|
-
}
|
|
24142
|
-
setCustomValidity(true);
|
|
24143
|
-
return error;
|
|
24144
|
-
};
|
|
24145
|
-
|
|
24146
|
-
function baseGet(object, updatePath) {
|
|
24147
|
-
const length = updatePath.slice(0, -1).length;
|
|
24148
|
-
let index = 0;
|
|
24149
|
-
while (index < length) {
|
|
24150
|
-
object = isUndefined(object) ? index++ : object[updatePath[index++]];
|
|
24151
|
-
}
|
|
24152
|
-
return object;
|
|
24153
|
-
}
|
|
24154
|
-
function isEmptyArray(obj) {
|
|
24155
|
-
for (const key in obj) {
|
|
24156
|
-
if (obj.hasOwnProperty(key) && !isUndefined(obj[key])) {
|
|
24157
|
-
return false;
|
|
24158
|
-
}
|
|
24159
|
-
}
|
|
24160
|
-
return true;
|
|
24161
|
-
}
|
|
24162
|
-
function unset(object, path) {
|
|
24163
|
-
const paths = Array.isArray(path)
|
|
24164
|
-
? path
|
|
24165
|
-
: isKey(path)
|
|
24166
|
-
? [path]
|
|
24167
|
-
: stringToPath(path);
|
|
24168
|
-
const childObject = paths.length === 1 ? object : baseGet(object, paths);
|
|
24169
|
-
const index = paths.length - 1;
|
|
24170
|
-
const key = paths[index];
|
|
24171
|
-
if (childObject) {
|
|
24172
|
-
delete childObject[key];
|
|
24173
|
-
}
|
|
24174
|
-
if (index !== 0 &&
|
|
24175
|
-
((isObject$1(childObject) && isEmptyObject(childObject)) ||
|
|
24176
|
-
(Array.isArray(childObject) && isEmptyArray(childObject)))) {
|
|
24177
|
-
unset(object, paths.slice(0, -1));
|
|
24178
|
-
}
|
|
24179
|
-
return object;
|
|
24180
|
-
}
|
|
24181
|
-
|
|
24182
|
-
var createSubject = () => {
|
|
24183
|
-
let _observers = [];
|
|
24184
|
-
const next = (value) => {
|
|
24185
|
-
for (const observer of _observers) {
|
|
24186
|
-
observer.next && observer.next(value);
|
|
24187
|
-
}
|
|
24188
|
-
};
|
|
24189
|
-
const subscribe = (observer) => {
|
|
24190
|
-
_observers.push(observer);
|
|
24191
|
-
return {
|
|
24192
|
-
unsubscribe: () => {
|
|
24193
|
-
_observers = _observers.filter((o) => o !== observer);
|
|
24194
|
-
},
|
|
24195
|
-
};
|
|
24196
|
-
};
|
|
24197
|
-
const unsubscribe = () => {
|
|
24198
|
-
_observers = [];
|
|
24199
|
-
};
|
|
24200
|
-
return {
|
|
24201
|
-
get observers() {
|
|
24202
|
-
return _observers;
|
|
24203
|
-
},
|
|
24204
|
-
next,
|
|
24205
|
-
subscribe,
|
|
24206
|
-
unsubscribe,
|
|
24207
|
-
};
|
|
24208
|
-
};
|
|
24209
|
-
|
|
24210
|
-
var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);
|
|
24211
|
-
|
|
24212
|
-
function deepEqual(object1, object2) {
|
|
24213
|
-
if (isPrimitive(object1) || isPrimitive(object2)) {
|
|
24214
|
-
return object1 === object2;
|
|
24215
|
-
}
|
|
24216
|
-
if (isDateObject(object1) && isDateObject(object2)) {
|
|
24217
|
-
return object1.getTime() === object2.getTime();
|
|
24218
|
-
}
|
|
24219
|
-
const keys1 = Object.keys(object1);
|
|
24220
|
-
const keys2 = Object.keys(object2);
|
|
24221
|
-
if (keys1.length !== keys2.length) {
|
|
24222
|
-
return false;
|
|
24223
|
-
}
|
|
24224
|
-
for (const key of keys1) {
|
|
24225
|
-
const val1 = object1[key];
|
|
24226
|
-
if (!keys2.includes(key)) {
|
|
24227
|
-
return false;
|
|
24228
|
-
}
|
|
24229
|
-
if (key !== 'ref') {
|
|
24230
|
-
const val2 = object2[key];
|
|
24231
|
-
if ((isDateObject(val1) && isDateObject(val2)) ||
|
|
24232
|
-
(isObject$1(val1) && isObject$1(val2)) ||
|
|
24233
|
-
(Array.isArray(val1) && Array.isArray(val2))
|
|
24234
|
-
? !deepEqual(val1, val2)
|
|
24235
|
-
: val1 !== val2) {
|
|
24236
|
-
return false;
|
|
24237
|
-
}
|
|
24238
|
-
}
|
|
24239
|
-
}
|
|
24240
|
-
return true;
|
|
24241
|
-
}
|
|
24242
|
-
|
|
24243
|
-
var isMultipleSelect = (element) => element.type === `select-multiple`;
|
|
24244
|
-
|
|
24245
|
-
var isRadioOrCheckbox = (ref) => isRadioInput(ref) || isCheckBoxInput(ref);
|
|
24246
|
-
|
|
24247
|
-
var live = (ref) => isHTMLElement(ref) && ref.isConnected;
|
|
24248
|
-
|
|
24249
|
-
var objectHasFunction = (data) => {
|
|
24250
|
-
for (const key in data) {
|
|
24251
|
-
if (isFunction(data[key])) {
|
|
24252
|
-
return true;
|
|
24253
|
-
}
|
|
24254
|
-
}
|
|
24255
|
-
return false;
|
|
24256
|
-
};
|
|
24257
|
-
|
|
24258
|
-
function markFieldsDirty(data, fields = {}) {
|
|
24259
|
-
const isParentNodeArray = Array.isArray(data);
|
|
24260
|
-
if (isObject$1(data) || isParentNodeArray) {
|
|
24261
|
-
for (const key in data) {
|
|
24262
|
-
if (Array.isArray(data[key]) ||
|
|
24263
|
-
(isObject$1(data[key]) && !objectHasFunction(data[key]))) {
|
|
24264
|
-
fields[key] = Array.isArray(data[key]) ? [] : {};
|
|
24265
|
-
markFieldsDirty(data[key], fields[key]);
|
|
24266
|
-
}
|
|
24267
|
-
else if (!isNullOrUndefined(data[key])) {
|
|
24268
|
-
fields[key] = true;
|
|
24269
|
-
}
|
|
24270
|
-
}
|
|
24271
|
-
}
|
|
24272
|
-
return fields;
|
|
24273
|
-
}
|
|
24274
|
-
function getDirtyFieldsFromDefaultValues(data, formValues, dirtyFieldsFromValues) {
|
|
24275
|
-
const isParentNodeArray = Array.isArray(data);
|
|
24276
|
-
if (isObject$1(data) || isParentNodeArray) {
|
|
24277
|
-
for (const key in data) {
|
|
24278
|
-
if (Array.isArray(data[key]) ||
|
|
24279
|
-
(isObject$1(data[key]) && !objectHasFunction(data[key]))) {
|
|
24280
|
-
if (isUndefined(formValues) ||
|
|
24281
|
-
isPrimitive(dirtyFieldsFromValues[key])) {
|
|
24282
|
-
dirtyFieldsFromValues[key] = Array.isArray(data[key])
|
|
24283
|
-
? markFieldsDirty(data[key], [])
|
|
24284
|
-
: { ...markFieldsDirty(data[key]) };
|
|
24285
|
-
}
|
|
24286
|
-
else {
|
|
24287
|
-
getDirtyFieldsFromDefaultValues(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);
|
|
24288
|
-
}
|
|
24289
|
-
}
|
|
24290
|
-
else {
|
|
24291
|
-
dirtyFieldsFromValues[key] = !deepEqual(data[key], formValues[key]);
|
|
24292
|
-
}
|
|
24293
|
-
}
|
|
24294
|
-
}
|
|
24295
|
-
return dirtyFieldsFromValues;
|
|
24296
|
-
}
|
|
24297
|
-
var getDirtyFields = (defaultValues, formValues) => getDirtyFieldsFromDefaultValues(defaultValues, formValues, markFieldsDirty(formValues));
|
|
24298
|
-
|
|
24299
|
-
var getFieldValueAs = (value, { valueAsNumber, valueAsDate, setValueAs }) => isUndefined(value)
|
|
24300
|
-
? value
|
|
24301
|
-
: valueAsNumber
|
|
24302
|
-
? value === ''
|
|
24303
|
-
? NaN
|
|
24304
|
-
: value
|
|
24305
|
-
? +value
|
|
24306
|
-
: value
|
|
24307
|
-
: valueAsDate && isString(value)
|
|
24308
|
-
? new Date(value)
|
|
24309
|
-
: setValueAs
|
|
24310
|
-
? setValueAs(value)
|
|
24311
|
-
: value;
|
|
24312
|
-
|
|
24313
|
-
function getFieldValue(_f) {
|
|
24314
|
-
const ref = _f.ref;
|
|
24315
|
-
if (_f.refs ? _f.refs.every((ref) => ref.disabled) : ref.disabled) {
|
|
24316
|
-
return;
|
|
24317
|
-
}
|
|
24318
|
-
if (isFileInput(ref)) {
|
|
24319
|
-
return ref.files;
|
|
24320
|
-
}
|
|
24321
|
-
if (isRadioInput(ref)) {
|
|
24322
|
-
return getRadioValue(_f.refs).value;
|
|
24323
|
-
}
|
|
24324
|
-
if (isMultipleSelect(ref)) {
|
|
24325
|
-
return [...ref.selectedOptions].map(({ value }) => value);
|
|
24326
|
-
}
|
|
24327
|
-
if (isCheckBoxInput(ref)) {
|
|
24328
|
-
return getCheckboxValue(_f.refs).value;
|
|
24329
|
-
}
|
|
24330
|
-
return getFieldValueAs(isUndefined(ref.value) ? _f.ref.value : ref.value, _f);
|
|
24331
|
-
}
|
|
24332
|
-
|
|
24333
|
-
var getResolverOptions = (fieldsNames, _fields, criteriaMode, shouldUseNativeValidation) => {
|
|
24334
|
-
const fields = {};
|
|
24335
|
-
for (const name of fieldsNames) {
|
|
24336
|
-
const field = get(_fields, name);
|
|
24337
|
-
field && set(fields, name, field._f);
|
|
24338
|
-
}
|
|
24339
|
-
return {
|
|
24340
|
-
criteriaMode,
|
|
24341
|
-
names: [...fieldsNames],
|
|
24342
|
-
fields,
|
|
24343
|
-
shouldUseNativeValidation,
|
|
24344
|
-
};
|
|
24345
|
-
};
|
|
24346
|
-
|
|
24347
|
-
var getRuleValue = (rule) => isUndefined(rule)
|
|
24348
|
-
? rule
|
|
24349
|
-
: isRegex(rule)
|
|
24350
|
-
? rule.source
|
|
24351
|
-
: isObject$1(rule)
|
|
24352
|
-
? isRegex(rule.value)
|
|
24353
|
-
? rule.value.source
|
|
24354
|
-
: rule.value
|
|
24355
|
-
: rule;
|
|
24356
|
-
|
|
24357
|
-
var hasValidation = (options) => options.mount &&
|
|
24358
|
-
(options.required ||
|
|
24359
|
-
options.min ||
|
|
24360
|
-
options.max ||
|
|
24361
|
-
options.maxLength ||
|
|
24362
|
-
options.minLength ||
|
|
24363
|
-
options.pattern ||
|
|
24364
|
-
options.validate);
|
|
24365
|
-
|
|
24366
|
-
function schemaErrorLookup(errors, _fields, name) {
|
|
24367
|
-
const error = get(errors, name);
|
|
24368
|
-
if (error || isKey(name)) {
|
|
24369
|
-
return {
|
|
24370
|
-
error,
|
|
24371
|
-
name,
|
|
24372
|
-
};
|
|
24373
|
-
}
|
|
24374
|
-
const names = name.split('.');
|
|
24375
|
-
while (names.length) {
|
|
24376
|
-
const fieldName = names.join('.');
|
|
24377
|
-
const field = get(_fields, fieldName);
|
|
24378
|
-
const foundError = get(errors, fieldName);
|
|
24379
|
-
if (field && !Array.isArray(field) && name !== fieldName) {
|
|
24380
|
-
return { name };
|
|
24381
|
-
}
|
|
24382
|
-
if (foundError && foundError.type) {
|
|
24383
|
-
return {
|
|
24384
|
-
name: fieldName,
|
|
24385
|
-
error: foundError,
|
|
24386
|
-
};
|
|
24387
|
-
}
|
|
24388
|
-
names.pop();
|
|
24389
|
-
}
|
|
24390
|
-
return {
|
|
24391
|
-
name,
|
|
24392
|
-
};
|
|
24393
|
-
}
|
|
24394
|
-
|
|
24395
|
-
var skipValidation = (isBlurEvent, isTouched, isSubmitted, reValidateMode, mode) => {
|
|
24396
|
-
if (mode.isOnAll) {
|
|
24397
|
-
return false;
|
|
24398
|
-
}
|
|
24399
|
-
else if (!isSubmitted && mode.isOnTouch) {
|
|
24400
|
-
return !(isTouched || isBlurEvent);
|
|
24401
|
-
}
|
|
24402
|
-
else if (isSubmitted ? reValidateMode.isOnBlur : mode.isOnBlur) {
|
|
24403
|
-
return !isBlurEvent;
|
|
24404
|
-
}
|
|
24405
|
-
else if (isSubmitted ? reValidateMode.isOnChange : mode.isOnChange) {
|
|
24406
|
-
return isBlurEvent;
|
|
24407
|
-
}
|
|
24408
|
-
return true;
|
|
24409
|
-
};
|
|
24410
|
-
|
|
24411
|
-
var unsetEmptyArray = (ref, name) => !compact(get(ref, name)).length && unset(ref, name);
|
|
24412
|
-
|
|
24413
|
-
const defaultOptions$2 = {
|
|
24414
|
-
mode: VALIDATION_MODE.onSubmit,
|
|
24415
|
-
reValidateMode: VALIDATION_MODE.onChange,
|
|
24416
|
-
shouldFocusError: true,
|
|
24417
|
-
};
|
|
24418
|
-
function createFormControl(props = {}) {
|
|
24419
|
-
let _options = {
|
|
24420
|
-
...defaultOptions$2,
|
|
24421
|
-
...props,
|
|
24422
|
-
};
|
|
24423
|
-
let _formState = {
|
|
24424
|
-
submitCount: 0,
|
|
24425
|
-
isDirty: false,
|
|
24426
|
-
isLoading: isFunction(_options.defaultValues),
|
|
24427
|
-
isValidating: false,
|
|
24428
|
-
isSubmitted: false,
|
|
24429
|
-
isSubmitting: false,
|
|
24430
|
-
isSubmitSuccessful: false,
|
|
24431
|
-
isValid: false,
|
|
24432
|
-
touchedFields: {},
|
|
24433
|
-
dirtyFields: {},
|
|
24434
|
-
validatingFields: {},
|
|
24435
|
-
errors: _options.errors || {},
|
|
24436
|
-
disabled: _options.disabled || false,
|
|
24437
|
-
};
|
|
24438
|
-
let _fields = {};
|
|
24439
|
-
let _defaultValues = isObject$1(_options.defaultValues) || isObject$1(_options.values)
|
|
24440
|
-
? cloneObject(_options.defaultValues || _options.values) || {}
|
|
24441
|
-
: {};
|
|
24442
|
-
let _formValues = _options.shouldUnregister
|
|
24443
|
-
? {}
|
|
24444
|
-
: cloneObject(_defaultValues);
|
|
24445
|
-
let _state = {
|
|
24446
|
-
action: false,
|
|
24447
|
-
mount: false,
|
|
24448
|
-
watch: false,
|
|
24449
|
-
};
|
|
24450
|
-
let _names = {
|
|
24451
|
-
mount: new Set(),
|
|
24452
|
-
unMount: new Set(),
|
|
24453
|
-
array: new Set(),
|
|
24454
|
-
watch: new Set(),
|
|
24455
|
-
};
|
|
24456
|
-
let delayErrorCallback;
|
|
24457
|
-
let timer = 0;
|
|
24458
|
-
const _proxyFormState = {
|
|
24459
|
-
isDirty: false,
|
|
24460
|
-
dirtyFields: false,
|
|
24461
|
-
validatingFields: false,
|
|
24462
|
-
touchedFields: false,
|
|
24463
|
-
isValidating: false,
|
|
24464
|
-
isValid: false,
|
|
24465
|
-
errors: false,
|
|
24466
|
-
};
|
|
24467
|
-
const _subjects = {
|
|
24468
|
-
values: createSubject(),
|
|
24469
|
-
array: createSubject(),
|
|
24470
|
-
state: createSubject(),
|
|
24471
|
-
};
|
|
24472
|
-
const validationModeBeforeSubmit = getValidationModes(_options.mode);
|
|
24473
|
-
const validationModeAfterSubmit = getValidationModes(_options.reValidateMode);
|
|
24474
|
-
const shouldDisplayAllAssociatedErrors = _options.criteriaMode === VALIDATION_MODE.all;
|
|
24475
|
-
const debounce = (callback) => (wait) => {
|
|
24476
|
-
clearTimeout(timer);
|
|
24477
|
-
timer = setTimeout(callback, wait);
|
|
24478
|
-
};
|
|
24479
|
-
const _updateValid = async (shouldUpdateValid) => {
|
|
24480
|
-
if (_proxyFormState.isValid || shouldUpdateValid) {
|
|
24481
|
-
const isValid = _options.resolver
|
|
24482
|
-
? isEmptyObject((await _executeSchema()).errors)
|
|
24483
|
-
: await executeBuiltInValidation(_fields, true);
|
|
24484
|
-
if (isValid !== _formState.isValid) {
|
|
24485
|
-
_subjects.state.next({
|
|
24486
|
-
isValid,
|
|
24487
|
-
});
|
|
24488
|
-
}
|
|
24489
|
-
}
|
|
24490
|
-
};
|
|
24491
|
-
const _updateIsValidating = (names, isValidating) => {
|
|
24492
|
-
if (_proxyFormState.isValidating || _proxyFormState.validatingFields) {
|
|
24493
|
-
(names || Array.from(_names.mount)).forEach((name) => {
|
|
24494
|
-
if (name) {
|
|
24495
|
-
isValidating
|
|
24496
|
-
? set(_formState.validatingFields, name, isValidating)
|
|
24497
|
-
: unset(_formState.validatingFields, name);
|
|
24498
|
-
}
|
|
24499
|
-
});
|
|
24500
|
-
_subjects.state.next({
|
|
24501
|
-
validatingFields: _formState.validatingFields,
|
|
24502
|
-
isValidating: !isEmptyObject(_formState.validatingFields),
|
|
24503
|
-
});
|
|
24504
|
-
}
|
|
24505
|
-
};
|
|
24506
|
-
const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
|
|
24507
|
-
if (args && method) {
|
|
24508
|
-
_state.action = true;
|
|
24509
|
-
if (shouldUpdateFieldsAndState && Array.isArray(get(_fields, name))) {
|
|
24510
|
-
const fieldValues = method(get(_fields, name), args.argA, args.argB);
|
|
24511
|
-
shouldSetValues && set(_fields, name, fieldValues);
|
|
24512
|
-
}
|
|
24513
|
-
if (shouldUpdateFieldsAndState &&
|
|
24514
|
-
Array.isArray(get(_formState.errors, name))) {
|
|
24515
|
-
const errors = method(get(_formState.errors, name), args.argA, args.argB);
|
|
24516
|
-
shouldSetValues && set(_formState.errors, name, errors);
|
|
24517
|
-
unsetEmptyArray(_formState.errors, name);
|
|
24518
|
-
}
|
|
24519
|
-
if (_proxyFormState.touchedFields &&
|
|
24520
|
-
shouldUpdateFieldsAndState &&
|
|
24521
|
-
Array.isArray(get(_formState.touchedFields, name))) {
|
|
24522
|
-
const touchedFields = method(get(_formState.touchedFields, name), args.argA, args.argB);
|
|
24523
|
-
shouldSetValues && set(_formState.touchedFields, name, touchedFields);
|
|
24524
|
-
}
|
|
24525
|
-
if (_proxyFormState.dirtyFields) {
|
|
24526
|
-
_formState.dirtyFields = getDirtyFields(_defaultValues, _formValues);
|
|
24527
|
-
}
|
|
24528
|
-
_subjects.state.next({
|
|
24529
|
-
name,
|
|
24530
|
-
isDirty: _getDirty(name, values),
|
|
24531
|
-
dirtyFields: _formState.dirtyFields,
|
|
24532
|
-
errors: _formState.errors,
|
|
24533
|
-
isValid: _formState.isValid,
|
|
24534
|
-
});
|
|
24535
|
-
}
|
|
24536
|
-
else {
|
|
24537
|
-
set(_formValues, name, values);
|
|
24538
|
-
}
|
|
24539
|
-
};
|
|
24540
|
-
const updateErrors = (name, error) => {
|
|
24541
|
-
set(_formState.errors, name, error);
|
|
24542
|
-
_subjects.state.next({
|
|
24543
|
-
errors: _formState.errors,
|
|
24544
|
-
});
|
|
24545
|
-
};
|
|
24546
|
-
const _setErrors = (errors) => {
|
|
24547
|
-
_formState.errors = errors;
|
|
24548
|
-
_subjects.state.next({
|
|
24549
|
-
errors: _formState.errors,
|
|
24550
|
-
isValid: false,
|
|
24551
|
-
});
|
|
24552
|
-
};
|
|
24553
|
-
const updateValidAndValue = (name, shouldSkipSetValueAs, value, ref) => {
|
|
24554
|
-
const field = get(_fields, name);
|
|
24555
|
-
if (field) {
|
|
24556
|
-
const defaultValue = get(_formValues, name, isUndefined(value) ? get(_defaultValues, name) : value);
|
|
24557
|
-
isUndefined(defaultValue) ||
|
|
24558
|
-
(ref && ref.defaultChecked) ||
|
|
24559
|
-
shouldSkipSetValueAs
|
|
24560
|
-
? set(_formValues, name, shouldSkipSetValueAs ? defaultValue : getFieldValue(field._f))
|
|
24561
|
-
: setFieldValue(name, defaultValue);
|
|
24562
|
-
_state.mount && _updateValid();
|
|
24563
|
-
}
|
|
24564
|
-
};
|
|
24565
|
-
const updateTouchAndDirty = (name, fieldValue, isBlurEvent, shouldDirty, shouldRender) => {
|
|
24566
|
-
let shouldUpdateField = false;
|
|
24567
|
-
let isPreviousDirty = false;
|
|
24568
|
-
const output = {
|
|
24569
|
-
name,
|
|
24570
|
-
};
|
|
24571
|
-
const disabledField = !!(get(_fields, name) && get(_fields, name)._f.disabled);
|
|
24572
|
-
if (!isBlurEvent || shouldDirty) {
|
|
24573
|
-
if (_proxyFormState.isDirty) {
|
|
24574
|
-
isPreviousDirty = _formState.isDirty;
|
|
24575
|
-
_formState.isDirty = output.isDirty = _getDirty();
|
|
24576
|
-
shouldUpdateField = isPreviousDirty !== output.isDirty;
|
|
24577
|
-
}
|
|
24578
|
-
const isCurrentFieldPristine = disabledField || deepEqual(get(_defaultValues, name), fieldValue);
|
|
24579
|
-
isPreviousDirty = !!(!disabledField && get(_formState.dirtyFields, name));
|
|
24580
|
-
isCurrentFieldPristine || disabledField
|
|
24581
|
-
? unset(_formState.dirtyFields, name)
|
|
24582
|
-
: set(_formState.dirtyFields, name, true);
|
|
24583
|
-
output.dirtyFields = _formState.dirtyFields;
|
|
24584
|
-
shouldUpdateField =
|
|
24585
|
-
shouldUpdateField ||
|
|
24586
|
-
(_proxyFormState.dirtyFields &&
|
|
24587
|
-
isPreviousDirty !== !isCurrentFieldPristine);
|
|
24588
|
-
}
|
|
24589
|
-
if (isBlurEvent) {
|
|
24590
|
-
const isPreviousFieldTouched = get(_formState.touchedFields, name);
|
|
24591
|
-
if (!isPreviousFieldTouched) {
|
|
24592
|
-
set(_formState.touchedFields, name, isBlurEvent);
|
|
24593
|
-
output.touchedFields = _formState.touchedFields;
|
|
24594
|
-
shouldUpdateField =
|
|
24595
|
-
shouldUpdateField ||
|
|
24596
|
-
(_proxyFormState.touchedFields &&
|
|
24597
|
-
isPreviousFieldTouched !== isBlurEvent);
|
|
24598
|
-
}
|
|
24599
|
-
}
|
|
24600
|
-
shouldUpdateField && shouldRender && _subjects.state.next(output);
|
|
24601
|
-
return shouldUpdateField ? output : {};
|
|
24602
|
-
};
|
|
24603
|
-
const shouldRenderByError = (name, isValid, error, fieldState) => {
|
|
24604
|
-
const previousFieldError = get(_formState.errors, name);
|
|
24605
|
-
const shouldUpdateValid = _proxyFormState.isValid &&
|
|
24606
|
-
isBoolean(isValid) &&
|
|
24607
|
-
_formState.isValid !== isValid;
|
|
24608
|
-
if (props.delayError && error) {
|
|
24609
|
-
delayErrorCallback = debounce(() => updateErrors(name, error));
|
|
24610
|
-
delayErrorCallback(props.delayError);
|
|
24611
|
-
}
|
|
24612
|
-
else {
|
|
24613
|
-
clearTimeout(timer);
|
|
24614
|
-
delayErrorCallback = null;
|
|
24615
|
-
error
|
|
24616
|
-
? set(_formState.errors, name, error)
|
|
24617
|
-
: unset(_formState.errors, name);
|
|
24618
|
-
}
|
|
24619
|
-
if ((error ? !deepEqual(previousFieldError, error) : previousFieldError) ||
|
|
24620
|
-
!isEmptyObject(fieldState) ||
|
|
24621
|
-
shouldUpdateValid) {
|
|
24622
|
-
const updatedFormState = {
|
|
24623
|
-
...fieldState,
|
|
24624
|
-
...(shouldUpdateValid && isBoolean(isValid) ? { isValid } : {}),
|
|
24625
|
-
errors: _formState.errors,
|
|
24626
|
-
name,
|
|
24627
|
-
};
|
|
24628
|
-
_formState = {
|
|
24629
|
-
..._formState,
|
|
24630
|
-
...updatedFormState,
|
|
24631
|
-
};
|
|
24632
|
-
_subjects.state.next(updatedFormState);
|
|
24633
|
-
}
|
|
24634
|
-
};
|
|
24635
|
-
const _executeSchema = async (name) => {
|
|
24636
|
-
_updateIsValidating(name, true);
|
|
24637
|
-
const result = await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
|
|
24638
|
-
_updateIsValidating(name);
|
|
24639
|
-
return result;
|
|
24640
|
-
};
|
|
24641
|
-
const executeSchemaAndUpdateState = async (names) => {
|
|
24642
|
-
const { errors } = await _executeSchema(names);
|
|
24643
|
-
if (names) {
|
|
24644
|
-
for (const name of names) {
|
|
24645
|
-
const error = get(errors, name);
|
|
24646
|
-
error
|
|
24647
|
-
? set(_formState.errors, name, error)
|
|
24648
|
-
: unset(_formState.errors, name);
|
|
24649
|
-
}
|
|
24650
|
-
}
|
|
24651
|
-
else {
|
|
24652
|
-
_formState.errors = errors;
|
|
24653
|
-
}
|
|
24654
|
-
return errors;
|
|
24655
|
-
};
|
|
24656
|
-
const executeBuiltInValidation = async (fields, shouldOnlyCheckValid, context = {
|
|
24657
|
-
valid: true,
|
|
24658
|
-
}) => {
|
|
24659
|
-
for (const name in fields) {
|
|
24660
|
-
const field = fields[name];
|
|
24661
|
-
if (field) {
|
|
24662
|
-
const { _f, ...fieldValue } = field;
|
|
24663
|
-
if (_f) {
|
|
24664
|
-
const isFieldArrayRoot = _names.array.has(_f.name);
|
|
24665
|
-
_updateIsValidating([name], true);
|
|
24666
|
-
const fieldError = await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !shouldOnlyCheckValid, isFieldArrayRoot);
|
|
24667
|
-
_updateIsValidating([name]);
|
|
24668
|
-
if (fieldError[_f.name]) {
|
|
24669
|
-
context.valid = false;
|
|
24670
|
-
if (shouldOnlyCheckValid) {
|
|
24671
|
-
break;
|
|
24672
|
-
}
|
|
24673
|
-
}
|
|
24674
|
-
!shouldOnlyCheckValid &&
|
|
24675
|
-
(get(fieldError, _f.name)
|
|
24676
|
-
? isFieldArrayRoot
|
|
24677
|
-
? updateFieldArrayRootError(_formState.errors, fieldError, _f.name)
|
|
24678
|
-
: set(_formState.errors, _f.name, fieldError[_f.name])
|
|
24679
|
-
: unset(_formState.errors, _f.name));
|
|
24680
|
-
}
|
|
24681
|
-
fieldValue &&
|
|
24682
|
-
(await executeBuiltInValidation(fieldValue, shouldOnlyCheckValid, context));
|
|
24683
|
-
}
|
|
24684
|
-
}
|
|
24685
|
-
return context.valid;
|
|
24686
|
-
};
|
|
24687
|
-
const _removeUnmounted = () => {
|
|
24688
|
-
for (const name of _names.unMount) {
|
|
24689
|
-
const field = get(_fields, name);
|
|
24690
|
-
field &&
|
|
24691
|
-
(field._f.refs
|
|
24692
|
-
? field._f.refs.every((ref) => !live(ref))
|
|
24693
|
-
: !live(field._f.ref)) &&
|
|
24694
|
-
unregister(name);
|
|
24695
|
-
}
|
|
24696
|
-
_names.unMount = new Set();
|
|
24697
|
-
};
|
|
24698
|
-
const _getDirty = (name, data) => (name && data && set(_formValues, name, data),
|
|
24699
|
-
!deepEqual(getValues(), _defaultValues));
|
|
24700
|
-
const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
|
|
24701
|
-
...(_state.mount
|
|
24702
|
-
? _formValues
|
|
24703
|
-
: isUndefined(defaultValue)
|
|
24704
|
-
? _defaultValues
|
|
24705
|
-
: isString(names)
|
|
24706
|
-
? { [names]: defaultValue }
|
|
24707
|
-
: defaultValue),
|
|
24708
|
-
}, isGlobal, defaultValue);
|
|
24709
|
-
const _getFieldArray = (name) => compact(get(_state.mount ? _formValues : _defaultValues, name, props.shouldUnregister ? get(_defaultValues, name, []) : []));
|
|
24710
|
-
const setFieldValue = (name, value, options = {}) => {
|
|
24711
|
-
const field = get(_fields, name);
|
|
24712
|
-
let fieldValue = value;
|
|
24713
|
-
if (field) {
|
|
24714
|
-
const fieldReference = field._f;
|
|
24715
|
-
if (fieldReference) {
|
|
24716
|
-
!fieldReference.disabled &&
|
|
24717
|
-
set(_formValues, name, getFieldValueAs(value, fieldReference));
|
|
24718
|
-
fieldValue =
|
|
24719
|
-
isHTMLElement(fieldReference.ref) && isNullOrUndefined(value)
|
|
24720
|
-
? ''
|
|
24721
|
-
: value;
|
|
24722
|
-
if (isMultipleSelect(fieldReference.ref)) {
|
|
24723
|
-
[...fieldReference.ref.options].forEach((optionRef) => (optionRef.selected = fieldValue.includes(optionRef.value)));
|
|
24724
|
-
}
|
|
24725
|
-
else if (fieldReference.refs) {
|
|
24726
|
-
if (isCheckBoxInput(fieldReference.ref)) {
|
|
24727
|
-
fieldReference.refs.length > 1
|
|
24728
|
-
? fieldReference.refs.forEach((checkboxRef) => (!checkboxRef.defaultChecked || !checkboxRef.disabled) &&
|
|
24729
|
-
(checkboxRef.checked = Array.isArray(fieldValue)
|
|
24730
|
-
? !!fieldValue.find((data) => data === checkboxRef.value)
|
|
24731
|
-
: fieldValue === checkboxRef.value))
|
|
24732
|
-
: fieldReference.refs[0] &&
|
|
24733
|
-
(fieldReference.refs[0].checked = !!fieldValue);
|
|
24734
|
-
}
|
|
24735
|
-
else {
|
|
24736
|
-
fieldReference.refs.forEach((radioRef) => (radioRef.checked = radioRef.value === fieldValue));
|
|
24737
|
-
}
|
|
24738
|
-
}
|
|
24739
|
-
else if (isFileInput(fieldReference.ref)) {
|
|
24740
|
-
fieldReference.ref.value = '';
|
|
24741
|
-
}
|
|
24742
|
-
else {
|
|
24743
|
-
fieldReference.ref.value = fieldValue;
|
|
24744
|
-
if (!fieldReference.ref.type) {
|
|
24745
|
-
_subjects.values.next({
|
|
24746
|
-
name,
|
|
24747
|
-
values: { ..._formValues },
|
|
24748
|
-
});
|
|
24749
|
-
}
|
|
24750
|
-
}
|
|
24751
|
-
}
|
|
24752
|
-
}
|
|
24753
|
-
(options.shouldDirty || options.shouldTouch) &&
|
|
24754
|
-
updateTouchAndDirty(name, fieldValue, options.shouldTouch, options.shouldDirty, true);
|
|
24755
|
-
options.shouldValidate && trigger(name);
|
|
24756
|
-
};
|
|
24757
|
-
const setValues = (name, value, options) => {
|
|
24758
|
-
for (const fieldKey in value) {
|
|
24759
|
-
const fieldValue = value[fieldKey];
|
|
24760
|
-
const fieldName = `${name}.${fieldKey}`;
|
|
24761
|
-
const field = get(_fields, fieldName);
|
|
24762
|
-
(_names.array.has(name) ||
|
|
24763
|
-
!isPrimitive(fieldValue) ||
|
|
24764
|
-
(field && !field._f)) &&
|
|
24765
|
-
!isDateObject(fieldValue)
|
|
24766
|
-
? setValues(fieldName, fieldValue, options)
|
|
24767
|
-
: setFieldValue(fieldName, fieldValue, options);
|
|
24768
|
-
}
|
|
24769
|
-
};
|
|
24770
|
-
const setValue = (name, value, options = {}) => {
|
|
24771
|
-
const field = get(_fields, name);
|
|
24772
|
-
const isFieldArray = _names.array.has(name);
|
|
24773
|
-
const cloneValue = cloneObject(value);
|
|
24774
|
-
set(_formValues, name, cloneValue);
|
|
24775
|
-
if (isFieldArray) {
|
|
24776
|
-
_subjects.array.next({
|
|
24777
|
-
name,
|
|
24778
|
-
values: { ..._formValues },
|
|
24779
|
-
});
|
|
24780
|
-
if ((_proxyFormState.isDirty || _proxyFormState.dirtyFields) &&
|
|
24781
|
-
options.shouldDirty) {
|
|
24782
|
-
_subjects.state.next({
|
|
24783
|
-
name,
|
|
24784
|
-
dirtyFields: getDirtyFields(_defaultValues, _formValues),
|
|
24785
|
-
isDirty: _getDirty(name, cloneValue),
|
|
24786
|
-
});
|
|
24787
|
-
}
|
|
24788
|
-
}
|
|
24789
|
-
else {
|
|
24790
|
-
field && !field._f && !isNullOrUndefined(cloneValue)
|
|
24791
|
-
? setValues(name, cloneValue, options)
|
|
24792
|
-
: setFieldValue(name, cloneValue, options);
|
|
24793
|
-
}
|
|
24794
|
-
isWatched(name, _names) && _subjects.state.next({ ..._formState });
|
|
24795
|
-
_subjects.values.next({
|
|
24796
|
-
name: _state.mount ? name : undefined,
|
|
24797
|
-
values: { ..._formValues },
|
|
24798
|
-
});
|
|
24799
|
-
};
|
|
24800
|
-
const onChange = async (event) => {
|
|
24801
|
-
_state.mount = true;
|
|
24802
|
-
const target = event.target;
|
|
24803
|
-
let name = target.name;
|
|
24804
|
-
let isFieldValueUpdated = true;
|
|
24805
|
-
const field = get(_fields, name);
|
|
24806
|
-
const getCurrentFieldValue = () => target.type ? getFieldValue(field._f) : getEventValue(event);
|
|
24807
|
-
const _updateIsFieldValueUpdated = (fieldValue) => {
|
|
24808
|
-
isFieldValueUpdated =
|
|
24809
|
-
Number.isNaN(fieldValue) ||
|
|
24810
|
-
fieldValue === get(_formValues, name, fieldValue);
|
|
24811
|
-
};
|
|
24812
|
-
if (field) {
|
|
24813
|
-
let error;
|
|
24814
|
-
let isValid;
|
|
24815
|
-
const fieldValue = getCurrentFieldValue();
|
|
24816
|
-
const isBlurEvent = event.type === EVENTS.BLUR || event.type === EVENTS.FOCUS_OUT;
|
|
24817
|
-
const shouldSkipValidation = (!hasValidation(field._f) &&
|
|
24818
|
-
!_options.resolver &&
|
|
24819
|
-
!get(_formState.errors, name) &&
|
|
24820
|
-
!field._f.deps) ||
|
|
24821
|
-
skipValidation(isBlurEvent, get(_formState.touchedFields, name), _formState.isSubmitted, validationModeAfterSubmit, validationModeBeforeSubmit);
|
|
24822
|
-
const watched = isWatched(name, _names, isBlurEvent);
|
|
24823
|
-
set(_formValues, name, fieldValue);
|
|
24824
|
-
if (isBlurEvent) {
|
|
24825
|
-
field._f.onBlur && field._f.onBlur(event);
|
|
24826
|
-
delayErrorCallback && delayErrorCallback(0);
|
|
24827
|
-
}
|
|
24828
|
-
else if (field._f.onChange) {
|
|
24829
|
-
field._f.onChange(event);
|
|
24830
|
-
}
|
|
24831
|
-
const fieldState = updateTouchAndDirty(name, fieldValue, isBlurEvent, false);
|
|
24832
|
-
const shouldRender = !isEmptyObject(fieldState) || watched;
|
|
24833
|
-
!isBlurEvent &&
|
|
24834
|
-
_subjects.values.next({
|
|
24835
|
-
name,
|
|
24836
|
-
type: event.type,
|
|
24837
|
-
values: { ..._formValues },
|
|
24838
|
-
});
|
|
24839
|
-
if (shouldSkipValidation) {
|
|
24840
|
-
_proxyFormState.isValid && _updateValid();
|
|
24841
|
-
return (shouldRender &&
|
|
24842
|
-
_subjects.state.next({ name, ...(watched ? {} : fieldState) }));
|
|
24843
|
-
}
|
|
24844
|
-
!isBlurEvent && watched && _subjects.state.next({ ..._formState });
|
|
24845
|
-
if (_options.resolver) {
|
|
24846
|
-
const { errors } = await _executeSchema([name]);
|
|
24847
|
-
_updateIsFieldValueUpdated(fieldValue);
|
|
24848
|
-
if (isFieldValueUpdated) {
|
|
24849
|
-
const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);
|
|
24850
|
-
const errorLookupResult = schemaErrorLookup(errors, _fields, previousErrorLookupResult.name || name);
|
|
24851
|
-
error = errorLookupResult.error;
|
|
24852
|
-
name = errorLookupResult.name;
|
|
24853
|
-
isValid = isEmptyObject(errors);
|
|
24854
|
-
}
|
|
24855
|
-
}
|
|
24856
|
-
else {
|
|
24857
|
-
_updateIsValidating([name], true);
|
|
24858
|
-
error = (await validateField(field, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name];
|
|
24859
|
-
_updateIsValidating([name]);
|
|
24860
|
-
_updateIsFieldValueUpdated(fieldValue);
|
|
24861
|
-
if (isFieldValueUpdated) {
|
|
24862
|
-
if (error) {
|
|
24863
|
-
isValid = false;
|
|
24864
|
-
}
|
|
24865
|
-
else if (_proxyFormState.isValid) {
|
|
24866
|
-
isValid = await executeBuiltInValidation(_fields, true);
|
|
24867
|
-
}
|
|
24868
|
-
}
|
|
24869
|
-
}
|
|
24870
|
-
if (isFieldValueUpdated) {
|
|
24871
|
-
field._f.deps &&
|
|
24872
|
-
trigger(field._f.deps);
|
|
24873
|
-
shouldRenderByError(name, isValid, error, fieldState);
|
|
24874
|
-
}
|
|
24875
|
-
}
|
|
24876
|
-
};
|
|
24877
|
-
const _focusInput = (ref, key) => {
|
|
24878
|
-
if (get(_formState.errors, key) && ref.focus) {
|
|
24879
|
-
ref.focus();
|
|
24880
|
-
return 1;
|
|
24881
|
-
}
|
|
24882
|
-
return;
|
|
24883
|
-
};
|
|
24884
|
-
const trigger = async (name, options = {}) => {
|
|
24885
|
-
let isValid;
|
|
24886
|
-
let validationResult;
|
|
24887
|
-
const fieldNames = convertToArrayPayload(name);
|
|
24888
|
-
if (_options.resolver) {
|
|
24889
|
-
const errors = await executeSchemaAndUpdateState(isUndefined(name) ? name : fieldNames);
|
|
24890
|
-
isValid = isEmptyObject(errors);
|
|
24891
|
-
validationResult = name
|
|
24892
|
-
? !fieldNames.some((name) => get(errors, name))
|
|
24893
|
-
: isValid;
|
|
24894
|
-
}
|
|
24895
|
-
else if (name) {
|
|
24896
|
-
validationResult = (await Promise.all(fieldNames.map(async (fieldName) => {
|
|
24897
|
-
const field = get(_fields, fieldName);
|
|
24898
|
-
return await executeBuiltInValidation(field && field._f ? { [fieldName]: field } : field);
|
|
24899
|
-
}))).every(Boolean);
|
|
24900
|
-
!(!validationResult && !_formState.isValid) && _updateValid();
|
|
24901
|
-
}
|
|
24902
|
-
else {
|
|
24903
|
-
validationResult = isValid = await executeBuiltInValidation(_fields);
|
|
24904
|
-
}
|
|
24905
|
-
_subjects.state.next({
|
|
24906
|
-
...(!isString(name) ||
|
|
24907
|
-
(_proxyFormState.isValid && isValid !== _formState.isValid)
|
|
24908
|
-
? {}
|
|
24909
|
-
: { name }),
|
|
24910
|
-
...(_options.resolver || !name ? { isValid } : {}),
|
|
24911
|
-
errors: _formState.errors,
|
|
24912
|
-
});
|
|
24913
|
-
options.shouldFocus &&
|
|
24914
|
-
!validationResult &&
|
|
24915
|
-
iterateFieldsByAction(_fields, _focusInput, name ? fieldNames : _names.mount);
|
|
24916
|
-
return validationResult;
|
|
24917
|
-
};
|
|
24918
|
-
const getValues = (fieldNames) => {
|
|
24919
|
-
const values = {
|
|
24920
|
-
...(_state.mount ? _formValues : _defaultValues),
|
|
24921
|
-
};
|
|
24922
|
-
return isUndefined(fieldNames)
|
|
24923
|
-
? values
|
|
24924
|
-
: isString(fieldNames)
|
|
24925
|
-
? get(values, fieldNames)
|
|
24926
|
-
: fieldNames.map((name) => get(values, name));
|
|
24927
|
-
};
|
|
24928
|
-
const getFieldState = (name, formState) => ({
|
|
24929
|
-
invalid: !!get((formState || _formState).errors, name),
|
|
24930
|
-
isDirty: !!get((formState || _formState).dirtyFields, name),
|
|
24931
|
-
isTouched: !!get((formState || _formState).touchedFields, name),
|
|
24932
|
-
isValidating: !!get((formState || _formState).validatingFields, name),
|
|
24933
|
-
error: get((formState || _formState).errors, name),
|
|
24934
|
-
});
|
|
24935
|
-
const clearErrors = (name) => {
|
|
24936
|
-
name &&
|
|
24937
|
-
convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName));
|
|
24938
|
-
_subjects.state.next({
|
|
24939
|
-
errors: name ? _formState.errors : {},
|
|
24940
|
-
});
|
|
24941
|
-
};
|
|
24942
|
-
const setError = (name, error, options) => {
|
|
24943
|
-
const ref = (get(_fields, name, { _f: {} })._f || {}).ref;
|
|
24944
|
-
const currentError = get(_formState.errors, name) || {};
|
|
24945
|
-
// Don't override existing error messages elsewhere in the object tree.
|
|
24946
|
-
const { ref: currentRef, message, type, ...restOfErrorTree } = currentError;
|
|
24947
|
-
set(_formState.errors, name, {
|
|
24948
|
-
...restOfErrorTree,
|
|
24949
|
-
...error,
|
|
24950
|
-
ref,
|
|
24951
|
-
});
|
|
24952
|
-
_subjects.state.next({
|
|
24953
|
-
name,
|
|
24954
|
-
errors: _formState.errors,
|
|
24955
|
-
isValid: false,
|
|
24956
|
-
});
|
|
24957
|
-
options && options.shouldFocus && ref && ref.focus && ref.focus();
|
|
24958
|
-
};
|
|
24959
|
-
const watch = (name, defaultValue) => isFunction(name)
|
|
24960
|
-
? _subjects.values.subscribe({
|
|
24961
|
-
next: (payload) => name(_getWatch(undefined, defaultValue), payload),
|
|
24962
|
-
})
|
|
24963
|
-
: _getWatch(name, defaultValue, true);
|
|
24964
|
-
const unregister = (name, options = {}) => {
|
|
24965
|
-
for (const fieldName of name ? convertToArrayPayload(name) : _names.mount) {
|
|
24966
|
-
_names.mount.delete(fieldName);
|
|
24967
|
-
_names.array.delete(fieldName);
|
|
24968
|
-
if (!options.keepValue) {
|
|
24969
|
-
unset(_fields, fieldName);
|
|
24970
|
-
unset(_formValues, fieldName);
|
|
24971
|
-
}
|
|
24972
|
-
!options.keepError && unset(_formState.errors, fieldName);
|
|
24973
|
-
!options.keepDirty && unset(_formState.dirtyFields, fieldName);
|
|
24974
|
-
!options.keepTouched && unset(_formState.touchedFields, fieldName);
|
|
24975
|
-
!options.keepIsValidating &&
|
|
24976
|
-
unset(_formState.validatingFields, fieldName);
|
|
24977
|
-
!_options.shouldUnregister &&
|
|
24978
|
-
!options.keepDefaultValue &&
|
|
24979
|
-
unset(_defaultValues, fieldName);
|
|
24980
|
-
}
|
|
24981
|
-
_subjects.values.next({
|
|
24982
|
-
values: { ..._formValues },
|
|
24983
|
-
});
|
|
24984
|
-
_subjects.state.next({
|
|
24985
|
-
..._formState,
|
|
24986
|
-
...(!options.keepDirty ? {} : { isDirty: _getDirty() }),
|
|
24987
|
-
});
|
|
24988
|
-
!options.keepIsValid && _updateValid();
|
|
24989
|
-
};
|
|
24990
|
-
const _updateDisabledField = ({ disabled, name, field, fields, value, }) => {
|
|
24991
|
-
if ((isBoolean(disabled) && _state.mount) || !!disabled) {
|
|
24992
|
-
const inputValue = disabled
|
|
24993
|
-
? undefined
|
|
24994
|
-
: isUndefined(value)
|
|
24995
|
-
? getFieldValue(field ? field._f : get(fields, name)._f)
|
|
24996
|
-
: value;
|
|
24997
|
-
set(_formValues, name, inputValue);
|
|
24998
|
-
updateTouchAndDirty(name, inputValue, false, false, true);
|
|
24999
|
-
}
|
|
25000
|
-
};
|
|
25001
|
-
const register = (name, options = {}) => {
|
|
25002
|
-
let field = get(_fields, name);
|
|
25003
|
-
const disabledIsDefined = isBoolean(options.disabled);
|
|
25004
|
-
set(_fields, name, {
|
|
25005
|
-
...(field || {}),
|
|
25006
|
-
_f: {
|
|
25007
|
-
...(field && field._f ? field._f : { ref: { name } }),
|
|
25008
|
-
name,
|
|
25009
|
-
mount: true,
|
|
25010
|
-
...options,
|
|
25011
|
-
},
|
|
25012
|
-
});
|
|
25013
|
-
_names.mount.add(name);
|
|
25014
|
-
if (field) {
|
|
25015
|
-
_updateDisabledField({
|
|
25016
|
-
field,
|
|
25017
|
-
disabled: options.disabled,
|
|
25018
|
-
name,
|
|
25019
|
-
value: options.value,
|
|
25020
|
-
});
|
|
25021
|
-
}
|
|
25022
|
-
else {
|
|
25023
|
-
updateValidAndValue(name, true, options.value);
|
|
25024
|
-
}
|
|
25025
|
-
return {
|
|
25026
|
-
...(disabledIsDefined ? { disabled: options.disabled } : {}),
|
|
25027
|
-
...(_options.progressive
|
|
25028
|
-
? {
|
|
25029
|
-
required: !!options.required,
|
|
25030
|
-
min: getRuleValue(options.min),
|
|
25031
|
-
max: getRuleValue(options.max),
|
|
25032
|
-
minLength: getRuleValue(options.minLength),
|
|
25033
|
-
maxLength: getRuleValue(options.maxLength),
|
|
25034
|
-
pattern: getRuleValue(options.pattern),
|
|
25035
|
-
}
|
|
25036
|
-
: {}),
|
|
25037
|
-
name,
|
|
25038
|
-
onChange,
|
|
25039
|
-
onBlur: onChange,
|
|
25040
|
-
ref: (ref) => {
|
|
25041
|
-
if (ref) {
|
|
25042
|
-
register(name, options);
|
|
25043
|
-
field = get(_fields, name);
|
|
25044
|
-
const fieldRef = isUndefined(ref.value)
|
|
25045
|
-
? ref.querySelectorAll
|
|
25046
|
-
? ref.querySelectorAll('input,select,textarea')[0] || ref
|
|
25047
|
-
: ref
|
|
25048
|
-
: ref;
|
|
25049
|
-
const radioOrCheckbox = isRadioOrCheckbox(fieldRef);
|
|
25050
|
-
const refs = field._f.refs || [];
|
|
25051
|
-
if (radioOrCheckbox
|
|
25052
|
-
? refs.find((option) => option === fieldRef)
|
|
25053
|
-
: fieldRef === field._f.ref) {
|
|
25054
|
-
return;
|
|
25055
|
-
}
|
|
25056
|
-
set(_fields, name, {
|
|
25057
|
-
_f: {
|
|
25058
|
-
...field._f,
|
|
25059
|
-
...(radioOrCheckbox
|
|
25060
|
-
? {
|
|
25061
|
-
refs: [
|
|
25062
|
-
...refs.filter(live),
|
|
25063
|
-
fieldRef,
|
|
25064
|
-
...(Array.isArray(get(_defaultValues, name)) ? [{}] : []),
|
|
25065
|
-
],
|
|
25066
|
-
ref: { type: fieldRef.type, name },
|
|
25067
|
-
}
|
|
25068
|
-
: { ref: fieldRef }),
|
|
25069
|
-
},
|
|
25070
|
-
});
|
|
25071
|
-
updateValidAndValue(name, false, undefined, fieldRef);
|
|
25072
|
-
}
|
|
25073
|
-
else {
|
|
25074
|
-
field = get(_fields, name, {});
|
|
25075
|
-
if (field._f) {
|
|
25076
|
-
field._f.mount = false;
|
|
25077
|
-
}
|
|
25078
|
-
(_options.shouldUnregister || options.shouldUnregister) &&
|
|
25079
|
-
!(isNameInFieldArray(_names.array, name) && _state.action) &&
|
|
25080
|
-
_names.unMount.add(name);
|
|
25081
|
-
}
|
|
25082
|
-
},
|
|
25083
|
-
};
|
|
25084
|
-
};
|
|
25085
|
-
const _focusError = () => _options.shouldFocusError &&
|
|
25086
|
-
iterateFieldsByAction(_fields, _focusInput, _names.mount);
|
|
25087
|
-
const _disableForm = (disabled) => {
|
|
25088
|
-
if (isBoolean(disabled)) {
|
|
25089
|
-
_subjects.state.next({ disabled });
|
|
25090
|
-
iterateFieldsByAction(_fields, (ref, name) => {
|
|
25091
|
-
const currentField = get(_fields, name);
|
|
25092
|
-
if (currentField) {
|
|
25093
|
-
ref.disabled = currentField._f.disabled || disabled;
|
|
25094
|
-
if (Array.isArray(currentField._f.refs)) {
|
|
25095
|
-
currentField._f.refs.forEach((inputRef) => {
|
|
25096
|
-
inputRef.disabled = currentField._f.disabled || disabled;
|
|
25097
|
-
});
|
|
25098
|
-
}
|
|
25099
|
-
}
|
|
25100
|
-
}, 0, false);
|
|
25101
|
-
}
|
|
25102
|
-
};
|
|
25103
|
-
const handleSubmit = (onValid, onInvalid) => async (e) => {
|
|
25104
|
-
let onValidError = undefined;
|
|
25105
|
-
if (e) {
|
|
25106
|
-
e.preventDefault && e.preventDefault();
|
|
25107
|
-
e.persist && e.persist();
|
|
25108
|
-
}
|
|
25109
|
-
let fieldValues = cloneObject(_formValues);
|
|
25110
|
-
_subjects.state.next({
|
|
25111
|
-
isSubmitting: true,
|
|
25112
|
-
});
|
|
25113
|
-
if (_options.resolver) {
|
|
25114
|
-
const { errors, values } = await _executeSchema();
|
|
25115
|
-
_formState.errors = errors;
|
|
25116
|
-
fieldValues = values;
|
|
25117
|
-
}
|
|
25118
|
-
else {
|
|
25119
|
-
await executeBuiltInValidation(_fields);
|
|
25120
|
-
}
|
|
25121
|
-
unset(_formState.errors, 'root');
|
|
25122
|
-
if (isEmptyObject(_formState.errors)) {
|
|
25123
|
-
_subjects.state.next({
|
|
25124
|
-
errors: {},
|
|
25125
|
-
});
|
|
25126
|
-
try {
|
|
25127
|
-
await onValid(fieldValues, e);
|
|
25128
|
-
}
|
|
25129
|
-
catch (error) {
|
|
25130
|
-
onValidError = error;
|
|
25131
|
-
}
|
|
25132
|
-
}
|
|
25133
|
-
else {
|
|
25134
|
-
if (onInvalid) {
|
|
25135
|
-
await onInvalid({ ..._formState.errors }, e);
|
|
25136
|
-
}
|
|
25137
|
-
_focusError();
|
|
25138
|
-
setTimeout(_focusError);
|
|
25139
|
-
}
|
|
25140
|
-
_subjects.state.next({
|
|
25141
|
-
isSubmitted: true,
|
|
25142
|
-
isSubmitting: false,
|
|
25143
|
-
isSubmitSuccessful: isEmptyObject(_formState.errors) && !onValidError,
|
|
25144
|
-
submitCount: _formState.submitCount + 1,
|
|
25145
|
-
errors: _formState.errors,
|
|
25146
|
-
});
|
|
25147
|
-
if (onValidError) {
|
|
25148
|
-
throw onValidError;
|
|
25149
|
-
}
|
|
25150
|
-
};
|
|
25151
|
-
const resetField = (name, options = {}) => {
|
|
25152
|
-
if (get(_fields, name)) {
|
|
25153
|
-
if (isUndefined(options.defaultValue)) {
|
|
25154
|
-
setValue(name, cloneObject(get(_defaultValues, name)));
|
|
25155
|
-
}
|
|
25156
|
-
else {
|
|
25157
|
-
setValue(name, options.defaultValue);
|
|
25158
|
-
set(_defaultValues, name, cloneObject(options.defaultValue));
|
|
25159
|
-
}
|
|
25160
|
-
if (!options.keepTouched) {
|
|
25161
|
-
unset(_formState.touchedFields, name);
|
|
25162
|
-
}
|
|
25163
|
-
if (!options.keepDirty) {
|
|
25164
|
-
unset(_formState.dirtyFields, name);
|
|
25165
|
-
_formState.isDirty = options.defaultValue
|
|
25166
|
-
? _getDirty(name, cloneObject(get(_defaultValues, name)))
|
|
25167
|
-
: _getDirty();
|
|
25168
|
-
}
|
|
25169
|
-
if (!options.keepError) {
|
|
25170
|
-
unset(_formState.errors, name);
|
|
25171
|
-
_proxyFormState.isValid && _updateValid();
|
|
25172
|
-
}
|
|
25173
|
-
_subjects.state.next({ ..._formState });
|
|
25174
|
-
}
|
|
25175
|
-
};
|
|
25176
|
-
const _reset = (formValues, keepStateOptions = {}) => {
|
|
25177
|
-
const updatedValues = formValues ? cloneObject(formValues) : _defaultValues;
|
|
25178
|
-
const cloneUpdatedValues = cloneObject(updatedValues);
|
|
25179
|
-
const isEmptyResetValues = isEmptyObject(formValues);
|
|
25180
|
-
const values = isEmptyResetValues ? _defaultValues : cloneUpdatedValues;
|
|
25181
|
-
if (!keepStateOptions.keepDefaultValues) {
|
|
25182
|
-
_defaultValues = updatedValues;
|
|
25183
|
-
}
|
|
25184
|
-
if (!keepStateOptions.keepValues) {
|
|
25185
|
-
if (keepStateOptions.keepDirtyValues) {
|
|
25186
|
-
for (const fieldName of _names.mount) {
|
|
25187
|
-
get(_formState.dirtyFields, fieldName)
|
|
25188
|
-
? set(values, fieldName, get(_formValues, fieldName))
|
|
25189
|
-
: setValue(fieldName, get(values, fieldName));
|
|
25190
|
-
}
|
|
25191
|
-
}
|
|
25192
|
-
else {
|
|
25193
|
-
if (isWeb && isUndefined(formValues)) {
|
|
25194
|
-
for (const name of _names.mount) {
|
|
25195
|
-
const field = get(_fields, name);
|
|
25196
|
-
if (field && field._f) {
|
|
25197
|
-
const fieldReference = Array.isArray(field._f.refs)
|
|
25198
|
-
? field._f.refs[0]
|
|
25199
|
-
: field._f.ref;
|
|
25200
|
-
if (isHTMLElement(fieldReference)) {
|
|
25201
|
-
const form = fieldReference.closest('form');
|
|
25202
|
-
if (form) {
|
|
25203
|
-
form.reset();
|
|
25204
|
-
break;
|
|
25205
|
-
}
|
|
25206
|
-
}
|
|
25207
|
-
}
|
|
25208
|
-
}
|
|
25209
|
-
}
|
|
25210
|
-
_fields = {};
|
|
25211
|
-
}
|
|
25212
|
-
_formValues = props.shouldUnregister
|
|
25213
|
-
? keepStateOptions.keepDefaultValues
|
|
25214
|
-
? cloneObject(_defaultValues)
|
|
25215
|
-
: {}
|
|
25216
|
-
: cloneObject(values);
|
|
25217
|
-
_subjects.array.next({
|
|
25218
|
-
values: { ...values },
|
|
25219
|
-
});
|
|
25220
|
-
_subjects.values.next({
|
|
25221
|
-
values: { ...values },
|
|
25222
|
-
});
|
|
25223
|
-
}
|
|
25224
|
-
_names = {
|
|
25225
|
-
mount: keepStateOptions.keepDirtyValues ? _names.mount : new Set(),
|
|
25226
|
-
unMount: new Set(),
|
|
25227
|
-
array: new Set(),
|
|
25228
|
-
watch: new Set(),
|
|
25229
|
-
watchAll: false,
|
|
25230
|
-
focus: '',
|
|
25231
|
-
};
|
|
25232
|
-
_state.mount =
|
|
25233
|
-
!_proxyFormState.isValid ||
|
|
25234
|
-
!!keepStateOptions.keepIsValid ||
|
|
25235
|
-
!!keepStateOptions.keepDirtyValues;
|
|
25236
|
-
_state.watch = !!props.shouldUnregister;
|
|
25237
|
-
_subjects.state.next({
|
|
25238
|
-
submitCount: keepStateOptions.keepSubmitCount
|
|
25239
|
-
? _formState.submitCount
|
|
25240
|
-
: 0,
|
|
25241
|
-
isDirty: isEmptyResetValues
|
|
25242
|
-
? false
|
|
25243
|
-
: keepStateOptions.keepDirty
|
|
25244
|
-
? _formState.isDirty
|
|
25245
|
-
: !!(keepStateOptions.keepDefaultValues &&
|
|
25246
|
-
!deepEqual(formValues, _defaultValues)),
|
|
25247
|
-
isSubmitted: keepStateOptions.keepIsSubmitted
|
|
25248
|
-
? _formState.isSubmitted
|
|
25249
|
-
: false,
|
|
25250
|
-
dirtyFields: isEmptyResetValues
|
|
25251
|
-
? []
|
|
25252
|
-
: keepStateOptions.keepDirtyValues
|
|
25253
|
-
? keepStateOptions.keepDefaultValues && _formValues
|
|
25254
|
-
? getDirtyFields(_defaultValues, _formValues)
|
|
25255
|
-
: _formState.dirtyFields
|
|
25256
|
-
: keepStateOptions.keepDefaultValues && formValues
|
|
25257
|
-
? getDirtyFields(_defaultValues, formValues)
|
|
25258
|
-
: {},
|
|
25259
|
-
touchedFields: keepStateOptions.keepTouched
|
|
25260
|
-
? _formState.touchedFields
|
|
25261
|
-
: {},
|
|
25262
|
-
errors: keepStateOptions.keepErrors ? _formState.errors : {},
|
|
25263
|
-
isSubmitSuccessful: keepStateOptions.keepIsSubmitSuccessful
|
|
25264
|
-
? _formState.isSubmitSuccessful
|
|
25265
|
-
: false,
|
|
25266
|
-
isSubmitting: false,
|
|
25267
|
-
});
|
|
25268
|
-
};
|
|
25269
|
-
const reset = (formValues, keepStateOptions) => _reset(isFunction(formValues)
|
|
25270
|
-
? formValues(_formValues)
|
|
25271
|
-
: formValues, keepStateOptions);
|
|
25272
|
-
const setFocus = (name, options = {}) => {
|
|
25273
|
-
const field = get(_fields, name);
|
|
25274
|
-
const fieldReference = field && field._f;
|
|
25275
|
-
if (fieldReference) {
|
|
25276
|
-
const fieldRef = fieldReference.refs
|
|
25277
|
-
? fieldReference.refs[0]
|
|
25278
|
-
: fieldReference.ref;
|
|
25279
|
-
if (fieldRef.focus) {
|
|
25280
|
-
fieldRef.focus();
|
|
25281
|
-
options.shouldSelect && fieldRef.select();
|
|
25282
|
-
}
|
|
25283
|
-
}
|
|
25284
|
-
};
|
|
25285
|
-
const _updateFormState = (updatedFormState) => {
|
|
25286
|
-
_formState = {
|
|
25287
|
-
..._formState,
|
|
25288
|
-
...updatedFormState,
|
|
25289
|
-
};
|
|
25290
|
-
};
|
|
25291
|
-
const _resetDefaultValues = () => isFunction(_options.defaultValues) &&
|
|
25292
|
-
_options.defaultValues().then((values) => {
|
|
25293
|
-
reset(values, _options.resetOptions);
|
|
25294
|
-
_subjects.state.next({
|
|
25295
|
-
isLoading: false,
|
|
25296
|
-
});
|
|
25297
|
-
});
|
|
25298
|
-
return {
|
|
25299
|
-
control: {
|
|
25300
|
-
register,
|
|
25301
|
-
unregister,
|
|
25302
|
-
getFieldState,
|
|
25303
|
-
handleSubmit,
|
|
25304
|
-
setError,
|
|
25305
|
-
_executeSchema,
|
|
25306
|
-
_getWatch,
|
|
25307
|
-
_getDirty,
|
|
25308
|
-
_updateValid,
|
|
25309
|
-
_removeUnmounted,
|
|
25310
|
-
_updateFieldArray,
|
|
25311
|
-
_updateDisabledField,
|
|
25312
|
-
_getFieldArray,
|
|
25313
|
-
_reset,
|
|
25314
|
-
_resetDefaultValues,
|
|
25315
|
-
_updateFormState,
|
|
25316
|
-
_disableForm,
|
|
25317
|
-
_subjects,
|
|
25318
|
-
_proxyFormState,
|
|
25319
|
-
_setErrors,
|
|
25320
|
-
get _fields() {
|
|
25321
|
-
return _fields;
|
|
25322
|
-
},
|
|
25323
|
-
get _formValues() {
|
|
25324
|
-
return _formValues;
|
|
25325
|
-
},
|
|
25326
|
-
get _state() {
|
|
25327
|
-
return _state;
|
|
25328
|
-
},
|
|
25329
|
-
set _state(value) {
|
|
25330
|
-
_state = value;
|
|
25331
|
-
},
|
|
25332
|
-
get _defaultValues() {
|
|
25333
|
-
return _defaultValues;
|
|
25334
|
-
},
|
|
25335
|
-
get _names() {
|
|
25336
|
-
return _names;
|
|
25337
|
-
},
|
|
25338
|
-
set _names(value) {
|
|
25339
|
-
_names = value;
|
|
25340
|
-
},
|
|
25341
|
-
get _formState() {
|
|
25342
|
-
return _formState;
|
|
25343
|
-
},
|
|
25344
|
-
set _formState(value) {
|
|
25345
|
-
_formState = value;
|
|
25346
|
-
},
|
|
25347
|
-
get _options() {
|
|
25348
|
-
return _options;
|
|
25349
|
-
},
|
|
25350
|
-
set _options(value) {
|
|
25351
|
-
_options = {
|
|
25352
|
-
..._options,
|
|
25353
|
-
...value,
|
|
25354
|
-
};
|
|
25355
|
-
},
|
|
25356
|
-
},
|
|
25357
|
-
trigger,
|
|
25358
|
-
register,
|
|
25359
|
-
handleSubmit,
|
|
25360
|
-
watch,
|
|
25361
|
-
setValue,
|
|
25362
|
-
getValues,
|
|
25363
|
-
reset,
|
|
25364
|
-
resetField,
|
|
25365
|
-
clearErrors,
|
|
25366
|
-
unregister,
|
|
25367
|
-
setError,
|
|
25368
|
-
setFocus,
|
|
25369
|
-
getFieldState,
|
|
25370
|
-
};
|
|
25371
|
-
}
|
|
25372
|
-
|
|
25373
|
-
/**
|
|
25374
|
-
* Custom hook to manage the entire form.
|
|
25375
|
-
*
|
|
25376
|
-
* @remarks
|
|
25377
|
-
* [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)
|
|
25378
|
-
*
|
|
25379
|
-
* @param props - form configuration and validation parameters.
|
|
25380
|
-
*
|
|
25381
|
-
* @returns methods - individual functions to manage the form state. {@link UseFormReturn}
|
|
25382
|
-
*
|
|
25383
|
-
* @example
|
|
25384
|
-
* ```tsx
|
|
25385
|
-
* function App() {
|
|
25386
|
-
* const { register, handleSubmit, watch, formState: { errors } } = useForm();
|
|
25387
|
-
* const onSubmit = data => console.log(data);
|
|
25388
|
-
*
|
|
25389
|
-
* console.log(watch("example"));
|
|
25390
|
-
*
|
|
25391
|
-
* return (
|
|
25392
|
-
* <form onSubmit={handleSubmit(onSubmit)}>
|
|
25393
|
-
* <input defaultValue="test" {...register("example")} />
|
|
25394
|
-
* <input {...register("exampleRequired", { required: true })} />
|
|
25395
|
-
* {errors.exampleRequired && <span>This field is required</span>}
|
|
25396
|
-
* <button>Submit</button>
|
|
25397
|
-
* </form>
|
|
25398
|
-
* );
|
|
25399
|
-
* }
|
|
25400
|
-
* ```
|
|
25401
|
-
*/
|
|
25402
|
-
function useForm(props = {}) {
|
|
25403
|
-
const _formControl = React__default.useRef();
|
|
25404
|
-
const _values = React__default.useRef();
|
|
25405
|
-
const [formState, updateFormState] = React__default.useState({
|
|
25406
|
-
isDirty: false,
|
|
25407
|
-
isValidating: false,
|
|
25408
|
-
isLoading: isFunction(props.defaultValues),
|
|
25409
|
-
isSubmitted: false,
|
|
25410
|
-
isSubmitting: false,
|
|
25411
|
-
isSubmitSuccessful: false,
|
|
25412
|
-
isValid: false,
|
|
25413
|
-
submitCount: 0,
|
|
25414
|
-
dirtyFields: {},
|
|
25415
|
-
touchedFields: {},
|
|
25416
|
-
validatingFields: {},
|
|
25417
|
-
errors: props.errors || {},
|
|
25418
|
-
disabled: props.disabled || false,
|
|
25419
|
-
defaultValues: isFunction(props.defaultValues)
|
|
25420
|
-
? undefined
|
|
25421
|
-
: props.defaultValues,
|
|
25422
|
-
});
|
|
25423
|
-
if (!_formControl.current) {
|
|
25424
|
-
_formControl.current = {
|
|
25425
|
-
...createFormControl(props),
|
|
25426
|
-
formState,
|
|
25427
|
-
};
|
|
25428
|
-
}
|
|
25429
|
-
const control = _formControl.current.control;
|
|
25430
|
-
control._options = props;
|
|
25431
|
-
useSubscribe({
|
|
25432
|
-
subject: control._subjects.state,
|
|
25433
|
-
next: (value) => {
|
|
25434
|
-
if (shouldRenderFormState(value, control._proxyFormState, control._updateFormState, true)) {
|
|
25435
|
-
updateFormState({ ...control._formState });
|
|
25436
|
-
}
|
|
25437
|
-
},
|
|
25438
|
-
});
|
|
25439
|
-
React__default.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]);
|
|
25440
|
-
React__default.useEffect(() => {
|
|
25441
|
-
if (control._proxyFormState.isDirty) {
|
|
25442
|
-
const isDirty = control._getDirty();
|
|
25443
|
-
if (isDirty !== formState.isDirty) {
|
|
25444
|
-
control._subjects.state.next({
|
|
25445
|
-
isDirty,
|
|
25446
|
-
});
|
|
25447
|
-
}
|
|
25448
|
-
}
|
|
25449
|
-
}, [control, formState.isDirty]);
|
|
25450
|
-
React__default.useEffect(() => {
|
|
25451
|
-
if (props.values && !deepEqual(props.values, _values.current)) {
|
|
25452
|
-
control._reset(props.values, control._options.resetOptions);
|
|
25453
|
-
_values.current = props.values;
|
|
25454
|
-
updateFormState((state) => ({ ...state }));
|
|
25455
|
-
}
|
|
25456
|
-
else {
|
|
25457
|
-
control._resetDefaultValues();
|
|
25458
|
-
}
|
|
25459
|
-
}, [props.values, control]);
|
|
25460
|
-
React__default.useEffect(() => {
|
|
25461
|
-
if (props.errors) {
|
|
25462
|
-
control._setErrors(props.errors);
|
|
25463
|
-
}
|
|
25464
|
-
}, [props.errors, control]);
|
|
25465
|
-
React__default.useEffect(() => {
|
|
25466
|
-
if (!control._state.mount) {
|
|
25467
|
-
control._updateValid();
|
|
25468
|
-
control._state.mount = true;
|
|
25469
|
-
}
|
|
25470
|
-
if (control._state.watch) {
|
|
25471
|
-
control._state.watch = false;
|
|
25472
|
-
control._subjects.state.next({ ...control._formState });
|
|
25473
|
-
}
|
|
25474
|
-
control._removeUnmounted();
|
|
25475
|
-
});
|
|
25476
|
-
React__default.useEffect(() => {
|
|
25477
|
-
props.shouldUnregister &&
|
|
25478
|
-
control._subjects.values.next({
|
|
25479
|
-
values: control._getWatch(),
|
|
25480
|
-
});
|
|
25481
|
-
}, [props.shouldUnregister, control]);
|
|
25482
|
-
_formControl.current.formState = getProxyFormState(formState, control);
|
|
25483
|
-
return _formControl.current;
|
|
25484
|
-
}
|
|
25485
|
-
|
|
25486
|
-
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$1.isValidElement(t)?React$1.cloneElement(t,d):i?i({message:g||o,messages:u}):React$1.createElement(t||React$1.Fragment,d)};
|
|
23861
|
+
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$1.isValidElement(t)?React$1.cloneElement(t,d):i?i({message:g||o,messages:u}):React$1.createElement(t||React$1.Fragment,d)};
|
|
25487
23862
|
|
|
25488
23863
|
// TODO: remove this export once ClassNameGenerator is stable
|
|
25489
23864
|
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
@@ -42446,7 +40821,7 @@ function MultiSelectV1({ props }) {
|
|
|
42446
40821
|
} }), 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) => {
|
|
42447
40822
|
var _a;
|
|
42448
40823
|
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));
|
|
42449
|
-
})) : (jsxRuntimeExports.jsx(MenuItem, Object.assign({ disabled: true, value: "NA" }, { children: "No data Found" }), "NA"))] })), jsxRuntimeExports.jsx(s
|
|
40824
|
+
})) : (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 })) })] })) }));
|
|
42450
40825
|
}
|
|
42451
40826
|
|
|
42452
40827
|
var dayjs_min = {exports: {}};
|
|
@@ -47363,6 +45738,7 @@ const DateRangePickerComponent = ({ props }) => {
|
|
|
47363
45738
|
setOpen(false);
|
|
47364
45739
|
}
|
|
47365
45740
|
}, [props.getValues('ToDate')]);
|
|
45741
|
+
console.log(props.getValues('ToDate'), 'props.getValues');
|
|
47366
45742
|
console.log(props.getValues('FromDate'), props.getValues('FromDate'), 'from date range picker');
|
|
47367
45743
|
const value = props.getValues('FromDate') && props.getValues('ToDate')
|
|
47368
45744
|
? `${props.getValues('FromDate')} - ${props.getValues('ToDate')}`
|
|
@@ -47373,7 +45749,7 @@ const DateRangePickerComponent = ({ props }) => {
|
|
|
47373
45749
|
"& .css-1holvmy, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
|
|
47374
45750
|
top: "-10px",
|
|
47375
45751
|
},
|
|
47376
|
-
} }, { children: [jsxRuntimeExports.jsx(TextField, { label: props.item.label, value: value, className: "read-only", inputRef: textRef, sx: { width: '100%', '& input': { cursor: 'pointer' } }, onClick: () => {
|
|
45752
|
+
} }, { children: [jsxRuntimeExports.jsx(TextField, { label: props.item.label, value: value || null, className: "read-only", inputRef: textRef, sx: { width: '100%', '& input': { cursor: 'pointer' } }, onClick: () => {
|
|
47377
45753
|
setOpen(true);
|
|
47378
45754
|
} }), open && (jsxRuntimeExports.jsx(Box, Object.assign({ sx: {
|
|
47379
45755
|
position: "absolute",
|
|
@@ -51618,7 +49994,7 @@ const SingleSelect = ({ props }) => {
|
|
|
51618
49994
|
},
|
|
51619
49995
|
}, getOptionLabel: (option) => option.label, renderInput: (params) => {
|
|
51620
49996
|
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 })) })));
|
|
51621
|
-
}, isOptionEqualToValue: isOptionEqualToValue })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
49997
|
+
}, isOptionEqualToValue: isOptionEqualToValue })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
|
|
51622
49998
|
} }));
|
|
51623
49999
|
};
|
|
51624
50000
|
|
|
@@ -51635,7 +50011,7 @@ const PasswordField = ({ props }) => {
|
|
|
51635
50011
|
const handleTogglePasswordVisibility = () => {
|
|
51636
50012
|
setShowPassword((prevShowPassword) => !prevShowPassword);
|
|
51637
50013
|
};
|
|
51638
|
-
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:
|
|
50014
|
+
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: {
|
|
51639
50015
|
width: "100%",
|
|
51640
50016
|
"& .css-kichxs-MuiFormLabel-root-MuiInputLabel-root,.css-1holvmy": {
|
|
51641
50017
|
top: "-8px",
|
|
@@ -51645,7 +50021,17 @@ const PasswordField = ({ props }) => {
|
|
|
51645
50021
|
right: "14px",
|
|
51646
50022
|
top: "50%",
|
|
51647
50023
|
transform: "translateY(-50%)",
|
|
51648
|
-
}, "aria-label": "toggle password visibility", onClick: handleTogglePasswordVisibility, edge: "end" }, { children: showPassword ? (jsxRuntimeExports.jsx(Visibility, { sx: {
|
|
50024
|
+
}, "aria-label": "toggle password visibility", onClick: handleTogglePasswordVisibility, edge: "end" }, { children: showPassword ? (jsxRuntimeExports.jsx(Visibility, { sx: {
|
|
50025
|
+
fontSize: "12px",
|
|
50026
|
+
position: "absolute",
|
|
50027
|
+
top: "22%",
|
|
50028
|
+
right: 10,
|
|
50029
|
+
} })) : (jsxRuntimeExports.jsx(VisibilityOff, { sx: {
|
|
50030
|
+
fontSize: "12px",
|
|
50031
|
+
position: "absolute",
|
|
50032
|
+
top: "22%",
|
|
50033
|
+
right: 10,
|
|
50034
|
+
} })) }))] })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) })] })));
|
|
51649
50035
|
};
|
|
51650
50036
|
|
|
51651
50037
|
const Monthpickerrender = ({ props }) => {
|
|
@@ -51714,7 +50100,7 @@ const Monthpickerrender = ({ props }) => {
|
|
|
51714
50100
|
fontFamily: "Roboto-Reg",
|
|
51715
50101
|
fontSize: "11px",
|
|
51716
50102
|
color: "#3651d3",
|
|
51717
|
-
} }, { 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
|
|
50103
|
+
} }, { 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 }) })] }));
|
|
51718
50104
|
} }));
|
|
51719
50105
|
};
|
|
51720
50106
|
|
|
@@ -51744,7 +50130,7 @@ const DatepickerWrapperV2 = ({ props }) => {
|
|
|
51744
50130
|
// onFocus: () => inputTextRef.current?.blur(),
|
|
51745
50131
|
},
|
|
51746
50132
|
}, sx: {
|
|
51747
|
-
"& .css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root,.css-zy8vme,.css-1holvmy": {
|
|
50133
|
+
"& .css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root,.css-zy8vme,.css-1holvmy,.css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
|
|
51748
50134
|
top: "-10px !important",
|
|
51749
50135
|
},
|
|
51750
50136
|
"& input:hover": {
|
|
@@ -51754,7 +50140,7 @@ const DatepickerWrapperV2 = ({ props }) => {
|
|
|
51754
50140
|
fontFamily: "Roboto-Reg",
|
|
51755
50141
|
fontSize: "11px",
|
|
51756
50142
|
color: "#3651d3",
|
|
51757
|
-
} }, { 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
|
|
50143
|
+
} }, { 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 }) }))] }));
|
|
51758
50144
|
} }));
|
|
51759
50145
|
};
|
|
51760
50146
|
|
|
@@ -51775,7 +50161,7 @@ const FormRenderFileUpload = ({ props }) => {
|
|
|
51775
50161
|
[props.item.name]: file,
|
|
51776
50162
|
[props.item.name + "Name"]: fileName,
|
|
51777
50163
|
});
|
|
51778
|
-
}, sx: { width: "100%" } }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50164
|
+
}, sx: { width: "100%" } }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
|
|
51779
50165
|
};
|
|
51780
50166
|
|
|
51781
50167
|
const useStyles = makeStyles((theme) => ({
|
|
@@ -51798,7 +50184,7 @@ const SingleSelectNonAutoComplete = ({ props }) => {
|
|
|
51798
50184
|
fontSize: "11px",
|
|
51799
50185
|
fontFamily: "Roboto-Reg",
|
|
51800
50186
|
zIndex: 2000,
|
|
51801
|
-
}, value: item.value }, { children: item.label })))) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50187
|
+
}, value: item.value }, { children: item.label })))) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })));
|
|
51802
50188
|
};
|
|
51803
50189
|
|
|
51804
50190
|
function formatDateMonthAndYear(date) {
|
|
@@ -51845,11 +50231,11 @@ const RenderForm = (props) => {
|
|
|
51845
50231
|
},
|
|
51846
50232
|
},
|
|
51847
50233
|
// classes={{ option: { color: "red !important" } }}
|
|
51848
|
-
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: {
|
|
50234
|
+
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: {
|
|
51849
50235
|
fontFamily: "Roboto-Reg",
|
|
51850
50236
|
fontSize: "11px",
|
|
51851
50237
|
color: "#3651d3",
|
|
51852
|
-
} }, { 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
|
|
50238
|
+
} }, { 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 }) })] }));
|
|
51853
50239
|
} }) }));
|
|
51854
50240
|
case "register-number":
|
|
51855
50241
|
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(Controller, { control: props.control, name: props.item.name, render: ({ field }) => {
|
|
@@ -51860,7 +50246,9 @@ const RenderForm = (props) => {
|
|
|
51860
50246
|
border: "none",
|
|
51861
50247
|
},
|
|
51862
50248
|
}, onInput: (e) => {
|
|
51863
|
-
e.target.value = e.target.value
|
|
50249
|
+
e.target.value = e.target.value
|
|
50250
|
+
.replace(/\s/g, "")
|
|
50251
|
+
.replace(/[^a-zA-Z0-9!@#$%^&*()_+{}\[\]:;<>,.?/~`|\\-]/g, "");
|
|
51864
50252
|
}, sx: {
|
|
51865
50253
|
fontFamily: "Roboto-Reg",
|
|
51866
50254
|
"& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root, .css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
|
|
@@ -51888,7 +50276,7 @@ const RenderForm = (props) => {
|
|
|
51888
50276
|
fontFamily: "Roboto-Reg",
|
|
51889
50277
|
fontSize: "11px",
|
|
51890
50278
|
color: "#3651d3",
|
|
51891
|
-
} }, { 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
|
|
50279
|
+
} }, { 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 }) })] }));
|
|
51892
50280
|
} }) }));
|
|
51893
50281
|
case "password":
|
|
51894
50282
|
return (jsxRuntimeExports.jsx(Box, Object.assign({ position: "relative" }, { children: jsxRuntimeExports.jsx(PasswordField, { props: props }) })));
|
|
@@ -51904,10 +50292,11 @@ const RenderForm = (props) => {
|
|
|
51904
50292
|
// );
|
|
51905
50293
|
case "number":
|
|
51906
50294
|
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(Controller, { control: props.control, name: props.item.name, render: ({ field }) => {
|
|
51907
|
-
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) => {
|
|
50295
|
+
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) => {
|
|
51908
50296
|
var _a, _b;
|
|
51909
50297
|
e.target.value = e.target.value.replace(/[^0-9]/g, "");
|
|
51910
|
-
((_a = props === null || props === void 0 ? void 0 : props.item) === null || _a === void 0 ? void 0 : _a.onChangeFn) &&
|
|
50298
|
+
((_a = props === null || props === void 0 ? void 0 : props.item) === null || _a === void 0 ? void 0 : _a.onChangeFn) &&
|
|
50299
|
+
((_b = props === null || props === void 0 ? void 0 : props.item) === null || _b === void 0 ? void 0 : _b.onChangeFn(e.target.value));
|
|
51911
50300
|
(props === null || props === void 0 ? void 0 : props.clearErrors) && (props === null || props === void 0 ? void 0 : props.clearErrors(props.item.name));
|
|
51912
50301
|
}, sx: {
|
|
51913
50302
|
"& .css-1holvmy,.css-lqj8pz-MuiFormLabel-root-MuiInputLabel-root,.css-kichxs-MuiFormLabel-root-MuiInputLabel-root": {
|
|
@@ -51916,7 +50305,7 @@ const RenderForm = (props) => {
|
|
|
51916
50305
|
}, inputProps: {
|
|
51917
50306
|
pattern: "[0-9]*",
|
|
51918
50307
|
maxLength: props.item.maxLength || 20,
|
|
51919
|
-
}, disabled: props.item.disable })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50308
|
+
}, disabled: props.item.disable })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] }));
|
|
51920
50309
|
} }) }));
|
|
51921
50310
|
case "decimal":
|
|
51922
50311
|
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: {
|
|
@@ -51944,7 +50333,7 @@ const RenderForm = (props) => {
|
|
|
51944
50333
|
pattern: "[1-9]",
|
|
51945
50334
|
maxLength: 7,
|
|
51946
50335
|
},
|
|
51947
|
-
} })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50336
|
+
} })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }) }));
|
|
51948
50337
|
// case "alpha-numerical":
|
|
51949
50338
|
// return (
|
|
51950
50339
|
// <>
|
|
@@ -52153,12 +50542,12 @@ const RenderForm = (props) => {
|
|
|
52153
50542
|
},
|
|
52154
50543
|
}, label: props.item.label, views: ["year"], value: dayjs(field.value), onChange: (date) => field.onChange(date), slots: {
|
|
52155
50544
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
52156
|
-
textField: (textFieldProps) => jsxRuntimeExports.jsx(TextField, Object.assign({}, textFieldProps, { fullWidth: true, disabled: props.item.disable || false, InputLabelProps: {
|
|
50545
|
+
textField: (textFieldProps) => (jsxRuntimeExports.jsx(TextField, Object.assign({}, textFieldProps, { fullWidth: true, disabled: props.item.disable || false, InputLabelProps: {
|
|
52157
50546
|
shrink: true,
|
|
52158
50547
|
}, error: props.errors, inputProps: {
|
|
52159
50548
|
min: props.item.minDate,
|
|
52160
|
-
} }))
|
|
52161
|
-
} }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s
|
|
50549
|
+
} }))),
|
|
50550
|
+
} }) })), jsxRuntimeExports.jsx(ErrorMessageComponent, { children: jsxRuntimeExports.jsx(s, { errors: props.errors, name: props.item.name }) })] })) }) }));
|
|
52162
50551
|
case "dateRangePicker":
|
|
52163
50552
|
return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: jsxRuntimeExports.jsx(DateRangePickerComponent, { props: props }) }));
|
|
52164
50553
|
case "monthpicker":
|
|
@@ -52202,7 +50591,7 @@ const RenderForm = (props) => {
|
|
|
52202
50591
|
},
|
|
52203
50592
|
}, minRows: props.item.minRows || 1,
|
|
52204
50593
|
// maxRows={2}
|
|
52205
|
-
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
|
|
50594
|
+
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 }) })] })) }) }));
|
|
52206
50595
|
// case "textarea-normal":
|
|
52207
50596
|
// return (
|
|
52208
50597
|
// <>
|
|
@@ -52276,7 +50665,84 @@ const RenderForm = (props) => {
|
|
|
52276
50665
|
// </ErrorMessageComponent>
|
|
52277
50666
|
// </>
|
|
52278
50667
|
// );
|
|
50668
|
+
default:
|
|
50669
|
+
return jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, {});
|
|
50670
|
+
}
|
|
50671
|
+
};
|
|
50672
|
+
|
|
50673
|
+
const customTheme = createTheme({
|
|
50674
|
+
breakpoints: {
|
|
50675
|
+
values: {
|
|
50676
|
+
xs: 0,
|
|
50677
|
+
sm: 600,
|
|
50678
|
+
md: 900,
|
|
50679
|
+
lg: 1200,
|
|
50680
|
+
xl: 1536,
|
|
50681
|
+
},
|
|
50682
|
+
},
|
|
50683
|
+
typography: {
|
|
50684
|
+
fontFamily: 'Roboto-Reg'
|
|
50685
|
+
},
|
|
50686
|
+
palette: {
|
|
50687
|
+
// primary: {
|
|
50688
|
+
// // main: 'linear-gradient(135deg, #6379c3 0%, #546ee5 60%)',
|
|
50689
|
+
// },
|
|
50690
|
+
// secondary: {
|
|
50691
|
+
// main: 'linear-gradient(135deg, #6379c3 0%, #546ee5 60%)',
|
|
50692
|
+
// },
|
|
50693
|
+
},
|
|
50694
|
+
components: {
|
|
50695
|
+
MuiInputLabel: {
|
|
50696
|
+
styleOverrides: {
|
|
50697
|
+
root: {
|
|
50698
|
+
fontSize: '12px',
|
|
50699
|
+
},
|
|
50700
|
+
},
|
|
50701
|
+
},
|
|
50702
|
+
MuiInputBase: {
|
|
50703
|
+
styleOverrides: {
|
|
50704
|
+
root: {
|
|
50705
|
+
fontSize: '12px',
|
|
50706
|
+
input: {
|
|
50707
|
+
padding: '6.38px 14px',
|
|
50708
|
+
}
|
|
50709
|
+
}
|
|
50710
|
+
}
|
|
50711
|
+
},
|
|
50712
|
+
MuiRadio: {
|
|
50713
|
+
styleOverrides: {
|
|
50714
|
+
root: {
|
|
50715
|
+
padding: '4px 4px 0 8px'
|
|
50716
|
+
}
|
|
50717
|
+
}
|
|
50718
|
+
},
|
|
50719
|
+
MuiSelect: {
|
|
50720
|
+
styleOverrides: {
|
|
50721
|
+
select: {
|
|
50722
|
+
padding: '6.38px 32px 6.38px 14px'
|
|
50723
|
+
}
|
|
50724
|
+
}
|
|
50725
|
+
},
|
|
50726
|
+
MuiButton: {
|
|
50727
|
+
styleOverrides: {
|
|
50728
|
+
root: {
|
|
50729
|
+
fontFamily: 'Roboto-Reg',
|
|
50730
|
+
textTransform: 'none'
|
|
50731
|
+
}
|
|
50732
|
+
}
|
|
50733
|
+
}
|
|
52279
50734
|
}
|
|
50735
|
+
});
|
|
50736
|
+
|
|
50737
|
+
const FormRenderWrapper = ({ formArray, name, numberOfColumns = 3, form, }) => {
|
|
50738
|
+
// const formContext=useFormControl({
|
|
50739
|
+
// })
|
|
50740
|
+
// useEffect(() => {
|
|
50741
|
+
// // form.reset(initialValues, { resolver: yupResolver(validationSchema) });
|
|
50742
|
+
// }, [formArray, validationSchema, initialValues]);
|
|
50743
|
+
return (jsxRuntimeExports.jsx(ThemeProvider, Object.assign({ theme: customTheme }, { children: jsxRuntimeExports.jsx(FormComponent, Object.assign({ container: true, margin: "auto" }, { children: formArray.map((item, i) => {
|
|
50744
|
+
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));
|
|
50745
|
+
}) })) })));
|
|
52280
50746
|
};
|
|
52281
50747
|
|
|
52282
50748
|
/**
|
|
@@ -54516,11 +52982,7 @@ class ObjectSchema extends Schema {
|
|
|
54516
52982
|
}
|
|
54517
52983
|
create$3.prototype = ObjectSchema.prototype;
|
|
54518
52984
|
|
|
54519
|
-
|
|
54520
|
-
|
|
54521
|
-
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)}}}
|
|
54522
|
-
|
|
54523
|
-
const FormRenderWrapper = ({ formArray, name, setFormFunctions, numberOfColumns = 3 }) => {
|
|
52985
|
+
const useFormValidatingContext = (formArray) => {
|
|
54524
52986
|
const initialValues = {};
|
|
54525
52987
|
const validationShape = {};
|
|
54526
52988
|
formArray.forEach((field) => {
|
|
@@ -54543,7 +53005,7 @@ const FormRenderWrapper = ({ formArray, name, setFormFunctions, numberOfColumns
|
|
|
54543
53005
|
}
|
|
54544
53006
|
break;
|
|
54545
53007
|
case "password":
|
|
54546
|
-
initialValues[field.name] =
|
|
53008
|
+
initialValues[field.name] = "";
|
|
54547
53009
|
if (field.required) {
|
|
54548
53010
|
validationShape[field.name] = create$5()
|
|
54549
53011
|
.nullable()
|
|
@@ -54562,9 +53024,40 @@ const FormRenderWrapper = ({ formArray, name, setFormFunctions, numberOfColumns
|
|
|
54562
53024
|
case "multiselect":
|
|
54563
53025
|
initialValues[field.name] = null;
|
|
54564
53026
|
if (field.required) {
|
|
54565
|
-
validationShape[field.name] = validationShape[field.name] =
|
|
54566
|
-
|
|
54567
|
-
|
|
53027
|
+
validationShape[field.name] = validationShape[field.name] =
|
|
53028
|
+
create$6()
|
|
53029
|
+
.typeError(`Select atleast one ${field.label}`)
|
|
53030
|
+
.required(field.errorMessage);
|
|
53031
|
+
}
|
|
53032
|
+
break;
|
|
53033
|
+
case "datepicker":
|
|
53034
|
+
initialValues[field.name] = null;
|
|
53035
|
+
if (field.required) {
|
|
53036
|
+
validationShape[field.name] = validationShape[field.name] =
|
|
53037
|
+
create$6()
|
|
53038
|
+
.typeError(`Select ${field.label}`)
|
|
53039
|
+
.required(field.errorMessage);
|
|
53040
|
+
}
|
|
53041
|
+
break;
|
|
53042
|
+
case "dateRangePicker":
|
|
53043
|
+
const today = new Date();
|
|
53044
|
+
const day = String(today.getDate()).padStart(2, "0");
|
|
53045
|
+
const month = String(today.getMonth() + 1).padStart(2, "0"); // January is 0!
|
|
53046
|
+
const year = today.getFullYear();
|
|
53047
|
+
const formattedDate = `${day}/${month}/${year}`;
|
|
53048
|
+
const threeMonthsAgo = new Date(today);
|
|
53049
|
+
threeMonthsAgo.setMonth(today.getMonth() - 3);
|
|
53050
|
+
const dayBeforeThreeMonths = String(threeMonthsAgo.getDate()).padStart(2, "0");
|
|
53051
|
+
const monthBeforeThreeMonths = String(threeMonthsAgo.getMonth() + 1).padStart(2, "0"); // January is 0!
|
|
53052
|
+
const yearBeforeThreeMonths = threeMonthsAgo.getFullYear();
|
|
53053
|
+
const formattedDateForThreeMonths = `${dayBeforeThreeMonths}/${monthBeforeThreeMonths}/${yearBeforeThreeMonths}`;
|
|
53054
|
+
initialValues["FromDate"] = formattedDateForThreeMonths;
|
|
53055
|
+
initialValues["ToDate"] = formattedDate;
|
|
53056
|
+
if (field.required) {
|
|
53057
|
+
validationShape[field.name] = validationShape[field.name] =
|
|
53058
|
+
create$6()
|
|
53059
|
+
.typeError(`Select ${field.label}`)
|
|
53060
|
+
.required(field.errorMessage);
|
|
54568
53061
|
}
|
|
54569
53062
|
break;
|
|
54570
53063
|
default:
|
|
@@ -54576,36 +53069,8 @@ const FormRenderWrapper = ({ formArray, name, setFormFunctions, numberOfColumns
|
|
|
54576
53069
|
}
|
|
54577
53070
|
});
|
|
54578
53071
|
const validationSchema = create$3().shape(validationShape);
|
|
54579
|
-
|
|
54580
|
-
|
|
54581
|
-
|
|
54582
|
-
|
|
54583
|
-
useEffect(() => {
|
|
54584
|
-
setFormFunctions({
|
|
54585
|
-
handleSubmit,
|
|
54586
|
-
setValue,
|
|
54587
|
-
clearErrors,
|
|
54588
|
-
watch,
|
|
54589
|
-
control,
|
|
54590
|
-
getValues,
|
|
54591
|
-
reset,
|
|
54592
|
-
});
|
|
54593
|
-
}, [
|
|
54594
|
-
handleSubmit,
|
|
54595
|
-
setFormFunctions,
|
|
54596
|
-
setValue,
|
|
54597
|
-
watch,
|
|
54598
|
-
register,
|
|
54599
|
-
control,
|
|
54600
|
-
errors,
|
|
54601
|
-
getValues,
|
|
54602
|
-
reset,
|
|
54603
|
-
clearErrors,
|
|
54604
|
-
]);
|
|
54605
|
-
return jsxRuntimeExports.jsx(FormComponent, Object.assign({ container: true, margin: "auto" }, { children: formArray.map((item, i) => {
|
|
54606
|
-
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));
|
|
54607
|
-
}) }));
|
|
54608
|
-
};
|
|
54609
|
-
|
|
54610
|
-
export { Button$1 as Button, FormRenderWrapper as RenderForm };
|
|
53072
|
+
return { validationSchema, initialValues };
|
|
53073
|
+
};
|
|
53074
|
+
|
|
53075
|
+
export { Button$1 as Button, FormRenderWrapper as RenderForm, useFormValidatingContext };
|
|
54611
53076
|
//# sourceMappingURL=index.esm.js.map
|