vasille 2.0.5 → 2.2.2

package/lib/node/watch.js

@@ -1,27 +1,19 @@
 import { Fragment } from "./node";
-import { Slot } from "../core/slot";
 /**
  * Watch Node
  * @class Watch
  * @extends Fragment
  */
 export class Watch extends Fragment {
-    constructor() {
-        super();
-        this.slot = new Slot;
-        this.model = this.ref(null);
-        this.seal();
-    }
-    createWatchers() {
+    compose(input) {
         this.watch((value) => {
             this.children.forEach(child => {
-                child.destroy();
+                child.$destroy();
             });
             this.children.clear();
-            this.slot.release(this, value);
-        }, this.model);
-    }
-    compose() {
-        this.slot.release(this, this.model.$);
+            this.lastChild = null;
+            input.slot && input.slot(this, value);
+        }, input.model);
+        input.slot(this, input.model.$);
     }
 }

package/lib/spec/html.js

@@ -0,0 +1 @@
+export {};

package/lib/spec/react.js

@@ -0,0 +1 @@
+export {};

package/lib/spec/svg.js

@@ -0,0 +1 @@
+export {};

package/lib/v/index.js

@@ -0,0 +1,23 @@
+import { debug, text } from "../functional/components";
+import { arrayModel, mapModel, objectModel, setModel } from "../functional/models";
+import { expr, forward, mirror, point, ref, setValue, valueOf, watch } from "../functional/reactivity";
+import { app, component, create, extension, fragment, tag, vx } from "../functional/stack";
+import { current } from "../core/core";
+import { Reference } from "../value/reference";
+import { merge } from "../functional/merge";
+export { debug, arrayModel, mapModel, objectModel, setModel, expr, forward, mirror, point, ref, setValue, valueOf, watch };
+export 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);
+    } });

package/lib/value/expression.js

@@ -6,13 +6,18 @@ import { IValue } from "../core/ivalue";
  * @extends IValue
  */
 export class Expression extends IValue {
-    constructor(func, link, v1, v2, v3, v4, v5, v6, v7, v8, v9) {
+    /**
+     * Creates a function bounded to N values
+     * @param func {Function} the function to bound
+     * @param values
+     * @param link {Boolean} links immediately if true
+     */
+    constructor(func, link, ...values) {
         super(false);
         /**
          * Expression will link different handler for each value of list
          */
         this.linkedFunc = [];
-        const values = [v1, v2, v3, v4, v5, v6, v7, v8, v9].filter(v => v instanceof IValue);
         const handler = (i) => {
             if (i != null) {
                 this.valuesCache[i] = this.values[i].$;
@@ -21,23 +26,21 @@ export class Expression extends IValue {
         };
         // eslint-disable-next-line @typescript-eslint/ban-ts-comment
         // @ts-ignore
-        this.valuesCache = values.map(iValue => iValue.$);
+        this.valuesCache = values.map(item => item.$);
         this.sync = new Reference(func.apply(this, this.valuesCache));
         let i = 0;
         values.forEach(() => {
             this.linkedFunc.push(handler.bind(this, Number(i++)));
         });
-        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-ignore
         this.values = values;
         this.func = handler;
         if (link) {
-            this.enable();
+            this.$enable();
         }
         else {
             handler();
         }
-        this.seal();
+        this.$seal();
     }
     get $() {
         return this.sync.$;
@@ -45,18 +48,18 @@ export 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();
@@ -64,20 +67,20 @@ export 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();
     }
 }

package/lib/value/mirror.js

@@ -13,13 +13,13 @@ export 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
@@ -28,29 +28,29 @@ export 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();
     }
 }

package/lib/value/pointer.js

@@ -16,11 +16,11 @@ export 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();
         }
     }
 }

package/lib/value/reference.js

@@ -10,42 +10,42 @@ export 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();
     }
 }

package/lib/views/array-view.js

