vasille 2.2.0 → 2.3.0

package/flow-typed/vasille.js

@@ -11,16 +11,16 @@ declare class Mirror<T> extends Reference<T> {
      * pointed value
      * @type IValue
      */
-    pointedValue: IValue<T>;
+    $pointedValue: IValue<T>;
     /**
      * Collection of handlers
      * @type Set
      */
-    handler: any;
+    $handler;
     /**
      * Ensure forward only synchronization
      */
-    forwardOnly: boolean;
+    $forwardOnly: boolean;
     /**
      * Constructs a notifiable bind to a value
      * @param value {IValue} is initial value
@@ -29,9 +29,9 @@ declare class Mirror<T> extends Reference<T> {
     constructor(value: IValue<T>, forwardOnly?: boolean): void;
     get $(): T;
     set $(v: T): void;
-    enable(): void;
-    disable(): void;
-    destroy(): void;
+    $enable(): void;
+    $disable(): void;
+    $destroy(): void;
 }
 
 
@@ -73,11 +73,11 @@ declare class Expression<T,Args> extends IValue<T> {
     constructor(func: (...args: Args) => T, link: boolean, ...values: KindOfIValue<Args>): void;
     get $(): T;
     set $(value: T): void;
-    on(handler: (value: T) => void): this;
-    off(handler: (value: T) => void): this;
-    enable(): this;
-    disable(): this;
-    destroy(): void;
+    $on(handler: (value: T) => void): this;
+    $off(handler: (value: T) => void): this;
+    $enable(): this;
+    $disable(): this;
+    $destroy(): void;
 }
 
 
@@ -91,24 +91,24 @@ declare class Reference<T> extends IValue<T> {
      * The encapsulated value
      * @type {*}
      */
-    value: any;
+    $value;
     /**
      * Array of handlers
      * @type {Set}
      * @readonly
      */
-    onchange: any;
+    $onchange;
     /**
      * @param value {any} the initial value
      */
     constructor(value: T): void;
     get $(): T;
     set $(value: T): void;
-    enable(): void;
-    disable(): void;
-    on(handler: (value: T) => void): void;
-    off(handler: (value: T) => void): void;
-    destroy(): void;
+    $enable(): void;
+    $disable(): void;
+    $on(handler: (value: T) => void): void;
+    $off(handler: (value: T) => void): void;
+    $destroy(): void;
 }
 
 
@@ -127,7 +127,7 @@ declare class Pointer<T> extends Mirror<T> {
      * Point a new ivalue
      * @param value {IValue} value to point
      */
-    point(value: IValue<T>): void;
+    set $$(value: IValue<T>): void;
 }
 
 
@@ -163,9 +163,9 @@ declare class RepeatNodePrivate<IdT> extends INodePrivate {
      */
     nodes: Map<IdT, Fragment>;
     constructor(): void;
-    destroy(): void;
+    $destroy(): void;
 }
-declare interface RNO<T, IdT> extends Options {
+declare interface RNO<T, IdT> extends FragmentOptions {
     slot?: (node: Fragment, value: T, index: IdT) => void;
 }
 /**
@@ -268,12 +268,12 @@ declare class ObjectModel<T> extends Object implements ListenableModel<string, T
      * @return {ObjectModel} a pointer to this
      */
     set(key: string, v: T): this;
+    get values(): Record<string, T>;
     /**
      * Deletes an object property
      * @param key {string} property name
      */
     delete(key: string): void;
-    proxy(): Record<string, T>;
     enableReactivity(): void;
     disableReactivity(): void;
 }
@@ -325,7 +325,6 @@ declare class ArrayModel<T> extends Array<T> implements ListenableModel<T, T> {
      * @param data {Array} input data
      */
     constructor(data?: Array<T>): void;
-    proxy(): ArrayModel<T>;
     /**
      * Gets the last item of array
      * @return {*} the last item of array
@@ -413,6 +412,7 @@ declare class ArrayModel<T> extends Array<T> implements ListenableModel<T, T> {
      * @return {this}
      */
     removeOne(v: T): this;
+    replace(at: number, with_: T): this;
     enableReactivity(): void;
     disableReactivity(): void;
 }
