j-templates 6.0.26 → 6.0.28

package/DOM/createPropertyAssignment.d.ts

@@ -1,2 +1,4 @@
 export declare function CreateNodeValueAssignment(target: HTMLElement): (value: string) => void;
-export declare function CreatePropertyAssignment(target: any, prop: string): (next: any) => void;
+export declare function CreatePropertyAssignment(target: any): (next: {
+    [prop: string]: any;
+}) => void;

package/DOM/createPropertyAssignment.js

@@ -2,8 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CreateNodeValueAssignment = CreateNodeValueAssignment;
 exports.CreatePropertyAssignment = CreatePropertyAssignment;
-const jsonType_1 = require("../Utils/jsonType");
-const createAssignment_1 = require("./createAssignment");
+const json_1 = require("../Utils/json");
 function CreateNodeValueAssignment(target) {
     let lastValue = target.nodeValue;
     return function AssignNodeValue(value) {
@@ -13,39 +12,65 @@ function CreateNodeValueAssignment(target) {
         }
     };
 }
+function WalkValue(next, callback, index = 0, parent = "") {
+    const keys = Object.keys(next);
+    for (let x = 0; x < keys.length; x++) {
+        const value = next[keys[x]];
+        const type = (0, json_1.JsonType)(value);
+        switch (type) {
+            case "object":
+                index = WalkValue(value, callback, index, `${parent}${keys[x]}.`);
+                break;
+            default:
+                callback(`${parent}${keys[x]}`, value, index);
+                index++;
+                break;
+        }
+    }
+    return index;
+}
+function AssignNodeValue(target, value) {
+    target.nodeValue = value;
+}
 function AssignValue(target, value) {
-    const start = target.selectionStart;
-    const end = target.selectionEnd;
     target.value = value;
-    if (target.ownerDocument.activeElement === target)
-        target.setSelectionRange(start, end);
 }
-function CreatePropertyAssignment(target, prop) {
-    let lastValue;
-    let childPropertyAssignment;
-    return function (next) {
-        const nextValue = next && next[prop];
-        if (nextValue === lastValue)
+function AssignClassName(target, value) {
+    target.className = value;
+}
+function GetAssignmentFunction(path) {
+    switch (path) {
+        case "nodeValue":
+            return AssignNodeValue;
+        case "value":
+            return AssignValue;
+        case "className":
+            return AssignClassName;
+        default:
+            return new Function("t", "v", `t.${path} = v;`);
+    }
+}
+function CreatePropertyAssignment(target) {
+    const last = [["", null, null]];
+    function WalkCallback(path, value, index) {
+        if (index >= last.length || last[index][0] !== path) {
+            last[index] = [path, value, GetAssignmentFunction(path)];
+            last[index][2](target, value);
+        }
+        else if (last[index][1] !== value) {
+            last[index][2](target, value);
+        }
+    }
+    return function AssignProperty(next) {
+        if (next === null) {
+            for (let x = 0; x < last.length; x++)
+                last[x][2](target, null);
+            if (last.length > 0)
+                last.splice(0);
             return;
-        lastValue = nextValue;
-        if (childPropertyAssignment !== undefined)
-            childPropertyAssignment(target[prop], nextValue);
-        const nextValueType = (0, jsonType_1.JsonType)(nextValue);
-        switch (nextValueType) {
-            case "value":
-                switch (prop) {
-                    case "value":
-                        AssignValue(target, nextValue || "");
-                        break;
-                    default:
-                        target[prop] = nextValue;
-                        break;
-                }
-                break;
-            default:
-                childPropertyAssignment ??= (0, createAssignment_1.CreateAssignment)(target[prop], CreatePropertyAssignment);
-                childPropertyAssignment(target[prop], nextValue);
-                break;
         }
+        const endIndex = WalkValue(next, WalkCallback);
+        if (endIndex < last.length)
+            last.splice(endIndex);
     };
 }

package/DOM/domNodeConfig.js

@@ -6,19 +6,17 @@ const list_1 = require("../Utils/list");
 const createPropertyAssignment_1 = require("./createPropertyAssignment");
 const createEventAssignment_1 = require("./createEventAssignment");
 const createAssignment_1 = require("./createAssignment");
+const createPropertyAssignment_2 = require("./createPropertyAssignment");
 let pendingUpdates = list_1.List.Create();
 let updateScheduled = false;
 const updateMs = 16;
 function processUpdates() {
     list_1.List.Add(pendingUpdates, null);
-    const start = Date.now();
     let callback;
     while ((callback = list_1.List.Pop(pendingUpdates)))
         callback();
     if (pendingUpdates.size === 0)
         updateScheduled = false;
-    else if (Date.now() - start < updateMs)
-        processUpdates();
     else
         window_1.wndw.requestAnimationFrame(processUpdates);
 }
@@ -84,9 +82,7 @@ exports.DOMNodeConfig = {
         target.setAttribute(attribute, value);
     },
     createPropertyAssignment(target) {
-        if (target.nodeType === Node.TEXT_NODE)
-            return (0, createPropertyAssignment_1.CreateNodeValueAssignment)(target);
-        return (0, createAssignment_1.CreateAssignment)(target, createPropertyAssignment_1.CreatePropertyAssignment);
+        return (0, createPropertyAssignment_2.CreatePropertyAssignment)(target);
     },
     createEventAssignment(target) {
         return (0, createAssignment_1.CreateAssignment)(target, createEventAssignment_1.CreateEventAssignment);

package/Node/componentNode.js

@@ -102,13 +102,16 @@ function AddTemplate(node, init) {
                 init: true,
                 nodes
             });
-            if (init)
+            if (init) {
                 nodeRef_1.NodeRef.ReconcileChildren(node, list);
+                list_1.List.Clear(list);
+            }
             else
                 nodeConfig_1.NodeConfig.scheduleUpdate(function () {
                     if (node.destroyed)
                         return;
                     nodeRef_1.NodeRef.ReconcileChildren(node, list);
+                    list_1.List.Clear(list);
                 });
         });
         if (node.component.Bound !== component_1.Component.prototype.Bound)

package/Node/elementNode.js

@@ -72,6 +72,7 @@ function SetDefaultData(node) {
                     nodes
                 });
                 nodeRef_1.NodeRef.ReconcileChildren(node, defaultNodeList);
