compose-state - npm Package Compare versions

Comparing version 1.0.6 to 1.0.7

dist.js

@@ -1,1 +0,1 @@
-"use strict";var a=Object.assign||function(a){for(var b,c=1;c<arguments.length;c++)for(var d in b=arguments[c],b)Object.prototype.hasOwnProperty.call(b,d)&&(a[d]=b[d]);return a};Object.defineProperty(exports,"__esModule",{value:!0});function b(a){if(Array.isArray(a)){for(var b=0,c=Array(a.length);b<a.length;b++)c[b]=a[b];return c}return Array.from(a)}var c=function(c){return function(){for(var d=arguments.length,e=Array(d),f=0;f<d;f++)e[f]=arguments[f];return e.map(function(a){return a instanceof Function?a:function(){return a}}).reduceRight(function(d,e){return function(){for(var f=arguments.length,g=Array(f),h=0;h<f;h++)g[h]=arguments[h];var i=d.apply(void 0,g),j=e.apply(void 0,b(g.slice(0,c)).concat([a({},g[c],i)],b(g.slice(c+1))));return j?a({},i,j):null}},function(){return null})}},d=c(0),e=c(1);exports.composeState=d,exports.composeDerivedStateFromProps=e,exports.default=d;
+"use strict";var a=Object.assign||function(a){for(var b,c=1;c<arguments.length;c++)for(var d in b=arguments[c],b)Object.prototype.hasOwnProperty.call(b,d)&&(a[d]=b[d]);return a};Object.defineProperty(exports,"__esModule",{value:!0});function b(a){if(Array.isArray(a)){for(var b=0,c=Array(a.length);b<a.length;b++)c[b]=a[b];return c}return Array.from(a)}var c=function(c){return function(){for(var d=arguments.length,e=Array(d),f=0;f<d;f++)e[f]=arguments[f];return e.reduceRight(function(d,e){return function(){for(var f=arguments.length,g=Array(f),h=0;h<f;h++)g[h]=arguments[h];var i=d.apply(void 0,g),j=e instanceof Function?e.apply(void 0,b(g.slice(0,c)).concat([a({},g[c],i)],b(g.slice(c+1)))):e;return j||i?a({},i,j):null}},function(){return null})}},d=c(0),e=c(1);exports.composeState=d,exports.composeDerivedStateFromProps=e,exports.default=d;

index.js

 const composeStateFactory = stateIndex => (...updaters) =>
-  updaters
-    .map(updater => (updater instanceof Function ? updater : () => updater))
-    .reduceRight(
-      (accumulator, current) => (...args) => {
-        const accumulatedState = accumulator(...args);
-        const currentState = current(
-          ...args.slice(0, stateIndex),
-          { ...args[stateIndex], ...accumulatedState },
-          ...args.slice(stateIndex + 1),
-        );
+  updaters.reduceRight(
+    (accumulator, current) => (...args) => {
+      const accumulatedState = accumulator(...args);
+      const currentState =
+        current instanceof Function
+          ? current(
+              ...args.slice(0, stateIndex),
+              { ...args[stateIndex], ...accumulatedState },
+              ...args.slice(stateIndex + 1),
+            )
+          : current;
 
-        return currentState ? { ...accumulatedState, ...currentState } : null;
-      },
-      () => null,
-    );
+      return currentState || accumulatedState
+        ? { ...accumulatedState, ...currentState }
+        : null;
+    },
+    () => null,
+  );
 
@@ -18,0 +21,0 @@ const composeState = composeStateFactory(0);

package.json

@@ -13,3 +13,3 @@ {
   },
-  "version": "1.0.6",
+  "version": "1.0.7",
   "description": "Compose multiple setState or getDerivedStateFromProps updaters in React",
@@ -16,0 +16,0 @@ "main": "dist.js",

readme.md

 # ✍️ compose-state
 
-`compose-state` is a library to compose multiple state updaters in React.
+`compose-state` is a library that composes multiple state updaters in React.
 
