j-templates 6.1.11 → 7.0.0

package/Node/vNode.js

@@ -0,0 +1,296 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.vNode = void 0;
+const Store_1 = require("../Store");
+const injector_1 = require("../Utils/injector");
+const list_1 = require("../Utils/list");
+const thread_1 = require("../Utils/thread");
+const nodeConfig_1 = require("./nodeConfig");
+var vNode;
+(function (vNode) {
+    function Create(definition) {
+        return {
+            definition,
+            injector: injector_1.Injector.Current() ?? new injector_1.Injector(),
+            node: null,
+            children: null,
+            destroyed: false,
+            assignProperties: null,
+            assignEvents: null,
+            assignAttributes: null,
+            component: null,
+            scopes: []
+        };
+    }
+    vNode.Create = Create;
+    function Init(vnode) {
+        if (vnode.node !== null)
+            return;
+        InitNode(vnode);
+    }
+    vNode.Init = Init;
+    function InitAll(vnodes) {
+        for (let x = 0; x < vnodes.length; x++)
+            Init(vnodes[x]);
+    }
+    vNode.InitAll = InitAll;
+    function Destroy(vnode) {
+        if (vnode.destroyed)
+            return;
+        vnode.destroyed = true;
+        vnode.assignEvents?.(null);
+        vnode.component?.Destroy();
+        Store_1.ObservableScope.DestroyAll(vnode.scopes);
+        vnode.children && DestroyAll(vnode.children);
+    }
+    vNode.Destroy = Destroy;
+    function DestroyAll(vnodes) {
+        for (let x = 0; x < vnodes.length; x++)
+            Destroy(vnodes[x]);
+    }
+    vNode.DestroyAll = DestroyAll;
+    function ToFunction(type, namespace) {
+        return function (config, children) {
+            const childrenConfig = children ? Array.isArray(children) ? { childrenArray: children } : { children } : undefined;
+            const definition = Object.assign({
+                type,
+                namespace: namespace ?? null
+            }, config, childrenConfig);
+            return Create(definition);
+        };
+    }
+    vNode.ToFunction = ToFunction;
+    function Attach(node, vnode) {
+        Init(vnode);
+        nodeConfig_1.NodeConfig.addChild(node, vnode.node);
+        return vnode;
+    }
+    vNode.Attach = Attach;
+})(vNode || (exports.vNode = vNode = {}));
+function InitNode(vnode) {
+    const { type, namespace, props, attrs, on, data, componentConstructor, children, childrenArray } = vnode.definition;
+    const node = nodeConfig_1.NodeConfig.createNode(type, namespace);
+    vnode.node = node;
+    if (props) {
+        vnode.assignProperties = nodeConfig_1.NodeConfig.createPropertyAssignment(node);
+        if (typeof props === 'function') {
+            const scope = Store_1.ObservableScope.Create(props);
+            vnode.scopes.push(scope);
+            Store_1.ObservableScope.Watch(scope, CreateScheduledCallback(function () {
+                const value = Store_1.ObservableScope.Peek(scope);
+                vnode.assignProperties(value);
+            }));
+            const value = Store_1.ObservableScope.Peek(scope);
+            vnode.assignProperties(value);
+        }
+        else {
+            vnode.assignProperties(props);
+            vnode.assignProperties = null;
+        }
+    }
+    if (on) {
+        vnode.assignEvents = nodeConfig_1.NodeConfig.createEventAssignment(node);
+        if (typeof on === 'function') {
+            const scope = Store_1.ObservableScope.Create(on);
+            vnode.scopes.push(scope);
+            Store_1.ObservableScope.Watch(scope, CreateScheduledCallback(function () {
+                const value = Store_1.ObservableScope.Peek(scope);
+                vnode.assignEvents(value);
+            }));
+            const value = Store_1.ObservableScope.Peek(scope);
+            vnode.assignEvents(value);
+        }
+        else
+            vnode.assignEvents(on);
+    }
+    if (attrs) {
+        vnode.assignAttributes = nodeConfig_1.NodeConfig.createAttributeAssignment(node);
+        if (typeof attrs === 'function') {
+            const scope = Store_1.ObservableScope.Create(attrs);
+            vnode.scopes.push(scope);
+            Store_1.ObservableScope.Watch(scope, CreateScheduledCallback(function () {
+                const value = Store_1.ObservableScope.Peek(scope);
+                vnode.assignAttributes(value);
+            }));
+            const value = Store_1.ObservableScope.Peek(scope);
+            vnode.assignAttributes(value);
+        }
+        else {
+            vnode.assignAttributes(attrs);
+            vnode.assignAttributes = null;
+        }
+    }
+    if (componentConstructor) {
+        vnode.component = new componentConstructor(vnode);
+        const componentScope = Store_1.ObservableScope.Create(function () {
+            let nodes = vnode.component.Template();
+            if (!Array.isArray(nodes))
+                nodes = [nodes];
+            return nodes;
+        });
+        vnode.scopes.push(componentScope);
+        Store_1.ObservableScope.Watch(componentScope, CreateScheduledCallback(function () {
+            const nodes = Store_1.ObservableScope.Peek(componentScope);
+            vNode.DestroyAll(vnode.children);
+            vnode.children = nodes;
+            UpdateChildren(vnode);
+        }));
+        const nodes = Store_1.ObservableScope.Peek(componentScope);
+        vnode.children = nodes;
+    }
+    else if (childrenArray) {
+        vnode.children = childrenArray;
+    }
+    else if (children) {
+        if (data) {
+            DynamicChildren(vnode, children, ToArray(data));
+        }
+        else
+            StaticChildren(vnode, children);
+    }
+    UpdateChildren(vnode, true);
+}
+function StaticChildren(vnode, children) {
+    const childrenScope = Store_1.ObservableScope.Create(WrapStaticChildren(vnode.injector, children));
+    const child = Store_1.ObservableScope.Peek(childrenScope);
+    if (typeof child === 'string') {
+        const node = vNode.Create({
+            type: 'text',
+            namespace: null,
+            props() {
+                return { nodeValue: Store_1.ObservableScope.Value(childrenScope) };
+            }
+        });
+        node.scopes.push(childrenScope);
+        vnode.children = [node];
+    }
+    else {
+        vnode.scopes.push(childrenScope);
+        Store_1.ObservableScope.Touch(childrenScope);
+        Store_1.ObservableScope.Watch(childrenScope, CreateScheduledCallback(function () {
+            vNode.DestroyAll(vnode.children);
+            const nodes = Store_1.ObservableScope.Peek(childrenScope);
+            vnode.children = Array.isArray(nodes) ? nodes : [nodes];
+            UpdateChildren(vnode);
+        }));
+        vnode.children = Array.isArray(child) ? child : [child];
+    }
+}
+function WrapStaticChildren(injector, children) {
+    return function () {
+        return injector_1.Injector.Scope(injector, children, undefined);
+    };
+}
+function DestroyNodeList(nodeList) {
+    for (let node = nodeList.head; node !== null; node = node.next) {
+        vNode.DestroyAll(node.data.nodes);
+        Store_1.ObservableScope.Destroy(node.data.scope);
+    }
+}
+function DynamicChildren(vnode, children, data) {
+    const dataScope = Store_1.ObservableScope.Create(data);
+    vnode.scopes.push(dataScope);
+    const nodeList = list_1.List.Create();
+    const childrenScope = Store_1.ObservableScope.Create(WrapDynamicChildren(dataScope, nodeList, vnode.injector, children));
+    vnode.scopes.push(childrenScope);
+    Store_1.ObservableScope.OnDestroyed(dataScope, function () {
+        DestroyNodeList(nodeList);
+    });
+    Store_1.ObservableScope.Watch(childrenScope, CreateScheduledCallback(function () {
+        vnode.children = Store_1.ObservableScope.Peek(childrenScope);
+        UpdateChildren(vnode);
+    }));
+    vnode.children = Store_1.ObservableScope.Value(childrenScope);
+}
+function WrapDynamicChildren(dataScope, nodeList, injector, children) {
+    return function () {
+        const nextData = Store_1.ObservableScope.Value(dataScope);
+        const nodeMap = list_1.List.ToNodeMap(nodeList, function (data) { return data.data; });
+        const nextNodeList = list_1.List.Create();
+        const nextNodeArray = [];
+        for (let x = 0; x < nextData.length; x++) {
+            const data = nextData[x];
+            const existingNodeArray = nodeMap.get(data);
+            let existingNode = null;
+            ;
+            for (let x = 0; existingNodeArray && x < existingNodeArray.length && existingNode === null; x++) {
+                existingNode = existingNodeArray[x];
+                existingNodeArray[x] = null;
+            }
+            if (existingNode !== null) {
+                list_1.List.RemoveNode(nodeList, existingNode);
+                list_1.List.AddNode(nextNodeList, existingNode);
+                if (existingNode.data.scope.dirty) {
+                    const newNodes = Store_1.ObservableScope.Value(existingNode.data.scope);
+                    vNode.DestroyAll(existingNode.data.nodes);
+                    existingNode.data.nodes = newNodes;
+                    existingNode.data.nodes = Store_1.ObservableScope.Value(existingNode.data.scope);
+                }
+            }
+            else {
+                const childrenScope = Store_1.ObservableScope.Create(function () {
+                    const childNodes = injector_1.Injector.Scope(injector, children, data);
+                    return Array.isArray(childNodes) ? childNodes : [childNodes];
+                });
+                list_1.List.Add(nextNodeList, {
+                    data,
+                    nodes: Store_1.ObservableScope.Value(childrenScope),
+                    scope: childrenScope
+                });
+            }
+            nextNodeArray.push(...nextNodeList.tail.data.nodes);
+        }
+        DestroyNodeList(nodeList);
+        list_1.List.Clear(nodeList);
+        list_1.List.Append(nodeList, nextNodeList);
+        return nextNodeArray;
+    };
+}
+function UpdateChildren(vnode, init = false) {
+    if (!vnode.children)
+        return;
+    const children = vnode.children;
+    (0, thread_1.Thread)(function () {
+        if (vnode.destroyed || children !== vnode.children)
+            return;
+        for (let x = 0; x < children.length; x++)
+            if (children[x].node === null) {
+                const childNode = children[x];
+                (0, thread_1.Schedule)(function () {
+                    if (vnode.destroyed || children !== vnode.children)
+                        return;
+                    vNode.Init(childNode);
+                });
+            }
+        (0, thread_1.Thread)(function (async) {
+            if (vnode.destroyed || children !== vnode.children)
+                return;
+            if (init || !async)
+                nodeConfig_1.NodeConfig.reconcileChildren(vnode.node, vnode.children.map(vnode => vnode.node));
+            else
+                nodeConfig_1.NodeConfig.scheduleUpdate(function () {
+                    if (vnode.destroyed || children !== vnode.children)
+                        return;
+                    nodeConfig_1.NodeConfig.reconcileChildren(vnode.node, vnode.children.map(vnode => vnode.node));
+                });
+        });
+    });
+}
+function ToArray(callback) {
+    return function (...args) {
+        const result = callback(...args);
+        if (Array.isArray(result))
+            return result;
+        if (!result)
+            return [];
+        return [result];
+    };
+}
+function CreateScheduledCallback(callback) {
+    let scheduled = false;
+    return function () {
+        if (scheduled)
+            return;
+        nodeConfig_1.NodeConfig.scheduleUpdate(callback);
+    };
+}