@@ -550,7 +550,7 @@ declare interface ListenableModel<K, T> extends IModel {
 }
 
 
-declare interface WatchOptions<T> extends Options {
+declare interface WatchOptions<T> extends FragmentOptions {
     model: IValue<T>;
     slot?: (node: Fragment, value: T) => void;
 }
@@ -602,7 +602,7 @@ declare class FragmentPrivate extends ReactivePrivate {
     /**
      * Unlinks all bindings
      */
-    destroy(): void;
+    $destroy(): void;
 }
 /**
  * This class is symbolic
@@ -637,7 +637,8 @@ declare class Fragment<T> extends Reactive {
      * @param data {*} additional data
      */
     preinit(app: AppNode, parent: Fragment, data?: any): void;
-    compose(input: Options): void;
+    init(): T['return'];
+    compose(input: T): void;
     /** To be overloaded: ready event handler */
     ready(): void;
     /**
@@ -681,7 +682,7 @@ declare class Fragment<T> extends Reactive {
      * @param node {Fragment} vasille element to insert
      * @param callback {function($ : *)}
      */
-    create<T>(node: T, callback?: T['input']['slot']): void;
+    create<T>(node: T, callback?: T['input']['slot']): T['input']['return'];
     /**
      * Defines an if node
      * @param cond {IValue} condition
@@ -712,7 +713,7 @@ declare class Fragment<T> extends Reactive {
     insertBefore(node: Fragment): void;
     insertAfter(node: Fragment): void;
     remove(): void;
-    destroy(): void;
+    $destroy(): void;
 }
 /**
  * The part of a text node
@@ -732,7 +733,7 @@ declare class TextNodePrivate extends FragmentPrivate {
     /**
      * Clear node data
      */
-    destroy(): void;
+    $destroy(): void;
 }
 /**
  * Represents a text node
@@ -744,7 +745,7 @@ declare class TextNode extends Fragment {
     constructor($?: TextNodePrivate): void;
     preinit(app: AppNode, parent: Fragment, text?: IValue<string> | string): void;
     findFirstChild(): Node;
-    destroy(): void;
+    $destroy(): void;
 }
 /**
  * The part of a base node
@@ -763,7 +764,7 @@ declare class INodePrivate extends FragmentPrivate {
      */
     node: Element;
     constructor(): void;
-    destroy(): void;
+    $destroy(): void;
 }
 /**
  * Vasille node which can manipulate an element node
@@ -870,7 +871,7 @@ declare class Tag<K> extends INode<TagOptionsWithSlot<K>> {
     /**
      * Runs GC
      */
-    destroy(): void;
+    $destroy(): void;
 }
 /**
  * Represents a vasille extension node
@@ -879,7 +880,8 @@ declare class Tag<K> extends INode<TagOptionsWithSlot<K>> {
  */
 declare class Extension<T> extends INode<T> {
     preinit(app: AppNode, parent: Fragment): void;
-    destroy(): void;
+    extend(options: T): void;
+    $destroy(): void;
 }
 /**
  * Node which cas has just a child
@@ -887,6 +889,7 @@ declare class Extension<T> extends INode<T> {
  * @extends Extension
  */
 declare class Component<T> extends Extension<T> {
+    init(): void;
     ready(): void;
     preinit(app: AppNode, parent: Fragment): void;
 }
@@ -918,7 +921,7 @@ declare class SwitchedNodePrivate extends FragmentPrivate {
     /**
      * Runs GC
      */
-    destroy(): void;
+    $destroy(): void;
 }
 /**
  * Defines a node witch can switch its children conditionally
@@ -939,7 +942,7 @@ declare class SwitchedNode extends Fragment {
      */
     createChild(cb: (node: Fragment) => void): void;
     ready(): void;
