@danderson00/react-forms 0.0.17 → 0.0.21

package/README.md

@@ -175,10 +175,29 @@ export const Switch = wrapInput(material.Switch, { type: 'checkbox' })
 Options are as follows:
 
 Option|Type|Default|Description
--|-|-|-
+---|---|---|---
 type|string|'text'|One of `text`, `radio`, `checkbox` or `select`.
 passErrorProp|boolean|false|Passes a boolean prop named `error` when field validation fails.
 valueFromEvent|function||Override the default mechanism for retrieving a new field value from an onChange event. All function arguments are passed on.
 defaultValue|any||Specify the default value for the field. Can be a value or a function that returns a value. 
 
-### wrapSubmit(component)
+### wrapSubmit(component)
+
+## License
+
+**The MIT License (MIT)**
+
+Copyright © 2022 Dale Anderson
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
+documentation files (the “Software”), to deal in the Software without restriction, including without limitation the
+rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit
+persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the
+Software.
+
+THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE
+WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
+OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/dist/Form.js

@@ -67,6 +67,11 @@ var _default = function _default(ContextProvider) {
         error = _useState4[0],
         setError = _useState4[1];
 
+    var _useState5 = (0, _react.useState)(),
+        _useState6 = _slicedToArray(_useState5, 2),
+        valid = _useState6[0],
+        setValid = _useState6[1];
+
     var form = /*#__PURE__*/(0, _react.createRef)();
 
     var getFieldValue = function getFieldValue(path) {
@@ -84,9 +89,10 @@ var _default = function _default(ContextProvider) {
     };
 
     var setFieldValue = function setFieldValue(path, value) {
-      return setFieldValues(function (previousValues) {
+      setFieldValues(function (previousValues) {
         return (0, _objectPathImmutable.set)(previousValues, path, value);
       });
+      setValid(form.current.checkValidity());
     };
 
     var onSubmit = function onSubmit(e, additionalValues) {
@@ -165,7 +171,8 @@ var _default = function _default(ContextProvider) {
           setFieldValue: setFieldValue,
           getFieldValue: getFieldValue,
           getFieldValues: getFieldValues,
-          onSubmit: onSubmit
+          onSubmit: onSubmit,
+          valid: valid
         }, mergedAdditionalContext)
       })), error && /*#__PURE__*/(0, _react.createElement)(ErrorMessage, {
         key: 'error',

package/dist/input.js

@@ -15,7 +15,7 @@ var _inputTypes = _interopRequireDefault(require("./inputTypes"));
 
 var _throttle2 = _interopRequireDefault(require("./throttle"));
 
-var _excluded = ["type", "name", "value", "checked", "defaultValue", "numeric", "onSubmit", "registerFieldValidator", "setFieldValue", "getFieldValue", "getFieldValues", "submitOnChange", "submitOnBlur", "selectOnFocus", "throttle"];
+var _excluded = ["type", "name", "value", "checked", "defaultValue", "numeric", "onSubmit", "registerFieldValidator", "setFieldValue", "getFieldValue", "getFieldValues", "submitOnChange", "submitOnBlur", "selectOnFocus", "throttle", "valid"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -226,6 +226,7 @@ var _default = function _default(render) {
           submitOnBlur = props.submitOnBlur,
           selectOnFocus = props.selectOnFocus,
           _throttle = props.throttle,
+          valid = props.valid,
           passThroughProps = _objectWithoutProperties(props, _excluded);
 
       var valueProps = getValueProps({

package/dist/submit.js

@@ -9,7 +9,7 @@ exports["default"] = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _excluded = ["onSubmit", "registerFieldValidator", "setFieldValue", "getFieldValue", "getFieldValues"];
+var _excluded = ["onSubmit", "registerFieldValidator", "setFieldValue", "getFieldValue", "getFieldValues", "valid", "disableInvalid"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -62,11 +62,13 @@ var _default = function _default(render) {
         setFieldValue = props.setFieldValue,
         getFieldValue = props.getFieldValue,
         getFieldValues = props.getFieldValues,
+        valid = props.valid,
+        disableInvalid = props.disableInvalid,
         propsToPass = _objectWithoutProperties(props, _excluded);
 
     var finalProps = _objectSpread(_objectSpread({}, propsToPass), {}, {
       onClick: onClick,
-      disabled: executing
+      disabled: executing || props.disableInvalid && !props.valid
     });
 
     return render(finalProps);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@danderson00/react-forms",
-  "version": "0.0.17",
+  "version": "0.0.21",
   "description": "Ultra simple, stateless, validated forms for use in React function components",
   "main": "dist/index.js",
   "module": "src/index.js",
@@ -49,7 +49,7 @@
     "component"
   ],
   "author": "danderson00",
-  "license": "UNLICENSED",
+  "license": "MIT",
   "publishConfig": {
     "access": "public"
   },

package/src/Form.js

@@ -6,6 +6,7 @@ export default (ContextProvider, additionalContext = {}, ErrorMessage) => (
     const [fieldValues, setFieldValues] = useState(props.values || {})
     const [fieldValidators, registerFieldValidator] = useReducer((validators, validator) => [...validators, validator], [])
     const [error, setError] = useState()
+    const [valid, setValid] = useState()
     const form = createRef()
 
     const getFieldValue = path => get(fieldValues, path)
@@ -15,7 +16,10 @@ export default (ContextProvider, additionalContext = {}, ErrorMessage) => (
       {}
     )
 
-    const setFieldValue = (path, value) => setFieldValues(previousValues => set(previousValues, path, value))
+    const setFieldValue = (path, value) => {
+      setFieldValues(previousValues => set(previousValues, path, value))
+      setValid(form.current.checkValidity())
+    }
 
     const onSubmit = (e, additionalValues) => {
       fieldValidators.forEach(setFieldValidated => setFieldValidated())
@@ -88,6 +92,7 @@ export default (ContextProvider, additionalContext = {}, ErrorMessage) => (
               getFieldValue,
               getFieldValues,
               onSubmit,
+              valid,
               ...mergedAdditionalContext
             }
           }),

package/src/input.js

@@ -124,7 +124,7 @@ export default (render, options = {}) => function Input(props) {
     const {
       type, name, value, checked, defaultValue, numeric,
       onSubmit, registerFieldValidator, setFieldValue, getFieldValue, getFieldValues,
-      submitOnChange, submitOnBlur, selectOnFocus, throttle,
+      submitOnChange, submitOnBlur, selectOnFocus, throttle, valid,
       ...passThroughProps
     } = props
     const valueProps = getValueProps({ currentValue: getFieldValue(name) })

package/src/submit.js

@@ -14,12 +14,15 @@ export default render => function Submit(props) {
     }
   }
 
-  const { onSubmit, registerFieldValidator, setFieldValue, getFieldValue, getFieldValues, ...propsToPass } = props
+  const {
+    onSubmit, registerFieldValidator, setFieldValue, getFieldValue, getFieldValues,
+    valid, disableInvalid, ...propsToPass
+  } = props
 
   const finalProps = {
     ...propsToPass,
     onClick,
-    disabled: executing
+    disabled: executing || (props.disableInvalid && !props.valid)
   }
 
   return render(finalProps)