redux-zero - npm Package Compare versions

Comparing version 4.0.1 to 4.1.0

CHANGELOG.md

 # Changelog
 
+### 4.1.0
+
+- Include `Connect` component that can be used with a render callback as an alternative to the `connect` HOC
+
+```javascript
+import { Connect } from 'redux-zero/react'
+
+// ...
+
+render() {
+  return (
+    <Connect mapToProps={({ count }) => ({ count })}>
+      {({ count }) => <span>{count}</span>}
+    </Connect>
+  )
+}
+
+```
+
 ### 4.0.1
@@ -4,0 +23,0 @@

dist/react/components/connect.d.ts

 /// <reference types="react" />
 import * as React from "react";
-export default function connect(mapToProps: any): (Child: any) => {
-    new (props?: {}, context?: any): {
-        unsubscribe: any;
-        state: any;
-        componentWillMount(): void;
-        componentWillUnmount(): void;
-        getProps(): any;
-        update: () => void;
-        render(): JSX.Element;
-        setState<K extends never>(f: (prevState: {}, props: {}) => Pick<{}, K>, callback?: () => any): void;
-        setState<K extends never>(state: Pick<{}, K>, callback?: () => any): void;
-        forceUpdate(callBack?: () => any): void;
-        props: Readonly<{
-            children?: React.ReactNode;
-        }> & Readonly<{}>;
-        context: any;
-        refs: {
-            [key: string]: React.ReactInstance;
-        };
-        componentDidMount?(): void;
-        componentWillReceiveProps?(nextProps: Readonly<{}>, nextContext: any): void;
-        shouldComponentUpdate?(nextProps: Readonly<{}>, nextState: Readonly<{}>, nextContext: any): boolean;
-        componentWillUpdate?(nextProps: Readonly<{}>, nextState: Readonly<{}>, nextContext: any): void;
-        componentDidUpdate?(prevProps: Readonly<{}>, prevState: Readonly<{}>, prevContext: any): void;
-        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
-    };
-    contextTypes: {
+export declare class Connect extends React.Component<any> {
+    static contextTypes: {
         store: (props: object, propName: string, componentName: string) => Error;
     };
-};
+    unsubscribe: any;
+    state: any;
+    componentWillMount(): void;
+    componentWillUnmount(): void;
+    getProps(): any;
+    update: () => void;
+    render(): any;
+}
+export default function connect(mapToProps: any): (Child: any) => (props: any) => JSX.Element;

dist/react/index.d.ts

@@ -1,3 +0,3 @@
-import connect from "./components/connect";
+import connect, { Connect } from "./components/connect";
 import Provider from "./components/Provider";
-export { connect, Provider };
+export { connect, Provider, Connect };

package.json

 {
   "name": "redux-zero",
-  "version": "4.0.1",
+  "version": "4.1.0",
   "description": "",
@@ -84,2 +84,2 @@ "main": "dist/redux-zero.js",
   ]
-}
+}

react/index.js

@@ -58,35 +58,36 @@ 'use strict';
 
