vasille 2.2.0 → 2.3.0

package/cdn/es5.js

@@ -13,7 +13,7 @@ var __spreadArray = function (to, from, pack) {
 };
 
 var __assign = function(o1, o2) {
-    for (let i in o2) {
+    for (var i in o2) {
         o1[i] = o2[i];
     }
 
@@ -182,7 +182,7 @@ window.Reflect = window.Reflect || {
         return false;
     },
     ownKeys: function (obj) {
-        let ret = [];
+        var ret = [];
 
         for (var i in obj) {
             if (obj.hasOwnProperty(i)) {
@@ -197,18 +197,6 @@ window.Reflect = window.Reflect || {
 window.Proxy = window.Proxy || function (obj) {
     return obj;
 };
-// ./lib-es5/v/index.js
-
-var v = __assign(__assign({ ref: function (value) {
-        return current.ref(value);
-    }, expr: expr, of: valueOf, sv: setValue, alwaysFalse: new Reference(false), app: app, component: component, fragment: fragment, extension: extension, text: text, tag: tag, create: create }, vx), { merge: merge, destructor: function () {
-        return current.destroy.bind(current);
-    }, runOnDestroy: function (callback) {
-        current.runOnDestroy(callback);
-    } });
-
-window.v = v;
-
 // ./lib-es5/models/model.js
 
 
@@ -412,6 +400,13 @@ var ObjectModel = /** @class */ (function (_super) {
         this.listener.emitAdded(key, this.container[key]);
         return this;
     };
+    Object.defineProperty(ObjectModel.prototype, "values", {
+        get: function () {
+            return this.container;
+        },
+        enumerable: false,
+        configurable: true
+    });
     /**
      * Deletes an object property
      * @param key {string} property name
@@ -422,23 +417,6 @@ var ObjectModel = /** @class */ (function (_super) {
             delete this.container[key];
         }
     };
-    ObjectModel.prototype.proxy = function () {
-        // eslint-disable-next-line @typescript-eslint/no-this-alias
-        var ts = this;
-        return new Proxy(this.container, {
-            get: function (target, p) {
-                return ts.get(p);
-            },
-            set: function (target, p, value) {
-                ts.set(p, value);
-                return true;
-            },
-            deleteProperty: function (target, p) {
-                ts.delete(p);
-                return true;
-            }
-        });
-    };
     ObjectModel.prototype.enableReactivity = function () {
         this.listener.enableReactivity();
     };
@@ -622,15 +600,6 @@ var ArrayModel = /** @class */ (function (_super) {
         }
         return _this;
     }
-    // proxy
-    ArrayModel.prototype.proxy = function () {
-        return new Proxy(this, {
-            set: function (target, p, value) {
-                target.splice(parseInt(p), 1, value);
-                return true;
-            }
-        });
-    };
     Object.defineProperty(ArrayModel.prototype, "last", {
         /* Array members */
         /**
@@ -829,6 +798,12 @@ var ArrayModel = /** @class */ (function (_super) {
         this.removeAt(this.indexOf(v));
         return this;
     };
+    ArrayModel.prototype.replace = function (at, with_) {
+        this.listener.emitAdded(this[at], with_);
+        this.listener.emitRemoved(this[at], this[at]);
+        this[at] = with_;
+        return this;
+    };
     ArrayModel.prototype.enableReactivity = function () {
         this.listener.enableReactivity();
     };
@@ -841,467 +816,186 @@ var ArrayModel = /** @class */ (function (_super) {
 
 window.ArrayModel = ArrayModel;
 
-// ./lib-es5/functional/merge.js
-function merge(main) {
-    var targets = [];
-    for (var _i = 1; _i < arguments.length; _i++) {
-        targets[_i - 1] = arguments[_i];
-    }
-    function refactorClass(obj) {
-        if (Array.isArray(obj.class)) {
-            var out_1 = {
-                $: []
-            };
-            obj.class.forEach(function (item) {
-                if (item instanceof IValue) {
-                    out_1.$.push(item);
-                }
-                else if (typeof item === 'string') {
-                    out_1[item] = true;
-                }
-                else if (typeof item === 'object') {
-                    Object.assign(out_1, item);
-                }
-            });
-            obj.class = out_1;
-        }
+// ./lib-es5/core/signal.js
+/**
+ * Signal is an event generator
+ * @class Signal
+ */
+var Signal = /** @class */ (function () {
+    function Signal() {
+        /**
+         * Handler of event
+         * @type {Set}
+         * @private
+         */
+        this.handlers = new Set;
     }
-    refactorClass(main);
-    targets.forEach(function (target) {
-        Reflect.ownKeys(target).forEach(function (prop) {
-            var _a;
-            if (!Reflect.has(main, prop)) {
-                main[prop] = target[prop];
+    /**
+     * Emit event
+     * @param a1 {*} argument
+     * @param a2 {*} argument
+     * @param a3 {*} argument
+     * @param a4 {*} argument
+     * @param a5 {*} argument
+     * @param a6 {*} argument
+     * @param a7 {*} argument
+     * @param a8 {*} argument
+     * @param a9 {*} argument
+     */
+    Signal.prototype.emit = function (a1, a2, a3, a4, a5, a6, a7, a8, a9) {
+        this.handlers.forEach(function (handler) {
+            try {
+                handler(a1, a2, a3, a4, a5, a6, a7, a8, a9);
             }
-            else if (typeof main[prop] === 'object' && typeof target[prop] === 'object') {
-                if (prop === 'class') {
-                    refactorClass(target);
-                }
-                if (prop === '$' && Array.isArray(main[prop]) && Array.isArray(target[prop])) {
-                    (_a = main.$).push.apply(_a, target.$);
-                }
-                else {
-                    merge(main[prop], target[prop]);
-                }
+            catch (e) {
+                console.error("Vasille.js: Handler throw exception: ", e);
             }
         });
-    });
-}
+    };
+    /**
+     * Subscribe to event
+     * @param func {function} handler
+     */
+    Signal.prototype.subscribe = function (func) {
+        this.handlers.add(func);
+    };
+    /**
+     * Unsubscribe from event
+     * @param func {function} handler
+     */
+    Signal.prototype.unsubscribe = function (func) {
+        this.handlers.delete(func);
+    };
+    return Signal;
+}());
 
-window.merge = merge;
 
-// ./lib-es5/functional/stack.js
-function app(renderer) {
-    return function (node, opts) {
-        return new App(node, opts).runFunctional(renderer, opts);
+window.Signal = Signal;
+
+// ./lib-es5/core/slot.js
+/**
+ * Component slot
+ * @class Slot
+ */
+var Slot = /** @class */ (function () {
+    function Slot() {
+    }
+    /**
+     * Sets the runner
+     * @param func {function} the function to run
+     */
+    Slot.prototype.insert = function (func) {
+        this.runner = func;
     };
-}
-function component(renderer) {
-    return function (opts, callback) {
-        var component = new Component(opts);
-        if (!(current instanceof Fragment))
-            throw userError('missing parent node', 'out-of-context');
-        var ret;
-        if (callback)
-            opts.slot = callback;
-        current.create(component, function (node) {
-            ret = node.runFunctional(renderer, opts);
-        });
-        return ret;
+    /**
+     * @param a0 {Fragment} node to paste content
+     * @param a1 {*} 1st argument
+     * @param a2 {*} 2nd argument
+     * @param a3 {*} 3rd argument
+     * @param a4 {*} 4th argument
+     * @param a5 {*} 5th argument
+     * @param a6 {*} 6th argument
+     * @param a7 {*} 7th argument
+     * @param a8 {*} 8th argument
+     * @param a9 {*} 9th argument
+     */
+    Slot.prototype.release = function (a0, a1, a2, a3, a4, a5, a6, a7, a8, a9) {
+        if (this.runner) {
+            this.runner(a0, a1, a2, a3, a4, a5, a6, a7, a8, a9);
+        }
     };
-}
-function fragment(renderer) {
-    return function (opts, callback) {
-        var frag = new Fragment(opts);
-        if (!(current instanceof Fragment))
-            throw userError('missing parent node', 'out-of-context');
-        if (callback)
-            opts.slot = callback;
-        current.create(frag);
-        return frag.runFunctional(renderer, opts);
+    /**
+     * Predefine a handler for a slot
+     * @param func {function(node : Fragment)} Function to run if no handler specified
+     * @param a0 {Fragment} node to paste content
+     * @param a1 {*} 1st argument
+     * @param a2 {*} 2nd argument
+     * @param a3 {*} 3rd argument
+     * @param a4 {*} 4th argument
+     * @param a5 {*} 5th argument
+     * @param a6 {*} 6th argument
+     * @param a7 {*} 7th argument
+     * @param a8 {*} 8th argument
+     * @param a9 {*} 9th argument
+     */
+    Slot.prototype.predefine = function (func, a0, a1, a2, a3, a4, a5, a6, a7, a8, a9) {
+        (this.runner || func)(a0, a1, a2, a3, a4, a5, a6, a7, a8, a9);
     };
+    return Slot;
+}());
+
+
+window.Slot = Slot;
+
+// ./lib-es5/core/errors.js
+var reportIt = "Report it here: https://gitlab.com/vasille-js/vasille-js/-/issues";
+function notOverwritten() {
+    console.error("Vasille-SFP: Internal error", "Must be overwritten", reportIt);
+    return "not-overwritten";
 }
-function extension(renderer) {
-    return function (opts, callback) {
-        var ext = new Extension(opts);
-        if (!(current instanceof Fragment))
-            throw userError('missing parent node', 'out-of-context');
-        if (callback)
-            opts.slot = callback;
-        current.create(ext);
-        return ext.runFunctional(renderer, opts);
-    };
+function internalError(msg) {
+    console.error("Vasille-SFP: Internal error", msg, reportIt);
+    return "internal-error";
 }
-function tag(name, opts, callback) {
-    if (!(current instanceof Fragment))
-        throw userError('missing parent node', 'out-of-context');
-    return {
-        node: current.tag(name, opts, function (node) {
-            callback && node.runFunctional(callback);
-        })
-    };
+function userError(msg, err) {
+    console.error("Vasille-SFP: User error", msg);
+    return err;
 }
-function create(node, callback) {
-    if (!(current instanceof Fragment))
-        throw userError('missing current node', 'out-of-context');
-    current.create(node, function (node) {
-        var args = [];
-        for (var _i = 1; _i < arguments.length; _i++) {
-            args[_i - 1] = arguments[_i];
-        }
-        callback && node.runFunctional.apply(node, __spreadArray([callback], args, false));
-    });
-    return node;
-}
-var vx = {
-    if: function (condition, callback) {
-        if (current instanceof Fragment) {
-            current.if(condition, function (node) { return node.runFunctional(callback); });
-        }
-        else {
-            throw userError("wrong use of `v.if` function", "logic-error");
-        }
-    },
-    else: function (callback) {
-        if (current instanceof Fragment) {
-            current.else(function (node) { return node.runFunctional(callback); });
-        }
-        else {
-            throw userError("wrong use of `v.else` function", "logic-error");
-        }
-    },
-    elif: function (condition, callback) {
-        if (current instanceof Fragment) {
-            current.elif(condition, function (node) { return node.runFunctional(callback); });
-        }
-        else {
-            throw userError("wrong use of `v.elif` function", "logic-error");
-        }
-    },
-    for: function (model, callback) {
-        if (model instanceof ArrayModel) {
-            // for arrays T & K are the same type
-            create(new ArrayView({ model: model }), callback);
-        }
-        else if (model instanceof MapModel) {
-            create(new MapView({ model: model }), callback);
-        }
-        else if (model instanceof SetModel) {
-            // for sets T & K are the same type
-            create(new SetView({ model: model }), callback);
-        }
-        else if (model instanceof ObjectModel) {
-            // for objects K is always string
-            create(new ObjectView({ model: model }), callback);
-        }
-        else {
-            throw userError("wrong use of `v.for` function", 'wrong-model');
-        }
-    },
-    watch: function (model, callback) {
-        var opts = { model: model };
-        create(new Watch(opts), callback);
-    },
-    nextTick: function (callback) {
-        var node = current;
-        window.setTimeout(function () {
-            node.runFunctional(callback);
-        }, 0);
-    }
-};
-
-window.app = app;
-window.component = component;
-window.fragment = fragment;
-window.extension = extension;
-window.tag = tag;
-window.create = create;
-window.vx = vx;
-
-// ./lib-es5/functional/models.js
-function arrayModel(arr) {
-    if (arr === void 0) { arr = []; }
-    if (!current)
-        throw userError('missing parent node', 'out-of-context');
-    return current.register(new ArrayModel(arr)).proxy();
-}
-function mapModel(map) {
-    if (map === void 0) { map = []; }
-    if (!current)
-        throw userError('missing parent node', 'out-of-context');
-    return current.register(new MapModel(map));
-}
-function setModel(arr) {
-    if (arr === void 0) { arr = []; }
-    if (!current)
-        throw userError('missing parent node', 'out-of-context');
-    return current.register(new SetModel(arr));
-}
-function objectModel(obj) {
-    if (obj === void 0) { obj = {}; }
-    if (!current)
-        throw userError('missing parent node', 'out-of-context');
-    return current.register(new ObjectModel(obj));
-}
-
-window.arrayModel = arrayModel;
-window.mapModel = mapModel;
-window.setModel = setModel;
-window.objectModel = objectModel;
-
-// ./lib-es5/functional/options.js
-
-
-
-// ./lib-es5/functional/reactivity.js
-function ref(value) {
-    var ref = current.ref(value);
-    return [ref, function (value) { return ref.$ = value; }];
-}
-function mirror(value) {
-    return current.mirror(value);
-}
-function forward(value) {
-    return current.forward(value);
-}
-function point(value) {
-    return current.point(value);
-}
-function expr(func) {
-    var values = [];
-    for (var _i = 1; _i < arguments.length; _i++) {
-        values[_i - 1] = arguments[_i];
-    }
-    return current.expr.apply(current, __spreadArray([func], values, false));
-}
-function watch(func) {
-    var values = [];
-    for (var _i = 1; _i < arguments.length; _i++) {
-        values[_i - 1] = arguments[_i];
-    }
-    current.watch.apply(current, __spreadArray([func], values, false));
-}
-function valueOf(value) {
-    return value.$;
-}
-function setValue(ref, value) {
-    if (ref instanceof Pointer && value instanceof IValue) {
-        ref.point(value);
-    }
-    else {
-        ref.$ = value instanceof IValue ? value.$ : value;
-    }
-}
-
-window.ref = ref;
-window.mirror = mirror;
-window.forward = forward;
-window.point = point;
-window.expr = expr;
-window.watch = watch;
-window.valueOf = valueOf;
-window.setValue = setValue;
-
-// ./lib-es5/functional/components.js
-function text(text) {
-    if (!(current instanceof Fragment))
-        throw userError('missing parent node', 'out-of-context');
-    ;
-    current.text(text);
-}
-function debug(text) {
-    if (!(current instanceof Fragment))
-        throw userError('missing parent node', 'out-of-context');
-    current.debug(text);
-}
-function predefine(slot, predefined) {
-    return slot || predefined;
+function wrongBinding(msg) {
+    return userError(msg, "wrong-binding");
 }
 
-window.text = text;
-window.debug = debug;
-window.predefine = predefine;
+window.notOverwritten = notOverwritten;
+window.internalError = internalError;
+window.userError = userError;
+window.wrongBinding = wrongBinding;
 
-// ./lib-es5/core/signal.js
+// ./lib-es5/core/executor.js
 /**
- * Signal is an event generator
- * @class Signal
+ * Represents an executor unit interface
+ * @class Executor
  */
-var Signal = /** @class */ (function () {
-    function Signal() {
-        /**
-         * Handler of event
-         * @type {Set}
-         * @private
-         */
-        this.handlers = new Set;
+var Executor = /** @class */ (function () {
+    function Executor() {
     }
     /**
-     * Emit event
-     * @param a1 {*} argument
-     * @param a2 {*} argument
-     * @param a3 {*} argument
-     * @param a4 {*} argument
-     * @param a5 {*} argument
-     * @param a6 {*} argument
-     * @param a7 {*} argument
-     * @param a8 {*} argument
-     * @param a9 {*} argument
+     * Adds a CSS class
+     * @param el {Element} element to manipulate
+     * @param cl {string} class to be added
      */
-    Signal.prototype.emit = function (a1, a2, a3, a4, a5, a6, a7, a8, a9) {
-        this.handlers.forEach(function (handler) {
-            try {
-                handler(a1, a2, a3, a4, a5, a6, a7, a8, a9);
-            }
-            catch (e) {
-                console.error("Vasille.js: Handler throw exception: ", e);
-            }
-        });
+    Executor.prototype.addClass = function (el, cl) {
+        throw notOverwritten();
     };
     /**
-     * Subscribe to event
-     * @param func {function} handler
+     * Removes a CSS class
+     * @param el {Element} element to manipulate
+     * @param cl {string} class to be removed
      */
-    Signal.prototype.subscribe = function (func) {
-        this.handlers.add(func);
+    Executor.prototype.removeClass = function (el, cl) {
+        throw notOverwritten();
     };
     /**
-     * Unsubscribe from event
-     * @param func {function} handler
+     * Sets a tag attribute
+     * @param el {Element} element to manipulate
+     * @param name {string} name of attribute
+     * @param value {string} value of attribute
      */
-    Signal.prototype.unsubscribe = function (func) {
-        this.handlers.delete(func);
+    Executor.prototype.setAttribute = function (el, name, value) {
+        throw notOverwritten();
     };
-    return Signal;
-}());
-
-
-window.Signal = Signal;
-
-// ./lib-es5/core/slot.js
-/**
- * Component slot
- * @class Slot
- */
-var Slot = /** @class */ (function () {
-    function Slot() {
-    }
     /**
-     * Sets the runner
-     * @param func {function} the function to run
+     * Removes a tag attribute
+     * @param el {Element} element to manipulate
+     * @param name {string} name of attribute
      */
-    Slot.prototype.insert = function (func) {
-        this.runner = func;
+    Executor.prototype.removeAttribute = function (el, name) {
+        throw notOverwritten();
     };
     /**
-     * @param a0 {Fragment} node to paste content
-     * @param a1 {*} 1st argument
-     * @param a2 {*} 2nd argument
-     * @param a3 {*} 3rd argument
-     * @param a4 {*} 4th argument
-     * @param a5 {*} 5th argument
-     * @param a6 {*} 6th argument
-     * @param a7 {*} 7th argument
-     * @param a8 {*} 8th argument
-     * @param a9 {*} 9th argument
-     */
-    Slot.prototype.release = function (a0, a1, a2, a3, a4, a5, a6, a7, a8, a9) {
-        if (this.runner) {
-            this.runner(a0, a1, a2, a3, a4, a5, a6, a7, a8, a9);
-        }
-    };
-    /**
-     * Predefine a handler for a slot
-     * @param func {function(node : Fragment)} Function to run if no handler specified
-     * @param a0 {Fragment} node to paste content
-     * @param a1 {*} 1st argument
-     * @param a2 {*} 2nd argument
-     * @param a3 {*} 3rd argument
-     * @param a4 {*} 4th argument
-     * @param a5 {*} 5th argument
-     * @param a6 {*} 6th argument
-     * @param a7 {*} 7th argument
-     * @param a8 {*} 8th argument
-     * @param a9 {*} 9th argument
-     */
-    Slot.prototype.predefine = function (func, a0, a1, a2, a3, a4, a5, a6, a7, a8, a9) {
-        (this.runner || func)(a0, a1, a2, a3, a4, a5, a6, a7, a8, a9);
-    };
-    return Slot;
-}());
-
-
-window.Slot = Slot;
-
-// ./lib-es5/core/errors.js
-var reportIt = "Report it here: https://gitlab.com/vasille-js/vasille-js/-/issues";
-function notOverwritten() {
-    console.error("Vasille-SFP: Internal error", "Must be overwritten", reportIt);
-    return "not-overwritten";
-}
-function internalError(msg) {
-    console.error("Vasille-SFP: Internal error", msg, reportIt);
-    return "internal-error";
-}
-function userError(msg, err) {
-    console.error("Vasille-SFP: User error", msg);
-    return err;
-}
-function wrongBinding(msg) {
-    return userError(msg, "wrong-binding");
-}
-
-window.notOverwritten = notOverwritten;
-window.internalError = internalError;
-window.userError = userError;
-window.wrongBinding = wrongBinding;
-
-// ./lib-es5/core/executor.js
-/**
- * Represents an executor unit interface
- * @class Executor
- */
-var Executor = /** @class */ (function () {
-    function Executor() {
-    }
-    /**
-     * Adds a CSS class
-     * @param el {Element} element to manipulate
-     * @param cl {string} class to be added
-     */
-    Executor.prototype.addClass = function (el, cl) {
-        throw notOverwritten();
-    };
-    /**
-     * Removes a CSS class
-     * @param el {Element} element to manipulate
-     * @param cl {string} class to be removed
-     */
-    Executor.prototype.removeClass = function (el, cl) {
-        throw notOverwritten();
-    };
-    /**
-     * Sets a tag attribute
-     * @param el {Element} element to manipulate
-     * @param name {string} name of attribute
-     * @param value {string} value of attribute
-     */
-    Executor.prototype.setAttribute = function (el, name, value) {
-        throw notOverwritten();
-    };
-    /**
-     * Removes a tag attribute
-     * @param el {Element} element to manipulate
-     * @param name {string} name of attribute
-     */
-    Executor.prototype.removeAttribute = function (el, name) {
-        throw notOverwritten();
-    };
-    /**
-     * Sets a style attribute
-     * @param el {HTMLElement} element to manipulate
-     * @param prop {string} property name
-     * @param value {string} property value
+     * Sets a style attribute
+     * @param el {HTMLElement} element to manipulate
+     * @param prop {string} property name
+     * @param value {string} property value
      */
     Executor.prototype.setStyle = function (el, prop, value) {
         throw notOverwritten();
@@ -1452,7 +1146,7 @@ var Destroyable = /** @class */ (function () {
      * Make object fields non configurable
      * @protected
      */
-    Destroyable.prototype.seal = function () {
+    Destroyable.prototype.$seal = function () {
         var _this = this;
         var $ = this;
         Object.keys($).forEach(function (i) {
@@ -1485,7 +1179,7 @@ var Destroyable = /** @class */ (function () {
     /**
      * Garbage collector method
      */
-    Destroyable.prototype.destroy = function () {
+    Destroyable.prototype.$destroy = function () {
         // nothing here
     };
     return Destroyable;
@@ -1503,13 +1197,13 @@ var Switchable = /** @class */ (function (_super) {
     /**
      * Enable update handlers triggering
      */
-    Switchable.prototype.enable = function () {
+    Switchable.prototype.$enable = function () {
         throw notOverwritten();
     };
     /**
      * disable update handlers triggering
      */
-    Switchable.prototype.disable = function () {
+    Switchable.prototype.$disable = function () {
         throw notOverwritten();
     };
     return Switchable;
@@ -1552,14 +1246,14 @@ var IValue = /** @class */ (function (_super) {
      * Add a new handler to value change
      * @param handler {function(value : *)} the handler to add
      */
-    IValue.prototype.on = function (handler) {
+    IValue.prototype.$on = function (handler) {
         throw notOverwritten();
     };
     /**
      * Removes a handler of value change
      * @param handler {function(value : *)} the handler to remove
      */
-    IValue.prototype.off = function (handler) {
+    IValue.prototype.$off = function (handler) {
         throw notOverwritten();
     };
     return IValue;
@@ -1626,12 +1320,12 @@ var Expression = /** @class */ (function (_super) {
         _this.values = values;
         _this.func = handler;
         if (link) {
-            _this.enable();
+            _this.$enable();
         }
         else {
             handler();
         }
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     Object.defineProperty(Expression.prototype, "$", {
@@ -1644,18 +1338,18 @@ var Expression = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Expression.prototype.on = function (handler) {
-        this.sync.on(handler);
+    Expression.prototype.$on = function (handler) {
+        this.sync.$on(handler);
         return this;
     };
-    Expression.prototype.off = function (handler) {
-        this.sync.off(handler);
+    Expression.prototype.$off = function (handler) {
+        this.sync.$off(handler);
         return this;
     };
-    Expression.prototype.enable = function () {
+    Expression.prototype.$enable = function () {
         if (!this.isEnabled) {
             for (var i = 0; i < this.values.length; i++) {
-                this.values[i].on(this.linkedFunc[i]);
+                this.values[i].$on(this.linkedFunc[i]);
                 this.valuesCache[i] = this.values[i].$;
             }
             this.func();
@@ -1663,21 +1357,21 @@ var Expression = /** @class */ (function (_super) {
         }
         return this;
     };
-    Expression.prototype.disable = function () {
+    Expression.prototype.$disable = function () {
         if (this.isEnabled) {
             for (var i = 0; i < this.values.length; i++) {
-                this.values[i].off(this.linkedFunc[i]);
+                this.values[i].$off(this.linkedFunc[i]);
             }
             this.isEnabled = false;
         }
         return this;
     };
-    Expression.prototype.destroy = function () {
-        this.disable();
+    Expression.prototype.$destroy = function () {
+        this.$disable();
         this.values.splice(0);
         this.valuesCache.splice(0);
         this.linkedFunc.splice(0);
-        _super.prototype.destroy.call(this);
+        _super.prototype.$destroy.call(this);
     };
     return Expression;
 }(IValue));
@@ -1698,20 +1392,20 @@ var Reference = /** @class */ (function (_super) {
      */
     function Reference(value) {
         var _this = _super.call(this, true) || this;
-        _this.value = value;
-        _this.onchange = new Set;
-        _this.seal();
+        _this.$value = value;
+        _this.$onchange = new Set;
+        _this.$seal();
         return _this;
     }
     Object.defineProperty(Reference.prototype, "$", {
         get: function () {
-            return this.value;
+            return this.$value;
         },
         set: function (value) {
-            if (this.value !== value) {
-                this.value = value;
+            if (this.$value !== value) {
+                this.$value = value;
                 if (this.isEnabled) {
-                    this.onchange.forEach(function (handler) {
+                    this.$onchange.forEach(function (handler) {
                         handler(value);
                     });
                 }
@@ -1720,27 +1414,27 @@ var Reference = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Reference.prototype.enable = function () {
+    Reference.prototype.$enable = function () {
         var _this = this;
         if (!this.isEnabled) {
-            this.onchange.forEach(function (handler) {
-                handler(_this.value);
+            this.$onchange.forEach(function (handler) {
+                handler(_this.$value);
             });
             this.isEnabled = true;
         }
     };
-    Reference.prototype.disable = function () {
+    Reference.prototype.$disable = function () {
         this.isEnabled = false;
     };
-    Reference.prototype.on = function (handler) {
-        this.onchange.add(handler);
+    Reference.prototype.$on = function (handler) {
+        this.$onchange.add(handler);
     };
-    Reference.prototype.off = function (handler) {
-        this.onchange.delete(handler);
+    Reference.prototype.$off = function (handler) {
+        this.$onchange.delete(handler);
     };
-    Reference.prototype.destroy = function () {
-        _super.prototype.destroy.call(this);
-        this.onchange.clear();
+    Reference.prototype.$destroy = function () {
+        _super.prototype.$destroy.call(this);
+        this.$onchange.clear();
     };
     return Reference;
 }(IValue));
@@ -1765,13 +1459,13 @@ var Mirror = /** @class */ (function (_super) {
     function Mirror(value, forwardOnly) {
         if (forwardOnly === void 0) { forwardOnly = false; }
         var _this = _super.call(this, value.$) || this;
-        _this.handler = function (v) {
+        _this.$handler = function (v) {
             _this.$ = v;
         };
-        _this.pointedValue = value;
-        _this.forwardOnly = forwardOnly;
-        value.on(_this.handler);
-        _this.seal();
+        _this.$pointedValue = value;
+        _this.$forwardOnly = forwardOnly;
+        value.$on(_this.$handler);
+        _this.$seal();
         return _this;
     }
     Object.defineProperty(Mirror.prototype, "$", {
@@ -1782,8 +1476,8 @@ var Mirror = /** @class */ (function (_super) {
             return _super.prototype.$;
         },
         set: function (v) {
-            if (!this.forwardOnly) {
-                this.pointedValue.$ = v;
+            if (!this.$forwardOnly) {
+                this.$pointedValue.$ = v;
             }
             // this is a ts bug
             // eslint-disable-next-line
@@ -1793,22 +1487,22 @@ var Mirror = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Mirror.prototype.enable = function () {
+    Mirror.prototype.$enable = function () {
         if (!this.isEnabled) {
             this.isEnabled = true;
-            this.pointedValue.on(this.handler);
-            this.$ = this.pointedValue.$;
+            this.$pointedValue.$on(this.$handler);
+            this.$ = this.$pointedValue.$;
         }
     };
-    Mirror.prototype.disable = function () {
+    Mirror.prototype.$disable = function () {
         if (this.isEnabled) {
-            this.pointedValue.off(this.handler);
+            this.$pointedValue.$off(this.$handler);
             this.isEnabled = false;
         }
     };
-    Mirror.prototype.destroy = function () {
-        this.disable();
-        _super.prototype.destroy.call(this);
+    Mirror.prototype.$destroy = function () {
+        this.$disable();
+        _super.prototype.$destroy.call(this);
     };
     return Mirror;
 }(Reference));
@@ -1832,17 +1526,21 @@ var Pointer = /** @class */ (function (_super) {
         if (forwardOnly === void 0) { forwardOnly = false; }
         return _super.call(this, value, forwardOnly) || this;
     }
-    /**
-     * Point a new ivalue
-     * @param value {IValue} value to point
-     */
-    Pointer.prototype.point = function (value) {
-        if (this.pointedValue !== value) {
-            this.disable();
-            this.pointedValue = value;
-            this.enable();
-        }
-    };
+    Object.defineProperty(Pointer.prototype, "$$", {
+        /**
+         * Point a new ivalue
+         * @param value {IValue} value to point
+         */
+        set: function (value) {
+            if (this.$pointedValue !== value) {
+                this.$disable();
+                this.$pointedValue = value;
+                this.$enable();
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
     return Pointer;
 }(Mirror));
 
@@ -1864,20 +1562,20 @@ var Binding = /** @class */ (function (_super) {
     function Binding(value) {
         var _this = this; _super.call(this);
         _this.binding = value;
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     Binding.prototype.init = function (bounded) {
         this.func = bounded;
-        this.binding.on(this.func);
+        this.binding.$on(this.func);
         this.func(this.binding.$);
     };
     /**
      * Just clear bindings
      */
-    Binding.prototype.destroy = function () {
-        this.binding.off(this.func);
-        _super.prototype.destroy.call(this);
+    Binding.prototype.$destroy = function () {
+        this.binding.$off(this.func);
+        _super.prototype.$destroy.call(this);
     };
     return Binding;
 }(Destroyable));
@@ -1928,19 +1626,19 @@ var ReactivePrivate = /** @class */ (function (_super) {
          * @type {boolean}
          */
         _this.frozen = false;
-        _this.seal();
+        _this.$seal();
         return _this;
     }
-    ReactivePrivate.prototype.destroy = function () {
-        this.watch.forEach(function (value) { return value.destroy(); });
+    ReactivePrivate.prototype.$destroy = function () {
+        this.watch.forEach(function (value) { return value.$destroy(); });
         this.watch.clear();
-        this.bindings.forEach(function (binding) { return binding.destroy(); });
+        this.bindings.forEach(function (binding) { return binding.$destroy(); });
         this.bindings.clear();
         this.models.forEach(function (model) { return model.disableReactivity(); });
         this.models.clear();
-        this.freezeExpr && this.freezeExpr.destroy();
+        this.freezeExpr && this.freezeExpr.$destroy();
         this.onDestroy && this.onDestroy();
-        _super.prototype.destroy.call(this);
+        _super.prototype.$destroy.call(this);
     };
     return ReactivePrivate;
 }(Destroyable));
@@ -1956,7 +1654,7 @@ var Reactive = /** @class */ (function (_super) {
         var _this = this; _super.call(this);
         _this.input = input;
         _this.$ = $ || new ReactivePrivate;
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     Object.defineProperty(Reactive.prototype, "parent", {
@@ -2053,7 +1751,7 @@ var Reactive = /** @class */ (function (_super) {
         var $ = this.$;
         if (!$.enabled) {
             $.watch.forEach(function (watcher) {
-                watcher.enable();
+                watcher.$enable();
             });
             $.models.forEach(function (model) {
                 model.enableReactivity();
@@ -2068,7 +1766,7 @@ var Reactive = /** @class */ (function (_super) {
         var $ = this.$;
         if ($.enabled) {
             $.watch.forEach(function (watcher) {
-                watcher.disable();
+                watcher.$disable();
             });
             $.models.forEach(function (model) {
                 model.disableReactivity();
@@ -2106,13 +1804,19 @@ var Reactive = /** @class */ (function (_super) {
     };
     Reactive.prototype.init = function () {
         this.applyOptions(this.input);
-        this.compose(this.input);
+        return this.compose(this.input);
     };
     Reactive.prototype.applyOptions = function (input) {
         // empty
     };
+    Reactive.prototype.applyOptionsNow = function () {
+        this.applyOptions(this.input);
+    };
     Reactive.prototype.compose = function (input) {
-        // empty
+        throw notOverwritten();
+    };
+    Reactive.prototype.composeNow = function () {
+        this.compose(this.input);
     };
     Reactive.prototype.runFunctional = function (f) {
         var args = [];
@@ -2130,9 +1834,9 @@ var Reactive = /** @class */ (function (_super) {
     Reactive.prototype.runOnDestroy = function (func) {
         this.$.onDestroy = func;
     };
-    Reactive.prototype.destroy = function () {
-        _super.prototype.destroy.call(this);
-        this.$.destroy();
+    Reactive.prototype.$destroy = function () {
+        _super.prototype.$destroy.call(this);
+        this.$.$destroy();
         this.$ = null;
     };
     return Reactive;
@@ -2153,7 +1857,7 @@ var FragmentPrivate = /** @class */ (function (_super) {
     __extends(FragmentPrivate, _super);
     function FragmentPrivate() {
         var _this = this; _super.call(this);
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     /**
@@ -2168,10 +1872,10 @@ var FragmentPrivate = /** @class */ (function (_super) {
     /**
      * Unlinks all bindings
      */
-    FragmentPrivate.prototype.destroy = function () {
+    FragmentPrivate.prototype.$destroy = function () {
         this.next = null;
         this.prev = null;
-        _super.prototype.destroy.call(this);
+        _super.prototype.$destroy.call(this);
     };
     return FragmentPrivate;
 }(ReactivePrivate));
@@ -2217,8 +1921,12 @@ var Fragment = /** @class */ (function (_super) {
         var $ = this.$;
         $.preinit(app, parent);
     };
+    Fragment.prototype.init = function () {
+        var ret = _super.prototype.init.call(this);
+        this.ready();
+        return ret;
+    };
     Fragment.prototype.compose = function (input) {
-        _super.prototype.compose.call(this, input);
         input.slot && input.slot(this);
     };
     /** To be overloaded: ready event handler */
@@ -2326,8 +2034,7 @@ var Fragment = /** @class */ (function (_super) {
         node.preinit($.app, this);
         node.input.slot = callback || node.input.slot;
         this.pushNode(node);
-        node.init();
-        node.ready();
+        return node.init();
     };
     /**
      * Defines an if node
@@ -2399,14 +2106,14 @@ var Fragment = /** @class */ (function (_super) {
             $.prev.$.next = $.next;
         }
     };
-    Fragment.prototype.destroy = function () {
-        this.children.forEach(function (child) { return child.destroy(); });
+    Fragment.prototype.$destroy = function () {
+        this.children.forEach(function (child) { return child.$destroy(); });
         this.children.clear();
         this.lastChild = null;
         if (this.$.parent.lastChild === this) {
             this.$.parent.lastChild = this.$.prev;
         }
-        _super.prototype.destroy.call(this);
+        _super.prototype.$destroy.call(this);
     };
     return Fragment;
 }(Reactive));
@@ -2421,7 +2128,7 @@ var TextNodePrivate = /** @class */ (function (_super) {
     __extends(TextNodePrivate, _super);
     function TextNodePrivate() {
         var _this = this; _super.call(this);
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     /**
@@ -2443,8 +2150,8 @@ var TextNodePrivate = /** @class */ (function (_super) {
     /**
      * Clear node data
      */
-    TextNodePrivate.prototype.destroy = function () {
-        _super.prototype.destroy.call(this);
+    TextNodePrivate.prototype.$destroy = function () {
+        _super.prototype.$destroy.call(this);
     };
     return TextNodePrivate;
 }(FragmentPrivate));
@@ -2459,7 +2166,7 @@ var TextNode = /** @class */ (function (_super) {
     function TextNode($) {
         if ($ === void 0) { $ = new TextNodePrivate(); }
         var _this = _super.call(this, {}, $) || this;
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     TextNode.prototype.preinit = function (app, parent, text) {
@@ -2473,10 +2180,10 @@ var TextNode = /** @class */ (function (_super) {
     TextNode.prototype.findFirstChild = function () {
         return this.$.node;
     };
-    TextNode.prototype.destroy = function () {
+    TextNode.prototype.$destroy = function () {
         this.$.node.remove();
-        this.$.destroy();
-        _super.prototype.destroy.call(this);
+        this.$.$destroy();
+        _super.prototype.$destroy.call(this);
     };
     return TextNode;
 }(Fragment));
@@ -2495,11 +2202,11 @@ var INodePrivate = /** @class */ (function (_super) {
          * @type {boolean}
          */
         _this.unmounted = false;
-        _this.seal();
+        _this.$seal();
         return _this;
     }
-    INodePrivate.prototype.destroy = function () {
-        _super.prototype.destroy.call(this);
+    INodePrivate.prototype.$destroy = function () {
+        _super.prototype.$destroy.call(this);
     };
     return INodePrivate;
 }(FragmentPrivate));
@@ -2518,7 +2225,7 @@ var INode = /** @class */ (function (_super) {
      */
     function INode(input, $) {
         var _this = _super.call(this, input, $ || new INodePrivate) || this;
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     Object.defineProperty(INode.prototype, "node", {
@@ -2770,7 +2477,7 @@ var Tag = /** @class */ (function (_super) {
     __extends(Tag, _super);
     function Tag(input) {
         var _this = _super.call(this, input) || this;
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     Tag.prototype.preinit = function (app, parent, tagName) {
@@ -2825,9 +2532,9 @@ var Tag = /** @class */ (function (_super) {
     /**
      * Runs GC
      */
-    Tag.prototype.destroy = function () {
+    Tag.prototype.$destroy = function () {
         this.node.remove();
-        _super.prototype.destroy.call(this);
+        _super.prototype.$destroy.call(this);
     };
     return Tag;
 }(INode));
@@ -2856,8 +2563,11 @@ var Extension = /** @class */ (function (_super) {
             throw userError("A extension node can be encapsulated only in a tag/extension/component", "virtual-dom");
         }
     };
-    Extension.prototype.destroy = function () {
-        _super.prototype.destroy.call(this);
+    Extension.prototype.extend = function (options) {
+        this.applyOptions(options);
+    };
+    Extension.prototype.$destroy = function () {
+        _super.prototype.$destroy.call(this);
     };
     return Extension;
 }(INode));
@@ -2872,6 +2582,11 @@ var Component = /** @class */ (function (_super) {
     function Component() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
+    Component.prototype.init = function () {
+        _super.prototype.composeNow.call(this);
+        this.ready();
+        _super.prototype.applyOptionsNow.call(this);
+    };
     Component.prototype.ready = function () {
         _super.prototype.ready.call(this);
         if (this.children.size !== 1) {
@@ -2906,19 +2621,19 @@ var SwitchedNodePrivate = /** @class */ (function (_super) {
          * @type {Array<{cond : IValue<boolean>, cb : function(Fragment)}>}
          */
         _this.cases = [];
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     /**
      * Runs GC
      */
-    SwitchedNodePrivate.prototype.destroy = function () {
+    SwitchedNodePrivate.prototype.$destroy = function () {
         this.cases.forEach(function (c) {
             delete c.cond;
             delete c.cb;
         });
         this.cases.splice(0);
-        _super.prototype.destroy.call(this);
+        _super.prototype.$destroy.call(this);
     };
     return SwitchedNodePrivate;
 }(FragmentPrivate));
@@ -2945,7 +2660,7 @@ var SwitchedNode = /** @class */ (function (_super) {
                 return;
             }
             if (_this.lastChild) {
-                _this.lastChild.destroy();
+                _this.lastChild.$destroy();
                 _this.children.clear();
                 _this.lastChild = null;
             }
@@ -2957,12 +2672,12 @@ var SwitchedNode = /** @class */ (function (_super) {
                 $.index = -1;
             }
         };
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     SwitchedNode.prototype.addCase = function (case_) {
         this.$.cases.push(case_);
-        case_.cond.on(this.$.sync);
+        case_.cond.$on(this.$.sync);
         this.$.sync();
     };
     /**
@@ -2980,16 +2695,16 @@ var SwitchedNode = /** @class */ (function (_super) {
     SwitchedNode.prototype.ready = function () {
         var $ = this.$;
         $.cases.forEach(function (c) {
-            c.cond.on($.sync);
+            c.cond.$on($.sync);
         });
         $.sync();
     };
-    SwitchedNode.prototype.destroy = function () {
+    SwitchedNode.prototype.$destroy = function () {
         var $ = this.$;
         $.cases.forEach(function (c) {
-            c.cond.off($.sync);
+            c.cond.$off($.sync);
         });
-        _super.prototype.destroy.call(this);
+        _super.prototype.$destroy.call(this);
     };
     return SwitchedNode;
 }(Fragment));
@@ -3001,7 +2716,7 @@ var DebugPrivate = /** @class */ (function (_super) {
     __extends(DebugPrivate, _super);
     function DebugPrivate() {
         var _this = this; _super.call(this);
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     /**
@@ -3022,9 +2737,9 @@ var DebugPrivate = /** @class */ (function (_super) {
     /**
      * Clear node data
      */
-    DebugPrivate.prototype.destroy = function () {
+    DebugPrivate.prototype.$destroy = function () {
         this.node.remove();
-        _super.prototype.destroy.call(this);
+        _super.prototype.$destroy.call(this);
     };
     return DebugPrivate;
 }(FragmentPrivate));
@@ -3043,7 +2758,7 @@ var DebugNode = /** @class */ (function (_super) {
          * @type {DebugNode}
          */
         _this.$ = new DebugPrivate();
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     DebugNode.prototype.preinit = function (app, parent, text) {
@@ -3056,9 +2771,9 @@ var DebugNode = /** @class */ (function (_super) {
     /**
      * Runs garbage collector
      */
-    DebugNode.prototype.destroy = function () {
-        this.$.destroy();
-        _super.prototype.destroy.call(this);
+    DebugNode.prototype.$destroy = function () {
+        this.$.$destroy();
+        _super.prototype.$destroy.call(this);
     };
     return DebugNode;
 }(Fragment));
@@ -3092,7 +2807,7 @@ var AppNode = /** @class */ (function (_super) {
     function AppNode(input) {
         var _this = _super.call(this, input) || this;
         _this.debugUi = input.debugUi || false;
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     return AppNode;
@@ -3115,7 +2830,7 @@ var App = /** @class */ (function (_super) {
         _this.$.node = node;
         _this.preinit(_this, _this);
         _this.init();
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     App.prototype.appendNode = function (node) {
@@ -3129,7 +2844,7 @@ var Portal = /** @class */ (function (_super) {
     function Portal(input) {
         var _this = _super.call(this, input) || this;
         _this.$.node = input.node;
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     Portal.prototype.appendNode = function (node) {
@@ -3265,7 +2980,7 @@ var AttributeBinding = /** @class */ (function (_super) {
                 node.node.removeAttribute(name);
             }
         });
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     return AttributeBinding;
@@ -3295,7 +3010,7 @@ var StyleBinding = /** @class */ (function (_super) {
                 node.node.style.setProperty(name, value);
             }
         });
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     return StyleBinding;
@@ -3327,7 +3042,7 @@ var StaticClassBinding = /** @class */ (function (_super) {
                 _this.current = value;
             }
         });
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     return StaticClassBinding;
@@ -3349,7 +3064,7 @@ var DynamicalClassBinding = /** @class */ (function (_super) {
                 _this.current = value;
             }
         });
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     return DynamicalClassBinding;
@@ -3374,12 +3089,12 @@ var RepeatNodePrivate = /** @class */ (function (_super) {
          * @type {Map}
          */
         _this.nodes = new Map();
-        _this.seal();
+        _this.$seal();
         return _this;
     }
-    RepeatNodePrivate.prototype.destroy = function () {
+    RepeatNodePrivate.prototype.$destroy = function () {
         this.nodes.clear();
-        _super.prototype.destroy.call(this);
+        _super.prototype.$destroy.call(this);
     };
     return RepeatNodePrivate;
 }(INodePrivate));
@@ -3425,7 +3140,7 @@ var RepeatNode = /** @class */ (function (_super) {
         var child = $.nodes.get(id);
         if (child) {
             child.remove();
-            child.destroy();
+            child.$destroy();
             this.$.nodes.delete(id);
             this.children.delete(child);
         }
@@ -3521,7 +3236,7 @@ var BaseViewPrivate = /** @class */ (function (_super) {
     __extends(BaseViewPrivate, _super);
     function BaseViewPrivate() {
         var _this = this; _super.call(this);
-        _this.seal();
+        _this.$seal();
         return _this;
     }
     return BaseViewPrivate;
@@ -3603,7 +3318,7 @@ var Watch = /** @class */ (function (_super) {
         var _this = this;
         this.watch(function (value) {
             _this.children.forEach(function (child) {
-                child.destroy();
+                child.$destroy();
             });
             _this.children.clear();
             _this.lastChild = null;
@@ -3630,7 +3345,7 @@ var ObjectView = /** @class */ (function (_super) {
     }
     ObjectView.prototype.compose = function (input) {
         _super.prototype.compose.call(this, input);
-        var obj = input.model.proxy();
+        var obj = input.model.values;
         for (var key in obj) {
             this.createChild(input, key, obj[key]);
         }
@@ -3691,4 +3406,297 @@ var SetView = /** @class */ (function (_super) {
 
 window.SetView = SetView;
 
+// ./lib-es5/functional/merge.js
+function merge(main) {
+    var targets = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        targets[_i - 1] = arguments[_i];
+    }
+    function refactorClass(obj) {
+        if (Array.isArray(obj.class)) {
+            var out_1 = {
+                $: []
+            };
+            obj.class.forEach(function (item) {
+                if (item instanceof IValue) {
+                    out_1.$.push(item);
+                }
+                else if (typeof item === 'string') {
+                    out_1[item] = true;
+                }
+                else if (typeof item === 'object') {
+                    Object.assign(out_1, item);
+                }
+            });
+            obj.class = out_1;
+        }
+    }
+    refactorClass(main);
+    targets.forEach(function (target) {
+        Reflect.ownKeys(target).forEach(function (prop) {
+            var _a;
+            if (!Reflect.has(main, prop)) {
+                main[prop] = target[prop];
+            }
+            else if (typeof main[prop] === 'object' && typeof target[prop] === 'object') {
+                if (prop === 'class') {
+                    refactorClass(target);
+                }
+                if (prop === '$' && Array.isArray(main[prop]) && Array.isArray(target[prop])) {
+                    (_a = main.$).push.apply(_a, target.$);
+                }
+                else {
+                    merge(main[prop], target[prop]);
+                }
+            }
+        });
+    });
+}
+
+window.merge = merge;
+
+// ./lib-es5/functional/stack.js
+function app(renderer) {
+    return function (node, opts) {
+        return new App(node, opts).runFunctional(renderer, opts);
+    };
+}
+function component(renderer) {
+    return function (opts, callback) {
+        var component = new Component(opts);
+        if (!(current instanceof Fragment))
+            throw userError('missing parent node', 'out-of-context');
+        var ret;
+        if (callback)
+            opts.slot = callback;
+        current.create(component, function (node) {
+            ret = node.runFunctional(renderer, opts);
+        });
+        return ret;
+    };
+}
+function fragment(renderer) {
+    return function (opts, callback) {
+        var frag = new Fragment(opts);
+        if (!(current instanceof Fragment))
+            throw userError('missing parent node', 'out-of-context');
+        if (callback)
+            opts.slot = callback;
+        current.create(frag);
+        return frag.runFunctional(renderer, opts);
+    };
+}
+function extension(renderer) {
+    return function (opts, callback) {
+        var ext = new Extension(opts);
+        if (!(current instanceof Fragment))
+            throw userError('missing parent node', 'out-of-context');
+        if (callback)
+            opts.slot = callback;
+        current.create(ext);
+        return ext.runFunctional(renderer, opts);
+    };
+}
+function tag(name, opts, callback) {
+    if (!(current instanceof Fragment))
+        throw userError('missing parent node', 'out-of-context');
+    return {
+        node: current.tag(name, opts, function (node) {
+            callback && node.runFunctional(callback);
+        })
+    };
+}
+function create(node, callback) {
+    if (!(current instanceof Fragment))
+        throw userError('missing current node', 'out-of-context');
+    current.create(node, function (node) {
+        var args = [];
+        for (var _i = 1; _i < arguments.length; _i++) {
+            args[_i - 1] = arguments[_i];
+        }
+        callback && node.runFunctional.apply(node, __spreadArray([callback], args, false));
+    });
+    return node;
+}
+var vx = {
+    if: function (condition, callback) {
+        if (current instanceof Fragment) {
+            current.if(condition, function (node) { return node.runFunctional(callback); });
+        }
+        else {
+            throw userError("wrong use of `v.if` function", "logic-error");
+        }
+    },
+    else: function (callback) {
+        if (current instanceof Fragment) {
+            current.else(function (node) { return node.runFunctional(callback); });
+        }
+        else {
+            throw userError("wrong use of `v.else` function", "logic-error");
+        }
+    },
+    elif: function (condition, callback) {
+        if (current instanceof Fragment) {
+            current.elif(condition, function (node) { return node.runFunctional(callback); });
+        }
+        else {
+            throw userError("wrong use of `v.elif` function", "logic-error");
+        }
+    },
+    for: function (model, callback) {
+        if (model instanceof ArrayModel) {
+            // for arrays T & K are the same type
+            create(new ArrayView({ model: model }), callback);
+        }
+        else if (model instanceof MapModel) {
+            create(new MapView({ model: model }), callback);
+        }
+        else if (model instanceof SetModel) {
+            // for sets T & K are the same type
+            create(new SetView({ model: model }), callback);
+        }
+        else if (model instanceof ObjectModel) {
+            // for objects K is always string
+            create(new ObjectView({ model: model }), callback);
+        }
+        else {
+            throw userError("wrong use of `v.for` function", 'wrong-model');
+        }
+    },
+    watch: function (model, callback) {
+        var opts = { model: model };
+        create(new Watch(opts), callback);
+    },
+    nextTick: function (callback) {
+        var node = current;
+        window.setTimeout(function () {
+            node.runFunctional(callback);
+        }, 0);
+    }
+};
+
+window.app = app;
+window.component = component;
+window.fragment = fragment;
+window.extension = extension;
+window.tag = tag;
+window.create = create;
+window.vx = vx;
+
+// ./lib-es5/functional/models.js
+function arrayModel(arr) {
+    if (arr === void 0) { arr = []; }
+    if (!current)
+        throw userError('missing parent node', 'out-of-context');
+    return current.register(new ArrayModel(arr)).proxy();
+}
+function mapModel(map) {
+    if (map === void 0) { map = []; }
+    if (!current)
+        throw userError('missing parent node', 'out-of-context');
+    return current.register(new MapModel(map));
+}
+function setModel(arr) {
+    if (arr === void 0) { arr = []; }
+    if (!current)
+        throw userError('missing parent node', 'out-of-context');
+    return current.register(new SetModel(arr));
+}
+function objectModel(obj) {
+    if (obj === void 0) { obj = {}; }
+    if (!current)
+        throw userError('missing parent node', 'out-of-context');
+    return current.register(new ObjectModel(obj));
+}
+
+window.arrayModel = arrayModel;
+window.mapModel = mapModel;
+window.setModel = setModel;
+window.objectModel = objectModel;
+
+// ./lib-es5/functional/options.js
+
+
+
+// ./lib-es5/functional/reactivity.js
+function ref(value) {
+    var ref = current.ref(value);
+    return [ref, function (value) { return ref.$ = value; }];
+}
+function mirror(value) {
+    return current.mirror(value);
+}
+function forward(value) {
+    return current.forward(value);
+}
+function point(value) {
+    return current.point(value);
+}
+function expr(func) {
+    var values = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        values[_i - 1] = arguments[_i];
+    }
+    return current.expr.apply(current, __spreadArray([func], values, false));
+}
+function watch(func) {
+    var values = [];
+    for (var _i = 1; _i < arguments.length; _i++) {
+        values[_i - 1] = arguments[_i];
+    }
+    current.watch.apply(current, __spreadArray([func], values, false));
+}
+function valueOf(value) {
+    return value.$;
+}
+function setValue(ref, value) {
+    if (ref instanceof Pointer && value instanceof IValue) {
+        ref.$$ = value;
+    }
+    else {
+        ref.$ = value instanceof IValue ? value.$ : value;
+    }
+}
+
+window.ref = ref;
+window.mirror = mirror;
+window.forward = forward;
+window.point = point;
+window.expr = expr;
+window.watch = watch;
+window.valueOf = valueOf;
+window.setValue = setValue;
+
+// ./lib-es5/functional/components.js
+function text(text) {
+    if (!(current instanceof Fragment))
+        throw userError('missing parent node', 'out-of-context');
+    ;
+    current.text(text);
+}
+function debug(text) {
+    if (!(current instanceof Fragment))
+        throw userError('missing parent node', 'out-of-context');
+    current.debug(text);
+}
+function predefine(slot, predefined) {
+    return slot || predefined;
+}
+
+window.text = text;
+window.debug = debug;
+window.predefine = predefine;
+
+// ./lib-es5/v/index.js
+
+var v = __assign(__assign({ ref: function (value) {
+        return current.ref(value);
+    }, expr: expr, of: valueOf, sv: setValue, alwaysFalse: new Reference(false), app: app, component: component, fragment: fragment, extension: extension, text: text, tag: tag, create: create }, vx), { merge: merge, destructor: function () {
+        return current.$destroy.bind(current);
+    }, runOnDestroy: function (callback) {
+        current.runOnDestroy(callback);
+    } });
+
+window.v = v;
+
 })();