vasille 2.2.1 → 2.2.2

package/cdn/es2015.js

@@ -1,24 +1,4 @@
 (function(){
-// ./lib/v/index.js
-
-const v = Object.assign(Object.assign({ ref(value) {
-        return current.ref(value);
-    }, expr: expr, of: valueOf, sv: setValue, alwaysFalse: new Reference(false), app,
-    component,
-    fragment,
-    extension,
-    text,
-    tag,
-    create }, vx), { merge,
-    destructor() {
-        return current.destroy.bind(current);
-    },
-    runOnDestroy(callback) {
-        current.runOnDestroy(callback);
-    } });
-
-window.v = v;
-
 // ./lib/models/model.js
 
 
@@ -606,387 +586,127 @@ class ArrayModel extends Array {
 
 window.ArrayModel = ArrayModel;
 
-// ./lib/functional/merge.js
-function merge(main, ...targets) {
-    function refactorClass(obj) {
-        if (Array.isArray(obj.class)) {
-            const out = {
-                $: []
-            };
-            obj.class.forEach(item => {
-                if (item instanceof IValue) {
-                    out.$.push(item);
-                }
-                else if (typeof item === 'string') {
-                    out[item] = true;
-                }
-                else if (typeof item === 'object') {
-                    Object.assign(out, item);
-                }
-            });
-            obj.class = out;
-        }
+// ./lib/core/signal.js
+/**
+ * Signal is an event generator
+ * @class Signal
+ */
+class Signal {
+    constructor() {
+        /**
+         * Handler of event
+         * @type {Set}
+         * @private
+         */
+        this.handlers = new Set;
     }
-    refactorClass(main);
-    targets.forEach(target => {
-        Reflect.ownKeys(target).forEach((prop) => {
-            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
+     */
+    emit(a1, a2, a3, a4, a5, a6, a7, a8, a9) {
+        this.handlers.forEach(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])) {
-                    main.$.push(...target.$);
-                }
-                else {
-                    merge(main[prop], target[prop]);
-                }
+            catch (e) {
+                console.error(`Vasille.js: Handler throw exception: `, e);
             }
         });
-    });
+    }
+    /**
+     * Subscribe to event
+     * @param func {function} handler
+     */
+    subscribe(func) {
+        this.handlers.add(func);
+    }
+    /**
+     * Unsubscribe from event
+     * @param func {function} handler
+     */
+    unsubscribe(func) {
+        this.handlers.delete(func);
+    }
 }
 
-window.merge = merge;
+window.Signal = Signal;
 
-// ./lib/functional/stack.js
-function app(renderer) {
-    return (node, opts) => {
-        return new App(node, opts).runFunctional(renderer, opts);
-    };
-}
-function component(renderer) {
-    return (opts, callback) => {
-        const component = new Component(opts);
-        if (!(current instanceof Fragment))
-            throw userError('missing parent node', 'out-of-context');
-        let ret;
-        if (callback)
-            opts.slot = callback;
-        current.create(component, node => {
-            ret = node.runFunctional(renderer, opts);
-        });
-        return ret;
-    };
+// ./lib/core/slot.js
+/**
+ * Component slot
+ * @class Slot
+ */
+class Slot {
+    /**
+     * Sets the runner
+     * @param func {function} the function to run
+     */
+    insert(func) {
+        this.runner = func;
+    }
+    /**
+     * @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
+     */
+    release(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
+     */
+    predefine(func, a0, a1, a2, a3, a4, a5, a6, a7, a8, a9) {
+        (this.runner || func)(a0, a1, a2, a3, a4, a5, a6, a7, a8, a9);
+    }
 }
-function fragment(renderer) {
-    return (opts, callback) => {
-        const 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);
-    };
+
+window.Slot = Slot;
+
+// ./lib/core/errors.js
+const 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 (opts, callback) => {
-        const 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, (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, (node, ...args) => {
-        callback && node.runFunctional(callback, ...args);
-    });
-    return node;
-}
-const vx = {
-    if(condition, callback) {
-        if (current instanceof Fragment) {
-            current.if(condition, node => node.runFunctional(callback));
-        }
-        else {
-            throw userError("wrong use of `v.if` function", "logic-error");
-        }
-    },
-    else(callback) {
-        if (current instanceof Fragment) {
-            current.else(node => node.runFunctional(callback));
-        }
-        else {
-            throw userError("wrong use of `v.else` function", "logic-error");
-        }
-    },
-    elif(condition, callback) {
-        if (current instanceof Fragment) {
-            current.elif(condition, node => node.runFunctional(callback));
-        }
-        else {
-            throw userError("wrong use of `v.elif` function", "logic-error");
-        }
-    },
-    for(model, callback) {
-        if (model instanceof ArrayModel) {
-            // for arrays T & K are the same type
-            create(new ArrayView({ model }), callback);
-        }
-        else if (model instanceof MapModel) {
-            create(new MapView({ model }), callback);
-        }
-        else if (model instanceof SetModel) {
-            // for sets T & K are the same type
-            create(new SetView({ model }), callback);
-        }
-        else if (model instanceof ObjectModel) {
-            // for objects K is always string
-            create(new ObjectView({ model }), callback);
-        }
-        else {
-            throw userError("wrong use of `v.for` function", 'wrong-model');
-        }
-    },
-    watch(model, callback) {
-        const opts = { model };
-        create(new Watch(opts), callback);
-    },
-    nextTick(callback) {
-        const node = current;
-        window.setTimeout(() => {
-            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/functional/models.js
-function arrayModel(arr = []) {
-    if (!current)
-        throw userError('missing parent node', 'out-of-context');
-    return current.register(new ArrayModel(arr)).proxy();
-}
-function mapModel(map = []) {
-    if (!current)
-        throw userError('missing parent node', 'out-of-context');
-    return current.register(new MapModel(map));
-}
-function setModel(arr = []) {
-    if (!current)
-        throw userError('missing parent node', 'out-of-context');
-    return current.register(new SetModel(arr));
-}
-function objectModel(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/functional/options.js
-
-
-
-// ./lib/functional/reactivity.js
-function ref(value) {
-    const ref = current.ref(value);
-    return [ref, (value) => 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, ...values) {
-    return current.expr(func, ...values);
-}
-function watch(func, ...values) {
-    current.watch(func, ...values);
-}
-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/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/core/signal.js
-/**
- * Signal is an event generator
- * @class Signal
- */
-class Signal {
-    constructor() {
-        /**
-         * Handler of event
-         * @type {Set}
-         * @private
-         */
-        this.handlers = new Set;
-    }
-    /**
-     * 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
-     */
-    emit(a1, a2, a3, a4, a5, a6, a7, a8, a9) {
-        this.handlers.forEach(handler => {
-            try {
-                handler(a1, a2, a3, a4, a5, a6, a7, a8, a9);
-            }
-            catch (e) {
-                console.error(`Vasille.js: Handler throw exception: `, e);
-            }
-        });
-    }
-    /**
-     * Subscribe to event
-     * @param func {function} handler
-     */
-    subscribe(func) {
-        this.handlers.add(func);
-    }
-    /**
-     * Unsubscribe from event
-     * @param func {function} handler
-     */
-    unsubscribe(func) {
-        this.handlers.delete(func);
-    }
-}
-
-window.Signal = Signal;
-
-// ./lib/core/slot.js
-/**
- * Component slot
- * @class Slot
- */
-class Slot {
-    /**
-     * Sets the runner
-     * @param func {function} the function to run
-     */
-    insert(func) {
-        this.runner = func;
-    }
-    /**
-     * @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
-     */
-    release(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
-     */
-    predefine(func, a0, a1, a2, a3, a4, a5, a6, a7, a8, a9) {
-        (this.runner || func)(a0, a1, a2, a3, a4, a5, a6, a7, a8, a9);
-    }
-}
-
-window.Slot = Slot;
-
-// ./lib/core/errors.js
-const 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");
+function wrongBinding(msg) {
+    return userError(msg, "wrong-binding");
 }
 
 window.notOverwritten = notOverwritten;
@@ -1165,7 +885,7 @@ class Destroyable {
      * Make object fields non configurable
      * @protected
      */
-    seal() {
+    $seal() {
         const $ = this;
         Object.keys($).forEach(i => {
             // eslint-disable-next-line no-prototype-builtins
@@ -1197,7 +917,7 @@ class Destroyable {
     /**
      * Garbage collector method
      */
-    destroy() {
+    $destroy() {
         // nothing here
     }
 }
@@ -1209,13 +929,13 @@ class Switchable extends Destroyable {
     /**
      * Enable update handlers triggering
      */
-    enable() {
+    $enable() {
         throw notOverwritten();
     }
     /**
      * disable update handlers triggering
      */
-    disable() {
+    $disable() {
         throw notOverwritten();
     }
 }
@@ -1250,14 +970,14 @@ class IValue extends Switchable {
      * Add a new handler to value change
      * @param handler {function(value : *)} the handler to add
      */
-    on(handler) {
+    $on(handler) {
         throw notOverwritten();
     }
     /**
      * Removes a handler of value change
      * @param handler {function(value : *)} the handler to remove
      */
-    off(handler) {
+    $off(handler) {
         throw notOverwritten();
     }
 }
@@ -1317,12 +1037,12 @@ class Expression extends IValue {
         this.values = values;
         this.func = handler;
         if (link) {
-            this.enable();
+            this.$enable();
         }
         else {
             handler();
         }
-        this.seal();
+        this.$seal();
     }
     get $() {
         return this.sync.$;
@@ -1330,18 +1050,18 @@ class Expression extends IValue {
     set $(value) {
         this.sync.$ = value;
     }
-    on(handler) {
-        this.sync.on(handler);
+    $on(handler) {
+        this.sync.$on(handler);
         return this;
     }
-    off(handler) {
-        this.sync.off(handler);
+    $off(handler) {
+        this.sync.$off(handler);
         return this;
     }
-    enable() {
+    $enable() {
         if (!this.isEnabled) {
             for (let 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();
@@ -1349,21 +1069,21 @@ class Expression extends IValue {
         }
         return this;
     }
-    disable() {
+    $disable() {
         if (this.isEnabled) {
             for (let 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;
     }
-    destroy() {
-        this.disable();
+    $destroy() {
+        this.$disable();
         this.values.splice(0);
         this.valuesCache.splice(0);
         this.linkedFunc.splice(0);
-        super.destroy();
+        super.$destroy();
     }
 }
 
@@ -1381,43 +1101,43 @@ class Reference extends IValue {
      */
     constructor(value) {
         super(true);
-        this.value = value;
-        this.onchange = new Set;
-        this.seal();
+        this.$value = value;
+        this.$onchange = new Set;
+        this.$seal();
     }
     get $() {
-        return this.value;
+        return this.$value;
     }
     set $(value) {
-        if (this.value !== value) {
-            this.value = value;
+        if (this.$value !== value) {
+            this.$value = value;
             if (this.isEnabled) {
-                this.onchange.forEach(handler => {
+                this.$onchange.forEach(handler => {
                     handler(value);
                 });
             }
         }
     }
-    enable() {
+    $enable() {
         if (!this.isEnabled) {
-            this.onchange.forEach(handler => {
-                handler(this.value);
+            this.$onchange.forEach(handler => {
+                handler(this.$value);
             });
             this.isEnabled = true;
         }
     }
-    disable() {
+    $disable() {
         this.isEnabled = false;
     }
-    on(handler) {
-        this.onchange.add(handler);
+    $on(handler) {
+        this.$onchange.add(handler);
     }
-    off(handler) {
-        this.onchange.delete(handler);
+    $off(handler) {
+        this.$onchange.delete(handler);
     }
-    destroy() {
-        super.destroy();
-        this.onchange.clear();
+    $destroy() {
+        super.$destroy();
+        this.$onchange.clear();
     }
 }
 
@@ -1438,13 +1158,13 @@ class Mirror extends Reference {
      */
     constructor(value, forwardOnly = false) {
         super(value.$);
-        this.handler = (v) => {
+        this.$handler = (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();
     }
     get $() {
         // this is a ts bug
@@ -1453,30 +1173,30 @@ class Mirror extends Reference {
         return super.$;
     }
     set $(v) {
-        if (!this.forwardOnly) {
-            this.pointedValue.$ = v;
+        if (!this.$forwardOnly) {
+            this.$pointedValue.$ = v;
         }
         // this is a ts bug
         // eslint-disable-next-line
         // @ts-ignore
         super.$ = v;
     }
-    enable() {
+    $enable() {
         if (!this.isEnabled) {
             this.isEnabled = true;
-            this.pointedValue.on(this.handler);
-            this.$ = this.pointedValue.$;
+            this.$pointedValue.$on(this.$handler);
+            this.$ = this.$pointedValue.$;
         }
     }
-    disable() {
+    $disable() {
         if (this.isEnabled) {
-            this.pointedValue.off(this.handler);
+            this.$pointedValue.$off(this.$handler);
             this.isEnabled = false;
         }
     }
-    destroy() {
-        this.disable();
-        super.destroy();
+    $destroy() {
+        this.$disable();
+        super.$destroy();
     }
 }
 
@@ -1500,11 +1220,11 @@ class Pointer extends Mirror {
      * Point a new ivalue
      * @param value {IValue} value to point
      */
-    point(value) {
-        if (this.pointedValue !== value) {
-            this.disable();
-            this.pointedValue = value;
-            this.enable();
+    set $$(value) {
+        if (this.$pointedValue !== value) {
+            this.$disable();
+            this.$pointedValue = value;
+            this.$enable();
         }
     }
 }
@@ -1525,19 +1245,19 @@ class Binding extends Destroyable {
     constructor(value) {
         super();
         this.binding = value;
-        this.seal();
+        this.$seal();
     }
     init(bounded) {
         this.func = bounded;
-        this.binding.on(this.func);
+        this.binding.$on(this.func);
         this.func(this.binding.$);
     }
     /**
      * Just clear bindings
      */
-    destroy() {
-        this.binding.off(this.func);
-        super.destroy();
+    $destroy() {
+        this.binding.$off(this.func);
+        super.$destroy();
     }
 }
 
@@ -1585,18 +1305,18 @@ class ReactivePrivate extends Destroyable {
          * @type {boolean}
          */
         this.frozen = false;
-        this.seal();
+        this.$seal();
     }
-    destroy() {
-        this.watch.forEach(value => value.destroy());
+    $destroy() {
+        this.watch.forEach(value => value.$destroy());
         this.watch.clear();
-        this.bindings.forEach(binding => binding.destroy());
+        this.bindings.forEach(binding => binding.$destroy());
         this.bindings.clear();
         this.models.forEach(model => model.disableReactivity());
         this.models.clear();
-        this.freezeExpr && this.freezeExpr.destroy();
+        this.freezeExpr && this.freezeExpr.$destroy();
         this.onDestroy && this.onDestroy();
-        super.destroy();
+        super.$destroy();
     }
 }
 /**
@@ -1609,7 +1329,7 @@ class Reactive extends Destroyable {
         super();
         this.input = input;
         this.$ = $ || new ReactivePrivate;
-        this.seal();
+        this.$seal();
     }
     /**
      * Get parent node
@@ -1692,7 +1412,7 @@ class Reactive extends Destroyable {
         const $ = this.$;
         if (!$.enabled) {
             $.watch.forEach(watcher => {
-                watcher.enable();
+                watcher.$enable();
             });
             $.models.forEach(model => {
                 model.enableReactivity();
@@ -1707,7 +1427,7 @@ class Reactive extends Destroyable {
         const $ = this.$;
         if ($.enabled) {
             $.watch.forEach(watcher => {
-                watcher.disable();
+                watcher.$disable();
             });
             $.models.forEach(model => {
                 model.disableReactivity();
@@ -1770,9 +1490,9 @@ class Reactive extends Destroyable {
     runOnDestroy(func) {
         this.$.onDestroy = func;
     }
-    destroy() {
-        super.destroy();
-        this.$.destroy();
+    $destroy() {
+        super.$destroy();
+        this.$.$destroy();
         this.$ = null;
     }
 }
@@ -1789,7 +1509,7 @@ window.Reactive = Reactive;
 class FragmentPrivate extends ReactivePrivate {
     constructor() {
         super();
-        this.seal();
+        this.$seal();
     }
     /**
      * Pre-initializes the base of a fragment
@@ -1803,10 +1523,10 @@ class FragmentPrivate extends ReactivePrivate {
     /**
      * Unlinks all bindings
      */
-    destroy() {
+    $destroy() {
         this.next = null;
         this.prev = null;
-        super.destroy();
+        super.$destroy();
     }
 }
 /**
@@ -2029,14 +1749,14 @@ class Fragment extends Reactive {
             $.prev.$.next = $.next;
         }
     }
-    destroy() {
-        this.children.forEach(child => child.destroy());
+    $destroy() {
+        this.children.forEach(child => child.$destroy());
         this.children.clear();
         this.lastChild = null;
         if (this.$.parent.lastChild === this) {
             this.$.parent.lastChild = this.$.prev;
         }
-        super.destroy();
+        super.$destroy();
     }
 }
 const trueIValue = new Reference(true);
@@ -2048,7 +1768,7 @@ const trueIValue = new Reference(true);
 class TextNodePrivate extends FragmentPrivate {
     constructor() {
         super();
-        this.seal();
+        this.$seal();
     }
     /**
      * Pre-initializes a text node
@@ -2068,8 +1788,8 @@ class TextNodePrivate extends FragmentPrivate {
     /**
      * Clear node data
      */
-    destroy() {
-        super.destroy();
+    $destroy() {
+        super.$destroy();
     }
 }
 /**
@@ -2080,7 +1800,7 @@ class TextNodePrivate extends FragmentPrivate {
 class TextNode extends Fragment {
     constructor($ = new TextNodePrivate()) {
         super({}, $);
-        this.seal();
+        this.$seal();
     }
     preinit(app, parent, text) {
         const $ = this.$;
@@ -2093,10 +1813,10 @@ class TextNode extends Fragment {
     findFirstChild() {
         return this.$.node;
     }
-    destroy() {
+    $destroy() {
         this.$.node.remove();
-        this.$.destroy();
-        super.destroy();
+        this.$.$destroy();
+        super.$destroy();
     }
 }
 /**
@@ -2112,10 +1832,10 @@ class INodePrivate extends FragmentPrivate {
          * @type {boolean}
          */
         this.unmounted = false;
-        this.seal();
+        this.$seal();
     }
-    destroy() {
-        super.destroy();
+    $destroy() {
+        super.$destroy();
     }
 }
 /**
@@ -2131,7 +1851,7 @@ class INode extends Fragment {
      */
     constructor(input, $) {
         super(input, $ || new INodePrivate);
-        this.seal();
+        this.$seal();
     }
     /**
      * Get the bound node
@@ -2374,7 +2094,7 @@ class INode extends Fragment {
 class Tag extends INode {
     constructor(input) {
         super(input);
-        this.seal();
+        this.$seal();
     }
     preinit(app, parent, tagName) {
         if (!tagName || typeof tagName !== "string") {
@@ -2427,9 +2147,9 @@ class Tag extends INode {
     /**
      * Runs GC
      */
-    destroy() {
+    $destroy() {
         this.node.remove();
-        super.destroy();
+        super.$destroy();
     }
 }
 /**
@@ -2452,8 +2172,8 @@ class Extension extends INode {
             throw userError("A extension node can be encapsulated only in a tag/extension/component", "virtual-dom");
         }
     }
-    destroy() {
-        super.destroy();
+    $destroy() {
+        super.$destroy();
     }
 }
 /**
@@ -2498,18 +2218,18 @@ class SwitchedNodePrivate extends FragmentPrivate {
          * @type {Array<{cond : IValue<boolean>, cb : function(Fragment)}>}
          */
         this.cases = [];
-        this.seal();
+        this.$seal();
     }
     /**
      * Runs GC
      */
-    destroy() {
+    $destroy() {
         this.cases.forEach(c => {
             delete c.cond;
             delete c.cb;
         });
         this.cases.splice(0);
-        super.destroy();
+        super.$destroy();
     }
 }
 /**
@@ -2533,7 +2253,7 @@ class SwitchedNode extends Fragment {
                 return;
             }
             if (this.lastChild) {
-                this.lastChild.destroy();
+                this.lastChild.$destroy();
                 this.children.clear();
                 this.lastChild = null;
             }
@@ -2545,11 +2265,11 @@ class SwitchedNode extends Fragment {
                 $.index = -1;
             }
         };
-        this.seal();
+        this.$seal();
     }
     addCase(case_) {
         this.$.cases.push(case_);
-        case_.cond.on(this.$.sync);
+        case_.cond.$on(this.$.sync);
         this.$.sync();
     }
     /**
@@ -2567,16 +2287,16 @@ class SwitchedNode extends Fragment {
     ready() {
         const $ = this.$;
         $.cases.forEach(c => {
-            c.cond.on($.sync);
+            c.cond.$on($.sync);
         });
         $.sync();
     }
-    destroy() {
+    $destroy() {
         const $ = this.$;
         $.cases.forEach(c => {
-            c.cond.off($.sync);
+            c.cond.$off($.sync);
         });
-        super.destroy();
+        super.$destroy();
     }
 }
 /**
@@ -2585,7 +2305,7 @@ class SwitchedNode extends Fragment {
 class DebugPrivate extends FragmentPrivate {
     constructor() {
         super();
-        this.seal();
+        this.$seal();
     }
     /**
      * Pre-initializes a text node
@@ -2604,9 +2324,9 @@ class DebugPrivate extends FragmentPrivate {
     /**
      * Clear node data
      */
-    destroy() {
+    $destroy() {
         this.node.remove();
-        super.destroy();
+        super.$destroy();
     }
 }
 /**
@@ -2622,7 +2342,7 @@ class DebugNode extends Fragment {
          * @type {DebugNode}
          */
         this.$ = new DebugPrivate();
-        this.seal();
+        this.$seal();
     }
     preinit(app, parent, text) {
         const $ = this.$;
@@ -2634,9 +2354,9 @@ class DebugNode extends Fragment {
     /**
      * Runs garbage collector
      */
-    destroy() {
-        this.$.destroy();
-        super.destroy();
+    $destroy() {
+        this.$.$destroy();
+        super.$destroy();
     }
 }
 
@@ -2667,7 +2387,7 @@ class AppNode extends INode {
     constructor(input) {
         super(input);
         this.debugUi = input.debugUi || false;
-        this.seal();
+        this.$seal();
     }
 }
 /**
@@ -2686,7 +2406,7 @@ class App extends AppNode {
         this.$.node = node;
         this.preinit(this, this);
         this.init();
-        this.seal();
+        this.$seal();
     }
     appendNode(node) {
         this.$.node.appendChild(node);
@@ -2696,7 +2416,7 @@ class Portal extends AppNode {
     constructor(input) {
         super(input);
         this.$.node = input.node;
-        this.seal();
+        this.$seal();
     }
     appendNode(node) {
         this.$.node.appendChild(node);
@@ -2819,7 +2539,7 @@ class AttributeBinding extends Binding {
                 node.node.removeAttribute(name);
             }
         });
-        this.seal();
+        this.$seal();
     }
 }
 
@@ -2845,7 +2565,7 @@ class StyleBinding extends Binding {
                 node.node.style.setProperty(name, value);
             }
         });
-        this.seal();
+        this.$seal();
     }
 }
 
@@ -2873,7 +2593,7 @@ class StaticClassBinding extends Binding {
                 this.current = value;
             }
         });
-        this.seal();
+        this.$seal();
     }
 }
 class DynamicalClassBinding extends Binding {
@@ -2891,7 +2611,7 @@ class DynamicalClassBinding extends Binding {
                 this.current = value;
             }
         });
-        this.seal();
+        this.$seal();
     }
 }
 
@@ -2912,11 +2632,11 @@ class RepeatNodePrivate extends INodePrivate {
          * @type {Map}
          */
         this.nodes = new Map();
-        this.seal();
+        this.$seal();
     }
-    destroy() {
+    $destroy() {
         this.nodes.clear();
-        super.destroy();
+        super.$destroy();
     }
 }
 /**
@@ -2958,7 +2678,7 @@ class RepeatNode extends Fragment {
         const child = $.nodes.get(id);
         if (child) {
             child.remove();
-            child.destroy();
+            child.$destroy();
             this.$.nodes.delete(id);
             this.children.delete(child);
         }
@@ -3043,7 +2763,7 @@ window.Repeater = Repeater;
 class BaseViewPrivate extends RepeatNodePrivate {
     constructor() {
         super();
-        this.seal();
+        this.$seal();
     }
 }
 /**
@@ -3106,7 +2826,7 @@ class Watch extends Fragment {
     compose(input) {
         this.watch((value) => {
             this.children.forEach(child => {
-                child.destroy();
+                child.$destroy();
             });
             this.children.clear();
             this.lastChild = null;
@@ -3172,4 +2892,284 @@ class SetView extends BaseView {
 
 window.SetView = SetView;
 
+// ./lib/functional/merge.js
+function merge(main, ...targets) {
+    function refactorClass(obj) {
+        if (Array.isArray(obj.class)) {
+            const out = {
+                $: []
+            };
+            obj.class.forEach(item => {
+                if (item instanceof IValue) {
+                    out.$.push(item);
+                }
+                else if (typeof item === 'string') {
+                    out[item] = true;
+                }
+                else if (typeof item === 'object') {
+                    Object.assign(out, item);
+                }
+            });
+            obj.class = out;
+        }
+    }
+    refactorClass(main);
+    targets.forEach(target => {
+        Reflect.ownKeys(target).forEach((prop) => {
+            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])) {
+                    main.$.push(...target.$);
+                }
+                else {
+                    merge(main[prop], target[prop]);
+                }
+            }
+        });
+    });
+}
+
+window.merge = merge;
+
+// ./lib/functional/stack.js
+function app(renderer) {
+    return (node, opts) => {
+        return new App(node, opts).runFunctional(renderer, opts);
+    };
+}
+function component(renderer) {
+    return (opts, callback) => {
+        const component = new Component(opts);
+        if (!(current instanceof Fragment))
+            throw userError('missing parent node', 'out-of-context');
+        let ret;
+        if (callback)
+            opts.slot = callback;
+        current.create(component, node => {
+            ret = node.runFunctional(renderer, opts);
+        });
+        return ret;
+    };
+}
+function fragment(renderer) {
+    return (opts, callback) => {
+        const 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 (opts, callback) => {
+        const 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, (node) => {
+            callback && node.runFunctional(callback);
+        })
+    };
+}
+function create(node, callback) {
+    if (!(current instanceof Fragment))
+        throw userError('missing current node', 'out-of-context');
+    current.create(node, (node, ...args) => {
+        callback && node.runFunctional(callback, ...args);
+    });
+    return node;
+}
+const vx = {
+    if(condition, callback) {
+        if (current instanceof Fragment) {
+            current.if(condition, node => node.runFunctional(callback));
+        }
+        else {
+            throw userError("wrong use of `v.if` function", "logic-error");
+        }
+    },
+    else(callback) {
+        if (current instanceof Fragment) {
+            current.else(node => node.runFunctional(callback));
+        }
+        else {
+            throw userError("wrong use of `v.else` function", "logic-error");
+        }
+    },
+    elif(condition, callback) {
+        if (current instanceof Fragment) {
+            current.elif(condition, node => node.runFunctional(callback));
+        }
+        else {
+            throw userError("wrong use of `v.elif` function", "logic-error");
+        }
+    },
+    for(model, callback) {
+        if (model instanceof ArrayModel) {
+            // for arrays T & K are the same type
+            create(new ArrayView({ model }), callback);
+        }
+        else if (model instanceof MapModel) {
+            create(new MapView({ model }), callback);
+        }
+        else if (model instanceof SetModel) {
+            // for sets T & K are the same type
+            create(new SetView({ model }), callback);
+        }
+        else if (model instanceof ObjectModel) {
+            // for objects K is always string
+            create(new ObjectView({ model }), callback);
+        }
+        else {
+            throw userError("wrong use of `v.for` function", 'wrong-model');
+        }
+    },
+    watch(model, callback) {
+        const opts = { model };
+        create(new Watch(opts), callback);
+    },
+    nextTick(callback) {
+        const node = current;
+        window.setTimeout(() => {
+            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/functional/models.js
+function arrayModel(arr = []) {
+    if (!current)
+        throw userError('missing parent node', 'out-of-context');
+    return current.register(new ArrayModel(arr)).proxy();
+}
+function mapModel(map = []) {
+    if (!current)
+        throw userError('missing parent node', 'out-of-context');
+    return current.register(new MapModel(map));
+}
+function setModel(arr = []) {
+    if (!current)
+        throw userError('missing parent node', 'out-of-context');
+    return current.register(new SetModel(arr));
+}
+function objectModel(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/functional/options.js
+
+
+
+// ./lib/functional/reactivity.js
+function ref(value) {
+    const ref = current.ref(value);
+    return [ref, (value) => 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, ...values) {
+    return current.expr(func, ...values);
+}
+function watch(func, ...values) {
+    current.watch(func, ...values);
+}
+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/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/v/index.js
+
+const v = Object.assign(Object.assign({ ref(value) {
+        return current.ref(value);
+    }, expr: expr, of: valueOf, sv: setValue, alwaysFalse: new Reference(false), app,
+    component,
+    fragment,
+    extension,
+    text,
+    tag,
+    create }, vx), { merge,
+    destructor() {
+        return current.$destroy.bind(current);
+    },
+    runOnDestroy(callback) {
+        current.runOnDestroy(callback);
+    } });
+
+window.v = v;
+
 })();