react-final-form - npm Package Compare versions

Comparing version 6.5.1 to 6.5.2

dist/react-final-form.cjs.js

@@ -5,10 +5,13 @@ 'use strict';
 
-function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
-
-var _extends = _interopDefault(require('@babel/runtime/helpers/extends'));
-var _objectWithoutPropertiesLoose = _interopDefault(require('@babel/runtime/helpers/objectWithoutPropertiesLoose'));
+var _extends = require('@babel/runtime/helpers/extends');
+var _objectWithoutPropertiesLoose = require('@babel/runtime/helpers/objectWithoutPropertiesLoose');
 var React = require('react');
-var React__default = _interopDefault(React);
 var finalForm = require('final-form');
 
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
+var _objectWithoutPropertiesLoose__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutPropertiesLoose);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
 // shared logic between components that use either render prop,
@@ -20,3 +23,3 @@ // children render function, or component prop
       component = props.component,
-      rest = _objectWithoutPropertiesLoose(props, ["render", "children", "component"]);
+      rest = _objectWithoutPropertiesLoose__default['default'](props, ["render", "children", "component"]);
 
@@ -51,4 +54,4 @@ if (component) {
 
-  var previous = React__default.useRef(value);
-  React__default.useEffect(function () {
+  var previous = React__default['default'].useRef(value);
+  React__default['default'].useEffect(function () {
     if (!isEqual(value, previous.current)) {
@@ -75,3 +78,3 @@ callback();
 function useConstant(init) {
-  var ref = React__default.useRef();
+  var ref = React__default['default'].useRef();
 
@@ -121,4 +124,4 @@ if (!ref.current) {
 function useLatest(value) {
-  var ref = React__default.useRef(value);
-  React__default.useEffect(function () {
+  var ref = React__default['default'].useRef(value);
+  React__default['default'].useEffect(function () {
     ref.current = value;
@@ -129,3 +132,3 @@ });
 
-var version = "6.5.1";
+var version = "6.5.2";
 
@@ -173,3 +176,3 @@ var addLazyState = function addLazyState(dest, state, keys) {
       validateOnBlur = _ref.validateOnBlur,
-      rest = _objectWithoutPropertiesLoose(_ref, ["debug", "decorators", "destroyOnUnregister", "form", "initialValues", "initialValuesEqual", "keepDirtyOnReinitialize", "mutators", "onSubmit", "subscription", "validate", "validateOnBlur"]);
+      rest = _objectWithoutPropertiesLoose__default['default'](_ref, ["debug", "decorators", "destroyOnUnregister", "form", "initialValues", "initialValuesEqual", "keepDirtyOnReinitialize", "mutators", "onSubmit", "subscription", "validate", "validateOnBlur"]);
 
@@ -282,3 +285,3 @@ var config = {
   var renderProps = {
-    form: _extends({}, form, {
+    form: _extends__default['default']({}, form, {
       reset: function reset(eventOrValues) {
@@ -298,3 +301,3 @@ if (isSyntheticEvent(eventOrValues)) {
     value: form
-  }, renderComponent(_extends({}, rest, {
+  }, renderComponent(_extends__default['default']({}, rest, {
     __versions: versions
@@ -362,3 +365,3 @@ }), renderProps, 'ReactFinalForm'));
       subscription = _ref.subscription,
-      rest = _objectWithoutPropertiesLoose(_ref, ["onChange", "subscription"]);
+      rest = _objectWithoutPropertiesLoose__default['default'](_ref, ["onChange", "subscription"]);
 
@@ -376,3 +379,3 @@ var reactFinalForm = useForm('FormSpy');
   var renderProps = {
-    form: _extends({}, reactFinalForm, {
+    form: _extends__default['default']({}, reactFinalForm, {
       reset: function reset(eventOrValues) {
@@ -388,3 +391,3 @@ if (isSyntheticEvent(eventOrValues)) {
   };
-  return renderComponent(_extends({}, rest, renderProps), state, 'FormSpy');
+  return renderComponent(_extends__default['default']({}, rest, renderProps), state, 'FormSpy');
 }
@@ -621,3 +624,3 @@
 
-  var input = _extends({
+  var input = _extends__default['default']({
     name: name,
@@ -650,10 +653,14 @@
     get checked() {
+      var value = state.value;
+
       if (type === 'checkbox') {
+        value = format(value, name);
+
         if (_value === undefined) {
-          return !!state.value;
+          return !!value;
         } else {
-          return !!(Array.isArray(state.value) && ~state.value.indexOf(_value));
+          return !!(Array.isArray(value) && ~value.indexOf(_value));
         }
       } else if (type === 'radio') {
-        return state.value === _value;
+        return format(value, name) === _value;
       }
@@ -702,3 +709,3 @@
       value = _ref.value,
-      rest = _objectWithoutPropertiesLoose(_ref, ["afterSubmit", "allowNull", "beforeSubmit", "children", "component", "data", "defaultValue", "format", "formatOnBlur", "initialValue", "isEqual", "multiple", "name", "parse", "subscription", "type", "validate", "validateFields", "value"]);
+      rest = _objectWithoutPropertiesLoose__default['default'](_ref, ["afterSubmit", "allowNull", "beforeSubmit", "children", "component", "data", "defaultValue", "format", "formatOnBlur", "initialValue", "isEqual", "multiple", "name", "parse", "subscription", "type", "validate", "validateFields", "value"]);
 
@@ -727,3 +734,3 @@ var field = useField(name, {
   if (typeof children === 'function') {
-    return children(_extends({}, field, rest));
+    return children(_extends__default['default']({}, field, rest));
   }
@@ -733,3 +740,3 @@
     // ignore meta, combine input with any other props
-    return /*#__PURE__*/React.createElement(component, _extends({}, field.input, {
+    return /*#__PURE__*/React.createElement(component, _extends__default['default']({}, field.input, {
       children: children,
@@ -744,3 +751,3 @@ ref: ref
 
-  return renderComponent(_extends({
+  return renderComponent(_extends__default['default']({
     children: children,
@@ -747,0 +754,0 @@ component: component,

dist/react-final-form.es.js

 import _extends from '@babel/runtime/helpers/esm/extends';
 import _objectWithoutPropertiesLoose from '@babel/runtime/helpers/esm/objectWithoutPropertiesLoose';
-import React__default, { createElement, createContext, useState, useEffect, useContext, useRef, useCallback, forwardRef } from 'react';
+import React, { createElement, createContext, useState, useEffect, useContext, useRef, useCallback, forwardRef } from 'react';
 import { formSubscriptionItems, createForm, version as version$1, fieldSubscriptionItems } from 'final-form';
@@ -42,4 +42,4 @@
 
-  var previous = React__default.useRef(value);
-  React__default.useEffect(function () {
+  var previous = React.useRef(value);
+  React.useEffect(function () {
     if (!isEqual(value, previous.current)) {
@@ -66,3 +66,3 @@ callback();
 function useConstant(init) {
-  var ref = React__default.useRef();
+  var ref = React.useRef();
 
@@ -112,4 +112,4 @@ if (!ref.current) {
 function useLatest(value) {
-  var ref = React__default.useRef(value);
-  React__default.useEffect(function () {
+  var ref = React.useRef(value);
+  React.useEffect(function () {
     ref.current = value;
@@ -120,3 +120,3 @@ });
 
-var version = "6.5.1";
+var version = "6.5.2";
 
@@ -634,10 +634,14 @@ var addLazyState = function addLazyState(dest, state, keys) {
     get checked() {
+      var value = state.value;
+
       if (type === 'checkbox') {
+        value = format(value, name);
+
         if (_value === undefined) {
-          return !!state.value;
+          return !!value;
         } else {
-          return !!(Array.isArray(state.value) && ~state.value.indexOf(_value));
+          return !!(Array.isArray(value) && ~value.indexOf(_value));
         }
       } else if (type === 'radio') {
-        return state.value === _value;
+        return format(value, name) === _value;
       }
@@ -644,0 +648,0 @@

dist/react-final-form.umd.js

 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('final-form')) :
   typeof define === 'function' && define.amd ? define(['exports', 'react', 'final-form'], factory) :
-  (global = global || self, factory(global['react-final-form'] = {}, global.React, global.FinalForm));
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['react-final-form'] = {}, global.React, global.FinalForm));
 }(this, (function (exports, React, finalForm) { 'use strict';
 
-  var React__default = 'default' in React ? React['default'] : React;
+  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
+  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
   function _extends() {
@@ -78,4 +80,4 @@ _extends = Object.assign || function (target) {
 
-    var previous = React__default.useRef(value);
-    React__default.useEffect(function () {
+    var previous = React__default['default'].useRef(value);
+    React__default['default'].useEffect(function () {
       if (!isEqual(value, previous.current)) {
@@ -102,3 +104,3 @@ callback();
   function useConstant(init) {
-    var ref = React__default.useRef();
+    var ref = React__default['default'].useRef();
 
@@ -148,4 +150,4 @@ if (!ref.current) {
   function useLatest(value) {
-    var ref = React__default.useRef(value);
-    React__default.useEffect(function () {
+    var ref = React__default['default'].useRef(value);
+    React__default['default'].useEffect(function () {
       ref.current = value;
@@ -156,3 +158,3 @@ });
 
-  var version = "6.5.1";
+  var version = "6.5.2";
 
@@ -670,10 +672,14 @@ var addLazyState = function addLazyState(dest, state, keys) {
       get checked() {
+        var value = state.value;
+
         if (type === 'checkbox') {
+          value = format(value, name);
+
           if (_value === undefined) {
-            return !!state.value;
+            return !!value;
           } else {
-            return !!(Array.isArray(state.value) && ~state.value.indexOf(_value));
+            return !!(Array.isArray(value) && ~value.indexOf(_value));
           }
         } else if (type === 'radio') {
-          return state.value === _value;
+          return format(value, name) === _value;
         }
@@ -680,0 +686,0 @@

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

package.json

 {
   "name": "react-final-form",
-  "version": "6.5.1",
+  "version": "6.5.2",
   "description": "🏁 High performance subscription-based form state management for React",
@@ -32,66 +32,66 @@ "main": "dist/react-final-form.cjs.js",
   "devDependencies": {
-    "@babel/core": "^7.10.0",
-    "@babel/plugin-proposal-class-properties": "^7.8.3",
-    "@babel/plugin-proposal-decorators": "^7.10.0",
-    "@babel/plugin-proposal-export-namespace-from": "^7.8.3",
-    "@babel/plugin-proposal-function-sent": "^7.8.3",
-    "@babel/plugin-proposal-json-strings": "^7.10.0",
-    "@babel/plugin-proposal-numeric-separator": "^7.8.3",
-    "@babel/plugin-proposal-throw-expressions": "^7.8.3",
+    "@babel/core": "^7.12.3",
+    "@babel/plugin-proposal-class-properties": "^7.12.1",
+    "@babel/plugin-proposal-decorators": "^7.12.1",
+    "@babel/plugin-proposal-export-namespace-from": "^7.12.1",
+    "@babel/plugin-proposal-function-sent": "^7.12.1",
+    "@babel/plugin-proposal-json-strings": "^7.12.1",
+    "@babel/plugin-proposal-numeric-separator": "^7.12.1",
+    "@babel/plugin-proposal-throw-expressions": "^7.12.1",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
-    "@babel/plugin-syntax-import-meta": "^7.8.3",
-    "@babel/plugin-transform-flow-strip-types": "^7.9.0",
-    "@babel/plugin-transform-runtime": "^7.10.0",
-    "@babel/preset-env": "^7.10.0",
-    "@babel/preset-flow": "^7.9.0",
-    "@babel/preset-react": "^7.10.0",
-    "@testing-library/jest-dom": "^5.8.0",
-    "@testing-library/react": "^10.0.2",
-    "@types/react": "^16.9.27",
-    "@typescript-eslint/eslint-plugin": "^3.0.1",
-    "@typescript-eslint/parser": "^3.0.1",
+    "@babel/plugin-syntax-import-meta": "^7.10.4",
+    "@babel/plugin-transform-flow-strip-types": "^7.12.1",
+    "@babel/plugin-transform-runtime": "^7.12.1",
+    "@babel/preset-env": "^7.12.1",
+    "@babel/preset-flow": "^7.12.1",
+    "@babel/preset-react": "^7.12.1",
+    "@testing-library/jest-dom": "^5.11.4",
+    "@testing-library/react": "^11.1.0",
+    "@types/react": "^16.9.53",
+    "@typescript-eslint/eslint-plugin": "^4.5.0",
+    "@typescript-eslint/parser": "^4.5.0",
     "babel-core": "^7.0.0-bridge.0",
     "babel-eslint": "^10.1.0",
-    "babel-jest": "^26.0.1",
+    "babel-jest": "^26.6.0",
     "bundlesize": "^0.18.0",
     "doctoc": "^1.4.0",
-    "dtslint": "^3.6.4",
-    "eslint": "^7.1.0",
+    "dtslint": "^4.0.4",
+    "eslint": "^7.11.0",
     "eslint-config-react-app": "^5.2.1",
-    "eslint-plugin-babel": "^5.2.1",
-    "eslint-plugin-flowtype": "^5.1.1",
-    "eslint-plugin-import": "^2.20.2",
-    "eslint-plugin-jsx-a11y": "^6.2.1",
-    "eslint-plugin-react": "^7.19.0",
-    "eslint-plugin-react-hooks": "^4.0.4",
-    "fast-deep-equal": "^3.1.1",
-    "final-form": "^4.20.0",
-    "flow-bin": "^0.98.1",
+    "eslint-plugin-babel": "^5.3.1",
+    "eslint-plugin-flowtype": "^5.2.0",
+    "eslint-plugin-import": "^2.22.1",
+    "eslint-plugin-jsx-a11y": "^6.3.1",
+    "eslint-plugin-react": "^7.21.5",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "fast-deep-equal": "^3.1.3",
+    "final-form": "^4.20.1",
+    "flow-bin": "^0.136.0",
     "glow": "^1.2.2",
-    "husky": "^4.2.3",
-    "jest": "^26.0.1",
-    "jest-mock-console": "^1.0.0",
-    "lint-staged": "^10.2.6",
-    "nps": "^5.9.12",
+    "husky": "^4.3.0",
+    "jest": "^26.6.0",
+    "jest-mock-console": "^1.0.1",
+    "lint-staged": "^10.4.2",
+    "nps": "^5.10.0",
     "nps-utils": "^1.7.0",
     "opencollective": "^1.0.3",
-    "prettier": "^2.0.2",
+    "prettier": "^2.1.2",
     "prettier-eslint-cli": "^5.0.0",
-    "react": "^16.13.1",
-    "react-dom": "^16.13.1",
-    "rollup": "^2.10.9",
+    "react": "^17.0.0",
+    "react-dom": "^17.0.0",
+    "rollup": "^2.32.1",
     "rollup-plugin-babel": "^4.4.0",
-    "rollup-plugin-commonjs": "^10.0.0",
+    "rollup-plugin-commonjs": "^10.1.0",
     "rollup-plugin-json": "^4.0.0",
-    "rollup-plugin-node-resolve": "^5.0.2",
+    "rollup-plugin-node-resolve": "^5.2.0",
     "rollup-plugin-replace": "^2.2.0",
     "rollup-plugin-uglify": "^6.0.4",
-    "tar": "^6.0.1",
-    "tslint": "^6.1.0",
-    "ts-essentials": "^6.0.5",
-    "typescript": "^3.9.3"
+    "tar": "^6.0.5",
+    "ts-essentials": "^7.0.1",
+    "tslint": "^6.1.3",
+    "typescript": "^4.0.3"
   },
   "peerDependencies": {
     "final-form": "^4.20.0",
-    "react": "^16.8.0"
+    "react": "^16.8.0 || ^17.0.0"
   },
@@ -133,4 +133,4 @@ "lint-staged": {
   "dependencies": {
-    "@babel/runtime": "^7.10.0"
+    "@babel/runtime": "^7.12.1"
   }
 }

README.md

@@ -57,1 +57,3 @@ [<img src="form-nerd-logo.png" align="left"/>](https://formnerd.co/react-final-form-readme) **You build great forms, but do you know HOW users use your forms? [Find out with Form Nerd!](https://formnerd.co/react-final-form-readme) Professional analytics from the creator of React Final Form.**
 ## [FAQ](https://final-form.org/docs/react-final-form/faq)
+
+<img src="https://static.scarf.sh/a.png?x-pxid=8feec529-43ac-4b78-8ad9-17c280b4f2d9" />

typescript/index.d.ts

@@ -81,2 +81,3 @@ import * as React from 'react';
   initialValuesEqual?: (a?: AnyObject, b?: AnyObject) => boolean;
+  [otherProp: string]: any;
 }
@@ -145,3 +146,3 @@
 export function useFormState<FormValues = Record<string, any>, InitialFormValues = Partial<FormValues>>(
-  params?: UseFormStateParams
+  params?: UseFormStateParams<FormValues, InitialFormValues>
 ): FormState<FormValues, InitialFormValues>;
@@ -148,0 +149,0 @@ export function withTypes<FormValues = Record<string, any>, InitialFormValues = Partial<FormValues>>(): {

No alert changes

Improved metrics

Total package byte prevSize

194016

increased by0.77%

Lines of code

2338

increased by0.52%

Number of lines in readme file

59

increased by3.51%

Dependency changes

• + Addedreact@17.0.2(transitive)

• - Removedprop-types@15.8.1(transitive)

• - Removedreact@16.14.0(transitive)

• - Removedreact-is@16.13.1(transitive)

• Updated@babel/runtime@^7.12.1