refract-xstream - npm Package Compare versions

Comparing version 2.0.0 to 2.1.0

index.es.js

@@ -106,2 +106,10 @@ import xs from 'xstream';
     var data = function () { return xs.from(dataObservable); };
+    var fromEvent = function (eventName, valueTransformer) {
+        return data()
+            .filter(isEvent(eventName))
+            .map(function (data) {
+            var value = data.payload.value;
+            return valueTransformer ? valueTransformer(value) : value;
+        });
+    };
     return {
@@ -139,11 +147,5 @@ mount: data()
         },
-        fromEvent: function (eventName, valueTransformer) {
-            return data()
-                .filter(isEvent(eventName))
-                .map(function (data) {
-                var value = data.payload.value;
-                return valueTransformer ? valueTransformer(value) : value;
-            });
-        },
-        pushEvent: pushEvent
+        fromEvent: fromEvent,
+        pushEvent: pushEvent,
+        useEvent: function (eventName) { return [fromEvent(eventName), pushEvent(eventName)]; }
     };
@@ -171,4 +173,4 @@ };
     };
-    var finalHandler = function (initialProps) {
-        var effectHandler = handler(initialProps);
+    var finalHandler = function (initialProps, initialContext) {
+        var effectHandler = handler(initialProps, initialContext);
         return function (effect) {
@@ -238,4 +240,6 @@ if (isValidElement$$1(effect)) {
     var component = createComponent(instance, dataObservable, pushEvent);
-    var sinkObservable = aperture(instance.props)(component);
-    var sinkSubscription = subscribeToSink(sinkObservable, finalHandler(instance.props), errorHandler ? errorHandler(instance.props) : undefined);
+    var sinkObservable = aperture(instance.props, instance.context)(component);
+    var sinkSubscription = subscribeToSink(sinkObservable, finalHandler(instance.props, instance.context), errorHandler
+        ? errorHandler(instance.props, instance.context)
+        : undefined);
     instance.reDecorateProps = function (nextProps) {
@@ -297,36 +301,39 @@ Object.keys(nextProps).forEach(function (propName) {
 var Empty = function () { return null; };
-var withEffects = function (handler, errorHandler) { return function (aperture) { return function (BaseComponent) {
+var withEffects = function (handler, errorHandler, Context) { return function (aperture) { return function (BaseComponent) {
     if (BaseComponent === void 0) { BaseComponent = Empty; }
-    return /** @class */ (function (_super) {
-        __extends(WithEffects, _super);
-        function WithEffects(props, context) {
-            var _this = _super.call(this, props, context) || this;
-            _this.mounted = false;
-            _this.unmounted = false;
-            configureComponent(handler, errorHandler)(aperture, _this, isValidElement, isComponentClass);
-            return _this;
-        }
-        WithEffects.prototype.componentDidMount = function () {
-            this.mounted = true;
-            this.triggerMount();
-        };
-        WithEffects.prototype.componentWillReceiveProps = function (nextProps) {
-            this.reDecorateProps(nextProps);
-            this.pushProps(nextProps);
-        };
-        WithEffects.prototype.shouldComponentUpdate = function (nextProps, nextState) {
-            return this.havePropsChanged(nextProps, nextState);
-        };
-        WithEffects.prototype.componentWillUnmount = function () {
-            this.unmounted = true;
-            this.triggerUnmount();
-        };
-        WithEffects.prototype.render = function () {
-            if (this.state.children) {
-                return this.state.children;
+    return _a = /** @class */ (function (_super) {
+            __extends(WithEffects, _super);
+            function WithEffects(props, context) {
+                var _this = _super.call(this, props, context) || this;
+                _this.mounted = false;
+                _this.unmounted = false;
+                configureComponent(handler, errorHandler)(aperture, _this, isValidElement, isComponentClass);
+                return _this;
             }
-            return createElement(BaseComponent, this.getChildProps());
-        };
-        return WithEffects;
-    }(Component));
+            WithEffects.prototype.componentDidMount = function () {
+                this.mounted = true;
+                this.triggerMount();
+            };
+            WithEffects.prototype.componentWillReceiveProps = function (nextProps) {
+                this.reDecorateProps(nextProps);
+                this.pushProps(nextProps);
+            };
+            WithEffects.prototype.shouldComponentUpdate = function (nextProps, nextState) {
+                return this.havePropsChanged(nextProps, nextState);
+            };
+            WithEffects.prototype.componentWillUnmount = function () {
+                this.unmounted = true;
+                this.triggerUnmount();
+            };
+            WithEffects.prototype.render = function () {
+                if (this.state.children) {
+                    return this.state.children;
+                }
+                return createElement(BaseComponent, this.getChildProps());
+            };
+            return WithEffects;
+        }(Component)),
+        _a.contextType = Context,
+        _a;
+    var _a;
 }; }; };
@@ -333,0 +340,0 @@

index.js

@@ -112,2 +112,10 @@ 'use strict';
     var data = function () { return xs.from(dataObservable); };
+    var fromEvent = function (eventName, valueTransformer) {
+        return data()
+            .filter(isEvent(eventName))
+            .map(function (data) {
+            var value = data.payload.value;
+            return valueTransformer ? valueTransformer(value) : value;
+        });
+    };
     return {
@@ -145,11 +153,5 @@ mount: data()
         },
-        fromEvent: function (eventName, valueTransformer) {
-            return data()
-                .filter(isEvent(eventName))
-                .map(function (data) {
-                var value = data.payload.value;
-                return valueTransformer ? valueTransformer(value) : value;
-            });
-        },
-        pushEvent: pushEvent
+        fromEvent: fromEvent,
+        pushEvent: pushEvent,
+        useEvent: function (eventName) { return [fromEvent(eventName), pushEvent(eventName)]; }
     };
@@ -177,4 +179,4 @@ };
     };
-    var finalHandler = function (initialProps) {
-        var effectHandler = handler(initialProps);
+    var finalHandler = function (initialProps, initialContext) {
+        var effectHandler = handler(initialProps, initialContext);
         return function (effect) {
@@ -244,4 +246,6 @@ if (isValidElement(effect)) {
     var component = createComponent(instance, dataObservable, pushEvent);
-    var sinkObservable = aperture(instance.props)(component);
-    var sinkSubscription = subscribeToSink(sinkObservable, finalHandler(instance.props), errorHandler ? errorHandler(instance.props) : undefined);
+    var sinkObservable = aperture(instance.props, instance.context)(component);
+    var sinkSubscription = subscribeToSink(sinkObservable, finalHandler(instance.props, instance.context), errorHandler
+        ? errorHandler(instance.props, instance.context)
+        : undefined);
     instance.reDecorateProps = function (nextProps) {
@@ -303,36 +307,39 @@ Object.keys(nextProps).forEach(function (propName) {
 var Empty = function () { return null; };
-var withEffects = function (handler, errorHandler) { return function (aperture) { return function (BaseComponent) {
+var withEffects = function (handler, errorHandler, Context) { return function (aperture) { return function (BaseComponent) {
     if (BaseComponent === void 0) { BaseComponent = Empty; }
-    return /** @class */ (function (_super) {
-        __extends(WithEffects, _super);
-        function WithEffects(props, context) {
-            var _this = _super.call(this, props, context) || this;
-            _this.mounted = false;
-            _this.unmounted = false;
-            configureComponent(handler, errorHandler)(aperture, _this, React.isValidElement, isComponentClass);
-            return _this;
-        }
-        WithEffects.prototype.componentDidMount = function () {
-            this.mounted = true;
-            this.triggerMount();
-        };
-        WithEffects.prototype.componentWillReceiveProps = function (nextProps) {
-            this.reDecorateProps(nextProps);
-            this.pushProps(nextProps);
-        };
-        WithEffects.prototype.shouldComponentUpdate = function (nextProps, nextState) {
-            return this.havePropsChanged(nextProps, nextState);
-        };
-        WithEffects.prototype.componentWillUnmount = function () {
-            this.unmounted = true;
-            this.triggerUnmount();
-        };
-        WithEffects.prototype.render = function () {
-            if (this.state.children) {
-                return this.state.children;
+    return _a = /** @class */ (function (_super) {
+            __extends(WithEffects, _super);
+            function WithEffects(props, context) {
+                var _this = _super.call(this, props, context) || this;
+                _this.mounted = false;
+                _this.unmounted = false;
+                configureComponent(handler, errorHandler)(aperture, _this, React.isValidElement, isComponentClass);
+                return _this;
             }
-            return React.createElement(BaseComponent, this.getChildProps());
-        };
-        return WithEffects;
-    }(React.Component));
+            WithEffects.prototype.componentDidMount = function () {
+                this.mounted = true;
+                this.triggerMount();
+            };
+            WithEffects.prototype.componentWillReceiveProps = function (nextProps) {
+                this.reDecorateProps(nextProps);
+                this.pushProps(nextProps);
+            };
+            WithEffects.prototype.shouldComponentUpdate = function (nextProps, nextState) {
+                return this.havePropsChanged(nextProps, nextState);
+            };
+            WithEffects.prototype.componentWillUnmount = function () {
+                this.unmounted = true;
+                this.triggerUnmount();
+            };
+            WithEffects.prototype.render = function () {
+                if (this.state.children) {
+                    return this.state.children;
+                }
+                return React.createElement(BaseComponent, this.getChildProps());
+            };
+            return WithEffects;
+        }(React.Component)),
+        _a.contextType = Context,
+        _a;
+    var _a;
 }; }; };
@@ -339,0 +346,0 @@

package.json

 {
     "name": "refract-xstream",
     "description": "Refract bindings for React with xstream: harness the power of reactive programming to supercharge your components!",
-    "version": "2.0.0",
+    "version": "2.1.0",
     "main": "index.js",
@@ -6,0 +6,0 @@ "jsnext:main": "index.es.js",

README.md

@@ -42,3 +42,3 @@ <p align="center">
 *   [Manage side effects](https://refract.js.org/) like API calls, analytics, logging, etc.
-*   [Manipulate, replace and inject props](https://refract.js.org/usage/pushing-props), you can even [fully replace Redux `connect` HoC](https://refract.js.org/recipes/replace-connect)
+*   [Manipulate, replace and inject props](https://refract.js.org/usage/pushing-to-props), you can even [fully replace Redux `connect` HoC](https://refract.js.org/recipes/replacing-connect)
 *   [Handle state](https://refract.js.org/recipes/handling-state)
@@ -45,0 +45,0 @@ *   [Render components](https://refract.js.org/usage/rendering-components)

types/baseTypes.d.ts

@@ -1,3 +0,9 @@
-export declare type Handler<P, E> = (intialProps: P) => (val: E) => void
-export declare type ErrorHandler<P> = (intialProps: P) => (error: any) => void
+export declare type Handler<P, E, C = any> = (
+    intialProps: P,
+    initialContext: C
+) => (val: E) => void
+export declare type ErrorHandler<P, C = any> = (
+    intialProps: P,
+    initialContext: C
+) => (error: any) => void
 export declare type PushEvent = (eventName: string) => <T>(val: T) => void

types/configureComponent.d.ts

 import { Handler, ErrorHandler } from './baseTypes'
 import { Aperture } from './observable'
-declare const configureComponent: <P, E>(
-    handler: Handler<P, E>,
-    errorHandler?: ErrorHandler<P>
+declare const configureComponent: <P, E, Ctx>(
+    handler: Handler<P, E, Ctx>,
+    errorHandler?: ErrorHandler<P, any>
 ) => (
-    aperture: Aperture<P, E>,
+    aperture: Aperture<P, E, Ctx>,
     instance: any,
@@ -9,0 +9,0 @@ isValidElement?: (val: any) => boolean,

types/observable.d.ts

@@ -16,5 +16,7 @@ import { Stream, Listener, Subscription } from 'xstream'
     pushEvent: PushEvent
+    useEvent: <T>(eventName: string) => [Stream<T>, (val: T) => any]
 }
-export declare type Aperture<P, E> = (
-    props: P
+export declare type Aperture<P, E, C = any> = (
+    initialProps: P,
+    initialContext: C
 ) => (component: ObservableComponent) => Stream<E>
@@ -21,0 +23,0 @@ export declare const subscribeToSink: <T>(

types/withEffects.d.ts

@@ -11,7 +11,8 @@ /// <reference types="react" />
 }
-export declare const withEffects: <P, E, CP = P>(
-    handler: Handler<P, E>,
-    errorHandler?: ErrorHandler<P>
+export declare const withEffects: <P, E, CP = P, C = any>(
+    handler: Handler<P, E, C>,
+    errorHandler?: ErrorHandler<P, C>,
+    Context?: React.Context<C>
 ) => (
-    aperture: Aperture<P, E>
+    aperture: Aperture<P, E, C>
 ) => (
@@ -18,0 +19,0 @@ BaseComponent?: React.ComponentType<

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

Total package byte prevSize

41938

increased by2.64%

Lines of code

880

increased by2.68%

No dependency changes