package/Node/vNode.types.d.ts

@@ -0,0 +1,45 @@
+import { Component } from "./component";
+import { IObservableScope } from "../Store/Tree/observableScope";
+import { Injector } from "../Utils/injector";
+import { RecursivePartial } from "../Utils/utils.types";
+export type FunctionOr<T> = {
+    (): T | Promise<T>;
+} | T;
+export type vNodeEvents<E extends {
+    [event: string]: any;
+} = any> = {
+    [P in keyof E]?: {
+        (events: E[P]): void;
+    };
+};
+export type vNode = {
+    definition: vNodeDefinition<any, any, any>;
+    injector: Injector;
+    node: Node | null;
+    children: vNode[] | null;
+    destroyed: boolean;
+    assignProperties: (next: any) => void;
+    assignEvents: (next: {
+        [event: string]: (event: Event) => void;
+    }) => void;
+    assignAttributes: (next: {
+        [attr: string]: string;
+    }) => void;
+    scopes: IObservableScope<unknown>[];
+    component: Component;
+};
+export type vNodeDefinition<P = HTMLElement, E = HTMLElementEventMap, T = never> = {
+    type: string;
+    namespace: string | null;
+    props?: FunctionOr<RecursivePartial<P>>;
+    attrs?: FunctionOr<{
+        [name: string]: string;
+    }>;
+    on?: FunctionOr<vNodeEvents<E>>;
+    data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
+    children?: (data: T) => string | vNode | vNode[];
+    childrenArray?: vNode[];
+    componentConstructor?: {
+        new (vnode: vNode): Component<any, any, any>;
+    };
+};

