@react-aria/form 3.1.3 → 3.1.5
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.
|
@@ -1,6 +1,6 @@
|
|
|
1
|
+
var $j3sn1$reactariautils = require("@react-aria/utils");
|
|
1
2
|
var $j3sn1$reactariainteractions = require("@react-aria/interactions");
|
|
2
3
|
var $j3sn1$react = require("react");
|
|
3
|
-
var $j3sn1$reactariautils = require("@react-aria/utils");
|
|
4
4
|
|
|
5
5
|
|
|
6
6
|
function $parcel$export(e, n, v, s) {
|
|
@@ -69,7 +69,7 @@ function $9da8e3f192aba981$export$b8473d3665f3a75a(props, state, ref) {
|
|
|
69
69
|
// This is best-effort. There may be false positives, e.g. setTimeout.
|
|
70
70
|
form.reset = ()=>{
|
|
71
71
|
// React uses MessageChannel for scheduling, so ignore 'message' events.
|
|
72
|
-
isIgnoredReset.current = !window.event || window.event.type === 'message' && window.event
|
|
72
|
+
isIgnoredReset.current = !window.event || window.event.type === 'message' && (0, $j3sn1$reactariautils.getEventTarget)(window.event) instanceof MessagePort;
|
|
73
73
|
reset === null || reset === void 0 ? void 0 : reset.call(form);
|
|
74
74
|
isIgnoredReset.current = false;
|
|
75
75
|
};
|
|
@@ -117,8 +117,9 @@ function $9da8e3f192aba981$var$getNativeValidity(input) {
|
|
|
117
117
|
}
|
|
118
118
|
function $9da8e3f192aba981$var$getFirstInvalidInput(form) {
|
|
119
119
|
for(let i = 0; i < form.elements.length; i++){
|
|
120
|
+
var _element_validity;
|
|
120
121
|
let element = form.elements[i];
|
|
121
|
-
if (
|
|
122
|
+
if (((_element_validity = element.validity) === null || _element_validity === void 0 ? void 0 : _element_validity.valid) === false) return element;
|
|
122
123
|
}
|
|
123
124
|
return null;
|
|
124
125
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;AAcM,SAAS,0CAAqB,KAA6B,EAAE,KAA0B,EAAE,GAAqD;IACnJ,IAAI,sBAAC,kBAAkB,SAAE,KAAK,EAAC,GAAG;IAElC,iIAAiI;IACjI,CAAA,GAAA,qCAAc,EAAE;QACd,IAAI,uBAAuB,aAAY,gBAAA,0BAAA,IAAK,OAAO,KAAI,CAAC,IAAI,OAAO,CAAC,QAAQ,EAAE;YAC5E,IAAI,eAAe,MAAM,kBAAkB,CAAC,SAAS,GAAG,MAAM,kBAAkB,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,mBAAmB;YAClI,IAAI,OAAO,CAAC,iBAAiB,CAAC;YAE9B,kDAAkD;YAClD,sDAAsD;YACtD,IAAI,CAAC,IAAI,OAAO,CAAC,YAAY,CAAC,UAC5B,IAAI,OAAO,CAAC,KAAK,GAAG;YAGtB,IAAI,CAAC,MAAM,kBAAkB,CAAC,SAAS,EACrC,MAAM,gBAAgB,CAAC,wCAAkB,IAAI,OAAO;QAExD;IACF;IAEA,IAAI,iBAAiB,CAAA,GAAA,mBAAK,EAAE;IAC5B,IAAI,UAAU,CAAA,GAAA,oCAAa,EAAE;QAC3B,IAAI,CAAC,eAAe,OAAO,EACzB,MAAM,eAAe;IAEzB;IAEA,IAAI,YAAY,CAAA,GAAA,oCAAa,EAAE,CAAC;YAQnB;QAPX,+DAA+D;QAC/D,wEAAwE;QACxE,IAAI,CAAC,MAAM,iBAAiB,CAAC,SAAS,EACpC,MAAM,gBAAgB;QAGxB,oGAAoG;QACpG,IAAI,OAAO,gBAAA,2BAAA,eAAA,IAAK,OAAO,cAAZ,mCAAA,aAAc,IAAI;QAC7B,IAAI,CAAC,EAAE,gBAAgB,IAAI,OAAO,QAAQ,2CAAqB,UAAU,IAAI,OAAO,EAAE;gBAIlF;YAHF,IAAI,OACF;kBAEA,gBAAA,IAAI,OAAO,cAAX,oCAAA,cAAa,KAAK;YAGpB,0BAA0B;YAC1B,CAAA,GAAA,mDAAqB,EAAE;QACzB;QAEA,mDAAmD;QACnD,EAAE,cAAc;IAClB;IAEA,IAAI,WAAW,CAAA,GAAA,oCAAa,EAAE;QAC5B,MAAM,gBAAgB;IACxB;IAEA,CAAA,GAAA,sBAAQ,EAAE;QACR,IAAI,QAAQ,gBAAA,0BAAA,IAAK,OAAO;QACxB,IAAI,CAAC,OACH;QAGF,IAAI,OAAO,MAAM,IAAI;QAErB,IAAI,QAAQ,iBAAA,2BAAA,KAAM,KAAK;QACvB,IAAI,MACF,wEAAwE;QACxE,yDAAyD;QACzD,kFAAkF;QAClF,sEAAsE;QACtE,KAAK,KAAK,GAAG;YACX,wEAAwE;YACxE,eAAe,OAAO,GAAG,CAAC,OAAO,KAAK,IAAK,OAAO,KAAK,CAAC,IAAI,KAAK,aAAa,OAAO,KAAK,
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/form/src/useFormValidation.ts"],"sourcesContent":["/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {FormValidationState} from '@react-stately/form';\nimport {getEventTarget, useEffectEvent, useLayoutEffect} from '@react-aria/utils';\nimport {RefObject, Validation, ValidationResult} from '@react-types/shared';\nimport {setInteractionModality} from '@react-aria/interactions';\nimport {useEffect, useRef} from 'react';\n\ntype ValidatableElement = HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;\n\ninterface FormValidationProps<T> extends Validation<T> {\n focus?: () => void\n}\n\nexport function useFormValidation<T>(props: FormValidationProps<T>, state: FormValidationState, ref: RefObject<ValidatableElement | null> | undefined): void {\n let {validationBehavior, focus} = props;\n\n // This is a useLayoutEffect so that it runs before the useEffect in useFormValidationState, which commits the validation change.\n useLayoutEffect(() => {\n if (validationBehavior === 'native' && ref?.current && !ref.current.disabled) {\n let errorMessage = state.realtimeValidation.isInvalid ? state.realtimeValidation.validationErrors.join(' ') || 'Invalid value.' : '';\n ref.current.setCustomValidity(errorMessage);\n\n // Prevent default tooltip for validation message.\n // https://bugzilla.mozilla.org/show_bug.cgi?id=605277\n if (!ref.current.hasAttribute('title')) {\n ref.current.title = '';\n }\n\n if (!state.realtimeValidation.isInvalid) {\n state.updateValidation(getNativeValidity(ref.current));\n }\n }\n });\n\n let isIgnoredReset = useRef(false);\n let onReset = useEffectEvent(() => {\n if (!isIgnoredReset.current) {\n state.resetValidation();\n }\n });\n\n let onInvalid = useEffectEvent((e: Event) => {\n // Only commit validation if we are not already displaying one.\n // This avoids clearing server errors that the user didn't actually fix.\n if (!state.displayValidation.isInvalid) {\n state.commitValidation();\n }\n\n // Auto focus the first invalid input in a form, unless the error already had its default prevented.\n let form = ref?.current?.form;\n if (!e.defaultPrevented && ref && form && getFirstInvalidInput(form) === ref.current) {\n if (focus) {\n focus();\n } else {\n ref.current?.focus();\n }\n\n // Always show focus ring.\n setInteractionModality('keyboard');\n }\n\n // Prevent default browser error UI from appearing.\n e.preventDefault();\n });\n\n let onChange = useEffectEvent(() => {\n state.commitValidation();\n });\n\n useEffect(() => {\n let input = ref?.current;\n if (!input) {\n return;\n }\n\n let form = input.form;\n\n let reset = form?.reset;\n if (form) {\n // Try to detect React's automatic form reset behavior so we don't clear\n // validation errors that are returned by server actions.\n // To do this, we ignore programmatic form resets that occur outside a user event.\n // This is best-effort. There may be false positives, e.g. setTimeout.\n form.reset = () => {\n // React uses MessageChannel for scheduling, so ignore 'message' events.\n isIgnoredReset.current = !window.event || (window.event.type === 'message' && getEventTarget(window.event) instanceof MessagePort);\n reset?.call(form);\n isIgnoredReset.current = false;\n };\n }\n\n input.addEventListener('invalid', onInvalid);\n input.addEventListener('change', onChange);\n form?.addEventListener('reset', onReset);\n return () => {\n input!.removeEventListener('invalid', onInvalid);\n input!.removeEventListener('change', onChange);\n form?.removeEventListener('reset', onReset);\n if (form) {\n // @ts-ignore\n form.reset = reset;\n }\n };\n }, [ref, validationBehavior]);\n}\n\nfunction getValidity(input: ValidatableElement) {\n // The native ValidityState object is live, meaning each property is a getter that returns the current state.\n // We need to create a snapshot of the validity state at the time this function is called to avoid unpredictable React renders.\n let validity = input.validity;\n return {\n badInput: validity.badInput,\n customError: validity.customError,\n patternMismatch: validity.patternMismatch,\n rangeOverflow: validity.rangeOverflow,\n rangeUnderflow: validity.rangeUnderflow,\n stepMismatch: validity.stepMismatch,\n tooLong: validity.tooLong,\n tooShort: validity.tooShort,\n typeMismatch: validity.typeMismatch,\n valueMissing: validity.valueMissing,\n valid: validity.valid\n };\n}\n\nfunction getNativeValidity(input: ValidatableElement): ValidationResult {\n return {\n isInvalid: !input.validity.valid,\n validationDetails: getValidity(input),\n validationErrors: input.validationMessage ? [input.validationMessage] : []\n };\n}\n\nfunction getFirstInvalidInput(form: HTMLFormElement): ValidatableElement | null {\n for (let i = 0; i < form.elements.length; i++) {\n let element = form.elements[i] as ValidatableElement;\n if (element.validity?.valid === false) {\n return element;\n }\n }\n\n return null;\n}\n"],"names":[],"version":3,"file":"useFormValidation.main.js.map"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
+
import {useLayoutEffect as $9Gacy$useLayoutEffect, useEffectEvent as $9Gacy$useEffectEvent, getEventTarget as $9Gacy$getEventTarget} from "@react-aria/utils";
|
|
1
2
|
import {setInteractionModality as $9Gacy$setInteractionModality} from "@react-aria/interactions";
|
|
2
3
|
import {useRef as $9Gacy$useRef, useEffect as $9Gacy$useEffect} from "react";
|
|
3
|
-
import {useLayoutEffect as $9Gacy$useLayoutEffect, useEffectEvent as $9Gacy$useEffectEvent} from "@react-aria/utils";
|
|
4
4
|
|
|
5
5
|
/*
|
|
6
6
|
* Copyright 2023 Adobe. All rights reserved.
|
|
@@ -63,7 +63,7 @@ function $e93e671b31057976$export$b8473d3665f3a75a(props, state, ref) {
|
|
|
63
63
|
// This is best-effort. There may be false positives, e.g. setTimeout.
|
|
64
64
|
form.reset = ()=>{
|
|
65
65
|
// React uses MessageChannel for scheduling, so ignore 'message' events.
|
|
66
|
-
isIgnoredReset.current = !window.event || window.event.type === 'message' && window.event
|
|
66
|
+
isIgnoredReset.current = !window.event || window.event.type === 'message' && (0, $9Gacy$getEventTarget)(window.event) instanceof MessagePort;
|
|
67
67
|
reset === null || reset === void 0 ? void 0 : reset.call(form);
|
|
68
68
|
isIgnoredReset.current = false;
|
|
69
69
|
};
|
|
@@ -111,8 +111,9 @@ function $e93e671b31057976$var$getNativeValidity(input) {
|
|
|
111
111
|
}
|
|
112
112
|
function $e93e671b31057976$var$getFirstInvalidInput(form) {
|
|
113
113
|
for(let i = 0; i < form.elements.length; i++){
|
|
114
|
+
var _element_validity;
|
|
114
115
|
let element = form.elements[i];
|
|
115
|
-
if (
|
|
116
|
+
if (((_element_validity = element.validity) === null || _element_validity === void 0 ? void 0 : _element_validity.valid) === false) return element;
|
|
116
117
|
}
|
|
117
118
|
return null;
|
|
118
119
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
+
import {useLayoutEffect as $9Gacy$useLayoutEffect, useEffectEvent as $9Gacy$useEffectEvent, getEventTarget as $9Gacy$getEventTarget} from "@react-aria/utils";
|
|
1
2
|
import {setInteractionModality as $9Gacy$setInteractionModality} from "@react-aria/interactions";
|
|
2
3
|
import {useRef as $9Gacy$useRef, useEffect as $9Gacy$useEffect} from "react";
|
|
3
|
-
import {useLayoutEffect as $9Gacy$useLayoutEffect, useEffectEvent as $9Gacy$useEffectEvent} from "@react-aria/utils";
|
|
4
4
|
|
|
5
5
|
/*
|
|
6
6
|
* Copyright 2023 Adobe. All rights reserved.
|
|
@@ -63,7 +63,7 @@ function $e93e671b31057976$export$b8473d3665f3a75a(props, state, ref) {
|
|
|
63
63
|
// This is best-effort. There may be false positives, e.g. setTimeout.
|
|
64
64
|
form.reset = ()=>{
|
|
65
65
|
// React uses MessageChannel for scheduling, so ignore 'message' events.
|
|
66
|
-
isIgnoredReset.current = !window.event || window.event.type === 'message' && window.event
|
|
66
|
+
isIgnoredReset.current = !window.event || window.event.type === 'message' && (0, $9Gacy$getEventTarget)(window.event) instanceof MessagePort;
|
|
67
67
|
reset === null || reset === void 0 ? void 0 : reset.call(form);
|
|
68
68
|
isIgnoredReset.current = false;
|
|
69
69
|
};
|
|
@@ -111,8 +111,9 @@ function $e93e671b31057976$var$getNativeValidity(input) {
|
|
|
111
111
|
}
|
|
112
112
|
function $e93e671b31057976$var$getFirstInvalidInput(form) {
|
|
113
113
|
for(let i = 0; i < form.elements.length; i++){
|
|
114
|
+
var _element_validity;
|
|
114
115
|
let element = form.elements[i];
|
|
115
|
-
if (
|
|
116
|
+
if (((_element_validity = element.validity) === null || _element_validity === void 0 ? void 0 : _element_validity.valid) === false) return element;
|
|
116
117
|
}
|
|
117
118
|
return null;
|
|
118
119
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;AAAA;;;;;;;;;;CAUC;;;AAcM,SAAS,0CAAqB,KAA6B,EAAE,KAA0B,EAAE,GAAqD;IACnJ,IAAI,sBAAC,kBAAkB,SAAE,KAAK,EAAC,GAAG;IAElC,iIAAiI;IACjI,CAAA,GAAA,sBAAc,EAAE;QACd,IAAI,uBAAuB,aAAY,gBAAA,0BAAA,IAAK,OAAO,KAAI,CAAC,IAAI,OAAO,CAAC,QAAQ,EAAE;YAC5E,IAAI,eAAe,MAAM,kBAAkB,CAAC,SAAS,GAAG,MAAM,kBAAkB,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,mBAAmB;YAClI,IAAI,OAAO,CAAC,iBAAiB,CAAC;YAE9B,kDAAkD;YAClD,sDAAsD;YACtD,IAAI,CAAC,IAAI,OAAO,CAAC,YAAY,CAAC,UAC5B,IAAI,OAAO,CAAC,KAAK,GAAG;YAGtB,IAAI,CAAC,MAAM,kBAAkB,CAAC,SAAS,EACrC,MAAM,gBAAgB,CAAC,wCAAkB,IAAI,OAAO;QAExD;IACF;IAEA,IAAI,iBAAiB,CAAA,GAAA,aAAK,EAAE;IAC5B,IAAI,UAAU,CAAA,GAAA,qBAAa,EAAE;QAC3B,IAAI,CAAC,eAAe,OAAO,EACzB,MAAM,eAAe;IAEzB;IAEA,IAAI,YAAY,CAAA,GAAA,qBAAa,EAAE,CAAC;YAQnB;QAPX,+DAA+D;QAC/D,wEAAwE;QACxE,IAAI,CAAC,MAAM,iBAAiB,CAAC,SAAS,EACpC,MAAM,gBAAgB;QAGxB,oGAAoG;QACpG,IAAI,OAAO,gBAAA,2BAAA,eAAA,IAAK,OAAO,cAAZ,mCAAA,aAAc,IAAI;QAC7B,IAAI,CAAC,EAAE,gBAAgB,IAAI,OAAO,QAAQ,2CAAqB,UAAU,IAAI,OAAO,EAAE;gBAIlF;YAHF,IAAI,OACF;kBAEA,gBAAA,IAAI,OAAO,cAAX,oCAAA,cAAa,KAAK;YAGpB,0BAA0B;YAC1B,CAAA,GAAA,6BAAqB,EAAE;QACzB;QAEA,mDAAmD;QACnD,EAAE,cAAc;IAClB;IAEA,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE;QAC5B,MAAM,gBAAgB;IACxB;IAEA,CAAA,GAAA,gBAAQ,EAAE;QACR,IAAI,QAAQ,gBAAA,0BAAA,IAAK,OAAO;QACxB,IAAI,CAAC,OACH;QAGF,IAAI,OAAO,MAAM,IAAI;QAErB,IAAI,QAAQ,iBAAA,2BAAA,KAAM,KAAK;QACvB,IAAI,MACF,wEAAwE;QACxE,yDAAyD;QACzD,kFAAkF;QAClF,sEAAsE;QACtE,KAAK,KAAK,GAAG;YACX,wEAAwE;YACxE,eAAe,OAAO,GAAG,CAAC,OAAO,KAAK,IAAK,OAAO,KAAK,CAAC,IAAI,KAAK,aAAa,OAAO,KAAK,
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/form/src/useFormValidation.ts"],"sourcesContent":["/*\n * Copyright 2023 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {FormValidationState} from '@react-stately/form';\nimport {getEventTarget, useEffectEvent, useLayoutEffect} from '@react-aria/utils';\nimport {RefObject, Validation, ValidationResult} from '@react-types/shared';\nimport {setInteractionModality} from '@react-aria/interactions';\nimport {useEffect, useRef} from 'react';\n\ntype ValidatableElement = HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;\n\ninterface FormValidationProps<T> extends Validation<T> {\n focus?: () => void\n}\n\nexport function useFormValidation<T>(props: FormValidationProps<T>, state: FormValidationState, ref: RefObject<ValidatableElement | null> | undefined): void {\n let {validationBehavior, focus} = props;\n\n // This is a useLayoutEffect so that it runs before the useEffect in useFormValidationState, which commits the validation change.\n useLayoutEffect(() => {\n if (validationBehavior === 'native' && ref?.current && !ref.current.disabled) {\n let errorMessage = state.realtimeValidation.isInvalid ? state.realtimeValidation.validationErrors.join(' ') || 'Invalid value.' : '';\n ref.current.setCustomValidity(errorMessage);\n\n // Prevent default tooltip for validation message.\n // https://bugzilla.mozilla.org/show_bug.cgi?id=605277\n if (!ref.current.hasAttribute('title')) {\n ref.current.title = '';\n }\n\n if (!state.realtimeValidation.isInvalid) {\n state.updateValidation(getNativeValidity(ref.current));\n }\n }\n });\n\n let isIgnoredReset = useRef(false);\n let onReset = useEffectEvent(() => {\n if (!isIgnoredReset.current) {\n state.resetValidation();\n }\n });\n\n let onInvalid = useEffectEvent((e: Event) => {\n // Only commit validation if we are not already displaying one.\n // This avoids clearing server errors that the user didn't actually fix.\n if (!state.displayValidation.isInvalid) {\n state.commitValidation();\n }\n\n // Auto focus the first invalid input in a form, unless the error already had its default prevented.\n let form = ref?.current?.form;\n if (!e.defaultPrevented && ref && form && getFirstInvalidInput(form) === ref.current) {\n if (focus) {\n focus();\n } else {\n ref.current?.focus();\n }\n\n // Always show focus ring.\n setInteractionModality('keyboard');\n }\n\n // Prevent default browser error UI from appearing.\n e.preventDefault();\n });\n\n let onChange = useEffectEvent(() => {\n state.commitValidation();\n });\n\n useEffect(() => {\n let input = ref?.current;\n if (!input) {\n return;\n }\n\n let form = input.form;\n\n let reset = form?.reset;\n if (form) {\n // Try to detect React's automatic form reset behavior so we don't clear\n // validation errors that are returned by server actions.\n // To do this, we ignore programmatic form resets that occur outside a user event.\n // This is best-effort. There may be false positives, e.g. setTimeout.\n form.reset = () => {\n // React uses MessageChannel for scheduling, so ignore 'message' events.\n isIgnoredReset.current = !window.event || (window.event.type === 'message' && getEventTarget(window.event) instanceof MessagePort);\n reset?.call(form);\n isIgnoredReset.current = false;\n };\n }\n\n input.addEventListener('invalid', onInvalid);\n input.addEventListener('change', onChange);\n form?.addEventListener('reset', onReset);\n return () => {\n input!.removeEventListener('invalid', onInvalid);\n input!.removeEventListener('change', onChange);\n form?.removeEventListener('reset', onReset);\n if (form) {\n // @ts-ignore\n form.reset = reset;\n }\n };\n }, [ref, validationBehavior]);\n}\n\nfunction getValidity(input: ValidatableElement) {\n // The native ValidityState object is live, meaning each property is a getter that returns the current state.\n // We need to create a snapshot of the validity state at the time this function is called to avoid unpredictable React renders.\n let validity = input.validity;\n return {\n badInput: validity.badInput,\n customError: validity.customError,\n patternMismatch: validity.patternMismatch,\n rangeOverflow: validity.rangeOverflow,\n rangeUnderflow: validity.rangeUnderflow,\n stepMismatch: validity.stepMismatch,\n tooLong: validity.tooLong,\n tooShort: validity.tooShort,\n typeMismatch: validity.typeMismatch,\n valueMissing: validity.valueMissing,\n valid: validity.valid\n };\n}\n\nfunction getNativeValidity(input: ValidatableElement): ValidationResult {\n return {\n isInvalid: !input.validity.valid,\n validationDetails: getValidity(input),\n validationErrors: input.validationMessage ? [input.validationMessage] : []\n };\n}\n\nfunction getFirstInvalidInput(form: HTMLFormElement): ValidatableElement | null {\n for (let i = 0; i < form.elements.length; i++) {\n let element = form.elements[i] as ValidatableElement;\n if (element.validity?.valid === false) {\n return element;\n }\n }\n\n return null;\n}\n"],"names":[],"version":3,"file":"useFormValidation.module.js.map"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-aria/form",
|
|
3
|
-
"version": "3.1.
|
|
3
|
+
"version": "3.1.5",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -26,10 +26,10 @@
|
|
|
26
26
|
"url": "https://github.com/adobe/react-spectrum"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@react-aria/interactions": "^3.
|
|
30
|
-
"@react-aria/utils": "^3.
|
|
31
|
-
"@react-stately/form": "^3.2.
|
|
32
|
-
"@react-types/shared": "^3.
|
|
29
|
+
"@react-aria/interactions": "^3.27.1",
|
|
30
|
+
"@react-aria/utils": "^3.33.1",
|
|
31
|
+
"@react-stately/form": "^3.2.4",
|
|
32
|
+
"@react-types/shared": "^3.33.1",
|
|
33
33
|
"@swc/helpers": "^0.5.0"
|
|
34
34
|
},
|
|
35
35
|
"peerDependencies": {
|
|
@@ -39,5 +39,5 @@
|
|
|
39
39
|
"publishConfig": {
|
|
40
40
|
"access": "public"
|
|
41
41
|
},
|
|
42
|
-
"gitHead": "
|
|
42
|
+
"gitHead": "8df187370053aa35f553cb388ad670f65e1ab371"
|
|
43
43
|
}
|
package/src/useFormValidation.ts
CHANGED
|
@@ -11,10 +11,10 @@
|
|
|
11
11
|
*/
|
|
12
12
|
|
|
13
13
|
import {FormValidationState} from '@react-stately/form';
|
|
14
|
+
import {getEventTarget, useEffectEvent, useLayoutEffect} from '@react-aria/utils';
|
|
14
15
|
import {RefObject, Validation, ValidationResult} from '@react-types/shared';
|
|
15
16
|
import {setInteractionModality} from '@react-aria/interactions';
|
|
16
17
|
import {useEffect, useRef} from 'react';
|
|
17
|
-
import {useEffectEvent, useLayoutEffect} from '@react-aria/utils';
|
|
18
18
|
|
|
19
19
|
type ValidatableElement = HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;
|
|
20
20
|
|
|
@@ -94,7 +94,7 @@ export function useFormValidation<T>(props: FormValidationProps<T>, state: FormV
|
|
|
94
94
|
// This is best-effort. There may be false positives, e.g. setTimeout.
|
|
95
95
|
form.reset = () => {
|
|
96
96
|
// React uses MessageChannel for scheduling, so ignore 'message' events.
|
|
97
|
-
isIgnoredReset.current = !window.event || (window.event.type === 'message' && window.event
|
|
97
|
+
isIgnoredReset.current = !window.event || (window.event.type === 'message' && getEventTarget(window.event) instanceof MessagePort);
|
|
98
98
|
reset?.call(form);
|
|
99
99
|
isIgnoredReset.current = false;
|
|
100
100
|
};
|
|
@@ -145,7 +145,7 @@ function getNativeValidity(input: ValidatableElement): ValidationResult {
|
|
|
145
145
|
function getFirstInvalidInput(form: HTMLFormElement): ValidatableElement | null {
|
|
146
146
|
for (let i = 0; i < form.elements.length; i++) {
|
|
147
147
|
let element = form.elements[i] as ValidatableElement;
|
|
148
|
-
if (
|
|
148
|
+
if (element.validity?.valid === false) {
|
|
149
149
|
return element;
|
|
150
150
|
}
|
|
151
151
|
}
|