sygnal 2.4.0 → 2.5.0

package/dist/component.js

@@ -1,1324 +0,0 @@
-'use strict';
-
-var _excluded = ["state", "sygnalFactory", "id"];
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
-import isolate from '@cycle/isolate';
-import collection from './collection.js';
-import switchable from './switchable.js';
-import { StateSource } from '@cycle/state';
-import { default as xs, Stream } from 'xstream';
-import { default as delay } from 'xstream/extra/delay.js';
-import { default as concat } from 'xstream/extra/concat.js';
-import debounce from 'xstream/extra/debounce.js';
-import { default as dropRepeats } from 'xstream/extra/dropRepeats.js'; // import syntax has bugs for xstream in Node context
-// this attempts to normalize to work in both Node and browser
-// if (!xs.never && xs.default && xs.default.never) {
-//   xs.never = xs.default.never
-//   xs.merge = xs.default.merge
-//   xs.of    = xs.default.of
-// }
-// const concat = (Concat && Concat.default) ? Concat.default : Concat
-// const delay  = (Delay && Delay.default) ? Delay.default : Delay
-// const dropRepeats = (DropRepeats && DropRepeats.default) ? DropRepeats.default : DropRepeats
-
-var ENVIRONMENT = typeof window != 'undefined' && window || process && process.env || {};
-var REQUEST_SELECTOR_METHOD = 'request';
-var BOOTSTRAP_ACTION = 'BOOTSTRAP';
-var INITIALIZE_ACTION = 'INITIALIZE';
-var HYDRATE_ACTION = 'HYDRATE';
-var IS_ROOT_COMPONENT = true;
-export var ABORT = '~#~#~ABORT~#~#~';
-export default function component(opts) {
-  var name = opts.name,
-      sources = opts.sources,
-      isolateOpts = opts.isolateOpts,
-      _opts$stateSourceName = opts.stateSourceName,
-      stateSourceName = _opts$stateSourceName === void 0 ? 'STATE' : _opts$stateSourceName;
-
-  if (sources && _typeof(sources) !== 'object') {
-    throw new Error('Sources must be a Cycle.js sources object:', name);
-  }
-
-  var fixedIsolateOpts;
-
-  if (typeof isolateOpts == 'string') {
-    fixedIsolateOpts = _defineProperty({}, stateSourceName, isolateOpts);
-  } else {
-    if (isolateOpts === true) {
-      fixedIsolateOpts = {};
-    } else {
-      fixedIsolateOpts = isolateOpts;
-    }
-  }
-
-  var currySources = typeof sources === 'undefined';
-
-  if (_typeof(fixedIsolateOpts) == 'object') {
-    var wrapped = function wrapped(sources) {
-      var fixedOpts = _objectSpread(_objectSpread({}, opts), {}, {
-        sources: sources
-      });
-
-      return new Component(fixedOpts).sinks;
-    };
-
-    return currySources ? isolate(wrapped, fixedIsolateOpts) : isolate(wrapped, fixedIsolateOpts)(sources);
-  } else {
-    return currySources ? function (sources) {
-      return new Component(_objectSpread(_objectSpread({}, opts), {}, {
-        sources: sources
-      })).sinks;
-    } : new Component(opts).sinks;
-  }
-}
-
-var Component = /*#__PURE__*/function () {
-  // [ PASSED PARAMETERS ]
-  // name
-  // sources
-  // intent
-  // request
-  // model
-  // response
-  // view
-  // children
-  // initialState
-  // calculated
-  // storeCalculatedInState
-  // DOMSourceName
-  // stateSourceName
-  // requestSourceName
-  // [ PRIVATE / CALCULATED VALUES ]
-  // sourceNames
-  // intent$
-  // action$
-  // model$
-  // response$
-  // sendResponse$
-  // children$
-  // vdom$
-  // subComponentSink$
-  // [ INSTANTIATED STREAM OPERATOR ]
-  // log
-  // [ OUTPUT ]
-  // sinks
-  function Component(_ref) {
-    var _this = this;
-
-    var _ref$name = _ref.name,
-        name = _ref$name === void 0 ? 'NO NAME' : _ref$name,
-        sources = _ref.sources,
-        intent = _ref.intent,
-        request = _ref.request,
-        model = _ref.model,
-        response = _ref.response,
-        view = _ref.view,
-        _ref$children = _ref.children,
-        children = _ref$children === void 0 ? {} : _ref$children,
-        _ref$components = _ref.components,
-        components = _ref$components === void 0 ? {} : _ref$components,
-        initialState = _ref.initialState,
-        calculated = _ref.calculated,
-        _ref$storeCalculatedI = _ref.storeCalculatedInState,
-        storeCalculatedInState = _ref$storeCalculatedI === void 0 ? true : _ref$storeCalculatedI,
-        _ref$DOMSourceName = _ref.DOMSourceName,
-        DOMSourceName = _ref$DOMSourceName === void 0 ? 'DOM' : _ref$DOMSourceName,
-        _ref$stateSourceName = _ref.stateSourceName,
-        stateSourceName = _ref$stateSourceName === void 0 ? 'STATE' : _ref$stateSourceName,
-        _ref$requestSourceNam = _ref.requestSourceName,
-        requestSourceName = _ref$requestSourceNam === void 0 ? 'HTTP' : _ref$requestSourceNam;
-
-    _classCallCheck(this, Component);
-
-    if (!sources || _typeof(sources) != 'object') throw new Error('Missing or invalid sources');
-    this.name = name;
-    this.sources = sources;
-    this.intent = intent;
-    this.request = request;
-    this.model = model;
-    this.response = response;
-    this.view = view;
-    this.children = children;
-    this.components = components;
-    this.initialState = initialState;
-    this.calculated = calculated;
-    this.storeCalculatedInState = storeCalculatedInState;
-    this.DOMSourceName = DOMSourceName;
-    this.stateSourceName = stateSourceName;
-    this.requestSourceName = requestSourceName;
-    this.sourceNames = Object.keys(sources);
-    this.isSubComponent = this.sourceNames.includes('props$');
-    var state$ = sources[stateSourceName] && sources[stateSourceName].stream;
-
-    if (state$) {
-      this.currentState = initialState || {};
-      this.sources[this.stateSourceName] = new StateSource(state$.map(function (val) {
-        _this.currentState = val;
-        return val;
-      }));
-    }
-
-    if (IS_ROOT_COMPONENT && typeof this.intent === 'undefined' && typeof this.model === 'undefined') {
-      this.initialState = initialState || true;
-
-      this.intent = function (_) {
-        return {
-          __NOOP_ACTION__: xs.never()
-        };
-      };
-
-      this.model = {
-        __NOOP_ACTION__: function __NOOP_ACTION__(state) {
-          return state;
-        }
-      };
-    }
-
-    IS_ROOT_COMPONENT = false;
-    this.log = makeLog(name);
-    this.initIntent$();
-    this.initAction$();
-    this.initResponse$();
-    this.initState();
-    this.initModel$();
-    this.initSendResponse$();
-    this.initChildren$();
-    this.initSubComponentSink$();
-    this.initVdom$();
-    this.initSinks();
-  }
-
-  _createClass(Component, [{
-    key: "initIntent$",
-    value: function initIntent$() {
-      if (!this.intent) {
-        return;
-      }
-
-      if (typeof this.intent != 'function') {
-        throw new Error('Intent must be a function');
-      }
-
-      this.intent$ = this.intent(this.sources);
-
-      if (!(this.intent$ instanceof Stream) && _typeof(this.intent$) != 'object') {
-        throw new Error('Intent must return either an action$ stream or map of event streams');
-      }
-    }
-  }, {
-    key: "initAction$",
-    value: function initAction$() {
-      var requestSource = this.sources && this.sources[this.requestSourceName] || null;
-
-      if (!this.intent$) {
-        this.action$ = xs.never();
-        return;
-      }
-
-      var runner;
-
-      if (this.intent$ instanceof Stream) {
-        runner = this.intent$;
-      } else {
-        var mapped = Object.entries(this.intent$).map(function (_ref2) {
-          var _ref3 = _slicedToArray(_ref2, 2),
-              type = _ref3[0],
-              data$ = _ref3[1];
-
-          return data$.map(function (data) {
-            return {
-              type: type,
-              data: data
-            };
-          });
-        });
-        runner = xs.merge.apply(xs, [xs.never()].concat(_toConsumableArray(mapped)));
-      }
-
-      var action$ = runner instanceof Stream ? runner : runner.apply && runner(this.sources) || xs.never();
-      var wrapped$ = concat(xs.of({
-        type: BOOTSTRAP_ACTION
-      }), action$).compose(delay(10));
-      var initialApiData;
-
-      if (requestSource && typeof requestSource.select == 'function') {
-        initialApiData = requestSource.select('initial').flatten();
-      } else {
-        initialApiData = xs.never();
-      }
-
-      var hydrate$ = initialApiData.map(function (data) {
-        return {
-          type: HYDRATE_ACTION,
-          data: data
-        };
-      });
-      this.action$ = xs.merge(wrapped$, hydrate$).compose(this.log(function (_ref4) {
-        var type = _ref4.type;
-        return "Action triggered: <".concat(type, ">");
-      }));
-    }
-  }, {
-    key: "initResponse$",
-    value: function initResponse$() {
-      var _this2 = this;
-
-      if (typeof this.request == 'undefined') {
-        return;
-      } else if (_typeof(this.request) != 'object') {
-        throw new Error('The request parameter must be an object');
-      }
-
-      var router$ = this.sources[this.requestSourceName];
-      var methods = Object.entries(this.request);
-      var wrapped = methods.reduce(function (acc, _ref5) {
-        var _ref6 = _slicedToArray(_ref5, 2),
-            method = _ref6[0],
-            routes = _ref6[1];
-
-        var _method = method.toLowerCase();
-
-        if (typeof router$[_method] != 'function') {
-          throw new Error('Invalid method in request object:', method);
-        }
-
-        var entries = Object.entries(routes);
-        var mapped = entries.reduce(function (acc, _ref7) {
-          var _ref8 = _slicedToArray(_ref7, 2),
-              route = _ref8[0],
-              action = _ref8[1];
-
-          var routeString = "[".concat(_method.toUpperCase(), "]:").concat(route || 'none');
-
-          var actionType = _typeof(action);
-
-          if (actionType === 'undefined') {
-            throw new Error("Action for '".concat(route, "' route in request object not specified"));
-          } else if (actionType !== 'string' && actionType !== 'function') {
-            throw new Error("Invalid action for '".concat(route, "' route: expecting string or function"));
-          }
-
-          var actionString = actionType === 'function' ? '[ FUNCTION ]' : "< ".concat(action, " >");
-          console.log("[".concat(_this2.name, "] Adding ").concat(_this2.requestSourceName, " route:"), _method.toUpperCase(), "'".concat(route, "' <").concat(actionString, ">"));
-
-          var route$ = router$[_method](route).compose(dropRepeats(function (a, b) {
-            return a.id == b.id;
-          })).map(function (req) {
-            if (!req || !req.id) {
-              throw new Error("No id found in request: ".concat(routeString));
-            }
-
-            try {
-              var _reqId = req.id;
-              var params = req.params;
-              var body = req.body;
-              var cookies = req.cookies;
-              var type = actionType === 'function' ? 'FUNCTION' : action;
-              var data = {
-                params: params,
-                body: body,
-                cookies: cookies,
-                req: req
-              };
-              var obj = {
-                type: type,
-                data: body,
-                req: req,
-                _reqId: _reqId,
-                _action: type
-              };
-              var timestamp = new Date().toISOString();
-              var ip = req.get ? req.get('host') : '0.0.0.0';
-              console.log("".concat(timestamp, " ").concat(ip, " ").concat(req.method, " ").concat(req.url));
-
-              if (ENVIRONMENT.DEBUG) {
-                _this2.action$.setDebugListener({
-                  next: function next(_ref9) {
-                    var type = _ref9.type;
-                    return console.log("[".concat(_this2.name, "] Action from ").concat(_this2.requestSourceName, " request: <").concat(type, ">"));
-                  }
-                });
-              }
-
-              if (actionType === 'function') {
-                var enhancedState = _this2.addCalculated(_this2.currentState);
-
-                var result = action(enhancedState, req);
-                return xs.of(_objectSpread(_objectSpread({}, obj), {}, {
-                  data: result
-                }));
-              } else {
-                _this2.action$.shamefullySendNext(obj);
-
-                var sourceEntries = Object.entries(_this2.sources);
-                var responses = sourceEntries.reduce(function (acc, _ref10) {
-                  var _ref11 = _slicedToArray(_ref10, 2),
-                      name = _ref11[0],
-                      source = _ref11[1];
-
-                  if (!source || typeof source[REQUEST_SELECTOR_METHOD] != 'function') return acc;
-                  var selected$ = source[REQUEST_SELECTOR_METHOD](_reqId);
-                  return [].concat(_toConsumableArray(acc), [selected$]);
-                }, []);
-                return xs.merge.apply(xs, _toConsumableArray(responses));
-              }
-            } catch (err) {
-              console.error(err);
-            }
-          }).flatten();
-
-          return [].concat(_toConsumableArray(acc), [route$]);
-        }, []);
-        var mapped$ = xs.merge.apply(xs, _toConsumableArray(mapped));
-        return [].concat(_toConsumableArray(acc), [mapped$]);
-      }, []);
-      this.response$ = xs.merge.apply(xs, _toConsumableArray(wrapped)).compose(this.log(function (res) {
-        if (res._action) return "[".concat(_this2.requestSourceName, "] response data received for Action: <").concat(res._action, ">");
-        return "[".concat(_this2.requestSourceName, "] response data received from FUNCTION");
-      }));
-
-      if (typeof this.response != 'undefined' && typeof this.response$ == 'undefined') {
-        throw new Error('Cannot have a response parameter without a request parameter');
-      }
-    }
-  }, {
-    key: "initState",
-    value: function initState() {
-      var _this3 = this;
-
-      if (this.model != undefined) {
-        if (this.model[INITIALIZE_ACTION] === undefined) {
-          this.model[INITIALIZE_ACTION] = _defineProperty({}, this.stateSourceName, function (_, data) {
-            return _objectSpread({}, _this3.addCalculated(data));
-          });
-        } else {
-          Object.keys(this.model[INITIALIZE_ACTION]).forEach(function (name) {
-            if (name !== _this3.stateSourceName) {
-              console.warn("".concat(INITIALIZE_ACTION, " can only be used with the ").concat(_this3.stateSourceName, " source... disregarding ").concat(name));
-              delete _this3.model[INITIALIZE_ACTION][name];
-            }
-          });
-        }
-      }
-    }
-  }, {
-    key: "initModel$",
-    value: function initModel$() {
-      var _this4 = this;
-
-      if (typeof this.model == 'undefined') {
-        this.model$ = this.sourceNames.reduce(function (a, s) {
-          a[s] = xs.never();
-          return a;
-        }, {});
-        return;
-      }
-
-      var initial = {
-        type: INITIALIZE_ACTION,
-        data: this.initialState
-      };
-      var shimmed$ = this.initialState ? concat(xs.of(initial), this.action$).compose(delay(0)) : this.action$;
-      var onState = this.makeOnAction(shimmed$, true, this.action$);
-      var onNormal = this.makeOnAction(this.action$, false, this.action$);
-      var modelEntries = Object.entries(this.model);
-      var reducers = {};
-      modelEntries.forEach(function (entry) {
-        var _entry = _slicedToArray(entry, 2),
-            action = _entry[0],
-            sinks = _entry[1];
-
-        if (typeof sinks === 'function') {
-          sinks = _defineProperty({}, _this4.stateSourceName, sinks);
-        }
-
-        if (_typeof(sinks) !== 'object') {
-          throw new Error("Entry for each action must be an object: ".concat(_this4.name, " ").concat(action));
-        }
-
-        var sinkEntries = Object.entries(sinks);
-        sinkEntries.forEach(function (entry) {
-          var _entry2 = _slicedToArray(entry, 2),
-              sink = _entry2[0],
-              reducer = _entry2[1];
-
-          var isStateSink = sink == _this4.stateSourceName;
-          var on = isStateSink ? onState : onNormal;
-          var onned = on(action, reducer);
-          var wrapped = onned.compose(_this4.log(function (data) {
-            if (isStateSink) {
-              return "State reducer added: <".concat(action, ">");
-            } else {
-              var extra = data && (data.type || data.command || data.name || data.key || Array.isArray(data) && 'Array' || data);
-              return "Data sent to [".concat(sink, "]: <").concat(action, "> ").concat(extra);
-            }
-          }));
-
-          if (Array.isArray(reducers[sink])) {
-            reducers[sink].push(wrapped);
-          } else {
-            reducers[sink] = [wrapped];
-          }
-        });
-      });
-      var model$ = Object.entries(reducers).reduce(function (acc, entry) {
-        var _entry3 = _slicedToArray(entry, 2),
-            sink = _entry3[0],
-            streams = _entry3[1];
-
-        acc[sink] = xs.merge.apply(xs, [xs.never()].concat(_toConsumableArray(streams)));
-        return acc;
-      }, {});
-      this.model$ = model$;
-    }
-  }, {
-    key: "initSendResponse$",
-    value: function initSendResponse$() {
-      var _this5 = this;
-
-      var responseType = _typeof(this.response);
-
-      if (responseType != 'function' && responseType != 'undefined') {
-        throw new Error('The response parameter must be a function');
-      }
-
-      if (responseType == 'undefined') {
-        if (this.response$) {
-          this.response$.subscribe({
-            next: this.log(function (_ref12) {
-              var _reqId = _ref12._reqId,
-                  _action = _ref12._action;
-              return "Unhandled response for request: ".concat(_action, " ").concat(_reqId);
-            })
-          });
-        }
-
-        this.sendResponse$ = xs.never();
-        return;
-      }
-
-      var selectable = {
-        select: function select(actions) {
-          if (typeof actions == 'undefined') return _this5.response$;
-          if (!Array.isArray(actions)) actions = [actions];
-          return _this5.response$.filter(function (_ref13) {
-            var _action = _ref13._action;
-            return actions.length > 0 ? _action === 'FUNCTION' || actions.includes(_action) : true;
-          });
-        }
-      };
-      var out = this.response(selectable);
-
-      if (_typeof(out) != 'object') {
-        throw new Error('The response function must return an object');
-      }
-
-      var entries = Object.entries(out);
-      var out$ = entries.reduce(function (acc, _ref14) {
-        var _ref15 = _slicedToArray(_ref14, 2),
-            command = _ref15[0],
-            response$ = _ref15[1];
-
-        var mapped$ = response$.map(function (_ref16) {
-          var _reqId = _ref16._reqId,
-              _action = _ref16._action,
-              data = _ref16.data;
-
-          if (!_reqId) {
-            throw new Error("No request id found for response for: ".concat(command));
-          }
-
-          return {
-            _reqId: _reqId,
-            _action: _action,
-            command: command,
-            data: data
-          };
-        });
-        return [].concat(_toConsumableArray(acc), [mapped$]);
-      }, []);
-      this.sendResponse$ = xs.merge.apply(xs, _toConsumableArray(out$)).compose(this.log(function (_ref17) {
-        var _reqId = _ref17._reqId,
-            _action = _ref17._action;
-        return "[".concat(_this5.requestSourceName, "] response sent for: <").concat(_action, ">");
-      }));
-    }
-  }, {
-    key: "initChildren$",
-    value: function initChildren$() {
-      var _this6 = this;
-
-      var initial = this.sourceNames.reduce(function (acc, name) {
-        if (name == _this6.DOMSourceName) {
-          acc[name] = {};
-        } else {
-          acc[name] = [];
-        }
-
-        return acc;
-      }, {});
-      this.children$ = Object.entries(this.children).reduce(function (acc, _ref18) {
-        var _ref19 = _slicedToArray(_ref18, 2),
-            childName = _ref19[0],
-            childFactory = _ref19[1];
-
-        var child$ = childFactory(_this6.sources);
-
-        _this6.sourceNames.forEach(function (source) {
-          if (source == _this6.DOMSourceName) {
-            acc[source][childName] = child$[source];
-          } else {
-            acc[source].push(child$[source]);
-          }
-        });
-
-        return acc;
-      }, initial);
-    }
-  }, {
-    key: "initSubComponentSink$",
-    value: function initSubComponentSink$() {
-      var _this7 = this;
-
-      var subComponentSink$ = xs.create({
-        start: function start(listener) {
-          _this7.newSubComponentSinks = listener.next.bind(listener);
-        },
-        stop: function stop(_) {}
-      });
-      subComponentSink$.subscribe({
-        next: function next(_) {
-          return _;
-        }
-      });
-      this.subComponentSink$ = subComponentSink$.filter(function (sinks) {
-        return Object.keys(sinks).length > 0;
-      });
-    }
-  }, {
-    key: "initVdom$",
-    value: function initVdom$() {
-      var _this8 = this;
-
-      if (typeof this.view != 'function') {
-        this.vdom$ = xs.of(null);
-        return;
-      }
-
-      var state = this.sources[this.stateSourceName];
-
-      var renderParams = _objectSpread({}, this.children$[this.DOMSourceName]);
-
-      var enhancedState = state && state.isolateSource(state, {
-        get: function get(state) {
-          return _this8.addCalculated(state);
-        }
-      });
-      var stateStream = enhancedState && enhancedState.stream || xs.never();
-      renderParams.state = stateStream;
-      renderParams[this.stateSourceName] = stateStream;
-
-      if (this.sources.props$) {
-        renderParams.props = this.sources.props$;
-      }
-
-      if (this.sources.children$) {
-        renderParams.children = this.sources.children$;
-      }
-
-      var pulled = Object.entries(renderParams).reduce(function (acc, _ref20) {
-        var _ref21 = _slicedToArray(_ref20, 2),
-            name = _ref21[0],
-            stream = _ref21[1];
-
-        acc.names.push(name);
-        acc.streams.push(stream);
-        return acc;
-      }, {
-        names: [],
-        streams: []
-      });
-      var merged = xs.combine.apply(xs, _toConsumableArray(pulled.streams));
-      var throttled = merged.compose(debounce(5)).map(function (arr) {
-        return pulled.names.reduce(function (acc, name, index) {
-          acc[name] = arr[index];
-          return acc;
-        }, {});
-      });
-      var componentNames = Object.keys(this.components);
-      var subComponentRenderedProxy$ = xs.create();
-      var vDom$ = throttled.map(function (params) {
-        return params;
-      }).map(this.view).map(function (vDom) {
-        return vDom || {
-          sel: 'div',
-          data: {},
-          children: []
-        };
-      });
-      var componentInstances$ = vDom$.fold(function (previousComponents, vDom) {
-        var foundComponents = getComponents(vDom, componentNames);
-        var entries = Object.entries(foundComponents);
-        var rootEntry = {
-          '::ROOT::': vDom
-        };
-
-        if (entries.length === 0) {
-          return rootEntry;
-        }
-
-        var sinkArrsByType = {};
-        var newComponents = entries.reduce(function (acc, _ref22) {
-          var _ref23 = _slicedToArray(_ref22, 2),
-              id = _ref23[0],
-              el = _ref23[1];
-
-          var componentName = el.sel;
-          var data = el.data;
-          var props = data.props || {};
-          var children = el.children || [];
-          var isCollection = data.isCollection || false;
-          var isSwitchable = data.isSwitchable || false;
-
-          if (previousComponents[id]) {
-            var entry = previousComponents[id];
-            acc[id] = entry;
-            entry.props$.shamefullySendNext(props);
-            entry.children$.shamefullySendNext(children);
-            return acc;
-          }
-
-          var factory = componentName === 'sygnal-factory' ? props.sygnalFactory : _this8.components[componentName] || props.sygnalFactory;
-
-          if (!factory && !isCollection && !isSwitchable) {
-            if (componentName === 'sygnal-factory') throw new Error("Component not found on element with Capitalized selector and nameless function: JSX transpilation replaces selectors starting with upper case letters with functions in-scope with the same name, Sygnal cannot see the name of the resulting component.");
-            throw new Error("Component not found: ".concat(componentName));
-          }
-
-          var props$ = xs.create().startWith(props);
-          var children$ = xs.create().startWith(children);
-          var stateSource = new StateSource(_this8.sources[_this8.stateSourceName].stream.startWith(_this8.currentState));
-          var sink$;
-          var preventStateUpdates = true;
-
-          if (isCollection) {
-            var _objectSpread3;
-
-            var field, lense;
-
-            var stateGetter = function stateGetter(state) {
-              var arr = state[field];
-              if (typeof arr === 'undefined') return;
-
-              if (!Array.isArray(arr)) {
-                var label = typeof data.props.of === 'string' ? data.props.of : 'components';
-                console.warn("Collection of ".concat(label, " does not have a valid array in the 'for' property: expects either an array or a string of the name of an array property on the state"));
-                return [];
-              }
-
-              return arr;
-            };
-
-            if (typeof props["for"] === 'undefined') {
-              lense = {
-                get: function get(state) {
-                  if (!Array.isArray(state)) {
-                    console.warn("Collection sub-component of ".concat(_this8.name, " has no 'for' attribute and the parent state is not an array: Provide a 'for' attribute with either an array or the name of a state property containing an array"));
-                    return [];
-                  }
-
-                  return state;
-                },
-                set: function set(oldState, newState) {
-                  return newState;
-                }
-              };
-              preventStateUpdates = false;
-            } else if (typeof props["for"] === 'string') {
-              field = props["for"];
-              lense = {
-                get: stateGetter,
-                set: function set(state, arr) {
-                  if (_this8.calculated && field in _this8.calculated) {
-                    console.warn("Collection sub-component of ".concat(_this8.name, " attempted to update state on a calculated field '").concat(field, "': Update ignored"));
-                    return state;
-                  }
-
-                  return _objectSpread(_objectSpread({}, state), {}, _defineProperty({}, field, arr));
-                }
-              };
-              preventStateUpdates = false;
-            } else {
-              field = 'for';
-              stateSource = new StateSource(props$.remember());
-              lense = {
-                get: stateGetter,
-                set: function set(state, arr) {
-                  return state;
-                }
-              };
-            }
-
-            var sources = _objectSpread(_objectSpread({}, _this8.sources), {}, (_objectSpread3 = {}, _defineProperty(_objectSpread3, _this8.stateSourceName, stateSource), _defineProperty(_objectSpread3, "props$", props$), _defineProperty(_objectSpread3, "children$", children$), _objectSpread3));
-
-            var _factory = typeof data.props.of === 'function' ? data.props.of : _this8.components[data.props.of];
-
-            sink$ = collection(_factory, lense, {
-              container: null
-            })(sources);
-
-            if (_typeof(sink$) !== 'object') {
-              throw new Error('Invalid sinks returned from component factory of collection element');
-            }
-          } else if (isSwitchable) {
-            var _objectSpread5;
-
-            var stateField = data.props.state;
-            var isolateSwitchable = false;
-
-            var _lense;
-
-            if (typeof stateField === 'string') {
-              isolateSwitchable = true;
-              _lense = {
-                get: function get(state) {
-                  return state[stateField];
-                },
-                set: function set(oldState, newState) {
-                  if (_this8.calculated && stateField in _this8.calculated) {
-                    console.warn("Switchable sub-component of ".concat(_this8.name, " attempted to update state on a calculated field '").concat(stateField, "': Update ignored"));
-                    return oldState;
-                  }
-
-                  return _objectSpread(_objectSpread({}, oldState), {}, _defineProperty({}, stateField, newState));
-                }
-              };
-              preventStateUpdates = false;
-            } else if (typeof stateField === 'undefined') {
-              isolateSwitchable = true;
-              _lense = {
-                get: function get(state) {
-                  return state;
-                },
-                set: function set(oldState, newState) {
-                  return newState;
-                }
-              };
-              preventStateUpdates = false;
-            } else if (_typeof(stateField) === 'object') {
-              stateSource = new StateSource(props$.map(function (props) {
-                return props.state;
-              }));
-            } else {
-              throw new Error("Invalid state provided to collection sub-component of ".concat(_this8.name, ": Expecting string, object, or none, but found ").concat(_typeof(stateField)));
-            }
-
-            var switchableComponents = data.props.of;
-
-            var _sources = _objectSpread(_objectSpread({}, _this8.sources), {}, (_objectSpread5 = {}, _defineProperty(_objectSpread5, _this8.stateSourceName, stateSource), _defineProperty(_objectSpread5, "props$", props$), _defineProperty(_objectSpread5, "children$", children$), _objectSpread5));
-
-            if (isolateSwitchable) {
-              sink$ = isolate(switchable(switchableComponents, props$.map(function (props) {
-                return props.current;
-              })), _defineProperty({}, _this8.stateSourceName, _lense))(_sources);
-            } else {
-              sink$ = switchable(switchableComponents, props$.map(function (props) {
-                return props.current;
-              }))(_sources);
-            }
-
-            if (_typeof(sink$) !== 'object') {
-              throw new Error('Invalid sinks returned from component factory of switchable element');
-            }
-          } else {
-            var stateProp = props.state,
-                sygnalFactory = props.sygnalFactory,
-                _id = props.id,
-                sanitizedProps = _objectWithoutProperties(props, _excluded);
-
-            if (typeof stateProp === 'undefined' && (_typeof(sanitizedProps) !== 'object' || Object.keys(sanitizedProps).length === 0)) {
-              var _objectSpread6;
-
-              var _sources2 = _objectSpread(_objectSpread({}, _this8.sources), {}, (_objectSpread6 = {}, _defineProperty(_objectSpread6, _this8.stateSourceName, stateSource), _defineProperty(_objectSpread6, "props$", xs.never().startWith(null)), _defineProperty(_objectSpread6, "children$", children$), _objectSpread6));
-
-              sink$ = factory(_sources2);
-              preventStateUpdates = false;
-            } else {
-              var _objectSpread7;
-
-              var _lense2 = function _lense2(props) {
-                var state = props.state;
-                if (typeof state === 'undefined') return props;
-                if (_typeof(state) !== 'object') return state;
-
-                var copy = _objectSpread({}, props);
-
-                delete copy.state;
-                return _objectSpread(_objectSpread({}, copy), state);
-              };
-
-              stateSource = new StateSource(props$.map(_lense2));
-
-              var _sources3 = _objectSpread(_objectSpread({}, _this8.sources), {}, (_objectSpread7 = {}, _defineProperty(_objectSpread7, _this8.stateSourceName, stateSource), _defineProperty(_objectSpread7, "props$", props$), _defineProperty(_objectSpread7, "children$", children$), _objectSpread7));
-
-              sink$ = factory(_sources3);
-            }
-
-            if (_typeof(sink$) !== 'object') {
-              var name = componentName === 'sygnal-factory' ? 'custom element' : componentName;
-              throw new Error('Invalid sinks returned from component factory:', name);
-            }
-          }
-
-          if (preventStateUpdates) {
-            var originalStateSink = sink$[_this8.stateSourceName];
-            sink$[_this8.stateSourceName] = originalStateSink.filter(function (state) {
-              console.warn('State update attempt from component with inderect link to state: Components with state set through HTML properties/attributes cannot update application state directly');
-              return false;
-            });
-          }
-
-          var originalDOMSink = sink$[_this8.DOMSourceName].remember();
-
-          var repeatChecker = function repeatChecker(a, b) {
-            var aa = JSON.stringify(a);
-            var bb = JSON.stringify(b);
-            return aa === bb;
-          };
-
-          sink$[_this8.DOMSourceName] = stateSource.stream.compose(dropRepeats(repeatChecker)).map(function (state) {
-            subComponentRenderedProxy$.shamefullySendNext(null);
-            return originalDOMSink;
-          }).compose(debounce(10)).flatten().remember();
-          acc[id] = {
-            sink$: sink$,
-            props$: props$,
-            children$: children$
-          };
-          Object.entries(sink$).map(function (_ref24) {
-            var _ref25 = _slicedToArray(_ref24, 2),
-                name = _ref25[0],
-                stream = _ref25[1];
-
-            sinkArrsByType[name] || (sinkArrsByType[name] = []);
-            if (name !== _this8.DOMSourceName) sinkArrsByType[name].push(stream);
-          });
-          return acc;
-        }, rootEntry);
-        var mergedSinksByType = Object.entries(sinkArrsByType).reduce(function (acc, _ref26) {
-          var _ref27 = _slicedToArray(_ref26, 2),
-              name = _ref27[0],
-              streamArr = _ref27[1];
-
-          if (streamArr.length === 0) return acc;
-          acc[name] = streamArr.length === 1 ? streamArr[0] : xs.merge.apply(xs, _toConsumableArray(streamArr));
-          return acc;
-        }, {});
-
-        _this8.newSubComponentSinks(mergedSinksByType); // subComponentRenderedProxy$.shamefullySendNext(null)
-
-
-        return newComponents;
-      }, {});
-      this.vdom$ = xs.combine(subComponentRenderedProxy$.startWith(null), componentInstances$).map(function (_ref28) {
-        var _ref29 = _slicedToArray(_ref28, 2),
-            _ = _ref29[0],
-            components = _ref29[1];
-
-        var root = components['::ROOT::'];
-        var ids = [];
-        var entries = Object.entries(components).filter(function (_ref30) {
-          var _ref31 = _slicedToArray(_ref30, 1),
-              id = _ref31[0];
-
-          return id !== '::ROOT::';
-        });
-
-        if (entries.length === 0) {
-          return xs.of(root);
-        }
-
-        var vdom$ = entries.map(function (_ref32) {
-          var _ref33 = _slicedToArray(_ref32, 2),
-              id = _ref33[0],
-              val = _ref33[1];
-
-          ids.push(id);
-          return val.sink$[_this8.DOMSourceName].startWith(undefined);
-        });
-        if (vdom$.length === 0) return xs.of(root);
-        return xs.combine.apply(xs, _toConsumableArray(vdom$)).compose(debounce(5)).map(function (vdoms) {
-          var withIds = vdoms.reduce(function (acc, vdom, index) {
-            acc[ids[index]] = vdom;
-            return acc;
-          }, {});
-          var rootCopy = deepCopyVdom(root);
-          var injected = injectComponents(rootCopy, withIds, componentNames);
-          return injected;
-        });
-      }).flatten().filter(function (val) {
-        return !!val;
-      }).compose(debounce(5)).remember().compose(this.log('View Rendered'));
-    }
-  }, {
-    key: "initSinks",
-    value: function initSinks() {
-      var _this9 = this;
-
-      this.sinks = this.sourceNames.reduce(function (acc, name) {
-        if (name == _this9.DOMSourceName) return acc;
-        var subComponentSink$ = _this9.subComponentSink$ ? _this9.subComponentSink$.map(function (sinks) {
-          return sinks[name];
-        }).filter(function (sink) {
-          return !!sink;
-        }).flatten() : xs.never();
-
-        if (name === _this9.stateSourceName) {
-          acc[name] = xs.merge.apply(xs, [_this9.model$[name] || xs.never(), subComponentSink$, _this9.sources[_this9.stateSourceName].stream.filter(function (_) {
-            return false;
-          })].concat(_toConsumableArray(_this9.children$[name])));
-        } else {
-          acc[name] = xs.merge.apply(xs, [_this9.model$[name] || xs.never(), subComponentSink$].concat(_toConsumableArray(_this9.children$[name])));
-        }
-
-        return acc;
-      }, {});
-      this.sinks[this.DOMSourceName] = this.vdom$;
-      this.sinks[this.requestSourceName] = xs.merge(this.sendResponse$, this.sinks[this.requestSourceName]);
-    }
-  }, {
-    key: "makeOnAction",
-    value: function makeOnAction(action$) {
-      var _this10 = this;
-
-      var isStateSink = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-      var rootAction$ = arguments.length > 2 ? arguments[2] : undefined;
-      rootAction$ = rootAction$ || action$;
-      return function (name, reducer) {
-        var filtered$ = action$.filter(function (_ref34) {
-          var type = _ref34.type;
-          return type == name;
-        });
-        var returnStream$;
-
-        if (typeof reducer === 'function') {
-          returnStream$ = filtered$.map(function (action) {
-            var next = function next(type, data) {
-              var _reqId = action._reqId || action.req && action.req.id;
-
-              var _data = _reqId ? _typeof(data) == 'object' ? _objectSpread(_objectSpread({}, data), {}, {
-                _reqId: _reqId,
-                _action: name
-              }) : {
-                data: data,
-                _reqId: _reqId,
-                _action: name
-              } : data; // put the "next" action request at the end of the event loop so the "current" action completes first
-
-
-              setTimeout(function () {
-                // push the "next" action request into the action$ stream
-                rootAction$.shamefullySendNext({
-                  type: type,
-                  data: _data
-                });
-              }, 10);
-            };
-
-            var data = action.data;
-            if (data && data.data && data._reqId) data = data.data;
-
-            if (isStateSink) {
-              return function (state) {
-                var _state = _this10.isSubComponent ? _this10.currentState : state;
-
-                var enhancedState = _this10.addCalculated(_state);
-
-                var newState = reducer(enhancedState, data, next, action.req);
-                if (newState == ABORT) return _state;
-                return _this10.cleanupCalculated(newState);
-              };
-            } else {
-              var enhancedState = _this10.addCalculated(_this10.currentState);
-
-              var reduced = reducer(enhancedState, data, next, action.req);
-
-              var type = _typeof(reduced);
-
-              var _reqId = action._reqId || action.req && action.req.id;
-
-              if (['string', 'number', 'boolean', 'function'].includes(type)) return reduced;
-              if (type == 'object') return _objectSpread(_objectSpread({}, reduced), {}, {
-                _reqId: _reqId,
-                _action: name
-              });
-
-              if (type == 'undefined') {
-                console.warn("'undefined' value sent to ".concat(name));
-                return reduced;
-              }
-
-              throw new Error("Invalid reducer type for ".concat(name, " ").concat(type));
-            }
-          }).filter(function (result) {
-            return result != ABORT;
-          });
-        } else if (reducer === undefined || reducer === true) {
-          returnStream$ = filtered$.map(function (_ref35) {
-            var data = _ref35.data;
-            return data;
-          });
-        } else {
-          var value = reducer;
-          returnStream$ = filtered$.mapTo(value);
-        }
-
-        return returnStream$;
-      };
-    }
-  }, {
-    key: "addCalculated",
-    value: function addCalculated(state) {
-      if (!this.calculated || _typeof(state) !== 'object') return state;
-      if (_typeof(this.calculated) !== 'object') throw new Error("'calculated' parameter must be an object mapping calculated state field named to functions");
-      var entries = Object.entries(this.calculated);
-      var calculated = entries.reduce(function (acc, _ref36) {
-        var _ref37 = _slicedToArray(_ref36, 2),
-            field = _ref37[0],
-            fn = _ref37[1];
-
-        if (typeof fn !== 'function') throw new Error("Missing or invalid calculator function for calculated field '".concat(field));
-
-        try {
-          acc[field] = fn(state);
-        } catch (e) {
-          console.warn("Calculated field '".concat(field, "' threw an error during calculation: ").concat(e.message));
-        }
-
-        return acc;
-      }, {});
-      return _objectSpread(_objectSpread({}, state), calculated);
-    }
-  }, {
-    key: "cleanupCalculated",
-    value: function cleanupCalculated(state) {
-      var _this11 = this;
-
-      if (this.storeCalculatedInState) return this.addCalculated(state);
-      if (!this.calculated || !state || _typeof(state) !== 'object') return state;
-      var keys = Object.keys(this.calculated);
-
-      var copy = _objectSpread({}, state);
-
-      keys.forEach(function (key) {
-        if (_this11.initialState && typeof _this11.initialState[key] !== 'undefined') {
-          copy[key] = _this11.initialState[key];
-        } else {
-          delete copy[key];
-        }
-      });
-      return copy;
-    }
-  }]);
-
-  return Component;
-}();
-/**
- * factory to create a logging function meant to be used inside of an xstream .compose()
- *
- * @param {String} context name of the component or file to be prepended to any messages
- * @return {Function}
- *
- * returned function accepts either a `String` of `Function`
- * `String` values will be logged to `console` as is
- * `Function` values will be called with the current `stream` value and the result will be logged to `console`
- * all output will be prepended with the `context` (ex. "[CONTEXT] My output")
- * ONLY outputs if the global `DEBUG` variable is set to `true`
- */
-
-
-function makeLog(context) {
-  return function (msg) {
-    var fixedMsg = typeof msg === 'function' ? msg : function (_) {
-      return msg;
-    };
-    return function (stream) {
-      return stream.debug(function (msg) {
-        if (ENVIRONMENT.DEBUG == 'true' || ENVIRONMENT.DEBUG === true) {
-          console.log("[".concat(context, "] ").concat(fixedMsg(msg)));
-        }
-      });
-    };
-  };
-}
-
-function getComponents(currentElement, componentNames) {
-  var _currentElement$data, _currentElement$data2, _currentElement$data3;
-
-  var depth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-  var index = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
-  if (!currentElement) return {};
-  if ((_currentElement$data = currentElement.data) !== null && _currentElement$data !== void 0 && _currentElement$data.componentsProcessed) return {};
-  if (depth === 0) currentElement.data.componentsProcessed = true;
-  var sel = currentElement.sel;
-  var isCollection = sel && sel.toLowerCase() === 'collection';
-  var isSwitchable = sel && sel.toLowerCase() === 'switchable';
-  var isComponent = sel && ['collection', 'switchable', 'sygnal-factory'].concat(_toConsumableArray(componentNames)).includes(currentElement.sel) || typeof ((_currentElement$data2 = currentElement.data) === null || _currentElement$data2 === void 0 ? void 0 : (_currentElement$data3 = _currentElement$data2.props) === null || _currentElement$data3 === void 0 ? void 0 : _currentElement$data3.sygnalFactory) === 'function';
-  var props = currentElement.data && currentElement.data.props || {};
-  var attrs = currentElement.data && currentElement.data.attrs || {};
-  var children = currentElement.children || [];
-  var found = {};
-
-  if (isComponent) {
-    var id = getComponentIdFromElement(currentElement, depth, index);
-
-    if (isCollection) {
-      var _currentElement$data4;
-
-      if (!props.of) throw new Error("Collection element missing required 'component' property");
-      if (typeof props.of !== 'string' && typeof props.of !== 'function') throw new Error("Invalid 'component' property of collection element: found ".concat(_typeof(props.of), " requires string or component factory function"));
-      if (typeof props.of !== 'function' && !componentNames.includes(props.of)) throw new Error("Specified component for collection not found: ".concat(props.of));
-      if (typeof attrs["for"] !== 'undefined' && !(typeof attrs["for"] === 'string' || Array.isArray(attrs["for"]))) console.warn("No valid array found in the 'value' property of collection ".concat(typeof props.of === 'string' ? props.of : 'function component', ": no collection components will be created"));
-      currentElement.data.isCollection = true;
-      (_currentElement$data4 = currentElement.data).props || (_currentElement$data4.props = {});
-      currentElement.data.props["for"] = attrs["for"];
-      currentElement.data.attrs = undefined;
-    } else if (isSwitchable) {
-      if (!props.of) throw new Error("Switchable element missing required 'of' property");
-      if (_typeof(props.of) !== 'object') throw new Error("Invalid 'components' property of switchable element: found ".concat(_typeof(props.of), " requires object mapping names to component factories"));
-      var switchableComponents = Object.values(props.of);
-      if (!switchableComponents.every(function (comp) {
-        return typeof comp === 'function';
-      })) throw new Error("One or more components provided to switchable element is not a valid component factory");
-      if (!props.current || typeof props.current !== 'string' && typeof props.current !== 'function') throw new Error("Missing or invalid 'current' property for switchable element: found '".concat(_typeof(props.current), "' requires string or function"));
-      var switchableComponentNames = Object.keys(props.of);
-      if (!switchableComponentNames.includes(props.current)) throw new Error("Component '".concat(props.current, "' not found in switchable element"));
-      currentElement.data.isSwitchable = true;
-    } else {}
-
-    found[id] = currentElement;
-  }
-
-  if (children.length > 0) {
-    children.map(function (child, i) {
-      return getComponents(child, componentNames, depth + 1, i);
-    }).forEach(function (child) {
-      Object.entries(child).forEach(function (_ref38) {
-        var _ref39 = _slicedToArray(_ref38, 2),
-            id = _ref39[0],
-            el = _ref39[1];
-
-        return found[id] = el;
-      });
-    });
-  }
-
-  return found;
-}
-
-function injectComponents(currentElement, components, componentNames) {
-  var _currentElement$data5, _currentElement$data6, _currentElement$data7, _currentElement$data8, _currentElement$data9;
-
-  var depth = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
-  var index = arguments.length > 4 ? arguments[4] : undefined;
-  if (!currentElement) return;
-  if ((_currentElement$data5 = currentElement.data) !== null && _currentElement$data5 !== void 0 && _currentElement$data5.componentsInjected) return currentElement;
-  if (depth === 0 && currentElement.data) currentElement.data.componentsInjected = true;
-  var sel = currentElement.sel || 'NO SELECTOR';
-  var isComponent = ['collection', 'switchable', 'sygnal-factory'].concat(_toConsumableArray(componentNames)).includes(sel) || typeof ((_currentElement$data6 = currentElement.data) === null || _currentElement$data6 === void 0 ? void 0 : (_currentElement$data7 = _currentElement$data6.props) === null || _currentElement$data7 === void 0 ? void 0 : _currentElement$data7.sygnalFactory) === 'function';
-  var isCollection = currentElement === null || currentElement === void 0 ? void 0 : (_currentElement$data8 = currentElement.data) === null || _currentElement$data8 === void 0 ? void 0 : _currentElement$data8.isCollection;
-  var isSwitchable = currentElement === null || currentElement === void 0 ? void 0 : (_currentElement$data9 = currentElement.data) === null || _currentElement$data9 === void 0 ? void 0 : _currentElement$data9.isSwitchable;
-  var props = currentElement.data && currentElement.data.props || {};
-  var children = currentElement.children || [];
-
-  if (isComponent) {
-    var id = getComponentIdFromElement(currentElement, depth, index);
-    var _component = components[id];
-
-    if (isCollection) {
-      currentElement.sel = 'div';
-      currentElement.children = Array.isArray(_component) ? _component : [_component];
-      return currentElement;
-    } else if (isSwitchable) {
-      return _component;
-    } else {
-      return _component;
-    }
-  } else if (children.length > 0) {
-    currentElement.children = children.map(function (child, i) {
-      return injectComponents(child, components, componentNames, depth + 1, i);
-    }).flat();
-    return currentElement;
-  } else {
-    return currentElement;
-  }
-}
-
-var selMap = new Map();
-
-function getComponentIdFromElement(el, depth, index) {
-  var sel = el.sel;
-  var name = typeof sel === 'string' ? sel : 'functionComponent';
-  var base = selMap.get(sel);
-
-  if (!base) {
-    var date = Date.now();
-    var rand = Math.floor(Math.random() * 10000);
-    base = "".concat(date, "-").concat(rand);
-    selMap.set(sel, base);
-  }
-
-  var uid = "".concat(base, "-").concat(depth, "-").concat(index);
-  var props = el.data && el.data.props || {};
-  var id = props.id && JSON.stringify(props.id) || uid;
-  var fullId = "".concat(name, "::").concat(id);
-  return fullId;
-}
-
-function deepCopyVdom(obj) {
-  if (typeof obj === 'undefined') return obj;
-  return _objectSpread(_objectSpread({}, obj), {}, {
-    children: Array.isArray(obj.children) ? obj.children.map(deepCopyVdom) : undefined,
-    data: obj.data && _objectSpread(_objectSpread({}, obj.data), {}, {
-      componentsInjected: false
-    })
-  });
-}