flinker 1.0.0 → 1.0.6

package/dist/cjs/RXObserver.js

@@ -0,0 +1,255 @@
+"use strict";
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RenderQueueStatus = exports.ObservableGlobalState = exports.JSXSubscriber = void 0;
+exports.observe = observe;
+exports.observeFrom = observeFrom;
+exports.observer = observer;
+var react_1 = require("react");
+var __DEV__ = false;
+/*
+*
+*
+* GLOBAL OBSERVE METHODS
+*
+*
+* */
+function observe(rx) {
+    if (rx) {
+        var jsxSubscriber = ObservableGlobalState.initializingJSXComponent;
+        if (jsxSubscriber !== JSXSubscriber.empty) {
+            logInfo('observe(' + rx.constructor.name + '), subscriber uid =', jsxSubscriber.uid);
+            jsxSubscriber.observe(rx);
+        }
+        else {
+            logWarn('observe(' + rx.constructor.name + ') is failed: JSX Function Component has not "observer" wrapper!');
+        }
+    }
+    return rx;
+}
+function observeFrom(rx) {
+    if (rx) {
+        var jsxSubscriber = ObservableGlobalState.initializingJSXComponent;
+        if (jsxSubscriber !== JSXSubscriber.empty) {
+            logInfo('observeFunc(' + rx.constructor.name + '), subscriber uid =', jsxSubscriber.uid);
+            jsxSubscriber.observeFrom(rx);
+        }
+        else {
+            logWarn('observeFunc(' + rx.constructor.name + ') is failed: JSX Function Component has not "observer" wrapper!');
+        }
+    }
+}
+function observer(component) {
+    return function (props) {
+        var subscriberRef = (0, react_1.useRef)(JSXSubscriber.empty);
+        var _a = (0, react_1.useState)(ObservableGlobalState.renderCycle), forceRender = _a[1];
+        if (subscriberRef.current === JSXSubscriber.empty) {
+            subscriberRef.current = new JSXSubscriber(function (renderCycle) {
+                forceRender(renderCycle);
+            });
+        }
+        if (__DEV__) {
+            (0, react_1.useLayoutEffect)(function () {
+                if (ObservableGlobalState.debug)
+                    logInfo('Registering of unmounting [' + subscriberRef.current.uid + ']');
+                if (subscriberRef.current.isDisposed) {
+                    if (ObservableGlobalState.debug)
+                        logInfo('Disposed Subscriber [' + subscriberRef.current.uid + '] is resurrected');
+                    subscriberRef.current.resurrect();
+                }
+                return function () {
+                    if (ObservableGlobalState.debug)
+                        logInfo('Subscriber [' + subscriberRef.current.uid + '] is unmounted and disposed');
+                    subscriberRef.current.dispose();
+                };
+            }, []);
+        }
+        else {
+            (0, react_1.useLayoutEffect)(function () { return function () { subscriberRef.current.dispose(); }; }, []);
+        }
+        var parentGlobalComponent = ObservableGlobalState.initializingJSXComponent;
+        ObservableGlobalState.initializingJSXComponent = subscriberRef.current;
+        //initializing begin
+        subscriberRef.current.renderCycle = ObservableGlobalState.renderCycle;
+        var renderedComponent = component(props);
+        subscriberRef.current.initialized = true;
+        //initializing end
+        ObservableGlobalState.initializingJSXComponent = parentGlobalComponent;
+        return renderedComponent;
+    };
+}
+var suid = (function () { var value = 0; return function () { return value++; }; })();
+var JSXSubscriber = /** @class */ (function () {
+    function JSXSubscriber(forceRenderFunc) {
+        this.buildersSet = new Set();
+        this.unsubscribeColl = Array();
+        this.renderCycle = -1;
+        this.initialized = false;
+        this._isDisposed = false;
+        this.uid = suid();
+        this.forceRenderFunc = forceRenderFunc;
+    }
+    Object.defineProperty(JSXSubscriber.prototype, "isDisposed", {
+        get: function () {
+            return this._isDisposed;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    JSXSubscriber.prototype.observe = function (b) {
+        var _this = this;
+        if (b.isComplete || this.buildersSet.has(b.suid))
+            return;
+        this.buildersSet.add(b.suid);
+        this.unsubscribeColl.push(b.pipe()
+            .onReceive(function () {
+            RenderQueue.self.add(_this);
+        })
+            .subscribe());
+    };
+    JSXSubscriber.prototype.observeFrom = function (f) {
+        var _this = this;
+        if (this.initialized)
+            return;
+        this.unsubscribeColl.push(f().pipe()
+            .skipFirst()
+            .onReceive(function () {
+            RenderQueue.self.add(_this);
+        })
+            .subscribe());
+    };
+    JSXSubscriber.prototype.dispose = function () {
+        this._isDisposed = true;
+        if (!__DEV__)
+            this.unsubscribeColl.forEach(function (f) { f(); });
+    };
+    JSXSubscriber.prototype.resurrect = function () {
+        this._isDisposed = false;
+    };
+    JSXSubscriber.prototype.render = function (renderCycle) {
+        if (this.isDisposed || this.renderCycle === renderCycle) {
+            return false;
+        }
+        else {
+            this.renderCycle = renderCycle;
+            logInfo('----::forceRenderFunc');
+            this.forceRenderFunc(this.renderCycle);
+            return true;
+        }
+    };
+    JSXSubscriber.empty = new JSXSubscriber(function () { });
+    return JSXSubscriber;
+}());
+exports.JSXSubscriber = JSXSubscriber;
+//--------------------------------------
+//  GlobalState
+//--------------------------------------
+var ObservableGlobalState = /** @class */ (function () {
+    function ObservableGlobalState() {
+    }
+    ObservableGlobalState.renderCycle = 0;
+    ObservableGlobalState.initializingJSXComponent = JSXSubscriber.empty;
+    ObservableGlobalState.debug = false;
+    return ObservableGlobalState;
+}());
+exports.ObservableGlobalState = ObservableGlobalState;
+//--------------------------------------
+//  RenderQueue
+//--------------------------------------
+var RenderQueueStatus;
+(function (RenderQueueStatus) {
+    RenderQueueStatus["IDLE"] = "IDLE";
+    RenderQueueStatus["PENDING"] = "PENDING";
+    RenderQueueStatus["RUNNING"] = "LOADING";
+})(RenderQueueStatus || (exports.RenderQueueStatus = RenderQueueStatus = {}));
+var RenderQueue = /** @class */ (function () {
+    function RenderQueue() {
+        this.temp = Array();
+        this.queue = new Set();
+        this.status = RenderQueueStatus.IDLE;
+        this.INFINITE_LOOP_LIMIT = 20;
+        this.infiniteLoopDetected = false;
+        this.loopRenderings = 0;
+    }
+    RenderQueue.prototype.add = function (s) {
+        var _this = this;
+        if (this.infiniteLoopDetected)
+            return;
+        if (this.status === RenderQueueStatus.RUNNING) {
+            this.temp.push(s);
+        }
+        else {
+            this.queue.add(s);
+            if (this.status === RenderQueueStatus.IDLE) {
+                this.status = RenderQueueStatus.PENDING;
+                setTimeout(function () {
+                    _this.render();
+                }, 0);
+            }
+        }
+    };
+    RenderQueue.prototype.render = function () {
+        var _this = this;
+        logInfo('RenderQueue:render: begin, cycle:', ObservableGlobalState.renderCycle);
+        this.status = RenderQueueStatus.RUNNING;
+        ObservableGlobalState.renderCycle++;
+        var renderedComponentsCount = 0;
+        Array.from(this.queue)
+            .sort(function (s1, s2) { return s1.uid - s2.uid; })
+            .forEach(function (subscriber) {
+            subscriber.render(ObservableGlobalState.renderCycle) && renderedComponentsCount++;
+        });
+        this.queue.clear();
+        this.status = RenderQueueStatus.IDLE;
+        if (this.temp.length > 0) {
+            this.loopRenderings++;
+            if (this.loopRenderings > 2) {
+                logWarn.apply(void 0, __spreadArray(__spreadArray(['Sending value from publisher while jsx-component is rendering may cause an infinite loop. Loop renderings:', this.loopRenderings,
+                    '. Most active publishers: ['], this.temp.map(function (ob) { return ob.constructor.name; }), false), [']'], false));
+            }
+            if (this.loopRenderings < this.INFINITE_LOOP_LIMIT) {
+                this.temp.forEach(function (publisherUID) {
+                    _this.add(publisherUID);
+                });
+                this.temp.length = 0;
+            }
+            else {
+                this.infiniteLoopDetected = true;
+                logWarn('--Infinite Loop! The possible reason: An executed jsx-component X invoked new rendering of a jsx-component, ' +
+                    'that caused mutation in publisher, that trigger again force render of X');
+            }
+        }
+        else {
+            this.loopRenderings = 0;
+        }
+        logInfo('RenderQueue:render: end, renderedComponentsCount:', renderedComponentsCount);
+    };
+    RenderQueue.self = new RenderQueue();
+    return RenderQueue;
+}());
+//--------------------------------------
+//  logging
+//--------------------------------------
+var logInfo = function () {
+    var msg = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        msg[_i] = arguments[_i];
+    }
+    if (ObservableGlobalState.debug)
+        console.log.apply(console, msg);
+};
+var logWarn = function () {
+    var msg = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        msg[_i] = arguments[_i];
+    }
+    console.warn.apply(console, msg);
+};