+                list_1.List.Clear(defaultNodeList);
             });
         }
     });

package/Node/nodeRef.js

@@ -206,6 +206,7 @@ var NodeRef;
             case NodeRefType.ComponentNode:
                 node.component?.Destroy();
             case NodeRefType.BoundNode:
+                node.assignEvents?.(null);
             case NodeRefType.ElementNode:
                 for (let x = 0; node.scopes && x < node.scopes.length; x++)
                     Store_1.ObservableScope.Destroy(node.scopes[x]);

package/Store/Tree/observableNode.d.ts

@@ -5,7 +5,6 @@ export declare const GET_TO_JSON = "toJSON";
 export declare namespace ObservableNode {
     function Create<T>(value: T): T;
     function Touch(value: unknown): void;
-    function EnableDiff(value: boolean): void;
     function ApplyDiff(rootNode: any, diffResult: JsonDiffResult): void;
     function CreateFactory(alias?: (value: any) => any | undefined): <T>(value: T) => T;
 }

package/Store/Tree/observableNode.js

@@ -9,6 +9,7 @@ exports.GET_OBSERVABLE_VALUE = "____getObservableValue";
 exports.GET_TO_JSON = "toJSON";
 const proxyCache = new WeakMap();
 const scopeCache = new WeakMap();
