@danderson00/react-forms 0.0.33 → 0.0.36
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/Form.js +15 -7
- package/dist/Form.js.map +1 -1
- package/dist/input.js +3 -1
- package/dist/input.js.map +1 -1
- package/dist/submit.js +3 -2
- package/dist/submit.js.map +1 -1
- package/package.json +1 -1
- package/src/Form.js +8 -5
- package/src/input.js +1 -1
- package/src/submit.js +1 -1
package/dist/Form.js
CHANGED
|
@@ -97,15 +97,22 @@ var Form = function Form(ContextProvider) {
|
|
|
97
97
|
setFieldValues(function (previousValues) {
|
|
98
98
|
return (0, _objectPathImmutable.set)(previousValues, path, value);
|
|
99
99
|
});
|
|
100
|
-
|
|
100
|
+
|
|
101
|
+
if (form.current) {
|
|
102
|
+
setValid(form.current.checkValidity());
|
|
103
|
+
}
|
|
101
104
|
};
|
|
102
105
|
|
|
103
|
-
var onSubmit = function onSubmit(e
|
|
104
|
-
var
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
106
|
+
var onSubmit = function onSubmit(e) {
|
|
107
|
+
var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
|
108
|
+
additionalValues = _ref2.additionalValues,
|
|
109
|
+
validate = _ref2.validate;
|
|
110
|
+
|
|
111
|
+
if (validate !== false) {
|
|
112
|
+
fieldValidators.forEach(function (setFieldValidated) {
|
|
113
|
+
return setFieldValidated();
|
|
114
|
+
});
|
|
115
|
+
}
|
|
109
116
|
|
|
110
117
|
if ((validate === false || form.current.checkValidity()) && props.onSubmit) {
|
|
111
118
|
setError(undefined);
|
|
@@ -150,6 +157,7 @@ var Form = function Form(ContextProvider) {
|
|
|
150
157
|
}
|
|
151
158
|
|
|
152
159
|
e && e.preventDefault && e.preventDefault();
|
|
160
|
+
e && e.stopPropagation && e.stopPropagation();
|
|
153
161
|
};
|
|
154
162
|
|
|
155
163
|
var classNames = ['react-forms', props.className];
|
package/dist/Form.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form.js","names":["Form","ContextProvider","additionalContext","ErrorMessage","resetOnSubmit","row","gap","props","useState","values","fieldValues","setFieldValues","useReducer","validators","validator","fieldValidators","registerFieldValidator","error","setError","valid","setValid","form","createRef","useEffect","current","checkValidity","getFieldValue","path","get","getFieldValues","mapFieldValues","target","Object","keys","reduce","name","set","setFieldValue","value","previousValues","onSubmit","e","additionalValues","
|
|
1
|
+
{"version":3,"file":"Form.js","names":["Form","ContextProvider","additionalContext","ErrorMessage","resetOnSubmit","row","gap","props","useState","values","fieldValues","setFieldValues","useReducer","validators","validator","fieldValidators","registerFieldValidator","error","setError","valid","setValid","form","createRef","useEffect","current","checkValidity","getFieldValue","path","get","getFieldValues","mapFieldValues","target","Object","keys","reduce","name","set","setFieldValue","value","previousValues","onSubmit","e","additionalValues","validate","forEach","setFieldValidated","undefined","interactiveElements","querySelectorAll","setFormDisabled","disabled","x","reset","checkResultForError","result","success","message","then","preventDefault","stopPropagation","classNames","className","push","mergedAdditionalContext","property","createElement","join","noValidate","ref","style","children","key","type","visibility","position"],"sources":["../src/Form.js"],"sourcesContent":["import { createElement, createRef, useEffect, useReducer, useState } from 'react'\nimport { get, set } from 'object-path-immutable'\n\nconst Form = (ContextProvider, additionalContext = {}, ErrorMessage) => (\n ({ resetOnSubmit, row, gap, ...props }) => {\n const [fieldValues, setFieldValues] = useState(props.values || {})\n const [fieldValidators, registerFieldValidator] = useReducer((validators, validator) => [...validators, validator], [])\n const [error, setError] = useState()\n const [valid, setValid] = useState()\n const form = createRef()\n\n useEffect(() => {\n if(form.current) {\n setValid(form.current.checkValidity())\n }\n }, [form.current])\n\n const getFieldValue = path => get(fieldValues, path)\n const getFieldValues = () => fieldValues\n const mapFieldValues = target => Object.keys(target).reduce(\n (values, name) => set(values, name, target[name]),\n {}\n )\n\n const setFieldValue = (path, value) => {\n setFieldValues(previousValues => set(previousValues, path, value))\n if(form.current) {\n setValid(form.current.checkValidity())\n }\n }\n\n const onSubmit = (e, { additionalValues, validate } = {}) => {\n if(validate !== false) {\n fieldValidators.forEach(setFieldValidated => setFieldValidated())\n }\n\n if((validate === false || form.current.checkValidity()) && props.onSubmit) {\n setError(undefined)\n\n const interactiveElements = form.current.querySelectorAll('input,button,textarea,select')\n const setFormDisabled = disabled => interactiveElements.forEach(x => x.disabled = disabled)\n\n const reset = () => {\n if(resetOnSubmit) {\n setFieldValues(props.values || {})\n }\n }\n\n try {\n const checkResultForError = result => {\n if(result && (result.success === false || result.error)) {\n setError(result.error || result.message || 'Form submission failed')\n } else {\n reset()\n }\n return result\n }\n\n const result = props.onSubmit(mapFieldValues({ ...fieldValues, ...additionalValues }))\n if(result && typeof result.then === 'function') {\n setFormDisabled(true)\n result\n .then(checkResultForError)\n .catch(setError)\n .finally(() => setFormDisabled(false))\n } else {\n reset()\n }\n } catch(error) {\n setError(error)\n }\n }\n\n e && e.preventDefault && e.preventDefault()\n e && e.stopPropagation && e.stopPropagation()\n }\n\n const classNames = ['react-forms', props.className]\n if(row) {\n classNames.push('react-forms-row')\n }\n\n const mergedAdditionalContext = Object.keys(additionalContext).reduce(\n (result, property) => ({ ...result, [property]: props[property] || additionalContext[property] }),\n {}\n )\n\n return (\n createElement('form', {\n ...props,\n className: classNames.join(' '),\n noValidate: true,\n onSubmit: onSubmit,\n ref: form,\n ...(gap && { style: { gap } }),\n children: [\n createElement(ContextProvider, {\n ...props,\n key: 'context',\n value: {\n registerFieldValidator,\n setFieldValue,\n getFieldValue,\n getFieldValues,\n onSubmit,\n valid,\n ...mergedAdditionalContext\n }\n }),\n error && createElement(ErrorMessage, { key: 'error', error }),\n createElement('input', {\n key: 'submit',\n type: 'submit',\n style: {\n visibility: 'hidden',\n position: 'absolute'\n }\n }),\n ]\n })\n )\n }\n)\nexport default Form"],"mappings":"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"}
|
package/dist/input.js
CHANGED
|
@@ -148,7 +148,9 @@ var _default = function _default(render) {
|
|
|
148
148
|
if (submitOnChange && submitHandler) {
|
|
149
149
|
// the setFieldValue above sets state on the Form component, used in the onSubmit handler
|
|
150
150
|
// setting state requires an additional render cycle - we need to pass in the new value so it's set correctly
|
|
151
|
-
submitHandler(undefined,
|
|
151
|
+
submitHandler(undefined, {
|
|
152
|
+
additionalValues: _defineProperty({}, name, applyValueTransforms(elementValue))
|
|
153
|
+
});
|
|
152
154
|
}
|
|
153
155
|
};
|
|
154
156
|
|
package/dist/input.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input.js","names":["nextElementId","id","render","options","Input","props","name","Error","setFieldValue","useState","fieldValidated","setFieldValidated","error","setError","previousValueProp","usePrevious","value","groups","throttle","onSubmit","map","group","submitHandler","createThrottled","isNaN","useEffect","getFieldValue","registerFieldValidator","types","setInitialValue","applyValueTransforms","undefined","set","element","document","querySelector","updateValidationState","useUpdate","onChange","args","event","submitOnChange","valueFromEvent","getOutputValue","elementValue","apply","target","checkValidity","onBlur","submitOnBlur","onFocus","selectOnFocus","selectText","selectionStart","selectionEnd","length","setTimeout","onKeyDown","numeric","exec","key","includes","keyCode","preventDefault","Boolean","passErrorProp","getValueProps","type","checked","defaultValue","getFieldValues","valid","passThroughProps","valueProps","currentValue","numericProps","typeProps","errorProps","className","finalProps"],"sources":["../src/input.js"],"sourcesContent":["import { useState, useEffect } from 'react'\nimport usePrevious from './usePrevious'\nimport useUpdate from './useUpdate'\nimport types from './inputTypes'\nimport createThrottled from './throttle'\n\nconst nextElementId = (id => () => `react-forms-${++id}`)(0)\n\nexport default (render, options = {}) => function Input(props) {\n if (!props.name) throw new Error(\"You must provide a name prop to form components\")\n if (!props.setFieldValue) throw new Error(\"Input components must be contained within a Form component\")\n\n const [fieldValidated, setFieldValidated] = useState(false)\n const [error, setError] = useState(false)\n const [id] = useState(props.id || nextElementId())\n const previousValueProp = usePrevious(props.value)\n\n // this is currently broken :-\\\n const { groups = [], throttle, onSubmit } = props\n const name = groups.map(group => group + '.') + props.name\n const submitHandler = (throttle && onSubmit) ? createThrottled(onSubmit, isNaN(throttle) ? 200 : throttle) : onSubmit\n\n useEffect(() => {\n const { getFieldValue, setFieldValue, registerFieldValidator } = props\n const { setInitialValue, applyValueTransforms } = types(props, options)\n\n // don't override values that were set from passing a values prop to the form\n if(getFieldValue(name) === undefined) {\n // TODO: change setter to a getter and return a private `UNSET` symbol to indicate not to call the field setter\n // this allows us to set the default value with useState above and not have an initial render cycle without the default value\n // BUT... to get the default value of a select list, we need to render it first? dilemma....\n\n setInitialValue({\n // pass a setter function - radio buttons do not always want to set a value!\n set: value => setFieldValue(name, applyValueTransforms(value)),\n element: document.querySelector(`#${id}`)\n })\n }\n registerFieldValidator(updateValidationState)\n\n // TODO: need to unregister in case of dynamic form elements\n }, [])\n\n // ensure form values are updated to reflect passed `value` prop\n // this probably introduces some redundancy with the onChange handler below\n useUpdate(() => {\n const { value, setFieldValue } = props\n const { applyValueTransforms } = types(props, options)\n\n if(value !== previousValueProp) {\n setFieldValue(name, applyValueTransforms(value))\n }\n }, [props])\n\n // TODO: refactor bubbling to prop pattern\n const onChange = (...args) => {\n const [event] = args\n const { setFieldValue, onChange, submitOnChange } = props\n const { valueFromEvent } = options\n const { getOutputValue, applyValueTransforms } = types(props, options)\n\n const elementValue = valueFromEvent\n ? valueFromEvent.apply(null, args)\n : getOutputValue({ event })\n\n setFieldValue(name, applyValueTransforms(elementValue))\n\n if(event && event.target && event.target.checkValidity) {\n event.target.checkValidity()\n updateValidationState()\n }\n\n if(onChange) {\n onChange.apply(event.target, args)\n }\n\n if(submitOnChange && submitHandler) {\n // the setFieldValue above sets state on the Form component, used in the onSubmit handler\n // setting state requires an additional render cycle - we need to pass in the new value so it's set correctly\n submitHandler(undefined, { [name]: applyValueTransforms(elementValue) })\n }\n }\n\n const onBlur = (...args) => {\n const { submitOnBlur, onSubmit, onBlur } = props\n const [event] = args\n\n if(submitOnBlur) {\n onSubmit()\n }\n if(onBlur) {\n onBlur.apply(event.target, args)\n }\n }\n\n const onFocus = (...args) => {\n const { selectOnFocus, onFocus } = props\n const [event] = args\n const element = event.target\n\n const selectText = () => {\n element.selectionStart = 0\n element.selectionEnd = element.value.length\n }\n\n if(selectOnFocus) {\n selectText()\n setTimeout(selectText)\n }\n if(onFocus) {\n onFocus.apply(element, args)\n }\n }\n\n const onKeyDown = (...args) => {\n const { onKeyDown } = props\n const [event] = args\n const element = event.target\n \n if(props.numeric && !/[0-9-]/.exec(event.key) && ![null, 0, 8, 9, 13, 27, 35, 36, 37, 39, 46].includes(event.keyCode)) {\n event.preventDefault()\n }\n\n if(onKeyDown) {\n onKeyDown.apply(element, args)\n }\n }\n\n\n const updateValidationState = () => {\n setFieldValidated(true)\n // this is a little hacky, but the simplest way I could think of to determine the\n // validity of the actual input element. :invalid is also not supported by enzyme\n setError(Boolean(document.querySelector(`#${id}:invalid`)))\n }\n\n /* render */ {\n const { passErrorProp } = options\n const { getValueProps } = types(props, options)\n\n const {\n type, value, checked, defaultValue, numeric,\n onSubmit, registerFieldValidator, setFieldValue, getFieldValue, getFieldValues,\n submitOnChange, submitOnBlur, selectOnFocus, throttle, valid,\n ...passThroughProps\n } = props\n const valueProps = getValueProps({ currentValue: getFieldValue(name) })\n const numericProps = (numeric && { type: 'number' })\n const typeProps = (type && { type })\n const errorProps = (passErrorProp && { error })\n const className = ((fieldValidated ? 'validated ' : '') + (props.className || '') || undefined)\n\n const finalProps = {\n id, name, className,\n ...passThroughProps, ...valueProps, ...numericProps, ...typeProps, ...errorProps,\n onChange, onFocus, onBlur, onKeyDown\n }\n\n return render(finalProps)\n }\n}"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"input.js","names":["nextElementId","id","render","options","Input","props","name","Error","setFieldValue","useState","fieldValidated","setFieldValidated","error","setError","previousValueProp","usePrevious","value","groups","throttle","onSubmit","map","group","submitHandler","createThrottled","isNaN","useEffect","getFieldValue","registerFieldValidator","types","setInitialValue","applyValueTransforms","undefined","set","element","document","querySelector","updateValidationState","useUpdate","onChange","args","event","submitOnChange","valueFromEvent","getOutputValue","elementValue","apply","target","checkValidity","additionalValues","onBlur","submitOnBlur","onFocus","selectOnFocus","selectText","selectionStart","selectionEnd","length","setTimeout","onKeyDown","numeric","exec","key","includes","keyCode","preventDefault","Boolean","passErrorProp","getValueProps","type","checked","defaultValue","getFieldValues","valid","passThroughProps","valueProps","currentValue","numericProps","typeProps","errorProps","className","finalProps"],"sources":["../src/input.js"],"sourcesContent":["import { useState, useEffect } from 'react'\nimport usePrevious from './usePrevious'\nimport useUpdate from './useUpdate'\nimport types from './inputTypes'\nimport createThrottled from './throttle'\n\nconst nextElementId = (id => () => `react-forms-${++id}`)(0)\n\nexport default (render, options = {}) => function Input(props) {\n if (!props.name) throw new Error(\"You must provide a name prop to form components\")\n if (!props.setFieldValue) throw new Error(\"Input components must be contained within a Form component\")\n\n const [fieldValidated, setFieldValidated] = useState(false)\n const [error, setError] = useState(false)\n const [id] = useState(props.id || nextElementId())\n const previousValueProp = usePrevious(props.value)\n\n // this is currently broken :-\\\n const { groups = [], throttle, onSubmit } = props\n const name = groups.map(group => group + '.') + props.name\n const submitHandler = (throttle && onSubmit) ? createThrottled(onSubmit, isNaN(throttle) ? 200 : throttle) : onSubmit\n\n useEffect(() => {\n const { getFieldValue, setFieldValue, registerFieldValidator } = props\n const { setInitialValue, applyValueTransforms } = types(props, options)\n\n // don't override values that were set from passing a values prop to the form\n if(getFieldValue(name) === undefined) {\n // TODO: change setter to a getter and return a private `UNSET` symbol to indicate not to call the field setter\n // this allows us to set the default value with useState above and not have an initial render cycle without the default value\n // BUT... to get the default value of a select list, we need to render it first? dilemma....\n\n setInitialValue({\n // pass a setter function - radio buttons do not always want to set a value!\n set: value => setFieldValue(name, applyValueTransforms(value)),\n element: document.querySelector(`#${id}`)\n })\n }\n registerFieldValidator(updateValidationState)\n\n // TODO: need to unregister in case of dynamic form elements\n }, [])\n\n // ensure form values are updated to reflect passed `value` prop\n // this probably introduces some redundancy with the onChange handler below\n useUpdate(() => {\n const { value, setFieldValue } = props\n const { applyValueTransforms } = types(props, options)\n\n if(value !== previousValueProp) {\n setFieldValue(name, applyValueTransforms(value))\n }\n }, [props])\n\n // TODO: refactor bubbling to prop pattern\n const onChange = (...args) => {\n const [event] = args\n const { setFieldValue, onChange, submitOnChange } = props\n const { valueFromEvent } = options\n const { getOutputValue, applyValueTransforms } = types(props, options)\n\n const elementValue = valueFromEvent\n ? valueFromEvent.apply(null, args)\n : getOutputValue({ event })\n\n setFieldValue(name, applyValueTransforms(elementValue))\n\n if(event && event.target && event.target.checkValidity) {\n event.target.checkValidity()\n updateValidationState()\n }\n\n if(onChange) {\n onChange.apply(event.target, args)\n }\n\n if(submitOnChange && submitHandler) {\n // the setFieldValue above sets state on the Form component, used in the onSubmit handler\n // setting state requires an additional render cycle - we need to pass in the new value so it's set correctly\n submitHandler(undefined, { additionalValues: { [name]: applyValueTransforms(elementValue) } })\n }\n }\n\n const onBlur = (...args) => {\n const { submitOnBlur, onSubmit, onBlur } = props\n const [event] = args\n\n if(submitOnBlur) {\n onSubmit()\n }\n if(onBlur) {\n onBlur.apply(event.target, args)\n }\n }\n\n const onFocus = (...args) => {\n const { selectOnFocus, onFocus } = props\n const [event] = args\n const element = event.target\n\n const selectText = () => {\n element.selectionStart = 0\n element.selectionEnd = element.value.length\n }\n\n if(selectOnFocus) {\n selectText()\n setTimeout(selectText)\n }\n if(onFocus) {\n onFocus.apply(element, args)\n }\n }\n\n const onKeyDown = (...args) => {\n const { onKeyDown } = props\n const [event] = args\n const element = event.target\n \n if(props.numeric && !/[0-9-]/.exec(event.key) && ![null, 0, 8, 9, 13, 27, 35, 36, 37, 39, 46].includes(event.keyCode)) {\n event.preventDefault()\n }\n\n if(onKeyDown) {\n onKeyDown.apply(element, args)\n }\n }\n\n\n const updateValidationState = () => {\n setFieldValidated(true)\n // this is a little hacky, but the simplest way I could think of to determine the\n // validity of the actual input element. :invalid is also not supported by enzyme\n setError(Boolean(document.querySelector(`#${id}:invalid`)))\n }\n\n /* render */ {\n const { passErrorProp } = options\n const { getValueProps } = types(props, options)\n\n const {\n type, value, checked, defaultValue, numeric,\n onSubmit, registerFieldValidator, setFieldValue, getFieldValue, getFieldValues,\n submitOnChange, submitOnBlur, selectOnFocus, throttle, valid,\n ...passThroughProps\n } = props\n const valueProps = getValueProps({ currentValue: getFieldValue(name) })\n const numericProps = (numeric && { type: 'number' })\n const typeProps = (type && { type })\n const errorProps = (passErrorProp && { error })\n const className = ((fieldValidated ? 'validated ' : '') + (props.className || '') || undefined)\n\n const finalProps = {\n id, name, className,\n ...passThroughProps, ...valueProps, ...numericProps, ...typeProps, ...errorProps,\n onChange, onFocus, onBlur, onKeyDown\n }\n\n return render(finalProps)\n }\n}"],"mappings":"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"}
|
package/dist/submit.js
CHANGED
|
@@ -59,8 +59,9 @@ var _default = function _default(render) {
|
|
|
59
59
|
setExecuting = _useState2[1];
|
|
60
60
|
|
|
61
61
|
var onClick = function onClick(e) {
|
|
62
|
-
var result = onSubmit(e,
|
|
63
|
-
validate: validate
|
|
62
|
+
var result = onSubmit(e, {
|
|
63
|
+
validate: validate,
|
|
64
|
+
additionalValues: values
|
|
64
65
|
});
|
|
65
66
|
|
|
66
67
|
if (result && result["finally"] && typeof result["finally"] === 'function') {
|
package/dist/submit.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"submit.js","names":["render","Submit","props","onSubmit","Error","registerFieldValidator","setFieldValue","getFieldValue","getFieldValues","valid","validate","disableInvalid","values","propsToPass","useState","executing","setExecuting","onClick","e","result","finalProps","disabled"],"sources":["../src/submit.js"],"sourcesContent":["import React, { useState } from 'react'\n\nexport default render => function Submit(props) {\n if(!props.onSubmit) throw new Error('Button components must be contained within a Form component')\n\n const {\n onSubmit, registerFieldValidator, setFieldValue, getFieldValue, getFieldValues,\n valid, validate, disableInvalid, values, ...propsToPass\n } = props\n\n // TODO: set executing when form is triggered by enter key\n const [executing, setExecuting] = useState(false)\n\n const onClick = e => {\n const result = onSubmit(e,
|
|
1
|
+
{"version":3,"file":"submit.js","names":["render","Submit","props","onSubmit","Error","registerFieldValidator","setFieldValue","getFieldValue","getFieldValues","valid","validate","disableInvalid","values","propsToPass","useState","executing","setExecuting","onClick","e","result","additionalValues","finalProps","disabled"],"sources":["../src/submit.js"],"sourcesContent":["import React, { useState } from 'react'\n\nexport default render => function Submit(props) {\n if(!props.onSubmit) throw new Error('Button components must be contained within a Form component')\n\n const {\n onSubmit, registerFieldValidator, setFieldValue, getFieldValue, getFieldValues,\n valid, validate, disableInvalid, values, ...propsToPass\n } = props\n\n // TODO: set executing when form is triggered by enter key\n const [executing, setExecuting] = useState(false)\n\n const onClick = e => {\n const result = onSubmit(e, { validate, additionalValues: values })\n if(result && result.finally && typeof result.finally === 'function') {\n setExecuting(true)\n result.finally(() => setExecuting(false))\n }\n }\n\n const finalProps = {\n ...propsToPass,\n onClick,\n disabled: props.disabled || executing || (disableInvalid && !valid)\n }\n\n return render(finalProps)\n}\n"],"mappings":";;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;eAEe,kBAAAA,MAAM;EAAA,OAAI,SAASC,MAAT,CAAgBC,KAAhB,EAAuB;IAC9C,IAAG,CAACA,KAAK,CAACC,QAAV,EAAoB,MAAM,IAAIC,KAAJ,CAAU,6DAAV,CAAN;;IAEpB,IACED,QADF,GAGID,KAHJ,CACEC,QADF;IAAA,IACYE,sBADZ,GAGIH,KAHJ,CACYG,sBADZ;IAAA,IACoCC,aADpC,GAGIJ,KAHJ,CACoCI,aADpC;IAAA,IACmDC,aADnD,GAGIL,KAHJ,CACmDK,aADnD;IAAA,IACkEC,cADlE,GAGIN,KAHJ,CACkEM,cADlE;IAAA,IAEEC,KAFF,GAGIP,KAHJ,CAEEO,KAFF;IAAA,IAESC,QAFT,GAGIR,KAHJ,CAESQ,QAFT;IAAA,IAEmBC,cAFnB,GAGIT,KAHJ,CAEmBS,cAFnB;IAAA,IAEmCC,MAFnC,GAGIV,KAHJ,CAEmCU,MAFnC;IAAA,IAE8CC,WAF9C,4BAGIX,KAHJ,aAH8C,CAQ9C;;;IACA,gBAAkC,IAAAY,eAAA,EAAS,KAAT,CAAlC;IAAA;IAAA,IAAOC,SAAP;IAAA,IAAkBC,YAAlB;;IAEA,IAAMC,OAAO,GAAG,SAAVA,OAAU,CAAAC,CAAC,EAAI;MACnB,IAAMC,MAAM,GAAGhB,QAAQ,CAACe,CAAD,EAAI;QAAER,QAAQ,EAARA,QAAF;QAAYU,gBAAgB,EAAER;MAA9B,CAAJ,CAAvB;;MACA,IAAGO,MAAM,IAAIA,MAAM,WAAhB,IAA4B,OAAOA,MAAM,WAAb,KAA0B,UAAzD,EAAqE;QACnEH,YAAY,CAAC,IAAD,CAAZ;QACAG,MAAM,WAAN,CAAe;UAAA,OAAMH,YAAY,CAAC,KAAD,CAAlB;QAAA,CAAf;MACD;IACF,CAND;;IAQA,IAAMK,UAAU,mCACXR,WADW;MAEdI,OAAO,EAAPA,OAFc;MAGdK,QAAQ,EAAEpB,KAAK,CAACoB,QAAN,IAAkBP,SAAlB,IAAgCJ,cAAc,IAAI,CAACF;IAH/C,EAAhB;;IAMA,OAAOT,MAAM,CAACqB,UAAD,CAAb;EACD,CA1BoB;AAAA,C"}
|
package/package.json
CHANGED
package/src/Form.js
CHANGED
|
@@ -24,13 +24,15 @@ const Form = (ContextProvider, additionalContext = {}, ErrorMessage) => (
|
|
|
24
24
|
|
|
25
25
|
const setFieldValue = (path, value) => {
|
|
26
26
|
setFieldValues(previousValues => set(previousValues, path, value))
|
|
27
|
-
|
|
27
|
+
if(form.current) {
|
|
28
|
+
setValid(form.current.checkValidity())
|
|
29
|
+
}
|
|
28
30
|
}
|
|
29
31
|
|
|
30
|
-
const onSubmit = (e, additionalValues,
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
32
|
+
const onSubmit = (e, { additionalValues, validate } = {}) => {
|
|
33
|
+
if(validate !== false) {
|
|
34
|
+
fieldValidators.forEach(setFieldValidated => setFieldValidated())
|
|
35
|
+
}
|
|
34
36
|
|
|
35
37
|
if((validate === false || form.current.checkValidity()) && props.onSubmit) {
|
|
36
38
|
setError(undefined)
|
|
@@ -70,6 +72,7 @@ const Form = (ContextProvider, additionalContext = {}, ErrorMessage) => (
|
|
|
70
72
|
}
|
|
71
73
|
|
|
72
74
|
e && e.preventDefault && e.preventDefault()
|
|
75
|
+
e && e.stopPropagation && e.stopPropagation()
|
|
73
76
|
}
|
|
74
77
|
|
|
75
78
|
const classNames = ['react-forms', props.className]
|
package/src/input.js
CHANGED
|
@@ -77,7 +77,7 @@ export default (render, options = {}) => function Input(props) {
|
|
|
77
77
|
if(submitOnChange && submitHandler) {
|
|
78
78
|
// the setFieldValue above sets state on the Form component, used in the onSubmit handler
|
|
79
79
|
// setting state requires an additional render cycle - we need to pass in the new value so it's set correctly
|
|
80
|
-
submitHandler(undefined, { [name]: applyValueTransforms(elementValue) })
|
|
80
|
+
submitHandler(undefined, { additionalValues: { [name]: applyValueTransforms(elementValue) } })
|
|
81
81
|
}
|
|
82
82
|
}
|
|
83
83
|
|
package/src/submit.js
CHANGED
|
@@ -12,7 +12,7 @@ export default render => function Submit(props) {
|
|
|
12
12
|
const [executing, setExecuting] = useState(false)
|
|
13
13
|
|
|
14
14
|
const onClick = e => {
|
|
15
|
-
const result = onSubmit(e,
|
|
15
|
+
const result = onSubmit(e, { validate, additionalValues: values })
|
|
16
16
|
if(result && result.finally && typeof result.finally === 'function') {
|
|
17
17
|
setExecuting(true)
|
|
18
18
|
result.finally(() => setExecuting(false))
|