package/Store/Tree/observableNode.js

@@ -131,8 +131,7 @@ function CreateProxyFactory(alias) {
                 case "shift":
                 case "sort":
                 case "reverse":
-                    if (readOnly)
-                        throw `Object is readonly`;
+                    throw "Object is readonly";
             }
         switch (prop) {
             case exports.IS_OBSERVABLE_NODE:

package/Store/Tree/observableScope.d.ts

@@ -41,11 +41,9 @@ export interface IObservableScope<T> extends IDestroyable {
     dirty: boolean;
     emitter: Emitter;
     emitters: (Emitter | null)[];
-    calcFunctions: ICalcFunction<any>[] | null;
+    calcFunctions: ICalcFunction<any>[];
     onDestroyed: Emitter | null;
     destroyed: boolean;
-    watchEmitters: Emitter[] | null;
-    watchEmittersSet: Set<Emitter> | null;
 }
 export declare function CalcScope<T>(callback: () => T): T;
 export declare namespace ObservableScope {
@@ -54,13 +52,14 @@ export declare namespace ObservableScope {
     }): IObservableScope<T>;
     function Register(emitter: Emitter): void;
     function Init<T>(scope: IObservableScope<T>): void;
+    function Peek<T>(scope: IObservableScope<T>): T;
     function Value<T>(scope: IObservableScope<T>): T;
-    function Watching(): boolean;
     function Touch<T>(scope: IObservableScope<T>): void;
     function Watch<T>(scope: IObservableScope<T>, callback: EmitterCallback<[IObservableScope<T>]>): void;
     function Unwatch<T>(scope: IObservableScope<T>, callback: EmitterCallback<[IObservableScope<T> | ObservableScopeValue<T>]>): void;
     function OnDestroyed(scope: IObservableScope<unknown>, callback: () => void): void;
     function Update(scope: IObservableScope<any>): void;
     function Destroy<T>(scope: IObservableScope<T>): void;
+    function DestroyAll(scopes: IObservableScope<unknown>[]): void;
 }
 export {};