@@ -9,6 +9,10 @@ <img width="488" src="https://user-images.githubusercontent.com/4934193/39415633-8ed13b02-4bfa-11e8-9e0e-b706ae68fdbc.png" alt="example" />
 
-# Use
+## Use
 
+### Install
+
 `yarn add compose-state` or `npm install compose-state`
 
+### Import
+
 ```jsx
@@ -25,6 +29,28 @@ import composeState from 'compose-state';
 
-# Benefits
+### API
 
-## Simplify your updaters and React code
+#### `composeState([updaters])`
 
+Returns an updater that can be used with `setState`. Calling this produces the same result as calling or accessing each given updater from right to left, merging each partial state. If a given updater is a function, its `prevState` value is the previous state merged with the current partial state.
+
+##### Arguments
+
+| Name | Type | Description |
+| - | - | - |
+| `[updaters]` | `(...Updater)` | Functions that can be used with `setState`, or partial state objects |
+
+#### `composeDerivedStateFromProps([updaters])`
+
+Returns an updater that can be set as a component's `getDerivedStateFromProps` static value. Calling this produces the same result as calling or accessing each given updater from right to left, merging each partial state. If a given updater is a function, its `prevState` value is the previous state merged with the current partial state.
+
+##### Arguments
+
+| Name | Type | Description |
+| - | - | - |
+| `[updaters]` | `(...Updater)` | Functions that can be set as a component's `getDerivedStateFromProps` static value, or partial state objects |
+
+## Benefits
+
+### Simplify your updaters and React code
+
 Let's say you want to call `setState` and do two things
@@ -78,3 +104,3 @@
 
-## Easily mix functional and object updaters
+### Easily mix functional and object updaters
 
@@ -92,3 +118,3 @@ `compose-state` accepts both objects and functions, just like `setState`. This allows you to mix static and dynamic updaters without increasing the complexity of any individual parameter.
 
-## Compatibility with getDerivedStateFromProps
+### Compatibility with getDerivedStateFromProps
 
@@ -113,3 +139,3 @@ `compose-state` comes with a `composeDerivedStateFromProps` function to use with React's new [`getDerivedStateFromProps`](https://reactjs.org/docs/react-component.html#static-getderivedstatefromprops) lifecycle method.
 
-## It's just normal, [boring](https://twitter.com/jevakallio/status/987062864002342912) React
+### It's just normal, [boring](https://twitter.com/jevakallio/status/987062864002342912) React
 
@@ -120,3 +146,3 @@ While more formal state managers push developers away from controlling state in React, `compose-state` simply enhances state control methods that are primitive to the platform.
 
-# Further reading
+## Further reading
 
@@ -123,0 +149,0 @@ [Functional setState is the future of React](https://medium.freecodecamp.org/functional-setstate-is-the-future-of-react-374f30401b6b) by [Justice Mba](https://twitter.com/Daajust)

test.js

@@ -188,5 +188,6 @@ import React, { Component } from "react";
 setState({
-  name: "object then function then object",
+  name: "bunch of stuff then null",
   expected: { value: 1, anotherValue: 2, otherValue: 1 },
   updaters: [
+    null,
     { otherValue: 1 },
@@ -199,2 +200,13 @@ s => ({ value: s.value + 1 }),
 setState({
+  name: "null then bunch of stuff",
+  expected: { value: 1, anotherValue: 2, otherValue: 1 },
+  updaters: [
+    { otherValue: 1 },
+    s => ({ value: s.value + 1 }),
+    { anotherValue: 2 },
+    null,
+  ],
+  state: { value: 0 },
+});
+setState({
   name: "times2, plus1",
@@ -201,0 +213,0 @@ expected: { value: 2 },

No alert changes

Improved metrics

Total package byte prevSize

18224

increased by8.11%

Lines of code

351

increased by4.46%

Number of lines in readme file

146

increased by21.67%

No dependency changes