j-templates 7.0.55 → 7.0.57

package/DOM/createAssignment.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CreateAssignment = CreateAssignment;
+const DEFAULT_ASSIGNMENT = {};
 function CreateAssignment(target, createAssignment) {
     let last;
     let writeTo = {};
@@ -8,6 +9,7 @@ function CreateAssignment(target, createAssignment) {
         if (next === last)
             return;
         last = next;
+        next = !next ? DEFAULT_ASSIGNMENT : next;
         for (const key in writeTo) {
             writeTo[key](next);
         }

package/DOM/createPropertyAssignment.js

@@ -22,6 +22,7 @@ function CreatePropertyAssignment(target, property) {
                 childAssignment(nextValue);
             }
         }
+        lastValue = nextValue;
     };
 }
 function CreateRootPropertyAssignment(target, property) {
@@ -59,6 +60,7 @@ function CreateRootPropertyAssignment(target, property) {
                 }
             }
         }
+        lastValue = nextValue;
     };
 }
 function AssignNodeValue(target, value) {

package/DOM/domNodeConfig.js

@@ -100,6 +100,9 @@ exports.DOMNodeConfig = {
     setText(target, text) {
         target.nodeValue = text;
     },
+    copyText(source, target) {
+        target.nodeValue = source.nodeValue;
+    },
     getAttribute(target, attribute) {
         return target.getAttribute(attribute);
     },
@@ -133,15 +136,8 @@ exports.DOMNodeConfig = {
     },
     reconcileChildren(target, children) {
         if (!target.firstChild) {
-            if (children.length > 10) {
-                const fragment = new DocumentFragment();
-                for (let x = 0; x < children.length; x++)
-                    fragment.appendChild(children[x]);
-                target.appendChild(fragment);
-            }
-            else
-                for (let x = 0; x < children.length; x++)
-                    target.appendChild(children[x]);
+            for (let x = 0; x < children.length; x++)
+                target.appendChild(children[x]);
             return;
         }
         if (children.length === 0) {
@@ -169,14 +165,11 @@ exports.DOMNodeConfig = {
         }
         while (target.lastChild !== children[x - 1])
             target.removeChild(target.lastChild);
-        if (children.length - x > 10) {
-            const fragment = new DocumentFragment();
-            for (; x < children.length; x++)
-                fragment.appendChild(children[x]);
-            target.appendChild(fragment);
-        }
-        else
-            for (; x < children.length; x++)
-                target.appendChild(children[x]);
+        for (; x < children.length; x++)
+            target.appendChild(children[x]);
+    },
+    reconcileChild(target, child) {
+        if (target.childElementCount > 1 || target.firstChild !== child)
+            target.replaceChildren(child);
     },
 };

package/Node/nodeConfig.d.ts

@@ -4,6 +4,7 @@ export interface INodeConfig {
     scheduleUpdate(callback: () => void): void;
     wrapPriorityUpdates<P extends any[]>(callback: (...args: P) => void): (...args: P) => void;
     setText(target: any, text: string): void;
+    copyText(source: any, target: any): void;
     isTextNode(target: any): boolean;
     getAttribute(target: any, attribute: string): string;
     setAttribute(target: any, attribute: string, value: string): void;
@@ -38,5 +39,6 @@ export interface INodeConfig {
     getNextSibling(target: any): any;
     replaceChildren(target: any, children: any[]): void;
     reconcileChildren(target: any, children: any[]): void;
+    reconcileChild(target: any, child: any): void;
 }
 export declare const NodeConfig: INodeConfig;

package/Node/vNode.js

@@ -4,7 +4,6 @@ exports.vNode = void 0;
 const Store_1 = require("../Store");
 const emitter_1 = require("../Utils/emitter");
 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;
@@ -13,7 +12,11 @@ var vNode;
         return {
             definition,
             type: definition.type,
-            injector: injector_1.Injector.Current() ?? new injector_1.Injector(),
+            injector: definition.componentConstructor
+                ? injector_1.Injector.Scope(injector_1.Injector.Current(), function () {
+                    return new injector_1.Injector();
+                })
+                : (injector_1.Injector.Current() ?? new injector_1.Injector()),
             node: definition.node ?? null,
             children: null,
             destroyed: false,
@@ -55,7 +58,10 @@ var vNode;
         vnode.component?.Destroy();
         Store_1.ObservableScope.DestroyAll(vnode.scopes);
         vnode.onDestroyed && emitter_1.Emitter.Emit(vnode.onDestroyed);
-        vnode.children && DestroyAll(vnode.children);
+        for (let x = 0; vnode.children && x < vnode.children.length; x++) {
+            DestroyAll(vnode.children[x][1]);
+            Store_1.ObservableScope.Destroy(vnode.children[x][2]);
+        }
     }
     vNode.Destroy = Destroy;
     function DestroyAll(vnodes) {
@@ -93,10 +99,11 @@ function InitNode(vnode) {
     if (props) {
         const 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, ScheduledAssignment(assignProperties));
-            const value = Store_1.ObservableScope.Peek(scope);
+            const [value, scope] = Store_1.ObservableScope.CreateIf(props);
+            if (scope) {
+                vnode.scopes.push(scope);
+                Store_1.ObservableScope.Watch(scope, ScheduledAssignment(assignProperties));
+            }
             assignProperties(value);
         }
         else
@@ -105,27 +112,24 @@ function InitNode(vnode) {
     if (on) {
         const 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, ScheduledAssignment(assignEvents));
-            const value = Store_1.ObservableScope.Peek(scope);
+            const [value, scope] = Store_1.ObservableScope.CreateIf(on);
+            if (scope) {
+                vnode.scopes.push(scope);
+                Store_1.ObservableScope.Watch(scope, ScheduledAssignment(assignEvents));
+            }
             assignEvents(value);
         }
         else
             assignEvents(on);
-        vnode.onDestroyed ??= emitter_1.Emitter.Create();
-        emitter_1.Emitter.On(vnode.onDestroyed, function () {
-            assignEvents(null);
-            return true;
-        });
     }
     if (attrs) {
         const 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, ScheduledAssignment(assignAttributes));
-            const value = Store_1.ObservableScope.Peek(scope);
+            const [value, scope] = Store_1.ObservableScope.CreateIf(attrs);
+            if (scope) {
+                vnode.scopes.push(scope);
+                Store_1.ObservableScope.Watch(scope, ScheduledAssignment(assignAttributes));
+            }
             assignAttributes(value);
         }
         else
@@ -134,29 +138,14 @@ function InitNode(vnode) {
     if (componentConstructor) {
         vnode.component = new componentConstructor(vnode);
         vnode.component.Bound();
-        const componentScope = Store_1.ObservableScope.Create(function () {
-            let nodes = injector_1.Injector.Scope(vnode.injector, function () {
-                return vnode.component.Template();
-            });
-            if (!Array.isArray(nodes))
-                nodes = [nodes];
-            return nodes;
-        });
-        vnode.scopes.push(componentScope);
-        Store_1.ObservableScope.Watch(componentScope, CreateScheduledCallback(function () {
-            if (vnode.destroyed)
-                return;
-            const nodes = injector_1.Injector.Scope(vnode.injector, Store_1.ObservableScope.Peek, componentScope);
-            vNode.DestroyAll(vnode.children);
-            vnode.children = nodes;
-            UpdateChildren(vnode);
-        }));
-        const nodes = Store_1.ObservableScope.Peek(componentScope);
-        vnode.children = nodes;
+        function componentChildren() {
+            return vnode.component.Template();
+        }
+        Children(vnode, componentChildren, DefaultData);
     }
     else if (childrenArray) {
-        vnode.children = childrenArray;
-        vNode.InitAll(vnode.children);
+        vnode.children = [[undefined, childrenArray, null]];
+        vNode.InitAll(childrenArray);
     }
     else if (children) {
         Children(vnode, children, data);
@@ -175,80 +164,146 @@ function Children(vnode, children, data) {
     }));
     AssignChildren(vnode, childrenScope);
 }
+const DEFAULT_DATA = [undefined];
+function DefaultData() {
+    return DEFAULT_DATA;
+}
 function CreateChildrenScope(vnode, children, data) {
-    if (data === undefined)
-        return Store_1.ObservableScope.Create(WrapStaticChildren(vnode, children));
-    const dataScope = Store_1.ObservableScope.Create(data);
-    data = function () {
-        const result = Store_1.ObservableScope.Value(dataScope);
-        if (!result)
-            return [];
-        if (Array.isArray(result))
-            return result;
-        return [result];
-    };
-    const nodeList = list_1.List.Create();
-    const scope = Store_1.ObservableScope.Create(WrapChildren(vnode.injector, children, data, nodeList));
-    Store_1.ObservableScope.OnDestroyed(scope, function () {
-        DestroyNodeList(nodeList);
-        Store_1.ObservableScope.Destroy(dataScope);
-        return true;
-    });
+    let dataScope;
+    if (data !== undefined) {
+        dataScope = Store_1.ObservableScope.Create(data);
+        data = function () {
+            const result = Store_1.ObservableScope.Value(dataScope);
+            if (!result)
+                return [];
+            if (Array.isArray(result))
+                return result;
+            return [result];
+        };
+    }
+    else
+        data = DefaultData;
+    const scope = Store_1.ObservableScope.Create(WrapChildren(vnode.injector, children, data));
+    dataScope &&
+        Store_1.ObservableScope.OnDestroyed(scope, function () {
+            Store_1.ObservableScope.Destroy(dataScope);
+            return true;
+        });
     return scope;
 }
-function WrapStaticChildren(vnode, children) {
-    return function () {
-        vnode.children && vNode.DestroyAll(vnode.children);
-        const childNodes = injector_1.Injector.Scope(vnode.injector, children, undefined);
-        return CreateNodeArray(childNodes, vnode.children);
-    };
-}
-function WrapChildren(injector, children, data, nodeList) {
+function WrapChildren(injector, children, data) {
+    let nodeArray = [];
     return function () {
         const nextData = data();
         switch (nextData.length) {
-            case 0:
-                DestroyNodeList(nodeList);
-                return [];
-            default: {
-                const nodeListMap = list_1.List.ToListMap(nodeList, GetData);
-                const nextNodeList = list_1.List.Create();
-                const nextNodeArray = [];
-                for (let x = 0; x < nextData.length; x++) {
-                    const data = nextData[x];
-                    const existingNodeList = nodeListMap.get(data);
-                    const existingNode = existingNodeList && list_1.List.PopNode(existingNodeList);
-                    if (existingNode) {
-                        list_1.List.AddNode(nextNodeList, existingNode);
-                        if (existingNode.data.scope.dirty) {
-                            vNode.DestroyAll(existingNode.data.nodes);
-                            existingNode.data.nodes = Store_1.ObservableScope.Value(existingNode.data.scope);
-                        }
-                        else
-                            Store_1.ObservableScope.Touch(existingNode.data.scope);
-                    }
-                    else {
-                        nodeListMap.delete(data);
-                        const childrenScope = Store_1.ObservableScope.Create(function () {
-                            const childNodes = injector_1.Injector.Scope(injector, children, data);
-                            return CreateNodeArray(childNodes);
-                        });
-                        list_1.List.Add(nextNodeList, {
-                            data,
-                            nodes: Store_1.ObservableScope.Value(childrenScope),
-                            scope: childrenScope,
-                        });
-                    }
-                    nextNodeArray.push(...nextNodeList.tail.data.nodes);
+            case 0: {
+                for (let x = 0; x < nodeArray.length; x++) {
+                    vNode.DestroyAll(nodeArray[x][1]);
+                    Store_1.ObservableScope.Destroy(nodeArray[x][2]);
                 }
-                for (let value of nodeListMap.values())
-                    DestroyNodeList(value);
-                list_1.List.Append(nodeList, nextNodeList);
-                return nextNodeArray;
+                nodeArray.splice(0);
+            }
+            default: {
+                if (nodeArray.length < 21)
+                    nodeArray = EvaluateNextNodesSmall(injector, children, nextData, nodeArray);
+                else
+                    nodeArray = EvaluateNextNodesLarge(injector, children, nextData, nodeArray);
             }
         }
+        return nodeArray;
     };
 }
+function EvaluateNextNodesSmall(injector, getNextChildren, nextData, nodeArray) {
+    if (nextData === DEFAULT_DATA) {
+        const nextChildren = injector_1.Injector.Scope(injector, getNextChildren, nextData[0]);
+        const children = CreateNodeArray(nextChildren, nodeArray[0]?.[1]);
+        for (let x = 0; x < nodeArray.length; x++) {
+            vNode.DestroyAll(nodeArray[x][1]);
+            Store_1.ObservableScope.Destroy(nodeArray[x][2]);
+        }
+        return [
+            [undefined, children, null],
+        ];
+    }
+    const nextNodes = new Array(nextData.length);
+    for (let x = 0; x < nextData.length; x++) {
+        const data = nextData[x];
+        let i = 0;
+        for (; i < nodeArray.length &&
+            (nodeArray[i] === null || nodeArray[i][0] !== data); i++) { }
+        if (i !== nodeArray.length) {
+            if (nodeArray[i][2]) {
+                const scope = nodeArray[i][2];
+                const value = scope.value;
+                const updatedValue = Store_1.ObservableScope.Value(scope);
+                if (value !== updatedValue)
+                    nodeArray[i][1] = CreateNodeArray(updatedValue);
+            }
+            nextNodes[x] = nodeArray[i];
+            nodeArray[i] = null;
+        }
+        else {
+            const [nextChildren, scope] = Store_1.ObservableScope.CreateIf(function () {
+                return injector_1.Injector.Scope(injector, getNextChildren, data);
+            });
+            nextNodes[x] = [data, CreateNodeArray(nextChildren), scope];
+        }
+    }
+    for (let x = 0; x < nodeArray.length; x++) {
+        if (nodeArray[x] !== null) {
+            vNode.DestroyAll(nodeArray[x][1]);
+            Store_1.ObservableScope.Destroy(nodeArray[x][2]);
+        }
+    }
+    return nextNodes;
+}
+function EvaluateNextNodesLarge(injector, getNextChildren, nextData, nodeArray) {
+    const nextNodes = new Array(nextData.length);
+    const dataMap = new Map();
+    for (let x = 0; x < nodeArray.length; x++) {
+        const arr = dataMap.get(nodeArray[x][0]) ?? [];
+        arr.push(nodeArray[x]);
+        dataMap.set(nodeArray[x][0], arr);
+    }
+    for (let x = 0; x < nextData.length; x++) {
+        const data = nextData[x];
+        const currentChildren = dataMap.get(data);
+        let currentChildIndex = currentChildren ? currentChildren.length - 1 : -1;
+        for (; currentChildIndex >= 0 && currentChildren[currentChildIndex] === null; currentChildIndex--) { }
+        if (currentChildIndex !== -1) {
+            const currentChild = currentChildren[currentChildIndex];
+            if (currentChild[2]) {
+                const scope = currentChild[2];
+                const value = scope.value;
+                const updatedValue = Store_1.ObservableScope.Value(scope);
+                if (value !== updatedValue)
+                    currentChild[1] = CreateNodeArray(updatedValue);
+            }
+            if (currentChild[2]?.dirty) {
+                const nextChildren = Store_1.ObservableScope.Value(currentChild[2]);
+                currentChild[1] = CreateNodeArray(nextChildren);
+            }
+            nextNodes[x] = currentChild;
+            currentChildren[currentChildIndex] = null;
+            if (currentChildIndex === 0)
+                dataMap.delete(data);
+        }
+        else {
+            const [nextChildren, scope] = Store_1.ObservableScope.CreateIf(function () {
+                return injector_1.Injector.Scope(injector, getNextChildren, data);
+            });
+            nextNodes[x] = [data, CreateNodeArray(nextChildren), scope];
+        }
+    }
+    for (const value of dataMap.values()) {
+        for (let x = 0; x < value.length; x++) {
+            const row = value[x];
+            row && vNode.DestroyAll(row[1]);
+            row && Store_1.ObservableScope.Destroy(row[2]);
+        }
+    }
+    return nextNodes;
+}
 function CreateNodeArray(children, previousChildren) {
     if (Array.isArray(children))
         return children;
@@ -262,22 +317,10 @@ function CreateNodeArray(children, previousChildren) {
                 ? previousChildren
                 : [firstPrevChild];
         }
-        return [
-            vNode.CreateText(children),
-        ];
+        return [vNode.CreateText(children)];
     }
     return [children];
 }
-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);
-    }
-    list_1.List.Clear(nodeList);
-}
-function GetData(data) {
-    return data.data;
-}
 function AssignChildren(vnode, childrenScope) {
     const children = Store_1.ObservableScope.Peek(childrenScope);
     vnode.children = children;
@@ -286,9 +329,9 @@ function UpdateChildren(vnode, init = false, skipInit = false) {
     if (!vnode.children)
         return;
     if (vnode.children.length === 1 &&
-        vnode.children[0].type === "text" &&
-        vnode.children[0].node) {
-        nodeConfig_1.NodeConfig.reconcileChildren(vnode.node, [vnode.children[0].node]);
+        vnode.children[0][1].length === 1 &&
+        vnode.children[0][1][0].node) {
+        nodeConfig_1.NodeConfig.reconcileChild(vnode.node, vnode.children[0][1][0].node);
         return;
     }
     const children = vnode.children;
@@ -296,24 +339,32 @@ function UpdateChildren(vnode, init = false, skipInit = false) {
         if (vnode.destroyed || children !== vnode.children)
             return;
         for (let x = 0; !skipInit && x < children.length; x++)
-            if (children[x].definition) {
-                const childNode = children[x];
-                (0, thread_1.Schedule)(function () {
-                    if (vnode.destroyed || children !== vnode.children)
-                        return;
-                    vNode.Init(childNode);
-                });
-            }
+            for (let y = 0; y < children[x][1].length; y++)
+                if (children[x][1][y].definition) {
+                    const childNode = children[x][1][y];
+                    (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));
+            if (init || !async) {
+                if (vnode.children.length === 1 && vnode.children[0][1].length === 1)
+                    nodeConfig_1.NodeConfig.reconcileChild(vnode.node, vnode.children[0][1][0].node);
+                else
+                    nodeConfig_1.NodeConfig.reconcileChildren(vnode.node, vnode.children.flatMap((row) => row[1].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));
+                    if (vnode.children.length === 1 && vnode.children[0][1].length === 1)
+                        nodeConfig_1.NodeConfig.reconcileChild(vnode.node, vnode.children[0][1][0].node);
+                    else
+                        nodeConfig_1.NodeConfig.reconcileChildren(vnode.node, vnode.children.flatMap((row) => row[1].map((vnode) => vnode.node)));
                 });
         });
     });