-    destroy(): void;
+    $destroy(): void;
 }
 /**
  * The part of a text node
@@ -957,7 +960,7 @@ declare class DebugPrivate extends FragmentPrivate {
     /**
      * Clear node data
      */
-    destroy(): void;
+    $destroy(): void;
 }
 /**
  * Represents a debug node
@@ -975,7 +978,7 @@ declare class DebugNode extends Fragment {
     /**
      * Runs garbage collector
      */
-    destroy(): void;
+    $destroy(): void;
 }
 
 
@@ -1039,7 +1042,7 @@ declare class Binding<T> extends Destroyable {
     /**
      * Just clear bindings
      */
-    destroy(): void;
+    $destroy(): void;
 }
 
 
@@ -1128,13 +1131,13 @@ declare function debug(text: IValue<string>): void;
 declare function predefine<T>(slot: T | null | undefined, predefined: T): T;
 
 
-declare interface Options {
+declare interface FragmentOptions {
     "v:is"?: Record<string, IValue<any>>;
     return?: any;
     slot?: (node: Fragment, ...args: any[]) => void;
 }
 declare type AttrType<T> = IValue<T | string | null> | T | string | null | undefined;
-declare interface TagOptions<T> extends Options {
+declare interface TagOptions<T> extends FragmentOptions {
     "v:attr"?: {
         [K : string]:? AttrType<AcceptedTagsSpec[T]['attrs'][K]>;
     } & Record<string, AttrType<number | boolean>>;
@@ -1162,11 +1165,11 @@ declare class Destroyable {
      * Make object fields non configurable
      * @protected
      */
-    seal(): void;
+    $seal(): void;
     /**
      * Garbage collector method
      */
-    destroy(): void;
+    $destroy(): void;
 }
 
 
@@ -1180,11 +1183,11 @@ declare class Switchable extends Destroyable {
     /**
      * Enable update handlers triggering
      */
-    enable(): void;
+    $enable(): void;
     /**
      * disable update handlers triggering
      */
-    disable(): void;
+    $disable(): void;
 }
 /**
  * Interface which describes a value
@@ -1215,12 +1218,12 @@ declare class IValue<T> extends Switchable {
      * Add a new handler to value change
      * @param handler {function(value : *)} the handler to add
      */
-    on(handler: (value: T) => void): void;
+    $on(handler: (value: T) => void): void;
     /**
      * Removes a handler of value change
      * @param handler {function(value : *)} the handler to remove
      */
-    off(handler: (value: T) => void): void;
+    $off(handler: (value: T) => void): void;
 }
 
 
@@ -1267,7 +1270,7 @@ declare class ReactivePrivate extends Destroyable {
     parent: Reactive;
     onDestroy?: () => void;
     constructor(): void;
-    destroy(): void;
+    $destroy(): void;
 }
 /**
  * A reactive object
@@ -1340,12 +1343,14 @@ declare class Reactive<T> extends Destroyable {
      * @param onOn {function} on hide feedback
      */
     bindAlive(cond: IValue<boolean>, onOff?: () => void, onOn?: () => void): this;
-    init(): void;
+    init(): T['return'];
     applyOptions(input: T): void;
-    compose(input: T): void;
+    applyOptionsNow(): void;
+    compose(input: T): T['return'];
+    composeNow(): void;
     runFunctional<F>(f: F, ...args: Parameters<F>): ReturnType<F>;
     runOnDestroy(func: () => void): void;
-    destroy(): void;
+    $destroy(): void;
 }
 
 

package/lib/binding/attribute.js

@@ -26,6 +26,6 @@ export class AttributeBinding extends Binding {
                 node.node.removeAttribute(name);
             }
         });
-        this.seal();
+        this.$seal();
     }
 }

package/lib/binding/binding.js

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

package/lib/binding/class.js

