@danderson00/react-forms 0.0.18 → 0.0.19

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.18",
+  "version": "0.0.19",
   "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)