@@ -5,17 +5,13 @@ import { BaseView } from "./base-view";
  * @extends BaseView
  */
 export class ArrayView extends BaseView {
-    constructor(model) {
-        super();
-        this.model = model;
+    createChild(input, id, item, before) {
+        super.createChild(input, item, item, before || this.$.nodes.get(id));
     }
-    createChild(id, item, before) {
-        super.createChild(item, item, before || this.$.nodes.get(id));
-    }
-    ready() {
-        this.model.forEach(item => {
-            this.createChild(item, item);
+    compose(input) {
+        super.compose(input);
+        input.model.forEach(item => {
+            this.createChild(input, item, item);
         });
-        super.ready();
     }
 }

package/lib/views/base-view.js

@@ -7,7 +7,7 @@ import { RepeatNode, RepeatNodePrivate } from "./repeat-node";
 export class BaseViewPrivate extends RepeatNodePrivate {
     constructor() {
         super();
-        this.seal();
+        this.$seal();
     }
 }
 /**
@@ -17,33 +17,22 @@ export class BaseViewPrivate extends RepeatNodePrivate {
  * @implements IModel
  */
 export class BaseView extends RepeatNode {
-    constructor($1) {
-        super($1 || new BaseViewPrivate);
+    constructor(input, $) {
+        super(input, $ || new BaseViewPrivate);
+    }
+    compose(input) {
         const $ = this.$;
         $.addHandler = (id, item) => {
-            this.createChild(id, item);
+            this.createChild(input, id, item);
         };
         $.removeHandler = (id, item) => {
             this.destroyChild(id, item);
         };
-        this.seal();
-    }
-    /**
-     * Handle ready event
-     */
-    ready() {
-        const $ = this.$;
-        this.model.listener.onAdd($.addHandler);
-        this.model.listener.onRemove($.removeHandler);
-        super.ready();
-    }
-    /**
-     * Handles destroy event
-     */
-    destroy() {
-        const $ = this.$;
-        this.model.listener.offAdd($.addHandler);
-        this.model.listener.offRemove($.removeHandler);
-        super.destroy();
+        input.model.listener.onAdd($.addHandler);
+        input.model.listener.onRemove($.removeHandler);
+        this.runOnDestroy(() => {
+            input.model.listener.offAdd($.addHandler);
+            input.model.listener.offRemove($.removeHandler);
+        });
     }
 }

package/lib/views/map-view.js

@@ -5,15 +5,10 @@ import { BaseView } from "./base-view";
  * @extends BaseView
  */
 export class MapView extends BaseView {
-    constructor(model) {
-        super();
-        this.model = model;
-    }
-    ready() {
-        const map = this.model;
-        map.forEach((value, key) => {
-            this.createChild(key, value);
+    compose(input) {
+        super.compose(input);
+        input.model.forEach((value, key) => {
+            this.createChild(input, key, value);
         });
-        super.ready();
     }
 }

package/lib/views/object-view.js

@@ -5,14 +5,11 @@ import { BaseView } from "./base-view";
  * @extends BaseView
  */
 export class ObjectView extends BaseView {
-    constructor(model) {
-        super();
-        this.model = model;
-    }
-    ready() {
-        const obj = this.model;
+    compose(input) {
+        super.compose(input);
+        const obj = input.model.proxy();
         for (const key in obj) {
-            this.createChild(key, obj[key]);
+            this.createChild(input, key, obj[key]);
         }
         super.ready();
     }

package/lib/views/repeat-node.js

@@ -1,6 +1,4 @@
 import { Fragment, INodePrivate } from "../node/node";
-import { Slot } from "../core/slot";
-import { timeoutExecutor } from "../core/executor";
 /**
  * Private part of repeat node
  * @class RepeatNodePrivate
@@ -14,11 +12,11 @@ export class RepeatNodePrivate extends INodePrivate {
          * @type {Map}
          */
         this.nodes = new Map();
-        this.seal();
+        this.$seal();
     }
-    destroy() {
+    $destroy() {
         this.nodes.clear();
-        super.destroy();
+        super.$destroy();
     }
 }
 /**
@@ -27,17 +25,15 @@ export class RepeatNodePrivate extends INodePrivate {
  * @extends Fragment
  */
 export class RepeatNode extends Fragment {
-    constructor($) {
-        super($ || new RepeatNodePrivate);
+    constructor(input, $) {
+        super(input, $);
         /**
          * If false will use timeout executor, otherwise the app executor
          */
         this.freezeUi = true;
-        this.slot = new Slot;
     }
-    createChild(id, item, before) {
-        // TODO: Refactor: remove @ts-ignore
-        const node = new Fragment();
+    createChild(opts, id, item, before) {
+        const node = new Fragment({});
         this.destroyChild(id, item);
         if (before) {
             this.children.add(node);
@@ -53,16 +49,8 @@ export class RepeatNode extends Fragment {
         this.lastChild = node;
         node.preinit(this.$.app, this);
         node.init();
-        const callback = () => {
-            this.slot.release(node, item, id);
-            node.ready();
-        };
-        if (this.freezeUi) {
-            this.$.app.run.callCallback(callback);
-        }
-        else {
-            timeoutExecutor.callCallback(callback);
-        }
+        opts.slot && opts.slot(node, item, id);
+        node.ready();
         this.$.nodes.set(id, node);
     }
     destroyChild(id, item) {
@@ -70,7 +58,7 @@ export 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);
         }

package/lib/views/set-view.js

@@ -5,18 +5,11 @@ import { BaseView } from "./base-view";
  * @extends BaseView
  */
 export class SetView extends BaseView {
-    constructor(model) {
-        super();
-        this.model = model;
-    }
-    ready() {
-        const $ = this.$;
-        const set = this.model;
+    compose(input) {
+        super.compose(input);
+        const set = input.model;
         set.forEach(item => {
-            $.app.run.callCallback(() => {
-                this.createChild(item, item);
-            });
+            this.createChild(input, item, item);
         });
-        super.ready();
     }
 }

package/package.json

@@ -3,7 +3,7 @@
   "description": "Vasille - Safe. Fast. Powerful.",
   "main": "lib/index.js",
   "types": "types/index.d.ts",
-  "version": "2.0.5",
+  "version": "2.2.2",
   "exports": {
     "import": "./lib/index.js",
     "browser": "./lib/index.js"
@@ -15,6 +15,7 @@
     "test": "jest",
     "test-coverage": "jest --coverage",
     "update-types": "tsc --build tsconfig-types.json",
+    "update-flowjs": "node flow-typed/create.js",
     "cdn-create": "node cdn/create.js",
     "es5-check": "es-check es5 cdn/*es5.js"
   },
@@ -45,6 +46,7 @@
     "@typescript-eslint/parser": "latest",
     "es-check": "latest",
     "eslint": "latest",
+    "flow-bin": "latest",
     "jest": "latest",
     "jsdom": "latest",
     "ts-jest": "latest",

package/types/binding/attribute.d.ts

@@ -6,12 +6,12 @@ import type { IValue } from "../core/ivalue";
  * @class AttributeBinding
  * @extends Binding
  */
-export declare class AttributeBinding extends Binding<string> {
+export declare class AttributeBinding extends Binding<string | number | boolean | null> {
     /**
      * Constructs an attribute binding description
      * @param node {INode} the vasille node
      * @param name {String} the name of attribute
      * @param value {IValue} value to bind
      */
-    constructor(node: INode, name: string, value: IValue<string>);
+    constructor(node: INode, name: string, value: IValue<string | number | boolean | null>);
 }

package/types/binding/binding.d.ts

@@ -17,5 +17,5 @@ export declare class Binding<T> extends Destroyable {
     /**
      * Just clear bindings
      */
-    destroy(): void;
+    $destroy(): void;
 }