+var Connect = /** @class */ (function (_super) {
+    __extends(Connect, _super);
+    function Connect() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.state = _this.getProps();
+        _this.update = function () {
+            var mapped = _this.getProps();
+            if (!shallowEqual(mapped, _this.state)) {
+                _this.setState(mapped);
+            }
+        };
+        return _this;
+    }
+    Connect.prototype.componentWillMount = function () {
+        this.unsubscribe = this.context.store.subscribe(this.update);
+    };
+    Connect.prototype.componentWillUnmount = function () {
+        this.unsubscribe(this.update);
+    };
+    Connect.prototype.getProps = function () {
+        var mapToProps = this.props.mapToProps;
+        var state = (this.context.store && this.context.store.getState()) || {};
+        return mapToProps(state, this.props);
+    };
+    Connect.prototype.render = function () {
+        return this.props.children(this.state);
+    };
+    Connect.contextTypes = {
+        store: propsValidation
+    };
+    return Connect;
+}(React.Component));
 function connect(mapToProps) {
-    return function (Child) { return _a = /** @class */ (function (_super) {
-            __extends(Connected, _super);
-            function Connected() {
-                var _this = _super !== null && _super.apply(this, arguments) || this;
-                _this.state = _this.getProps();
-                _this.update = function () {
-                    var mapped = _this.getProps();
-                    if (!shallowEqual(mapped, _this.state)) {
-                        _this.setState(mapped);
-                    }
-                };
-                return _this;
-            }
-            Connected.prototype.componentWillMount = function () {
-                this.unsubscribe = this.context.store.subscribe(this.update);
-            };
-            Connected.prototype.componentWillUnmount = function () {
-                this.unsubscribe(this.update);
-            };
-            Connected.prototype.getProps = function () {
-                var state = (this.context.store && this.context.store.getState()) || {};
-                return mapToProps(state, this.props);
-            };
-            Connected.prototype.render = function () {
-                return (React.createElement(Child, __assign({ store: this.context.store }, this.props, this.state)));
-            };
-            return Connected;
-        }(React.Component)),
-        _a.contextTypes = {
-            store: propsValidation
-        },
-        _a; var _a; };
+    return function (Child) { return function (props) { return (React.createElement(Connect, { mapToProps: mapToProps }, function (mappedProps) { return React.createElement(Child, __assign({}, mappedProps, props)); })); }; };
 }
@@ -115,2 +116,3 @@
 exports.Provider = Provider;
+exports.Connect = Connect;
 //# sourceMappingURL=index.js.map

react/index.min.js

@@ -1,2 +0,2 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],e):e(t["redux-zero"]={},t.React)}(this,function(t,e){"use strict";function n(t,e){function n(){this.constructor=t}i(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}function r(t,e){for(var n in t)if(t[n]!==e[n])return!1;for(var n in e)if(!(n in t))return!1;return!0}function o(t,e,n){return"object"==typeof t?null:new Error("Invalid prop "+e+" supplied to "+n)}var i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])},p=Object.assign||function(t){for(var e,n=1,r=arguments.length;n<r;n++){e=arguments[n];for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o])}return t},s=function(t){function r(){return null!==t&&t.apply(this,arguments)||this}return n(r,t),r.prototype.getChildContext=function(){return{store:this.props.store}},r.prototype.render=function(){var t=this.props.children;return e.Children.only(t)},r.childContextTypes={store:o},r}(e.Component);t.connect=function(t){return function(i){return s=function(o){function s(){var t=null!==o&&o.apply(this,arguments)||this;return t.state=t.getProps(),t.update=function(){var e=t.getProps();r(e,t.state)||t.setState(e)},t}return n(s,o),s.prototype.componentWillMount=function(){this.unsubscribe=this.context.store.subscribe(this.update)},s.prototype.componentWillUnmount=function(){this.unsubscribe(this.update)},s.prototype.getProps=function(){var e=this.context.store&&this.context.store.getState()||{};return t(e,this.props)},s.prototype.render=function(){return e.createElement(i,p({store:this.context.store},this.props,this.state))},s}(e.Component),s.contextTypes={store:o},s;var s}},t.Provider=s,Object.defineProperty(t,"__esModule",{value:!0})});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],e):e(t["redux-zero"]={},t.React)}(this,function(t,e){"use strict";function n(t,e){function n(){this.constructor=t}i(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}function r(t,e){for(var n in t)if(t[n]!==e[n])return!1;for(var n in e)if(!(n in t))return!1;return!0}function o(t,e,n){return"object"==typeof t?null:new Error("Invalid prop "+e+" supplied to "+n)}var i=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])},p=Object.assign||function(t){for(var e,n=1,r=arguments.length;n<r;n++){e=arguments[n];for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o])}return t},u=function(t){function e(){var e=null!==t&&t.apply(this,arguments)||this;return e.state=e.getProps(),e.update=function(){var t=e.getProps();r(t,e.state)||e.setState(t)},e}return n(e,t),e.prototype.componentWillMount=function(){this.unsubscribe=this.context.store.subscribe(this.update)},e.prototype.componentWillUnmount=function(){this.unsubscribe(this.update)},e.prototype.getProps=function(){return(0,this.props.mapToProps)(this.context.store&&this.context.store.getState()||{},this.props)},e.prototype.render=function(){return this.props.children(this.state)},e.contextTypes={store:o},e}(e.Component),s=function(t){function r(){return null!==t&&t.apply(this,arguments)||this}return n(r,t),r.prototype.getChildContext=function(){return{store:this.props.store}},r.prototype.render=function(){var t=this.props.children;return e.Children.only(t)},r.childContextTypes={store:o},r}(e.Component);t.connect=function(t){return function(n){return function(r){return e.createElement(u,{mapToProps:t},function(t){return e.createElement(n,p({},t,r))})}}},t.Provider=s,t.Connect=u,Object.defineProperty(t,"__esModule",{value:!0})});
 //# sourceMappingURL=index.min.js.map