package/Store/Tree/observableScope.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ObservableScope = exports.ObservableScopeWrapper = exports.ObservableScopeValue = void 0;
 exports.CalcScope = CalcScope;
 const array_1 = require("../../Utils/array");
+const distinctArray_1 = require("../../Utils/distinctArray");
 const emitter_1 = require("../../Utils/emitter");
-const list_1 = require("../../Utils/list");
 class ObservableScopeValue {
     get Value() {
         return ObservableScope.Value(this.scope);
@@ -48,28 +48,24 @@ class ObservableScope extends ObservableScopeWrapper {
     }
 }
 exports.ObservableScope = ObservableScope;
-let watchingScope = null;
-let currentlyWatching = false;
+let watchState = null;
 function WatchScope(scope) {
-    const parentScope = watchingScope;
-    const parentWatching = currentlyWatching;
-    watchingScope = scope;
-    currentlyWatching = true;
+    const parent = watchState;
+    watchState = [distinctArray_1.DistinctArray.Create(emitter_1.Emitter.GetId), []];
     const value = scope.getFunction();
-    watchingScope.watchEmittersSet = null;
-    watchingScope = parentScope;
-    currentlyWatching = parentWatching;
-    return value;
+    const emitters = distinctArray_1.DistinctArray.Get(watchState[0]);
+    emitters.sort(emitter_1.Emitter.Compare);
+    const result = [value, emitters, watchState[1]];
+    watchState = parent;
+    return result;
 }
 function CalcScope(callback) {
     const value = callback();
-    if (currentlyWatching) {
-        watchingScope.calcFunctions ??= [];
-        watchingScope.calcFunctions.push({
+    if (watchState !== null)
+        watchState[1].push({
             getFunction: callback,
             value
         });
-    }
     return value;
 }
 (function (ObservableScope) {
@@ -82,11 +78,9 @@ function CalcScope(callback) {
             dirty: true,
             emitter: emitter_1.Emitter.Create(),
             emitters: [],
-            calcFunctions: null,
+            calcFunctions: [],
             onDestroyed: null,
             destroyed: false,
-            watchEmitters: null,
-            watchEmittersSet: null,
             setCallback: function () {
                 return OnSet(scope);
             },
@@ -95,35 +89,31 @@ function CalcScope(callback) {
     }
     ObservableScope.Create = Create;
     function Register(emitter) {
-        if (!currentlyWatching)
+        if (watchState === null)
             return;
-        watchingScope.watchEmitters ??= [];
-        if (watchingScope.watchEmitters.length === 10)
-            watchingScope.watchEmittersSet ??= new Set(watchingScope.watchEmitters);
-        if (watchingScope.watchEmittersSet === null ? !watchingScope.watchEmitters.includes(emitter) : !watchingScope.watchEmittersSet.has(emitter)) {
-            watchingScope.watchEmittersSet?.add(emitter);
-            watchingScope.watchEmitters.push(emitter);
-        }
+        distinctArray_1.DistinctArray.Push(watchState[0], emitter);
     }
     ObservableScope.Register = Register;
     function Init(scope) {
         if (!scope)
             return;
-        UpdateScope(scope);
+        UpdateValue(scope);
     }
     ObservableScope.Init = Init;
-    function Value(scope) {
+    function Peek(scope) {
         if (!scope)
             return undefined;
-        Register(scope.emitter);
-        UpdateScope(scope);
+        UpdateValue(scope);
         return scope.value;
     }
-    ObservableScope.Value = Value;
-    function Watching() {
-        return currentlyWatching;
+    ObservableScope.Peek = Peek;
+    function Value(scope) {
+        if (!scope)
+            return undefined;
+        Touch(scope);
+        return Peek(scope);
     }
-    ObservableScope.Watching = Watching;
+    ObservableScope.Value = Value;
     function Touch(scope) {
         if (!scope || !scope.emitter)
             return;
@@ -148,6 +138,8 @@ function CalcScope(callback) {
     }
     ObservableScope.OnDestroyed = OnDestroyed;
     function Update(scope) {
+        if (!scope || scope.dirty || scope.destroyed)
+            return;
         OnSet(scope);
     }
     ObservableScope.Update = Update;
@@ -155,26 +147,12 @@ function CalcScope(callback) {
         DestroyScope(scope);
     }
     ObservableScope.Destroy = Destroy;
+    function DestroyAll(scopes) {
+        for (let x = 0; x < scopes.length; x++)
+            Destroy(scopes[x]);
+    }
+    ObservableScope.DestroyAll = DestroyAll;
 })(ObservableScope || (exports.ObservableScope = ObservableScope = {}));
-function UpdateScope(scope) {
-    const prePromise = scope.promise;
-    UpdateValue(scope);
-    scope.async && prePromise !== scope.promise && scope.promise.then(function () {
-        emitter_1.Emitter.Emit(scope.emitter, scope);
-    });
-}
-const updateScopeQueue = list_1.List.Create();
-function ProcessScopeUpdateQueue() {
-    const processList = list_1.List.Split(updateScopeQueue, 0);
-    for (let node = processList.head; node !== null; node = node.next)
-        UpdateScope(node.data);
-    list_1.List.Clear(processList);
-}
-function QueueScopeUpdate(scope) {
-    list_1.List.Add(updateScopeQueue, scope);
-    if (updateScopeQueue.size === 1)
-        queueMicrotask(ProcessScopeUpdateQueue);
-}
 function CalcChanged(calc) {
     const value = calc.getFunction();
     const changed = calc.value !== value;
@@ -182,22 +160,43 @@ function CalcChanged(calc) {
     return changed;
 }
 function DirtyScope(scope) {
-    scope.dirty = scope.calcFunctions === null || scope.calcFunctions.some(CalcChanged);
-    scope.dirty && (scope.async ? QueueScopeUpdate(scope) : emitter_1.Emitter.Emit(scope.emitter, scope));
+    if (scope.dirty || !scope.getFunction)
+        return;
+    scope.dirty = scope.calcFunctions.length === 0 || scope.calcFunctions.some(CalcChanged);
+    if (!scope.dirty)
+        return;
+    if (scope.async) {
+        UpdateValue(scope);
+        scope.promise.then(function () {
+            emitter_1.Emitter.Emit(scope.emitter, scope);
+        });
+    }
+    else
+        emitter_1.Emitter.Emit(scope.emitter, scope);
+}
+const scopeQueue = new Set();
+function ProcessScopeQueue() {
+    const scopes = Array.from(scopeQueue);
+    scopeQueue.clear();
+    for (let x = 0; x < scopes.length; x++)
+        DirtyScope(scopes[x]);
 }
 function OnSet(scope) {
-    if (!scope || scope.dirty || scope.destroyed)
-        return scope?.destroyed;
+    if (scope.destroyed)
+        return true;
+    if (scope.async || scope.calcFunctions.length > 0) {
+        if (scopeQueue.size === 0)
+            queueMicrotask(ProcessScopeQueue);
+        scopeQueue.add(scope);
+        return;
+    }
     DirtyScope(scope);
-    return false;
 }
 function UpdateValue(scope) {
     if (!scope.dirty)
         return;
     scope.dirty = false;
-    scope.watchEmitters = null;
-    scope.calcFunctions = null;
-    const value = WatchScope(scope);
+    const [value, emitters, calcFunctions] = WatchScope(scope);
     if (scope.async) {
         scope.promise = value.then(function (result) {
             scope.value = result;
@@ -206,11 +205,11 @@ function UpdateValue(scope) {
     }
     else
         scope.value = value;
-    UpdateEmitters(scope);
+    scope.calcFunctions = calcFunctions;
+    UpdateEmitters(scope, emitters);
 }
-function UpdateEmitters(scope) {
-    const right = scope.watchEmitters;
-    if (right === null) {
+function UpdateEmitters(scope, right) {
+    if (right.length === 0) {
         if (scope.emitters.length > 0) {
             for (let x = 0; x < scope.emitters.length; x++)
                 emitter_1.Emitter.Remove(scope.emitters[x], scope.setCallback);
@@ -218,7 +217,6 @@ function UpdateEmitters(scope) {
         }
         return;
     }
-    emitter_1.Emitter.Sort(right);
     (0, array_1.ReconcileSortedArrays)(scope.emitters, right, function (emitter) {
         emitter_1.Emitter.On(emitter, scope.setCallback);
     }, function (emitter) {

package/Utils/avlTree.d.ts

@@ -0,0 +1,15 @@
+type Compare<T> = (a: T, b: T) => number;
+export interface AvlTree<T> {
+    size: number;
+    root: AvlTreeNode<T> | null;
+    compare: Compare<T>;
+}
+export type AvlTreeNode<T> = [T, number, number, AvlTreeNode<T> | null, AvlTreeNode<T> | null];
+export declare namespace AVL {
+    function Create<T>(compare: Compare<T>): AvlTree<T>;
+    function Clear(tree: AvlTree<unknown>): void;
+    function Insert<T>(tree: AvlTree<T>, value: T): void;
+    function ForEach<T>(tree: AvlTree<T>, callback: (value: T) => void): void;
+    function ToArray<T>(tree: AvlTree<T>): T[];
+}
+export {};