react-final-form - npm Package Compare versions

Comparing version 6.1.0 to 6.2.0

dist/react-final-form.cjs.js

@@ -113,11 +113,4 @@ 'use strict';
 
-var instance;
-function getContext() {
-  if (!instance) {
-    instance = React.createContext();
-  }
+var ReactFinalFormContext = React.createContext();
 
-  return instance;
-}
-
 function useLatest(value) {
@@ -131,3 +124,3 @@ var ref = React__default.useRef(value);
 
-var version = '6.1.0';
+var version = '6.2.0';
 var versions = {
@@ -158,3 +151,2 @@ 'final-form': finalForm.version,
 
-  var ReactFinalFormContext = getContext();
   var config = {
@@ -284,3 +276,2 @@ debug: debug,
 function useForm(componentName) {
-  var ReactFinalFormContext = getContext();
   var form = React.useContext(ReactFinalFormContext);
@@ -341,9 +332,3 @@
 
-  var ReactFinalFormContext = getContext();
-  var reactFinalForm = React.useContext(ReactFinalFormContext);
-
-  if (!reactFinalForm) {
-    throw new Error('FormSpy must be used inside of a ReactFinalForm component');
-  }
-
+  var reactFinalForm = useForm('FormSpy');
   var state = useFormState({
@@ -350,0 +335,0 @@ onChange: onChange,

dist/react-final-form.es.js

@@ -107,11 +107,4 @@ import _extends from '@babel/runtime/helpers/esm/extends';
 
-var instance;
-function getContext() {
-  if (!instance) {
-    instance = createContext();
-  }
+var ReactFinalFormContext = createContext();
 
-  return instance;
-}
-
 function useLatest(value) {
@@ -125,3 +118,3 @@ var ref = React__default.useRef(value);
 
-var version = '6.1.0';
+var version = '6.2.0';
 var versions = {
@@ -152,3 +145,2 @@ 'final-form': version$1,
 
-  var ReactFinalFormContext = getContext();
   var config = {
@@ -278,3 +270,2 @@ debug: debug,
 function useForm(componentName) {
-  var ReactFinalFormContext = getContext();
   var form = useContext(ReactFinalFormContext);
@@ -335,9 +326,3 @@
 
-  var ReactFinalFormContext = getContext();
-  var reactFinalForm = useContext(ReactFinalFormContext);
-
-  if (!reactFinalForm) {
-    throw new Error('FormSpy must be used inside of a ReactFinalForm component');
-  }
-
+  var reactFinalForm = useForm('FormSpy');
   var state = useFormState({
@@ -344,0 +329,0 @@ onChange: onChange,

dist/react-final-form.umd.js

@@ -142,11 +142,4 @@ (function (global, factory) {
 
-  var instance;
-  function getContext() {
-    if (!instance) {
-      instance = React.createContext();
-    }
+  var ReactFinalFormContext = React.createContext();
 
-    return instance;
-  }
-
   function useLatest(value) {
@@ -160,3 +153,3 @@ var ref = React__default.useRef(value);
 
-  var version = '6.1.0';
+  var version = '6.2.0';
   var versions = {
@@ -187,3 +180,2 @@ 'final-form': finalForm.version,
 
-    var ReactFinalFormContext = getContext();
     var config = {
@@ -313,3 +305,2 @@ debug: debug,
   function useForm(componentName) {
-    var ReactFinalFormContext = getContext();
     var form = React.useContext(ReactFinalFormContext);
@@ -370,9 +361,3 @@
 
-    var ReactFinalFormContext = getContext();
-    var reactFinalForm = React.useContext(ReactFinalFormContext);
-
-    if (!reactFinalForm) {
-      throw new Error('FormSpy must be used inside of a ReactFinalForm component');
-    }
-
+    var reactFinalForm = useForm('FormSpy');
     var state = useFormState({
@@ -379,0 +364,0 @@ onChange: onChange,

dist/react-final-form.umd.min.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("final-form")):"function"==typeof define&&define.amd?define(["exports","react","final-form"],t):t((e=e||self)["react-final-form"]={},e.React,e.FinalForm)}(this,function(e,D,E){"use strict";var w="default"in D?D.default:D;function N(){return(N=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function z(e,t){if(null==e)return{};var n,r,i={},u=Object.keys(e);for(r=0;r<u.length;r++)n=u[r],0<=t.indexOf(n)||(i[n]=e[n]);return i}function V(e,t){var n=e.render,r=e.children,i=e.component,u=z(e,["render","children","component"]);if(i)return D.createElement(i,N({},u,{children:r,render:n}));if(n)return n(void 0===r?u:N({},u,{children:r}));if("function"!=typeof r)throw new Error("Must specify either a render prop, a render function as children, or a component prop to "+t);return r(u)}function C(e,t,n){void 0===n&&(n=function(e,t){return e===t});var r=w.useRef(e);w.useEffect(function(){n(e,r.current)||(t(),r.current=e)})}var t,k=function(e,t){if(e===t)return!0;if("object"!=typeof e||!e||"object"!=typeof t||!t)return!1;var n=Object.keys(e),r=Object.keys(t);if(n.length!==r.length)return!1;for(var i=Object.prototype.hasOwnProperty.bind(t),u=0;u<n.length;u++){var a=n[u];if(!i(a)||e[a]!==t[a])return!1}return!0},x=function(e){return!(!e||"function"!=typeof e.stopPropagation)};function R(){return t||(t=D.createContext()),t}function U(e){var t=w.useRef(e);return w.useEffect(function(){t.current=e}),t}var n="6.1.0",j={"final-form":E.version,"react-final-form":n},q=E.formSubscriptionItems.reduce(function(e,t){return e[t]=!0,e},{});function r(e){var t=e.debug,n=e.decorators,r=e.destroyOnUnregister,i=e.form,u=e.initialValues,a=e.initialValuesEqual,o=e.keepDirtyOnReinitialize,c=e.mutators,l=e.onSubmit,f=e.subscription,s=void 0===f?q:f,d=e.validate,v=e.validateOnBlur,m=z(e,["debug","decorators","destroyOnUnregister","form","initialValues","initialValuesEqual","keepDirtyOnReinitialize","mutators","onSubmit","subscription","validate","validateOnBlur"]),p=R(),b={debug:t,destroyOnUnregister:r,initialValues:u,keepDirtyOnReinitialize:o,mutators:c,onSubmit:l,validate:d,validateOnBlur:v},y=function(e){var t=w.useRef();return t.current||(t.current=e()),t.current}(function(){var e=i||E.createForm(b);return e.pauseValidation(),e}),g=D.useState(function(){var t={};return y.subscribe(function(e){t=e},s)(),t}),h=g[0],S=g[1],F=U(h);D.useEffect(function(){y.isValidationPaused()&&y.resumeValidation();var e=[y.subscribe(function(e){k(e,F.current)||S(e)},s)].concat(n?n.map(function(e){return e(y)}):[]);return function(){e.forEach(function(e){return e()})}},[n]),C(t,function(){y.setConfig("debug",t)}),C(r,function(){y.setConfig("destroyOnUnregister",r)}),C(u,function(){y.setConfig("initialValues",u)},a||k),C(o,function(){y.setConfig("keepDirtyOnReinitialize",o)}),C(c,function(){y.setConfig("mutators",c)}),C(l,function(){y.setConfig("onSubmit",l)}),C(d,function(){y.setConfig("validate",d)}),C(v,function(){y.setConfig("validateOnBlur",v)});var O=N({},h,{form:N({},y,{reset:function(e){x(e)?y.reset():y.reset(e)}}),handleSubmit:function(e){return e&&("function"==typeof e.preventDefault&&e.preventDefault(),"function"==typeof e.stopPropagation&&e.stopPropagation()),y.submit()}});return D.createElement(p.Provider,{value:y},V(N({},m,O,{__versions:j}),"ReactFinalForm"))}function _(e){var t=R(),n=D.useContext(t);if(!n)throw new Error((e||"useForm")+" must be used inside of a <Form> component");return n}function o(e){var t=void 0===e?{}:e,n=t.onChange,r=t.subscription,i=void 0===r?q:r,u=_("useFormState"),a=D.useRef(!0),o=D.useState(function(){var t={};return u.subscribe(function(e){t=e},i)(),n&&n(t),t}),c=o[0],l=o[1];return D.useEffect(function(){return u.subscribe(function(e){a.current?a.current=!1:(l(e),n&&n(e))},i)},[]),c}function i(e){var t=e.onChange,n=e.subscription,r=z(e,["onChange","subscription"]),i=R(),u=D.useContext(i);if(!u)throw new Error("FormSpy must be used inside of a ReactFinalForm component");var a=o({onChange:t,subscription:n});return t?null:V(N({},r,a,{form:N({},u,{reset:function(e){x(e)?u.reset():u.reset(e)}})}),"FormSpy")}function I(e,t){return void 0===e?"":e}function L(e,t){return""===e?void 0:e}var M="undefined"!=typeof window&&window.navigator&&window.navigator.product&&"ReactNative"===window.navigator.product,T=E.fieldSubscriptionItems.reduce(function(e,t){return e[t]=!0,e},{});function F(n,e){function r(e){return E.registerField(n,e,g,{afterSubmit:i,beforeSubmit:function(){return V.current()},defaultValue:c,getValidator:function(){return w.current},initialValue:d,isEqual:v,validateFields:F})}var t=void 0===e?{}:e,i=t.afterSubmit,u=t.allowNull,a=t.beforeSubmit,o=t.component,c=t.defaultValue,l=t.format,f=void 0===l?I:l,s=t.formatOnBlur,d=t.initialValue,v=t.isEqual,m=t.multiple,p=t.parse,b=void 0===p?L:p,y=t.subscription,g=void 0===y?T:y,h=t.type,S=t.validate,F=t.validateFields,O=t.value,E=_("useField"),w=U(S),V=U(function(){if(s){var e=f(x.value,x.name);e!==x.value&&x.change(e)}return a&&a()}),C=D.useRef(!0),k=D.useState(function(){var t={};return r(function(e){t=e})(),t}),x=k[0],R=k[1];D.useEffect(function(){return r(function(e){C.current?C.current=!1:R(e)})},[n,c,d,v]);var j={onBlur:D.useCallback(function(e){x.blur(),s&&x.change(f(x.value,x.name))},[x.name,x.value,f,s]),onChange:D.useCallback(function(e){var t=e&&e.target?function(e,t,n,r){if(!r&&e.nativeEvent&&void 0!==e.nativeEvent.text)return e.nativeEvent.text;if(r&&e.nativeEvent)return e.nativeEvent.text;var i=e.target,u=i.type,a=i.value,o=i.checked;switch(u){case"checkbox":if(void 0===n)return!!o;if(o)return Array.isArray(t)?t.concat(n):[n];if(!Array.isArray(t))return t;var c=t.indexOf(n);return c<0?t:t.slice(0,c).concat(t.slice(c+1));case"select-multiple":return function(e){var t=[];if(e)for(var n=0;n<e.length;n++){var r=e[n];r.selected&&t.push(r.value)}return t}(e.target.options);default:return a}}(e,x.value,O,M):e;x.change(b(t,n))},[O,n,b,x.change,x.value,h]),onFocus:D.useCallback(function(e){x.focus()},[])},q=(x.blur,x.change,x.focus,x.value),B=(x.name,z(x,["blur","change","focus","value","name"])),P={active:B.active,data:B.data,dirty:B.dirty,dirtySinceLastSubmit:B.dirtySinceLastSubmit,error:B.error,initial:B.initial,invalid:B.invalid,length:B.length,modified:B.modified,pristine:B.pristine,submitError:B.submitError,submitFailed:B.submitFailed,submitSucceeded:B.submitSucceeded,submitting:B.submitting,touched:B.touched,valid:B.valid,visited:B.visited};s?"input"===o&&(q=I(q)):q=f(q,n),null!==q||u||(q="");var A=N({name:n,value:q,type:h},j);return"checkbox"===h?void 0===O?A.checked=!!q:(A.checked=!(!Array.isArray(q)||!~q.indexOf(O)),A.value=O):"radio"===h?(A.checked=q===O,A.value=O):"select"===o&&m&&(A.value=A.value||[],A.multiple=!0),{input:A,meta:P}}e.Field=function(e){var t=e.afterSubmit,n=e.allowNull,r=e.beforeSubmit,i=e.children,u=e.component,a=e.defaultValue,o=e.format,c=e.formatOnBlur,l=e.initialValue,f=e.isEqual,s=e.multiple,d=e.name,v=e.parse,m=e.subscription,p=e.type,b=e.validate,y=e.validateFields,g=e.value,h=z(e,["afterSubmit","allowNull","beforeSubmit","children","component","defaultValue","format","formatOnBlur","initialValue","isEqual","multiple","name","parse","subscription","type","validate","validateFields","value"]),S=F(d,{afterSubmit:t,allowNull:n,beforeSubmit:r,children:i,component:u,defaultValue:a,format:o,formatOnBlur:c,initialValue:l,isEqual:f,multiple:s,parse:v,subscription:m,type:p,validate:b,validateFields:y,value:g});return"function"==typeof i?i(N({},S,h)):"string"==typeof u?D.createElement(u,N({},S.input,{children:i},h)):V(N({},S,{children:i,component:u},h),"Field("+d+")")},e.Form=r,e.FormSpy=i,e.useField=F,e.useForm=_,e.useFormState=o,e.version=n,e.withTypes=function(){return{Form:r,FormSpy:i}},Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("final-form")):"function"==typeof define&&define.amd?define(["exports","react","final-form"],t):t((e=e||self)["react-final-form"]={},e.React,e.FinalForm)}(this,function(e,D,O){"use strict";var E="default"in D?D.default:D;function N(){return(N=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}function z(e,t){if(null==e)return{};var n,r,i={},u=Object.keys(e);for(r=0;r<u.length;r++)n=u[r],0<=t.indexOf(n)||(i[n]=e[n]);return i}function w(e,t){var n=e.render,r=e.children,i=e.component,u=z(e,["render","children","component"]);if(i)return D.createElement(i,N({},u,{children:r,render:n}));if(n)return n(void 0===r?u:N({},u,{children:r}));if("function"!=typeof r)throw new Error("Must specify either a render prop, a render function as children, or a component prop to "+t);return r(u)}function V(e,t,n){void 0===n&&(n=function(e,t){return e===t});var r=E.useRef(e);E.useEffect(function(){n(e,r.current)||(t(),r.current=e)})}var C=function(e,t){if(e===t)return!0;if("object"!=typeof e||!e||"object"!=typeof t||!t)return!1;var n=Object.keys(e),r=Object.keys(t);if(n.length!==r.length)return!1;for(var i=Object.prototype.hasOwnProperty.bind(t),u=0;u<n.length;u++){var a=n[u];if(!i(a)||e[a]!==t[a])return!1}return!0},k=function(e){return!(!e||"function"!=typeof e.stopPropagation)},x=D.createContext();function U(e){var t=E.useRef(e);return E.useEffect(function(){t.current=e}),t}var t="6.2.0",R={"final-form":O.version,"react-final-form":t},j=O.formSubscriptionItems.reduce(function(e,t){return e[t]=!0,e},{});function n(e){var t=e.debug,n=e.decorators,r=e.destroyOnUnregister,i=e.form,u=e.initialValues,a=e.initialValuesEqual,o=e.keepDirtyOnReinitialize,c=e.mutators,l=e.onSubmit,f=e.subscription,s=void 0===f?j:f,d=e.validate,v=e.validateOnBlur,m=z(e,["debug","decorators","destroyOnUnregister","form","initialValues","initialValuesEqual","keepDirtyOnReinitialize","mutators","onSubmit","subscription","validate","validateOnBlur"]),p={debug:t,destroyOnUnregister:r,initialValues:u,keepDirtyOnReinitialize:o,mutators:c,onSubmit:l,validate:d,validateOnBlur:v},b=function(e){var t=E.useRef();return t.current||(t.current=e()),t.current}(function(){var e=i||O.createForm(p);return e.pauseValidation(),e}),y=D.useState(function(){var t={};return b.subscribe(function(e){t=e},s)(),t}),g=y[0],h=y[1],S=U(g);D.useEffect(function(){b.isValidationPaused()&&b.resumeValidation();var e=[b.subscribe(function(e){C(e,S.current)||h(e)},s)].concat(n?n.map(function(e){return e(b)}):[]);return function(){e.forEach(function(e){return e()})}},[n]),V(t,function(){b.setConfig("debug",t)}),V(r,function(){b.setConfig("destroyOnUnregister",r)}),V(u,function(){b.setConfig("initialValues",u)},a||C),V(o,function(){b.setConfig("keepDirtyOnReinitialize",o)}),V(c,function(){b.setConfig("mutators",c)}),V(l,function(){b.setConfig("onSubmit",l)}),V(d,function(){b.setConfig("validate",d)}),V(v,function(){b.setConfig("validateOnBlur",v)});var F=N({},g,{form:N({},b,{reset:function(e){k(e)?b.reset():b.reset(e)}}),handleSubmit:function(e){return e&&("function"==typeof e.preventDefault&&e.preventDefault(),"function"==typeof e.stopPropagation&&e.stopPropagation()),b.submit()}});return D.createElement(x.Provider,{value:b},w(N({},m,F,{__versions:R}),"ReactFinalForm"))}function _(e){var t=D.useContext(x);if(!t)throw new Error((e||"useForm")+" must be used inside of a <Form> component");return t}function a(e){var t=void 0===e?{}:e,n=t.onChange,r=t.subscription,i=void 0===r?j:r,u=_("useFormState"),a=D.useRef(!0),o=D.useState(function(){var t={};return u.subscribe(function(e){t=e},i)(),n&&n(t),t}),c=o[0],l=o[1];return D.useEffect(function(){return u.subscribe(function(e){a.current?a.current=!1:(l(e),n&&n(e))},i)},[]),c}function r(e){var t=e.onChange,n=e.subscription,r=z(e,["onChange","subscription"]),i=_("FormSpy"),u=a({onChange:t,subscription:n});return t?null:w(N({},r,u,{form:N({},i,{reset:function(e){k(e)?i.reset():i.reset(e)}})}),"FormSpy")}function I(e,t){return void 0===e?"":e}function L(e,t){return""===e?void 0:e}var M="undefined"!=typeof window&&window.navigator&&window.navigator.product&&"ReactNative"===window.navigator.product,T=O.fieldSubscriptionItems.reduce(function(e,t){return e[t]=!0,e},{});function F(n,e){function r(e){return E.registerField(n,e,g,{afterSubmit:i,beforeSubmit:function(){return V.current()},defaultValue:c,getValidator:function(){return w.current},initialValue:d,isEqual:v,validateFields:F})}var t=void 0===e?{}:e,i=t.afterSubmit,u=t.allowNull,a=t.beforeSubmit,o=t.component,c=t.defaultValue,l=t.format,f=void 0===l?I:l,s=t.formatOnBlur,d=t.initialValue,v=t.isEqual,m=t.multiple,p=t.parse,b=void 0===p?L:p,y=t.subscription,g=void 0===y?T:y,h=t.type,S=t.validate,F=t.validateFields,O=t.value,E=_("useField"),w=U(S),V=U(function(){if(s){var e=f(x.value,x.name);e!==x.value&&x.change(e)}return a&&a()}),C=D.useRef(!0),k=D.useState(function(){var t={};return r(function(e){t=e})(),t}),x=k[0],R=k[1];D.useEffect(function(){return r(function(e){C.current?C.current=!1:R(e)})},[n,c,d,v]);var j={onBlur:D.useCallback(function(e){x.blur(),s&&x.change(f(x.value,x.name))},[x.name,x.value,f,s]),onChange:D.useCallback(function(e){var t=e&&e.target?function(e,t,n,r){if(!r&&e.nativeEvent&&void 0!==e.nativeEvent.text)return e.nativeEvent.text;if(r&&e.nativeEvent)return e.nativeEvent.text;var i=e.target,u=i.type,a=i.value,o=i.checked;switch(u){case"checkbox":if(void 0===n)return!!o;if(o)return Array.isArray(t)?t.concat(n):[n];if(!Array.isArray(t))return t;var c=t.indexOf(n);return c<0?t:t.slice(0,c).concat(t.slice(c+1));case"select-multiple":return function(e){var t=[];if(e)for(var n=0;n<e.length;n++){var r=e[n];r.selected&&t.push(r.value)}return t}(e.target.options);default:return a}}(e,x.value,O,M):e;x.change(b(t,n))},[O,n,b,x.change,x.value,h]),onFocus:D.useCallback(function(e){x.focus()},[])},q=(x.blur,x.change,x.focus,x.value),B=(x.name,z(x,["blur","change","focus","value","name"])),P={active:B.active,data:B.data,dirty:B.dirty,dirtySinceLastSubmit:B.dirtySinceLastSubmit,error:B.error,initial:B.initial,invalid:B.invalid,length:B.length,modified:B.modified,pristine:B.pristine,submitError:B.submitError,submitFailed:B.submitFailed,submitSucceeded:B.submitSucceeded,submitting:B.submitting,touched:B.touched,valid:B.valid,visited:B.visited};s?"input"===o&&(q=I(q)):q=f(q,n),null!==q||u||(q="");var A=N({name:n,value:q,type:h},j);return"checkbox"===h?void 0===O?A.checked=!!q:(A.checked=!(!Array.isArray(q)||!~q.indexOf(O)),A.value=O):"radio"===h?(A.checked=q===O,A.value=O):"select"===o&&m&&(A.value=A.value||[],A.multiple=!0),{input:A,meta:P}}e.Field=function(e){var t=e.afterSubmit,n=e.allowNull,r=e.beforeSubmit,i=e.children,u=e.component,a=e.defaultValue,o=e.format,c=e.formatOnBlur,l=e.initialValue,f=e.isEqual,s=e.multiple,d=e.name,v=e.parse,m=e.subscription,p=e.type,b=e.validate,y=e.validateFields,g=e.value,h=z(e,["afterSubmit","allowNull","beforeSubmit","children","component","defaultValue","format","formatOnBlur","initialValue","isEqual","multiple","name","parse","subscription","type","validate","validateFields","value"]),S=F(d,{afterSubmit:t,allowNull:n,beforeSubmit:r,children:i,component:u,defaultValue:a,format:o,formatOnBlur:c,initialValue:l,isEqual:f,multiple:s,parse:v,subscription:m,type:p,validate:b,validateFields:y,value:g});return"function"==typeof i?i(N({},S,h)):"string"==typeof u?D.createElement(u,N({},S.input,{children:i},h)):w(N({},S,{children:i,component:u},h),"Field("+d+")")},e.Form=n,e.FormSpy=r,e.useField=F,e.useForm=_,e.useFormState=a,e.version=t,e.withTypes=function(){return{Form:n,FormSpy:r}},Object.defineProperty(e,"__esModule",{value:!0})});
 //# sourceMappingURL=react-final-form.umd.min.js.map

package.json

 {
   "name": "react-final-form",
-  "version": "6.1.0",
+  "version": "6.2.0",
   "description": "🏁 High performance subscription-based form state management for React",
@@ -5,0 +5,0 @@ "main": "dist/react-final-form.cjs.js",

README.md

@@ -170,2 +170,3 @@ # 🏁 React Final Form
   - [`version: string`](#version-string)
+  - [`withTypes<T>: () => { Form<T>, FormSpy<T> }`](#withtypest----formt-formspyt-)
 - [Types](#types)
@@ -500,2 +501,6 @@ - [`FieldProps`](#fieldprops)
 
+### `withTypes<T>: () => { Form<T>, FormSpy<T> }`
+
+Provides versions of `Form` and `FormSpy` that will have strongly typed `values`.
+
 ---
@@ -502,0 +507,0 @@

typescript/index.d.ts

@@ -25,3 +25,3 @@ import * as React from 'react';
 
-interface FieldInputProps<T extends HTMLElement> {
+interface FieldInputProps<FieldValue, T extends HTMLElement> {
   name: string;
@@ -32,3 +32,3 @@ onBlur: (event?: React.FocusEvent<T>) => void;
   type?: string;
-  value: any;
+  value: FieldValue;
   checked?: boolean;
@@ -38,15 +38,21 @@ multiple?: boolean;
 
-export interface FieldRenderProps<T extends HTMLElement> {
-  input: FieldInputProps<T>;
+interface AnyObject {
+  [key: string]: any;
+}
+
+export interface FieldRenderProps<FieldValue, T extends HTMLElement> {
+  input: FieldInputProps<FieldValue, T>;
   meta: FieldMetaState;
 }
 
-export interface FormRenderProps<FormValues> extends FormState<FormValues> {
+export interface FormRenderProps<FormValues = AnyObject>
+  extends FormState<FormValues> {
   form: FormApi<FormValues>;
   handleSubmit: (
     event?: React.SyntheticEvent<HTMLFormElement>
-  ) => Promise<object | undefined> | undefined;
+  ) => Promise<AnyObject | undefined> | undefined;
 }
 
-export interface FormSpyRenderProps<FormValues> extends FormState<FormValues> {
+export interface FormSpyRenderProps<FormValues = AnyObject>
+  extends FormState<FormValues> {
   form: FormApi<FormValues>;
@@ -61,3 +67,3 @@ }
 
-export interface FormProps<FormValues = object>
+export interface FormProps<FormValues = AnyObject>
   extends Config<FormValues>,
@@ -68,16 +74,16 @@ RenderableProps<FormRenderProps<FormValues>> {
   form?: FormApi<FormValues>;
-  initialValuesEqual?: (a?: object, b?: object) => boolean;
+  initialValuesEqual?: (a?: AnyObject, b?: AnyObject) => boolean;
 }
 
-export interface UseFieldConfig {
+export interface UseFieldConfig<FieldValue> {
   afterSubmit?: () => void;
   allowNull?: boolean;
   beforeSubmit?: () => void | boolean;
-  defaultValue?: any;
-  format?: (value: any, name: string) => any;
+  defaultValue?: FieldValue;
+  format?: (value: FieldValue, name: string) => any;
   formatOnBlur?: boolean;
-  initialValue?: any;
+  initialValue?: FieldValue;
   isEqual?: (a: any, b: any) => boolean;
   multiple?: boolean;
-  parse?: (value: any, name: string) => any;
+  parse?: (value: any, name: string) => FieldValue;
   subscription?: FieldSubscription;
@@ -87,8 +93,8 @@ type?: string;
   validateFields?: string[];
-  value?: any;
+  value?: FieldValue;
 }
 
-export interface FieldProps<T extends HTMLElement>
-  extends UseFieldConfig,
-    RenderableProps<FieldRenderProps<T>> {
+export interface FieldProps<FieldValue, T extends HTMLElement>
+  extends UseFieldConfig<FieldValue>,
+    RenderableProps<FieldRenderProps<FieldValue, T>> {
   name: string;
@@ -98,3 +104,3 @@ [otherProp: string]: any;
 
-export interface UseFormStateParams<FormValues = object> {
+export interface UseFormStateParams<FormValues = AnyObject> {
   onChange?: (formState: FormState<FormValues>) => void;
@@ -104,17 +110,23 @@ subscription?: FormSubscription;
 
-export interface FormSpyProps<FormValues>
+export interface FormSpyProps<FormValues = AnyObject>
   extends UseFormStateParams<FormValues>,
     RenderableProps<FormSpyRenderProps<FormValues>> {}
 
-export const Field: React.FC<FieldProps<any>>;
-export const Form: React.FC<FormProps<object>>;
-export const FormSpy: React.FC<FormSpyProps<object>>;
-export function useField<T extends HTMLElement>(
+export const Field: <FieldValue = any, T extends HTMLElement = HTMLElement>(
+  props: FieldProps<FieldValue, T>
+) => React.ReactElement;
+export const Form: <FormValues = AnyObject>(
+  props: FormProps<FormValues>
+) => React.ReactElement;
+export const FormSpy: <FormValues = AnyObject>(
+  props: FormSpyProps<FormValues>
+) => React.ReactElement;
+export function useField<FieldValue = any, T extends HTMLElement = HTMLElement>(
   name: string,
-  config?: UseFieldConfig
-): FieldRenderProps<T>;
-export function useForm<FormValues = object>(
+  config?: UseFieldConfig<FieldValue>
+): FieldRenderProps<FieldValue, T>;
+export function useForm<FormValues = AnyObject>(
   componentName?: string
 ): FormApi<FormValues>;
-export function useFormState<FormValues = object>(
+export function useFormState<FormValues = AnyObject>(
   params?: UseFormStateParams
@@ -121,0 +133,0 @@ ): FormState<FormValues>;

Fixed alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

875

increased by0.57%

Number of low supply chain risk alerts

4

decreased by-33.33%

Worsened metrics

Total package byte prevSize

213058

decreased by-0.71%

No dependency changes