react/react/components/connect.d.ts

 /// <reference types="react" />
 import * as React from "react";
-export default function connect(mapToProps: any): (Child: any) => {
-    new (props?: {}, context?: any): {
-        unsubscribe: any;
-        state: any;
-        componentWillMount(): void;
-        componentWillUnmount(): void;
-        getProps(): any;
-        update: () => void;
-        render(): JSX.Element;
-        setState<K extends never>(f: (prevState: {}, props: {}) => Pick<{}, K>, callback?: () => any): void;
-        setState<K extends never>(state: Pick<{}, K>, callback?: () => any): void;
-        forceUpdate(callBack?: () => any): void;
-        props: Readonly<{
-            children?: React.ReactNode;
-        }> & Readonly<{}>;
-        context: any;
-        refs: {
-            [key: string]: React.ReactInstance;
-        };
-        componentDidMount?(): void;
-        componentWillReceiveProps?(nextProps: Readonly<{}>, nextContext: any): void;
-        shouldComponentUpdate?(nextProps: Readonly<{}>, nextState: Readonly<{}>, nextContext: any): boolean;
-        componentWillUpdate?(nextProps: Readonly<{}>, nextState: Readonly<{}>, nextContext: any): void;
-        componentDidUpdate?(prevProps: Readonly<{}>, prevState: Readonly<{}>, prevContext: any): void;
-        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
-    };
-    contextTypes: {
+export declare class Connect extends React.Component<any> {
+    static contextTypes: {
         store: (props: object, propName: string, componentName: string) => Error;
     };
-};
+    unsubscribe: any;
+    state: any;
+    componentWillMount(): void;
+    componentWillUnmount(): void;
+    getProps(): any;
+    update: () => void;
+    render(): any;
+}
+export default function connect(mapToProps: any): (Child: any) => (props: any) => JSX.Element;

react/react/index.d.ts

@@ -1,3 +0,3 @@
-import connect from "./components/connect";
+import connect, { Connect } from "./components/connect";
 import Provider from "./components/Provider";
-export { connect, Provider };
+export { connect, Provider, Connect };

README.md

@@ -59,2 +59,4 @@ <h1 align="center">
 
+## Example
+
 Let's make an increment/decrement simple application with React:
@@ -142,5 +144,9 @@
 ## Roadmap
-- Add more use case examples (including unit tests)
-- Add (Provider, connect) to Preact
+- Add more use case examples (including unit tests, SSR, etc)
+- Add Preact bindings
 
+## Tools
+These are unofficial tools, maintained by the community:
+- [Redux-Zero Tools](https://github.com/nyteshade/rzero-tools)
+
 ## Docs
@@ -147,0 +153,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

156

increased by4%

Worsened metrics

Total package byte prevSize

30439

decreased by-3.68%

Lines of code

260

decreased by-10.96%

No dependency changes