vasille 3.1.0 → 3.2.1

package/README.md

@@ -11,7 +11,7 @@
 * [Installation](#installation)
 * [How to use Vasille](#how-to-use-vasille)
 * [How SAFE is Vasille](#how-safe-is-vasille)
-* [How SIMPLE is Vasille](#how-simple-is-vasille)
+* [How INTUITIVE is Vasille](#how-intuitive-is-vasille)
 * [How POWERFUL is Vasille](#how-powerful-is-vasille)
 * [Road Map](#road-map)
 
@@ -44,6 +44,7 @@ $ npx degit vasille-js/example-javascript my-project
 
 ### Full documentation:
 * [Learn `Vasille` in 5 minutes](https://github.com/vasille-js/vasille-js/blob/v3/doc/V3-API.md)
+* [Vasille Router Documentation](https://github.com/vasille-js/vasille-js/blob/v3/doc/Router-API.md)
 
 ### Examples
 * [TypeScript Example](https://github.com/vasille-js/example-typescript)
@@ -60,7 +61,7 @@ The safe of your application is ensured by
 * `strong typing` makes your javascript/typescript code safe as C++ code.
 All entities of `vasille` core library are strongly typed, including:
   * data fields & properties.
-  * computed properties (function parameters & result).
+  * computed properties (function parameters and result).
   * methods.
   * events (defined handlers & event emit).
   * DOM events & DOM operation (attributing, styling, etc.).
@@ -68,7 +69,7 @@ All entities of `vasille` core library are strongly typed, including:
   * references to children.
 * No asynchronous code, when the line of code is executed, the DOM and reactive things are already synced.
 
-## How SIMPLE is Vasille
+## How INTUITIVE is Vasille
 
 There is the "Hello World":
 ```typescript jsx
@@ -105,7 +106,7 @@ All of these are supported:
 * [x] Develop the `Vasille Babel Plugin`.
 * [x] `100%` Test Coverage fot babel plugin.
 * [x] Add CSS support (define styles in components).
-* [ ] Add router.
+* [x] Add router.
 * [ ] Add SSR (server side rendering).
 * [ ] Develop tools extension for debugging.
 

package/lib/core/core.js

@@ -10,11 +10,6 @@ import { OwningPointer, Pointer } from "../value/pointer.js";
 export class Reactive extends Destroyable {
     constructor(input) {
         super();
-        /**
-         * A list of user-defined values
-         * @type {Set}
-         */
-        this._watch = new Set();
         /**
          * A list of user-defined bindings
          * @type {Set}
@@ -30,7 +25,7 @@ export class Reactive extends Destroyable {
      */
     ref(value, name) {
         const ref = new Reference(value);
-        this._watch.add(ref);
+        this.bindings.add(ref);
         if (name) {
             this.addState("ref", name, ref);
         }
@@ -43,7 +38,7 @@ export class Reactive extends Destroyable {
      */
     forward(value, name) {
         const mirror = new Pointer(value);
-        this._watch.add(mirror);
+        this.bindings.add(mirror);
         if (name) {
             this.addState("forward", name, mirror);
         }
@@ -56,7 +51,8 @@ export class Reactive extends Destroyable {
      */
     own(value, name) {
         const pointer = new OwningPointer(value);
-        this._watch.add(pointer);
+        this.bindings.add(pointer);
+        /* istanbul ignore else */
         if (name) {
             this.addState("own", name, pointer);
         }
@@ -81,7 +77,7 @@ export class Reactive extends Destroyable {
      * @param values
      */
     watch(func, values) {
-        this._watch.add(new Expression(func, values));
+        this.bindings.add(new Expression(func, values));
     }
     /**
      * Creates a computed value
@@ -92,7 +88,7 @@ export class Reactive extends Destroyable {
      */
     expr(func, values, name) {
         const res = new Expression(func, values);
-        this._watch.add(res);
+        this.bindings.add(res);
         if (name) {
             this.addState("expr", name, res);
         }
@@ -110,8 +106,6 @@ export class Reactive extends Destroyable {
     }
     destroy() {
         super.destroy();
-        this._watch.forEach(value => value.destroy());
-        this._watch.clear();
         this.bindings.forEach(binding => binding.destroy());
         this.bindings.clear();
         this.onDestroy?.();

package/lib/models/array-model.js

@@ -27,9 +27,11 @@ export class ArrayModel extends Array {
      */
     fill(value, start, end) {
         this.passive = true;
+        /* istanbul ignore else */
         if (!start) {
             start = 0;
         }
+        /* istanbul ignore else */
         if (!end) {
             end = this.length;
         }
@@ -48,6 +50,7 @@ export class ArrayModel extends Array {
     pop() {
         this.passive = true;
         const v = super.pop();
+        /* istanbul ignore else */
         if (v !== undefined) {
             this.listener.emitRemoved(v, v);
         }
@@ -75,6 +78,7 @@ export class ArrayModel extends Array {
     shift() {
         this.passive = true;
         const v = super.shift();
+        /* istanbul ignore else */
         if (v !== undefined) {
             this.listener.emitRemoved(v, v);
         }
@@ -95,6 +99,7 @@ export class ArrayModel extends Array {
         const before = this[start + deleteCount];
         for (let i = 0; i < deleteCount; i++) {
             const index = start + deleteCount - i - 1;
+            /* istanbul ignore else */
             if (this[index] !== undefined) {
                 this.listener.emitRemoved(this[index], this[index]);
             }

package/lib/models/map-model.js

@@ -33,6 +33,7 @@ export class MapModel extends Map {
      */
     delete(key) {
         const tmp = super.get(key);
+        /* istanbul ignore else */
         if (tmp) {
             this.listener.emitRemoved(key, tmp);
         }

package/lib/models/set-model.js

@@ -23,6 +23,7 @@ export class SetModel extends Set {
      * @return {this} a pointer to this
      */
     add(value) {
+        /* istanbul ignore else */
         if (!super.has(value)) {
             this.listener.emitAdded(value, value);
             super.add(value);

package/lib/node/node.js

@@ -33,6 +33,7 @@ export class Root extends Reactive {
         let first;
         for (const child of this.children) {
             first = child.findFirstChild();
+            /* istanbul ignore else */
             if (first) {
                 break;
             }
@@ -322,6 +323,7 @@ export class DebugNode extends Fragment {
         super(input, runner, ":debug");
     }
     destroy() {
+        /* istanbul ignore else */
         if (this.handler) {
             this.input.text.off(this.handler);
         }

package/lib/runner/web/binding/class.js

@@ -27,10 +27,12 @@ export class DynamicalClassBinding extends Binding {
         super(value);
         this.current = "";
         this.init((value) => {
+            /* istanbul ignore else */
             if (this.current != value) {
                 if (this.current.length) {
                     removeClass(node, this.current);
                 }
+                /* istanbul ignore else */
                 if (value.length) {
                     addClass(node, value);
                 }

package/lib/runner/web/binding/style.js

@@ -23,6 +23,7 @@ export class StyleBinding extends Binding {
     constructor(node, name, value) {
         super(value);
         this.init(value => {
+            /* istanbul ignore else */
             if (node.element instanceof HTMLElement) {
                 node.element.style.setProperty(name, stringifyStyleValue(value));
             }

package/lib/runner/web/runner.js

@@ -65,7 +65,9 @@ export class Tag extends AbstractTag {
                     this.register(new AttributeBinding(this, name, value));
                 }
                 else {
+                    /* istanbul ignore else */
                     if (typeof value === "boolean") {
+                        /* istanbul ignore else */
                         if (value) {
                             this.node.setAttribute(name, "");
                         }
@@ -140,6 +142,7 @@ export class Runner {
     }
     insertBefore(node, before) {
         const parent = before.parentElement;
+        /* istanbul ignore else */
         if (parent) {
             parent.insertBefore(node, before);
         }

package/lib/value/expression.js

@@ -19,6 +19,7 @@ export class Expression extends IValue {
          */
         this.linkedFunc = [];
         const handler = (i) => {
+            /* istanbul ignore else */
             if (typeof i === "number") {
                 this.valuesCache[i] = this.values[i].$;
             }

package/lib/value/pointer.js

@@ -31,6 +31,7 @@ export class Pointer extends IValue {
         return this.reference.$;
     }
     set $$(v) {
+        /* istanbul ignore else */
         if (this.target !== v) {
             this.disconnectTarget();
         }

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "vasille",
-  "description": "The first Developer eXperience orientated front-end framework (core library).",
+  "description": "The first Developer eXperience Orientated front-end framework (core library).",
   "main": "lib/index.js",
   "types": "types/index.d.ts",
-  "version": "3.1.0",
+  "version": "3.2.1",
   "exports": {
     ".": {
       "types": "./types/index.d.ts",

package/types/core/core.d.ts

@@ -8,11 +8,6 @@ import { Pointer } from "../value/pointer.js";
  * @extends Destroyable
  */
 export declare class Reactive<T extends object = object> extends Destroyable {
-    /**
-     * A list of user-defined values
-     * @type {Set}
-     */
-    private _watch;
     /**
      * A list of user-defined bindings
      * @type {Set}