redux-persist - npm Package Compare versions

Comparing version 5.7.2 to 5.8.0

es/integration/react.js

@@ -64,2 +64,9 @@ var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
     value: function render() {
+      if (process.env.NODE_ENV !== 'production') {
+        if (typeof this.props.children === 'function' && this.props.loading) console.error('redux-persist: PersistGate expects either a function child or loading prop, but not both. The loading prop will be ignored.');
+      }
+      if (typeof this.props.children === 'function') {
+        return this.props.children(this.state.bootstrapped);
+      }
+
       return this.state.bootstrapped ? this.props.children : this.props.loading;
@@ -66,0 +73,0 @@ }

lib/integration/react.js

@@ -73,2 +73,9 @@ 'use strict';
     value: function render() {
+      if (process.env.NODE_ENV !== 'production') {
+        if (typeof this.props.children === 'function' && this.props.loading) console.error('redux-persist: PersistGate expects either a function child or loading prop, but not both. The loading prop will be ignored.');
+      }
+      if (typeof this.props.children === 'function') {
+        return this.props.children(this.state.bootstrapped);
+      }
+
       return this.state.bootstrapped ? this.props.children : this.props.loading;
@@ -75,0 +82,0 @@ }

package.json

 {
   "name": "redux-persist",
-  "version": "5.7.2",
+  "version": "5.8.0",
   "description": "persist and rehydrate redux stores",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -120,2 +120,7 @@ # Redux Persist
 
+## React Integration
+Redux persist ships with react integration as a conveinence. The `PersistGate` component is the recommended way to delay rendering until persistence is complete. It works in one of two modes:
+1. `loading` prop: The provided loading value will be rendered until persistence is complete at which point children will be rendered.
+2. function childen: The function will be invoked with a single `bootstrapped` argument. When bootstrapped is true, persistence is complete and it is safe to render the full app. This can be useful for adding transition animations.
+
 ## Blacklist & Whitelist
@@ -122,0 +127,0 @@ By Example:

src/integration/react.js

@@ -8,3 +8,3 @@ // @flow
   onBeforeLift?: Function,
-  children?: Node,
+  children?: Node | Function,
   loading?: Node,
@@ -55,4 +55,14 @@ persistor: Persistor,
   render() {
+    if (process.env.NODE_ENV !== 'production') {
+      if (typeof this.props.children === 'function' && this.props.loading)
+        console.error(
+          'redux-persist: PersistGate expects either a function child or loading prop, but not both. The loading prop will be ignored.'
+        )
+    }
+    if (typeof this.props.children === 'function') {
+      return this.props.children(this.state.bootstrapped)
+    }
+
     return this.state.bootstrapped ? this.props.children : this.props.loading
   }
 }

No alert changes

Improved metrics

Total package byte prevSize

385469

increased by0.7%

Lines of code

4140

increased by0.51%

Number of lines in readme file

227

increased by2.25%

Worsened metrics

Number of low supply chain risk alerts

63

increased by5%

No dependency changes