support multiple componets, impliments #1

Author: theKashey

README.md

@@ -11,9 +11,17 @@ No updates when you dont expect them. For all. For free!
 [![NPM](https://nodei.co/npm/beautiful-react-redux.png?downloads=true&stars=true)](https://nodei.co/npm/beautiful-react-redux/)
 
 ## Usage
+
+#### Auto-magic
 ```js
 // to get automatic deep-equal memoization for all mapStateToProps
-import 'beautiful-react-redux/memoize';
+import 'beautiful-react-redux/patch';
+```
+
+#### Or just replace react-redux by beautiful-react-redux
+```js
+//import {connect, Provider} from 'react-redux';
+import {connect, Provider} from 'beautiful-react-redux';
 ```
 
 If you already handling selectors by your own, and dont need external tools - 

lib/index.js

@@ -0,0 +1,36 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+ value: true
+});
+exports.Provider = exports.connect = undefined;
+
+var _react = require('react');
+
+var _reactRedux = require('react-redux');
+
+var _memoizeState = require('memoize-state');
+
+var _memoizeState2 = _interopRequireDefault(_memoizeState);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var connect = function connect(mapStateToProps, mapDispatchToProps, mergeProps, options) {
+
+ if (options && 'pure' in options && !options.pure) {
+ return (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps, mergeProps, options);
+ }
+
+ var memoizedMapStateToProps = mapStateToProps && (0, _memoizeState2.default)(mapStateToProps, { strictArguments: true });
+
+ return function (WrappedComponent) {
+
+ var localMapStateToProps = memoizedMapStateToProps && mapStateToProps && (0, _memoizeState2.default)(memoizedMapStateToProps, { strictArguments: true });
+
+ // TODO: create `areStatesEqual` based on memoize-state usage.
+ return (0, _reactRedux.connect)(localMapStateToProps, mapDispatchToProps, mergeProps, options)(WrappedComponent);
+ };
+};
+
+exports.connect = connect;
+exports.Provider = _reactRedux.Provider;

lib/memoize.js

@@ -1,5 +1,7 @@
 'use strict';
 
+var _react = require('react');
+
 var _reactRedux = require('react-redux');
 
 var redux = _interopRequireWildcard(_reactRedux);
@@ -12,12 +14,19 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
 
-var c = redux.connect;
+var reactReduxConnect = redux.connect;
 redux.connect = function (mapStateToProps, mapDispatchToProps, mergeProps, options) {
 
  if (options && 'pure' in options && options.pure) {
  return c.call(redux, mapStateToProps, mapDispatchToProps, mergeProps, options);
  }
 
- return c.call(redux, mapStateToProps && (0, _memoizeState2.default)(mapStateToProps, { strictArguments: true }), mapDispatchToProps, mergeProps, options);
+ var memoizedMapStateToProps = mapStateToProps && (0, _memoizeState2.default)(mapStateToProps, { strictArguments: true });
+
+ return function (WrappedComponent) {
+
+ var ReduxedComponent = reactReduxConnect.call(redux, memoizedMapStateToProps && mapStateToProps && (0, _memoizeState2.default)(memoizedMapStateToProps, { strictArguments: true }), mapDispatchToProps, mergeProps, options)(WrappedComponent);
+
+ return ReduxedComponent;
+ };
 };

lib/patch.js

@@ -0,0 +1,11 @@
+'use strict';
+
+var _reactRedux = require('react-redux');
+
+var redux = _interopRequireWildcard(_reactRedux);
+
+var _index = require('./index');
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
+
+redux.connect = _index.connect;

memoize.js

@@ -1 +1 @@
-require('./lib/memoize.js');
+require('./lib/patch.js');

package.json

@@ -23,11 +23,15 @@
  },
  "author": "Anton Korzunov (thekashey@gmail.com)",
  "license": "MIT",
+ "peerDependencies": {
+ "react": "^15.0.0 || ^16.0.0"
+ },
  "devDependencies": {
  "babel-cli": "^6.26.0",
  "babel-preset-env": "^1.6.1",
  "chai": "^4.1.2",
- "mocha": "^4.0.1"
+ "mocha": "^4.0.1",
+ "react": "^16.2.0"
  },
  "repository": {
  "type": "git",

patch.js

@@ -0,0 +1 @@
+require('./lib/patch.js');

src/index.js

@@ -0,0 +1,38 @@
+import {Component} from 'react';
+import {connect as reactReduxConnect, Provider} from 'react-redux';
+import memoize from 'memoize-state';
+
+const connect = (mapStateToProps,
+ mapDispatchToProps,
+ mergeProps,
+ options) => {
+
+ if (options && ('pure' in options) && !options.pure) {
+ return reactReduxConnect(
+ mapStateToProps,
+ mapDispatchToProps,
+ mergeProps,
+ options
+ )
+ }
+
+ const memoizedMapStateToProps = mapStateToProps && memoize(mapStateToProps, {strictArguments: true});
+
+ return WrappedComponent => {
+
+ const localMapStateToProps = memoizedMapStateToProps && mapStateToProps && memoize(memoizedMapStateToProps, {strictArguments: true});
+
+ // TODO: create `areStatesEqual` based on memoize-state usage.
+ return reactReduxConnect(
+ localMapStateToProps,
+ mapDispatchToProps,
+ mergeProps,
+ options
+ )(WrappedComponent);
+ }
+};
+
+export {
+ connect,
+ Provider
+}

src/memoize.js

@@ -0,0 +1,4 @@
+import * as redux from 'react-redux';
+import {connect} from './index';
+
+redux.connect = connect;