+const leafScopeCache = new WeakMap();
 function getOwnPropertyDescriptor(target, prop) {
     const descriptor = Object.getOwnPropertyDescriptor(target, prop);
     return {
@@ -54,7 +55,6 @@ function UnwrapProxy(value) {
     }
     return value;
 }
-let applyingDiff = false;
 function CreateProxyFactory(alias) {
     function CreateProxy(value) {
         value = UnwrapProxy(value);
@@ -67,7 +67,6 @@ function CreateProxyFactory(alias) {
                 const typedValue = value;
                 const proxy = CreateProxy(typedValue);
                 return proxy.map(ToJsonCopy);
-                break;
             }
             case "object": {
                 const typedValue = alias(value) ?? value;
@@ -114,7 +113,7 @@ function CreateProxyFactory(alias) {
         return proxy;
     }
     function ArrayProxySetter(array, prop, value) {
-        if (readOnly && !applyingDiff)
+        if (readOnly)
             throw `Object is readonly`;
         if (prop === exports.IS_OBSERVABLE_NODE)
             throw `Cannot assign read-only property: ${exports.IS_OBSERVABLE_NODE}`;
@@ -127,7 +126,7 @@ function CreateProxyFactory(alias) {
     function ArrayProxyGetter(array, prop) {
         if (prop === exports.IS_OBSERVABLE_NODE)
             return true;
-        if (readOnly && !applyingDiff)
+        if (readOnly)
             switch (prop) {
                 case "push":
                 case "unshift":
@@ -136,7 +135,7 @@ function CreateProxyFactory(alias) {
                 case "shift":
                 case "sort":
                 case "reverse":
-                    if (readOnly && !applyingDiff)
+                    if (readOnly)
                         throw `Object is readonly`;
             }
         const scope = scopeCache.get(array);
@@ -181,44 +180,36 @@ function CreateProxyFactory(alias) {
             }
         }
     }
+    function SetPropertyValue(object, prop, value) {
+        object[prop] = value;
+        const leafScopes = leafScopeCache.get(object);
+        observableScope_1.ObservableScope.Update(leafScopes && leafScopes[prop] || scopeCache.get(object));
+    }
     function ObjectProxySetter(object, prop, value) {
-        if (readOnly && !applyingDiff)
+        if (readOnly)
             throw `Object is readonly`;
         if (prop === exports.IS_OBSERVABLE_NODE)
             throw `Cannot assign read-only property: ${exports.IS_OBSERVABLE_NODE}`;
-        const scope = scopeCache.get(object);
         value = UnwrapProxy(value);
-        if (applyingDiff) {
-            object[prop] = value;
-            observableScope_1.ObservableScope.Update(scope);
-        }
-        else {
-            applyingDiff = true;
-            const diff = (0, json_1.JsonDiff)(value, object[prop]);
-            for (let x = 0; x < diff.length; x++) {
-                if (diff[x].path.length === 0) {
-                    const proxy = proxyCache.get(object);
-                    proxy[prop] = diff[x].value;
-                }
-                else {
-                    const path = diff[x].path;
-                    let curr = object[prop];
-                    let y = 0;
-                    for (; y < path.length - 1; y++)
-                        curr = curr[path[y]];
-                    const target = proxyCache.get(curr) ?? curr;
-                    target[path[y]] = diff[x].value;
-                }
+        const diff = (0, json_1.JsonDiff)(value, object[prop]);
+        for (let x = 0; x < diff.length; x++) {
+            if (diff[x].path.length === 0) {
+                SetPropertyValue(object, prop, diff[x].value);
+            }
+            else {
+                const path = diff[x].path;
+                let curr = object[prop];
+                let y = 0;
+                for (; y < path.length - 1; y++)
+                    curr = curr[path[y]];
+                SetPropertyValue(curr, path[y], diff[x].value);
             }
-            applyingDiff = false;
         }
         return true;
     }
     function ObjectProxyGetter(object, prop) {
         if (prop === exports.IS_OBSERVABLE_NODE)
             return true;
-        const scope = scopeCache.get(object);
-        object = observableScope_1.ObservableScope.Value(scope);
         switch (prop) {
             case exports.GET_TO_JSON:
                 return function () {
@@ -227,14 +218,22 @@ function CreateProxyFactory(alias) {
             case exports.GET_OBSERVABLE_VALUE:
                 return object;
             default: {
-                const proxyValue = object[prop];
-                if (typeof prop === "symbol")
-                    return proxyValue;
-                const proxy = CreateProxyFromValue(proxyValue);
-                return proxy;
+                return GetAccessorValue(object, prop);
             }
         }
     }
+    function GetAccessorValue(parent, prop) {
+        let leafScopes = leafScopeCache.get(parent);
+        if (leafScopes === undefined) {
+            leafScopes = {};
+            leafScopeCache.set(parent, leafScopes);
+        }
+        leafScopes[prop] ??= observableScope_1.ObservableScope.Create(function () {
+            const value = parent[prop];
+            return CreateProxyFromValue(value);
+        });
+        return observableScope_1.ObservableScope.Value(leafScopes[prop]);
+    }
     function CreateProxyFromValue(value) {
         const type = (0, jsonType_1.JsonType)(value);
         switch (type) {
@@ -270,10 +269,6 @@ var ObservableNode;
         observableScope_1.ObservableScope.Update(scope);
     }
     ObservableNode.Touch = Touch;
-    function EnableDiff(value) {
-        applyingDiff = value;
-    }
-    ObservableNode.EnableDiff = EnableDiff;
     function ApplyDiff(rootNode, diffResult) {
         const root = rootNode[exports.GET_OBSERVABLE_VALUE];
         const pathTuples = [["", root]];

package/Store/Tree/observableScope.d.ts

@@ -30,21 +30,19 @@ export interface IObservableScope<T> extends IDestroyable {
     };
     async: boolean;
     value: T;
+    promise: Promise<T> | null;
     dirty: boolean;
     emitter: Emitter;
     emitters: (Emitter | null)[];
     setCallback: EmitterCallback;
     destroyed: boolean;
-    calc: any[] | null;
-    watchSet: Set<Emitter> | null;
-    watchCalc: any[] | null;
+    watchEmitters: Emitter[] | null;
 }
 export declare namespace ObservableScope {
     function Create<T>(valueFunction: {
         (): T | Promise<T>;
     }): IObservableScope<T>;
     function Register(emitter: Emitter): void;
-    function Calc<T>(value: T): T;
     function Value<T>(scope: IObservableScope<T>): T;
     function Watching(): boolean;
     function Touch<T>(scope: IObservableScope<T>): void;

package/Store/Tree/observableScope.js

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ObservableScope = exports.ObservableScopeWrapper = exports.ObservableScopeValue = void 0;
-const array_1 = require("../../Utils/array");
 const emitter_1 = require("../../Utils/emitter");
+const list_1 = require("../../Utils/list");
 class ObservableScopeValue {
     get Value() {
         return ObservableScope.Value(this.scope);
@@ -47,15 +47,15 @@ class ObservableScope extends ObservableScopeWrapper {
 }
 exports.ObservableScope = ObservableScope;
 let currentScope = null;
-let currentWatching = false;
+let currentlyWatching = false;
 function WatchScope(scope) {
     const parentScope = currentScope;
-    const parentWatching = currentWatching;
+    const parentWatching = currentlyWatching;
     currentScope = scope;
-    currentWatching = true;
+    currentlyWatching = true;
     const value = scope.getFunction();
     currentScope = parentScope;
-    currentWatching = parentWatching;
+    currentlyWatching = parentWatching;
     return value;
 }
 (function (ObservableScope) {
@@ -63,14 +63,13 @@ function WatchScope(scope) {
         const scope = {
             getFunction: valueFunction,
             value: null,
+            promise: null,
             async: valueFunction[Symbol.toStringTag] === "AsyncFunction",
             dirty: true,
             emitter: emitter_1.Emitter.Create(),
             emitters: [],
             destroyed: false,
-            calc: null,
-            watchSet: null,
-            watchCalc: null,
+            watchEmitters: null,
             setCallback: function () {
                 return OnSet(scope);
             },
@@ -79,30 +78,22 @@ function WatchScope(scope) {
     }
     ObservableScope.Create = Create;
     function Register(emitter) {
-        if (!currentWatching)
+        if (!currentlyWatching)
             return;
-        currentScope.watchSet ??= new Set();
-        currentScope.watchSet.add(emitter);
+        currentScope.watchEmitters ??= [];
+        currentScope.watchEmitters.push(emitter);
     }
     ObservableScope.Register = Register;
-    function Calc(value) {
-        if (!currentWatching)
-            return;
-        currentScope.watchCalc ??= [];
-        currentScope.watchCalc.push(value);
-        return value;
-    }
-    ObservableScope.Calc = Calc;
     function Value(scope) {
         if (!scope)
             return undefined;
         Register(scope.emitter);
-        UpdateValue(scope);
+        UpdateScope(scope);
         return scope.value;
     }
     ObservableScope.Value = Value;
     function Watching() {
-        return currentWatching;
+        return currentlyWatching;
     }
     ObservableScope.Watching = Watching;
     function Touch(scope) {
@@ -132,54 +123,65 @@ function WatchScope(scope) {
     }
     ObservableScope.Destroy = Destroy;
 })(ObservableScope || (exports.ObservableScope = ObservableScope = {}));
+function UpdateScope(scope) {
+    UpdateValue(scope);
+    scope.async && 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 DirtyScope(scope) {
+    scope.dirty = true;
+    scope.async ? QueueScopeUpdate(scope) : emitter_1.Emitter.Emit(scope.emitter, scope);
+}
 function OnSet(scope) {
     if (!scope || scope.dirty || scope.destroyed)
         return scope?.destroyed;
-    scope.dirty = !!scope.getFunction;
-    emitter_1.Emitter.Emit(scope.emitter, scope);
+    DirtyScope(scope);
     return false;
 }
 function UpdateValue(scope) {
     if (!scope.dirty)
         return;
     scope.dirty = false;
+    scope.watchEmitters = null;
     const value = WatchScope(scope);
-    const change = scope.watchCalc === null || (0, array_1.ArrayDiff)(scope.calc, scope.watchCalc);
-    scope.calc = scope.watchCalc;
-    if (change) {
-        if (scope.async)
-            Promise.resolve(value).then((val) => {
-                scope.value = val;
-                emitter_1.Emitter.Emit(scope.emitter, scope);
-            });
-        else
-            scope.value = value;
-        UpdateEmitters(scope);
-    }
-    scope.watchCalc = null;
-    scope.watchSet?.clear();
+    if (scope.async) {
+        scope.promise = value.then(function (result) {
+            scope.value = result;
+            return result;
+        });
+    }
+    else
+        scope.value = value;
+    UpdateEmitters(scope);
 }
 function UpdateEmitters(scope) {
-    const newEmitters = scope.watchSet;
+    const newEmitters = scope.watchEmitters;
     if (newEmitters === null) {
         for (let x = 0; x < scope.emitters.length; x++)
             emitter_1.Emitter.Remove(scope.emitters[x], scope.setCallback);
         scope.emitters = [];
         return;
     }
-    let removed = false;
-    for (let x = 0; x < scope.emitters.length; x++) {
-        if (!newEmitters.delete(scope.emitters[x])) {
-            emitter_1.Emitter.Remove(scope.emitters[x], scope.setCallback);
-            scope.emitters[x] = null;
-            removed = true;
-        }
-    }
-    const initLength = scope.emitters.length;
-    scope.emitters.push(...newEmitters);
-    for (let x = initLength; x < scope.emitters.length; x++)
-        emitter_1.Emitter.On(scope.emitters[x], scope.setCallback);
-    removed && (0, array_1.RemoveNulls)(scope.emitters);
+    let x = 0;
+    for (; x < scope.emitters.length && x < newEmitters.length && scope.emitters[x] === newEmitters[x]; x++) { }
+    for (let y = x; y < scope.emitters.length; y++)
+        emitter_1.Emitter.Remove(scope.emitters[y], scope.setCallback);
+    for (let y = x; y < newEmitters.length; y++)
+        emitter_1.Emitter.On(newEmitters[y], scope.setCallback);
+    scope.emitters = newEmitters;
 }
 function DestroyScope(scope) {
     if (!scope)

package/Store/Tree/observableTree.d.ts

@@ -1,34 +0,0 @@
-import { ObservableScope } from "../Tree/observableScope";
-export declare class ObservableTree {
-    private valuePathResolver?;
-    private undefinedScope;
-    private scopeCache;
-    private leafScopeCache;
-    private proxyCache;
-    private pathCache;
-    private rootStateMap;
-    constructor(valuePathResolver?: {
-        (value: string): string | undefined;
-    });
-    static UnwrapProxyValues(value: any): any;
-    Get<O>(path: string): O;
-    GetPathOf(value: any): string;
-    Scope<O, R = O>(path: string, callback?: {
-        (obj: O): R;
-    }): ObservableScope<O | R>;
-    Write(path: string, value: any): void;
-    WriteAll(data: Array<{
-        path: string;
-        value: any;
-    }>): void;
-    private GetParentScope;
-    private GetPropertyScope;
-    private GetValueProxy;
-    private ObjectProxyGetter;
-    private CreateObjectProxy;
-    private ArrayProxyGetter;
-    private CreateArrayProxy;
-    private CreateProxy;
-    private WritePath;
-    private UpdatePathCache;
-}