vasille 2.0.1 → 2.0.5

package/lib/node/watch.js

@@ -9,19 +9,19 @@ export class Watch extends Fragment {
     constructor() {
         super();
         this.slot = new Slot;
-        this.model = this.$ref(null);
-        this.$seal();
+        this.model = this.ref(null);
+        this.seal();
     }
-    $createWatchers() {
-        this.$watch((value) => {
-            this.$children.forEach(child => {
-                child.$destroy();
+    createWatchers() {
+        this.watch((value) => {
+            this.children.forEach(child => {
+                child.destroy();
             });
-            this.$children.splice(0);
+            this.children.clear();
             this.slot.release(this, value);
         }, this.model);
     }
-    $compose() {
+    compose() {
         this.slot.release(this, this.model.$);
     }
 }

package/lib/value/expression.js

@@ -37,7 +37,7 @@ export class Expression extends IValue {
         else {
             handler();
         }
-        this.$seal();
+        this.seal();
     }
     get $() {
         return this.sync.$;
@@ -73,11 +73,11 @@ export class Expression extends IValue {
         }
         return this;
     }
-    $destroy() {
+    destroy() {
         this.disable();
         this.values.splice(0);
         this.valuesCache.splice(0);
         this.linkedFunc.splice(0);
-        super.$destroy();
+        super.destroy();
     }
 }

package/lib/value/mirror.js

@@ -19,7 +19,7 @@ export class Mirror extends Reference {
         this.pointedValue = value;
         this.forwardOnly = forwardOnly;
         value.on(this.handler);
-        this.$seal();
+        this.seal();
     }
     get $() {
         // this is a ts bug
@@ -28,13 +28,13 @@ export class Mirror extends Reference {
         return super.$;
     }
     set $(v) {
+        if (!this.forwardOnly) {
+            this.pointedValue.$ = v;
+        }
         // this is a ts bug
         // eslint-disable-next-line
         // @ts-ignore
         super.$ = v;
-        if (!this.forwardOnly) {
-            this.pointedValue.$ = v;
-        }
     }
     enable() {
         if (!this.isEnabled) {
@@ -42,17 +42,15 @@ export class Mirror extends Reference {
             this.pointedValue.on(this.handler);
             this.$ = this.pointedValue.$;
         }
-        return this;
     }
     disable() {
         if (this.isEnabled) {
             this.pointedValue.off(this.handler);
             this.isEnabled = false;
         }
-        return this;
     }
-    $destroy() {
+    destroy() {
         this.disable();
-        super.$destroy();
+        super.destroy();
     }
 }

package/lib/value/reference.js

@@ -12,7 +12,7 @@ export class Reference extends IValue {
         super(true);
         this.value = value;
         this.onchange = new Set;
-        this.$seal();
+        this.seal();
     }
     get $() {
         return this.value;
@@ -34,22 +34,18 @@ export class Reference extends IValue {
             });
             this.isEnabled = true;
         }
-        return this;
     }
     disable() {
         this.isEnabled = false;
-        return this;
     }
     on(handler) {
         this.onchange.add(handler);
-        return this;
     }
     off(handler) {
         this.onchange.delete(handler);
-        return this;
     }
-    $destroy() {
-        super.$destroy();
+    destroy() {
+        super.destroy();
         this.onchange.clear();
     }
 }

package/lib/views/array-view.js

@@ -1,23 +1,21 @@
 import { BaseView } from "./base-view";
-import { ArrayModel } from "../models/array-model";
 /**
  * Represents a view of an array model
  * @class ArrayView
  * @extends BaseView
  */
 export class ArrayView extends BaseView {
-    constructor() {
+    constructor(model) {
         super();
-        this.model = new ArrayModel;
-        this.$seal();
+        this.model = model;
     }
     createChild(id, item, before) {
         super.createChild(item, item, before || this.$.nodes.get(id));
     }
-    $ready() {
+    ready() {
         this.model.forEach(item => {
             this.createChild(item, item);
         });
-        super.$ready();
+        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();
     }
 }
 /**
@@ -26,24 +26,24 @@ export class BaseView extends RepeatNode {
         $.removeHandler = (id, item) => {
             this.destroyChild(id, item);
         };
-        this.$seal();
+        this.seal();
     }
     /**
      * Handle ready event
      */
-    $ready() {
+    ready() {
         const $ = this.$;
         this.model.listener.onAdd($.addHandler);
         this.model.listener.onRemove($.removeHandler);
-        super.$ready();
+        super.ready();
     }
     /**
      * Handles destroy event
      */
-    $destroy() {
+    destroy() {
         const $ = this.$;
         this.model.listener.offAdd($.addHandler);
         this.model.listener.offRemove($.removeHandler);
-        super.$destroy();
+        super.destroy();
     }
 }

package/lib/views/map-view.js

@@ -1,20 +1,19 @@
 import { BaseView } from "./base-view";
-import { MapModel } from "../models/map-model";
 /**
  * Create a children pack for each map value
  * @class MapView
  * @extends BaseView
  */
 export class MapView extends BaseView {
-    constructor() {
+    constructor(model) {
         super();
-        this.model = new MapModel;
+        this.model = model;
     }
-    $ready() {
+    ready() {
         const map = this.model;
         map.forEach((value, key) => {
             this.createChild(key, value);
         });
-        super.$ready();
+        super.ready();
     }
 }

package/lib/views/object-view.js

@@ -1,20 +1,19 @@
 import { BaseView } from "./base-view";
-import { ObjectModel } from "../models/object-model";
 /**
  * Create a children pack for each object field
  * @class ObjectView
  * @extends BaseView
  */
 export class ObjectView extends BaseView {
-    constructor() {
+    constructor(model) {
         super();
-        this.model = new ObjectModel;
+        this.model = model;
     }
-    $ready() {
+    ready() {
         const obj = this.model;
         for (const key in obj) {
             this.createChild(key, obj[key]);
         }
-        super.$ready();
+        super.ready();
     }
 }

package/lib/views/repeat-node.js

@@ -14,11 +14,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();
     }
 }
 /**
@@ -38,43 +38,27 @@ export class RepeatNode extends Fragment {
     createChild(id, item, before) {
         // TODO: Refactor: remove @ts-ignore
         const node = new Fragment();
-        // eslint-disable-next-line
-        // @ts-ignore
-        const $ = node.$;
         this.destroyChild(id, item);
         if (before) {
-            $.next = before;
-            // eslint-disable-next-line
-            // @ts-ignore
-            $.prev = before.$.prev;
-            // eslint-disable-next-line
-            // @ts-ignore
-            before.$.prev = node;
-            if ($.prev) {
-                // eslint-disable-next-line
-                // @ts-ignore
-                $.prev.$.next = node;
-            }
-            this.$children.splice(this.$children.indexOf(before), 0, node);
+            this.children.add(node);
+            before.insertBefore(node);
         }
         else {
-            const lastChild = this.$children[this.$children.length - 1];
+            const lastChild = this.lastChild;
             if (lastChild) {
-                // eslint-disable-next-line
-                // @ts-ignore
-                lastChild.$.next = node;
+                lastChild.insertAfter(node);
             }
-            $.prev = lastChild;
-            this.$children.push(node);
+            this.children.add(node);
         }
-        node.$preinit(this.$.app, this);
-        node.$init();
+        this.lastChild = node;
+        node.preinit(this.$.app, this);
+        node.init();
         const callback = () => {
             this.slot.release(node, item, id);
-            node.$ready();
+            node.ready();
         };
         if (this.freezeUi) {
-            this.$.app.$run.callCallback(callback);
+            this.$.app.run.callCallback(callback);
         }
         else {
             timeoutExecutor.callCallback(callback);
@@ -85,22 +69,10 @@ export class RepeatNode extends Fragment {
         const $ = this.$;
         const child = $.nodes.get(id);
         if (child) {
-            // eslint-disable-next-line
-            // @ts-ignore
-            const $ = child.$;
-            if ($.prev) {
-                // eslint-disable-next-line
-                // @ts-ignore
-                $.prev.$.next = $.next;
-            }
-            if ($.next) {
-                // eslint-disable-next-line
-                // @ts-ignore
-                $.next.$.prev = $.prev;
-            }
-            child.$destroy();
+            child.remove();
+            child.destroy();
             this.$.nodes.delete(id);
-            this.$children.splice(this.$children.indexOf(child), 1);
+            this.children.delete(child);
         }
     }
 }

package/lib/views/repeater.js

@@ -12,7 +12,7 @@ export class RepeaterPrivate extends RepeatNodePrivate {
          * Current count of child nodes
          */
         this.currentCount = 0;
-        this.$seal();
+        this.seal();
     }
 }
 /**
@@ -27,7 +27,7 @@ export class Repeater extends RepeatNode {
          * The count of children
          */
         this.count = new Reference(0);
-        this.$seal();
+        this.seal();
     }
     /**
      * Changes the children count
@@ -46,18 +46,18 @@ export class Repeater extends RepeatNode {
         }
         $.currentCount = number;
     }
-    $created() {
+    created() {
         const $ = this.$;
-        super.$created();
+        super.created();
         $.updateHandler = this.changeCount.bind(this);
         this.count.on($.updateHandler);
     }
-    $ready() {
+    ready() {
         this.changeCount(this.count.$);
     }
-    $destroy() {
+    destroy() {
         const $ = this.$;
-        super.$destroy();
+        super.destroy();
         this.count.off($.updateHandler);
     }
 }

package/lib/views/set-view.js

@@ -1,23 +1,22 @@
 import { BaseView } from "./base-view";
-import { SetModel } from "../models/set-model";
 /**
  * Create a children pack for each set value
  * @class SetView
  * @extends BaseView
  */
 export class SetView extends BaseView {
-    constructor() {
+    constructor(model) {
         super();
-        this.model = new SetModel();
+        this.model = model;
     }
-    $ready() {
+    ready() {
         const $ = this.$;
         const set = this.model;
         set.forEach(item => {
-            $.app.$run.callCallback(() => {
+            $.app.run.callCallback(() => {
                 this.createChild(item, item);
             });
         });
-        super.$ready();
+        super.ready();
     }
 }

package/package.json

@@ -3,27 +3,32 @@
   "description": "Vasille - Safe. Fast. Powerful.",
   "main": "lib/index.js",
   "types": "types/index.d.ts",
-  "version": "2.0.1",
+  "version": "2.0.5",
   "exports": {
     "import": "./lib/index.js",
     "browser": "./lib/index.js"
   },
+  "unpkg": "./cdn/es2015.js",
   "scripts": {
-    "prepack": "tsc --build tsconfig-build.json",
     "build": "tsc --build tsconfig-build.json",
+    "build-es5": "tsc --build tsconfig-build-es5.json",
     "test": "jest",
     "test-coverage": "jest --coverage",
-    "update-types": "tsc --build tsconfig-types.json"
+    "update-types": "tsc --build tsconfig-types.json",
+    "cdn-create": "node cdn/create.js",
+    "es5-check": "es-check es5 cdn/*es5.js"
   },
   "repository": {
     "type": "git",
     "url": "https://gitlab.com/vasille-js/vasille-js.git"
   },
   "keywords": [
-    "javascript",
-    "framework",
-    "frontend",
-    "fast"
+    "front-end",
+    "web",
+    "app",
+    "safe",
+    "fast",
+    "poweful"
   ],
   "author": "Vasile Lixcode <lixcode@vivaldi.net> (https://t.me/lixcode)",
   "license": "MIT",
@@ -38,6 +43,7 @@
     "@types/node": "latest",
     "@typescript-eslint/eslint-plugin": "latest",
     "@typescript-eslint/parser": "latest",
+    "es-check": "latest",
     "eslint": "latest",
     "jest": "latest",
     "jsdom": "latest",

package/types/binding/attribute.d.ts

@@ -14,10 +14,4 @@ export declare class AttributeBinding extends Binding<string> {
      * @param value {IValue} value to bind
      */
     constructor(node: INode, name: string, value: IValue<string>);
-    /**
-     * Generates a function which updates the attribute value
-     * @param name {String} The name of attribute
-     * @returns {Function} a function which will update attribute value
-     */
-    protected bound(name: string): (node: INode, value: string) => void;
 }

package/types/binding/binding.d.ts

@@ -1,6 +1,5 @@
 import { Destroyable } from "../core/destroyable";
 import type { IValue } from "../core/ivalue";
-import type { INode } from "../node/node";
 /**
  * Describe a common binding logic
  * @class Binding
@@ -8,23 +7,15 @@ import type { INode } from "../node/node";
  */
 export declare class Binding<T> extends Destroyable {
     private binding;
-    private readonly updateFunc;
+    private func;
     /**
      * Constructs a common binding logic
-     * @param node {INode} the vasille node
-     * @param name {String} the name of property/attribute/class
      * @param value {IValue} the value to bind
      */
-    constructor(node: INode, name: string, value: IValue<T>);
-    /**
-     * Is a virtual function to get the specific bind function
-     * @param name {String} the name of attribute/property
-     * @returns {Function} a function to update attribute/property value
-     * @throws Always throws and must be overloaded in child class
-     */
-    protected bound(name: string): (node: INode, value: T) => void;
+    constructor(value: IValue<T>);
+    protected init(bounded: (v: T) => void): void;
     /**
      * Just clear bindings
      */
-    $destroy(): void;
+    destroy(): void;
 }

package/types/binding/class.d.ts

@@ -1,23 +1,11 @@
 import { Binding } from "./binding";
 import type { INode } from "../node/node";
 import type { IValue } from "../core/ivalue";
-/**
- * Represents a HTML class binding description
- * @class ClassBinding
- * @extends Binding
- */
-export declare class ClassBinding extends Binding<string | boolean> {
-    /**
-     * Constructs an HTML class binding description
-     * @param node {INode} the vasille node
-     * @param name {String} the name of class
-     * @param value {IValue} the value to bind
-     */
-    constructor(node: INode, name: string, value: IValue<string | boolean>);
-    /**
-     * Generates a function which updates the html class value
-     * @param name {String} The name of attribute
-     * @returns {Function} a function which will update attribute value
-     */
-    protected bound(name: string): (node: INode, value: string | boolean) => void;
+export declare class StaticClassBinding extends Binding<boolean> {
+    private current;
+    constructor(node: INode, name: string, value: IValue<boolean>);
+}
+export declare class DynamicalClassBinding extends Binding<string> {
+    private current;
+    constructor(node: INode, value: IValue<string>);
 }

package/types/binding/style.d.ts

@@ -14,10 +14,4 @@ export declare class StyleBinding extends Binding<string> {
      * @param value {IValue} the value to bind
      */
     constructor(node: INode, name: string, value: IValue<string>);
-    /**
-     * Generates a function to update style property value
-     * @param name {string}
-     * @returns {Function} a function to update style property
-     */
-    protected bound(name: string): (node: INode, value: string) => void;
 }