package/Node/vNode.types.d.ts

@@ -19,7 +19,7 @@ export type vNode = {
     definition: vNodeDefinition<any, any, any>;
     injector: Injector;
     node: Node | null;
-    children: vNode[] | null;
+    children: [any, vNode[], IObservableScope<string | vNode | vNode[]> | null][] | null;
     destroyed: boolean;
     onDestroyed: Emitter | null;
     scopes: IObservableScope<unknown>[];

package/Store/Tree/observableScope.d.ts

@@ -47,6 +47,9 @@ export declare namespace ObservableScope {
     function Create<T>(valueFunction: {
         (): T | Promise<T>;
     }, calc?: boolean): IObservableScope<T>;
+    function CreateIf<T>(valueFunction: {
+        (): T | Promise<T>;
+    }): [T, IObservableScope<T> | null];
     function Register(emitter: Emitter): void;
     function Init<T>(scope: IObservableScope<T>): void;
     function Peek<T>(scope: IObservableScope<T>): T;

package/Store/Tree/observableScope.js

@@ -65,6 +65,21 @@ function WatchScope(scope) {
     watchState = parent;
     return value;
 }
+function WatchFunction(func) {
+    const parent = watchState;
+    watchState = [[], null, null];
+    const async = (0, functions_1.IsAsync)(func);
+    const result = func();
+    let scope = null;
+    if (watchState[0].length > 0 || async) {
+        scope = ObservableScope.Create(func);
+        UpdateEmitters(scope, watchState[0]);
+        scope.calcScopes = watchState[2];
+        UpdateValue(scope, result);
+    }
+    watchState = parent;
+    return [async ? null : result, scope];
+}
 function CalcScope(callback, idOverride) {
     if (watchState === null)
         return callback();
@@ -103,6 +118,10 @@ function CalcScope(callback, idOverride) {
         return scope;
     }
     ObservableScope.Create = Create;
+    function CreateIf(valueFunction) {
+        return WatchFunction(valueFunction);
+    }
+    ObservableScope.CreateIf = CreateIf;
     function Register(emitter) {
         if (watchState === null)
             return;
@@ -205,11 +224,11 @@ function OnSet(scope) {
     }
     DirtyScope(scope);
 }
-function UpdateValue(scope) {
+function UpdateValue(scope, valueOverride = undefined) {
     if (!scope.dirty)
         return;
     scope.dirty = false;
-    const value = WatchScope(scope);
+    const value = valueOverride === undefined ? WatchScope(scope) : valueOverride;
     if (scope.async) {
         scope.promise = value.then(function (result) {
             if (scope.destroyed)
@@ -248,11 +267,14 @@ function UpdateEmitters(scope, right) {
 function DestroyScope(scope) {
     if (!scope)
         return;
+    emitter_1.Emitter.Clear(scope.emitter);
     const scopes = scope.calcScopes && Object.values(scope.calcScopes);
     scopes && ObservableScope.DestroyAll(scopes);
     scope.calcScopes = null;
+    for (let x = 0; x < scope.emitters.length; x++)
+        emitter_1.Emitter.Remove(scope.emitters[x], scope.setCallback);
+    scope.calcScopes = null;
     scope.emitters = null;
-    emitter_1.Emitter.Clear(scope.emitter);
     scope.emitter = null;
     scope.getFunction = null;
     scope.setCallback = null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "j-templates",
-  "version": "7.0.55",
+  "version": "7.0.57",
   "description": "j-templates",
   "license": "MIT",
   "repository": "https://github.com/TypesInCode/jTemplates",