@@ -20,7 +20,7 @@ export class StaticClassBinding extends Binding {
                 this.current = value;
             }
         });
-        this.seal();
+        this.$seal();
     }
 }
 export class DynamicalClassBinding extends Binding {
@@ -38,6 +38,6 @@ export class DynamicalClassBinding extends Binding {
                 this.current = value;
             }
         });
-        this.seal();
+        this.$seal();
     }
 }

package/lib/binding/style.js

@@ -18,6 +18,6 @@ export class StyleBinding extends Binding {
                 node.node.style.setProperty(name, value);
             }
         });
-        this.seal();
+        this.$seal();
     }
 }

package/lib/core/core.js

@@ -1,5 +1,5 @@
 import { Destroyable } from "./destroyable.js";
-import { wrongBinding } from "./errors";
+import { notOverwritten, wrongBinding } from "./errors";
 import { Expression } from "../value/expression";
 import { Reference } from "../value/reference";
 import { Pointer } from "../value/pointer";
@@ -45,18 +45,18 @@ export 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();
     }
 }
 /**
@@ -69,7 +69,7 @@ export class Reactive extends Destroyable {
         super();
         this.input = input;
         this.$ = $ || new ReactivePrivate;
-        this.seal();
+        this.$seal();
     }
     /**
      * Get parent node
@@ -152,7 +152,7 @@ export class Reactive extends Destroyable {
         const $ = this.$;
         if (!$.enabled) {
             $.watch.forEach(watcher => {
-                watcher.enable();
+                watcher.$enable();
             });
             $.models.forEach(model => {
                 model.enableReactivity();
@@ -167,7 +167,7 @@ export class Reactive extends Destroyable {
         const $ = this.$;
         if ($.enabled) {
             $.watch.forEach(watcher => {
-                watcher.disable();
+                watcher.$disable();
             });
             $.models.forEach(model => {
                 model.disableReactivity();
@@ -204,13 +204,19 @@ export class Reactive extends Destroyable {
     }
     init() {
         this.applyOptions(this.input);
-        this.compose(this.input);
+        return this.compose(this.input);
     }
     applyOptions(input) {
         // empty
     }
+    applyOptionsNow() {
+        this.applyOptions(this.input);
+    }
     compose(input) {
-        // empty
+        throw notOverwritten();
+    }
+    composeNow() {
+        this.compose(this.input);
     }
     runFunctional(f, ...args) {
         stack(this);
@@ -224,9 +230,9 @@ export class Reactive extends Destroyable {
     runOnDestroy(func) {
         this.$.onDestroy = func;
     }
-    destroy() {
-        super.destroy();
-        this.$.destroy();
+    $destroy() {
+        super.$destroy();
+        this.$.$destroy();
         this.$ = null;
     }
 }

package/lib/core/destroyable.js

@@ -7,7 +7,7 @@ export class Destroyable {
      * Make object fields non configurable
      * @protected
      */
-    seal() {
+    $seal() {
         const $ = this;
         Object.keys($).forEach(i => {
             // eslint-disable-next-line no-prototype-builtins
@@ -39,7 +39,7 @@ export class Destroyable {
     /**
      * Garbage collector method
      */
-    destroy() {
+    $destroy() {
         // nothing here
     }
 }

package/lib/core/ivalue.js

@@ -4,13 +4,13 @@ export class Switchable extends Destroyable {
     /**
      * Enable update handlers triggering
      */
-    enable() {
+    $enable() {
         throw notOverwritten();
     }
     /**
      * disable update handlers triggering
      */
-    disable() {
+    $disable() {
         throw notOverwritten();
     }
 }
@@ -45,14 +45,14 @@ export 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();
     }
 }

package/lib/functional/reactivity.js

@@ -25,7 +25,7 @@ export function valueOf(value) {
 }
 export function setValue(ref, value) {
     if (ref instanceof Pointer && value instanceof IValue) {
-        ref.point(value);
+        ref.$$ = value;
     }
     else {
         ref.$ = value instanceof IValue ? value.$ : value;

package/lib/index.js

@@ -6,7 +6,7 @@ import { Listener } from "./models/listener";
 import { MapModel } from "./models/map-model";
 import { ObjectModel } from "./models/object-model";
 import { SetModel } from "./models/set-model";
-import { App, AppNode } from "./node/app";
+import { App, AppNode, Portal } from "./node/app";
 import { Component, Extension, Fragment, INode, Tag } from "./node/node";
 import { Expression } from "./value/expression";
 import { Mirror } from "./value/mirror";
@@ -18,5 +18,4 @@ import { MapView } from "./views/map-view";
 import { ObjectView } from "./views/object-view";
 import { SetView } from "./views/set-view";
 import { Binding } from "./binding/binding";
-import * as libV from "./v/index";
-export { Destroyable, IValue, Reference, Mirror, Pointer, ArrayModel, MapModel, ObjectModel, SetModel, BaseView, Listener, ArrayView, MapView, ObjectView, SetView, Fragment, INode, Tag, Component, Extension, AppNode, App, Expression, Binding, Reactive, libV };
+export { Destroyable, IValue, Reference, Mirror, Pointer, ArrayModel, MapModel, ObjectModel, SetModel, BaseView, Listener, ArrayView, MapView, ObjectView, SetView, Fragment, INode, Tag, Component, Extension, AppNode, App, Portal, Expression, Binding, Reactive };

package/lib/models/array-model.js

@@ -19,15 +19,6 @@ export class ArrayModel extends Array {
             super.push(data[i]);
         }
     }
-    // proxy
-    proxy() {
-        return new Proxy(this, {
-            set(target, p, value) {
-                target.splice(parseInt(p), 1, value);
-                return true;
-            }
-        });
-    }
     /* Array members */
     /**
      * Gets the last item of array
@@ -208,6 +199,12 @@ export class ArrayModel extends Array {
         this.removeAt(this.indexOf(v));
         return this;
     }
+    replace(at, with_) {
+        this.listener.emitAdded(this[at], with_);
+        this.listener.emitRemoved(this[at], this[at]);
+        this[at] = with_;
+        return this;
+    }
     enableReactivity() {
         this.listener.enableReactivity();
     }

package/lib/models/object-model.js

@@ -56,6 +56,9 @@ export class ObjectModel extends Object {
         this.listener.emitAdded(key, this.container[key]);
         return this;
     }
+    get values() {
+        return this.container;
+    }
     /**
      * Deletes an object property
      * @param key {string} property name
@@ -66,23 +69,6 @@ export class ObjectModel extends Object {
             delete this.container[key];
         }
     }
-    proxy() {
-        // eslint-disable-next-line @typescript-eslint/no-this-alias
-        const ts = this;
-        return new Proxy(this.container, {
-            get(target, p) {
-                return ts.get(p);
-            },
-            set(target, p, value) {
-                ts.set(p, value);
-                return true;
-            },
-            deleteProperty(target, p) {
-                ts.delete(p);
-                return true;
-            }
-        });
-    }
     enableReactivity() {
         this.listener.enableReactivity();
     }

package/lib/node/app.js

@@ -11,7 +11,7 @@ export class AppNode extends INode {
     constructor(input) {
         super(input);
         this.debugUi = input.debugUi || false;
-        this.seal();
+        this.$seal();
     }
 }
 /**
@@ -30,7 +30,7 @@ export class App extends AppNode {
         this.$.node = node;
         this.preinit(this, this);
         this.init();
-        this.seal();
+        this.$seal();
     }
     appendNode(node) {
         this.$.node.appendChild(node);
@@ -40,7 +40,7 @@ export class Portal extends AppNode {
     constructor(input) {
         super(input);
         this.$.node = input.node;
-        this.seal();
+        this.$seal();
     }
     appendNode(node) {
         this.$.node.appendChild(node);