j-templates 7.0.76 → 7.0.78

package/DOM/createPropertyAssignment.js

@@ -72,8 +72,12 @@ function AssignValue(target, value) {
             const start = target.selectionStart;
             const end = target.selectionEnd;
             target.value = value;
-            if (target.ownerDocument.activeElement === target)
+            if (target.ownerDocument.activeElement === target) {
+                const type = target.type;
+                target.type = "text";
                 target.setSelectionRange(start, end);
+                target.type = type;
+            }
             break;
         }
         default:

package/DOM/domNodeConfig.js

@@ -48,6 +48,16 @@ function wrapPriorityUpdates(callback) {
         highPriority = currentPriority;
     };
 }
+function getHTMLNode(from, current) {
+    if (typeof from === "string") {
+        if (current?.nodeType === Node.TEXT_NODE) {
+            exports.DOMNodeConfig.setText(current, from);
+            return current;
+        }
+        return exports.DOMNodeConfig.createTextNode(from);
+    }
+    return from;
+}
 exports.DOMNodeConfig = {
     createNode(type, namespace) {
         if (type === "text")
@@ -136,8 +146,10 @@ exports.DOMNodeConfig = {
     },
     reconcileChildren(target, children) {
         if (!target.firstChild) {
-            for (let x = 0; x < children.length; x++)
-                target.appendChild(children[x]);
+            for (let x = 0; x < children.length; x++) {
+                const child = getHTMLNode(children[x]);
+                target.appendChild(child);
+            }
             return;
         }
         if (children.length === 0) {
@@ -148,7 +160,8 @@ exports.DOMNodeConfig = {
         let x = 0;
         let removed = false;
         for (; actualNode && x < children.length; x++) {
-            const expectedNode = children[x];
+            const child = children[x];
+            let expectedNode = getHTMLNode(child, actualNode);
             if (!removed && actualNode !== expectedNode) {
                 const remove = actualNode;
                 actualNode = actualNode.nextSibling;
@@ -165,14 +178,17 @@ exports.DOMNodeConfig = {
         }
         while (target.lastChild !== children[x - 1])
             target.removeChild(target.lastChild);
-        for (; x < children.length; x++)
-            target.appendChild(children[x]);
+        for (; x < children.length; x++) {
+            const child = getHTMLNode(children[x]);
+            target.appendChild(child);
+        }
     },
     reconcileChild(target, child) {
-        if (target.firstChild === child)
+        const newChild = getHTMLNode(child, target.firstChild);
+        if (target.firstChild === newChild)
             return;
-        target.appendChild(child);
-        while (target.firstChild !== child)
+        target.appendChild(newChild);
+        while (target.firstChild !== newChild)
             target.removeChild(target.firstChild);
     },
 };

package/DOM/elements.d.ts

@@ -5,7 +5,7 @@ export declare const div: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const a: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -13,7 +13,7 @@ export declare const a: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const b: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -21,7 +21,7 @@ export declare const b: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const button: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLButtonElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -29,7 +29,7 @@ export declare const button: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const h1: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -37,7 +37,7 @@ export declare const h1: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const h2: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -45,7 +45,7 @@ export declare const h2: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const h3: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -53,7 +53,7 @@ export declare const h3: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const input: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLInputElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -61,7 +61,7 @@ export declare const input: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const textarea: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLTextAreaElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -69,7 +69,7 @@ export declare const textarea: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const span: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -77,7 +77,7 @@ export declare const span: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const table: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -85,7 +85,7 @@ export declare const table: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const thead: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -93,7 +93,7 @@ export declare const thead: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const th: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -101,7 +101,7 @@ export declare const th: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const tbody: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -109,7 +109,7 @@ export declare const tbody: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const tr: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -117,7 +117,7 @@ export declare const tr: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const td: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -125,7 +125,7 @@ export declare const td: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const img: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLImageElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -133,7 +133,7 @@ export declare const img: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const video: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLVideoElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -141,7 +141,7 @@ export declare const video: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const select: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLSelectElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -149,7 +149,7 @@ export declare const select: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const option: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLOptionElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -157,7 +157,7 @@ export declare const option: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const aside: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -165,7 +165,7 @@ export declare const aside: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const p: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -173,7 +173,7 @@ export declare const p: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const label: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -181,7 +181,7 @@ export declare const label: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
 export declare const pre: <T>(config: {
     props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
     attrs?: import("../Node/vNode.types").FunctionOr<{
@@ -189,5 +189,29 @@ export declare const pre: <T>(config: {
     }>;
     on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
     data?: () => T | T[] | Promise<T[]> | Promise<T>;
-}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vNode;
-export declare const text: (callback: () => string) => import("../Node/vNode.types").vNode;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
+export declare const ul: <T>(config: {
+    props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
+    attrs?: import("../Node/vNode.types").FunctionOr<{
+        [name: string]: string;
+    }>;
+    on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
+    data?: () => T | T[] | Promise<T[]> | Promise<T>;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
+export declare const ol: <T>(config: {
+    props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
+    attrs?: import("../Node/vNode.types").FunctionOr<{
+        [name: string]: string;
+    }>;
+    on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
+    data?: () => T | T[] | Promise<T[]> | Promise<T>;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
+export declare const li: <T>(config: {
+    props?: import("../Node/vNode.types").FunctionOr<import("../Utils/utils.types").RecursivePartial<HTMLElement>>;
+    attrs?: import("../Node/vNode.types").FunctionOr<{
+        [name: string]: string;
+    }>;
+    on?: import("../Node/vNode.types").FunctionOr<import("../Node/vNode.types").vNodeEvents<HTMLElementEventMap>>;
+    data?: () => T | T[] | Promise<T[]> | Promise<T>;
+}, children?: import("../Node/vNode.types").vNode[] | import("../Node/vNode.types").vNodeChildrenFunction<T>) => import("../Node/vNode.types").vElementNode;
+export declare const text: (callback: () => string) => import("../Node/vNode.types").vElementNode;

package/DOM/elements.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.text = exports.pre = exports.label = exports.p = exports.aside = exports.option = exports.select = exports.video = exports.img = exports.td = exports.tr = exports.tbody = exports.th = exports.thead = exports.table = exports.span = exports.textarea = exports.input = exports.h3 = exports.h2 = exports.h1 = exports.button = exports.b = exports.a = exports.div = void 0;
+exports.text = exports.li = exports.ol = exports.ul = exports.pre = exports.label = exports.p = exports.aside = exports.option = exports.select = exports.video = exports.img = exports.td = exports.tr = exports.tbody = exports.th = exports.thead = exports.table = exports.span = exports.textarea = exports.input = exports.h3 = exports.h2 = exports.h1 = exports.button = exports.b = exports.a = exports.div = void 0;
 const vNode_1 = require("../Node/vNode");
 exports.div = vNode_1.vNode.ToFunction("div");
 exports.a = vNode_1.vNode.ToFunction("a");
@@ -26,6 +26,9 @@ exports.aside = vNode_1.vNode.ToFunction("aside");
 exports.p = vNode_1.vNode.ToFunction("p");
 exports.label = vNode_1.vNode.ToFunction("label");
 exports.pre = vNode_1.vNode.ToFunction("pre");
+exports.ul = vNode_1.vNode.ToFunction("ul");
+exports.ol = vNode_1.vNode.ToFunction("ol");
+exports.li = vNode_1.vNode.ToFunction("li");
 const textElement = vNode_1.vNode.ToFunction("text");
 const text = function (callback) {
     return textElement({ props: () => ({ nodeValue: callback() }) });

package/Node/component.d.ts

@@ -1,5 +1,5 @@
 import { ComponentEvents } from "./component.types";
-import { FunctionOr, vNode as vNodeType } from "./vNode.types";
+import { FunctionOr, vNode as vNodeType, vElementNode } from "./vNode.types";
 import { RecursivePartial } from "../Utils/utils.types";
 import { IObservableScope } from "../Store/Tree/observableScope";
 /**
@@ -33,12 +33,12 @@ export declare class Component<D = void, T = void, E = {}> {
     /**
      * Accessor for the component's virtual node.
      */
-    protected get VNode(): vNodeType;
+    protected get VNode(): vElementNode;
     /**
      * Accessor for the component's template collection.
      */
     protected get Templates(): T;
-    constructor(vNode: vNodeType, config: vComponentConfig<D, E>, templates: T);
+    constructor(vNode: vElementNode, config: vComponentConfig<D, E>, templates: T);
     /**
      * Returns the component's rendered vNode(s).
      * Override to provide custom rendering logic.
@@ -73,7 +73,7 @@ export declare namespace Component {
      * Function wraps the Component as a function that can be used to create vNode objects
      * and generate templates.
      */
-    function ToFunction<D, T, E, P = HTMLElement>(type: string, constructor: typeof Component<D, T, E>, namespace?: string): (config: vComponentConfig<D, E, P>, templates?: T) => vNodeType;
+    function ToFunction<D, T, E, P = HTMLElement>(type: string, constructor: typeof Component<D, T, E>, namespace?: string): (config: vComponentConfig<D, E, P>, templates?: T) => vElementNode;
     /**
      * Function registers the Component as a WebComponent as the provided name.
      */

package/Node/vNode.d.ts

@@ -1,5 +1,5 @@
 import { RecursivePartial } from "../Utils/utils.types";
-import { vNode as vNodeType, vNodeDefinition, FunctionOr, vNodeEvents, vNodeChildrenFunction } from "./vNode.types";
+import { vNode as vNodeType, vNodeDefinition, FunctionOr, vNodeEvents, vNodeChildrenFunction, vElementNode } from "./vNode.types";
 type vNodeConfig<P = HTMLElement, E = HTMLElementEventMap, T = never> = {
     props?: FunctionOr<RecursivePartial<P>>;
     attrs?: FunctionOr<{
@@ -9,13 +9,13 @@ type vNodeConfig<P = HTMLElement, E = HTMLElementEventMap, T = never> = {
     data?: () => T | Array<T> | Promise<Array<T>> | Promise<T>;
 };
 export declare namespace vNode {
-    function Create<P = HTMLElement, E = HTMLElementEventMap, T = never>(definition: vNodeDefinition<P, E, T>): vNodeType;
+    function Create<P = HTMLElement, E = HTMLElementEventMap, T = never>(definition: vNodeDefinition<P, E, T>): vElementNode;
     function CreateText(text: string): vNodeType;
     function Init(vnode: vNodeType): void;
     function InitAll(vnodes: vNodeType[]): void;
     function Destroy(vnode: vNodeType): void;
     function DestroyAll(vnodes: vNodeType[]): void;
-    function ToFunction<P = HTMLElement, E = HTMLElementEventMap>(type: string, namespace?: string): <T>(config: vNodeConfig<P, E, T>, children?: vNodeType[] | vNodeChildrenFunction<T>) => vNodeType;
+    function ToFunction<P = HTMLElement, E = HTMLElementEventMap>(type: string, namespace?: string): <T>(config: vNodeConfig<P, E, T>, children?: vNodeType[] | vNodeChildrenFunction<T>) => vElementNode;
     function Attach(node: any, vnode: vNodeType): vNodeType;
 }
 export {};

package/Node/vNode.js

@@ -8,6 +8,7 @@ const functions_1 = require("../Utils/functions");
 const injector_1 = require("../Utils/injector");
 const thread_1 = require("../Utils/thread");
 const nodeConfig_1 = require("./nodeConfig");
+const vNode_types_1 = require("./vNode.types");
 var vNode;
 (function (vNode) {
     function Create(definition) {
@@ -43,7 +44,7 @@ var vNode;
     }
     vNode.CreateText = CreateText;
     function Init(vnode) {
-        if (vnode.definition === null)
+        if ((0, vNode_types_1.isStringNode)(vnode) || vnode.definition === null)
             return;
         InitNode(vnode);
     }
@@ -54,7 +55,7 @@ var vNode;
     }
     vNode.InitAll = InitAll;
     function Destroy(vnode) {
-        if (vnode.destroyed)
+        if ((0, vNode_types_1.isStringNode)(vnode) || vnode.destroyed)
             return;
         vnode.destroyed = true;
         vnode.component?.Destroy();
@@ -212,7 +213,7 @@ function ToArray(result) {
 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]);
+        const children = CreateNodeArray(nextChildren);
         for (let x = 0; x < nodeArray.length; x++) {
             vNode.DestroyAll(nodeArray[x][1]);
             Store_1.ObservableScope.Destroy(nodeArray[x][2]);
@@ -304,22 +305,13 @@ function EvaluateNextNodesLarge(injector, getNextChildren, nextData, nodeArray)
     }
     return nextNodes;
 }
-function CreateNodeArray(children, previousChildren) {
-    if (Array.isArray(children))
-        return children;
-    if (typeof children === "string") {
-        const firstPrevChild = previousChildren?.[0];
-        if (firstPrevChild &&
-            firstPrevChild.node &&
-            firstPrevChild.type === "text") {
-            nodeConfig_1.NodeConfig.setText(firstPrevChild.node, children);
-            return previousChildren.length === 1
-                ? previousChildren
-                : [firstPrevChild];
-        }
-        return [vNode.CreateText(children)];
+function CreateNodeArray(children) {
+    if (!Array.isArray(children)) {
+        return typeof children === "string"
+            ? [{ type: "string", node: children }]
+            : [children];
     }
-    return [children];
+    return children;
 }
 function UpdateChildren(vnode, init = false, skipInit = false) {
     if (!vnode.children)
@@ -335,15 +327,16 @@ function UpdateChildren(vnode, init = false, skipInit = false) {
         if (vnode.destroyed || children !== vnode.children)
             return;
         for (let x = 0; !skipInit && x < children.length; x++)
-            for (let y = 0; y < children[x][1].length; y++)
-                if (children[x][1][y].definition) {
-                    const childNode = children[x][1][y];
+            for (let y = 0; y < children[x][1].length; y++) {
+                const childNode = children[x][1][y];
+                if (!(0, vNode_types_1.isStringNode)(childNode) && childNode.definition) {
                     (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;

package/Node/vNode.types.d.ts

@@ -14,7 +14,11 @@ export type vNodeEvents<E extends {
     };
 };
 export type vNodeChildrenFunction<T> = ((data: T) => vNode | vNode[]) | ((data: T) => string);
-export type vNode = {
+export type vStringNode = {
+    type: "string";
+    node: string;
+};
+export type vElementNode = {
     type: string;
     definition: vNodeDefinition<any, any, any>;
     injector: Injector;
@@ -25,6 +29,8 @@ export type vNode = {
     scopes: IObservableScope<unknown>[];
     component: Component;
 };
+export type vNode = vStringNode | vElementNode;
+export declare function isStringNode(vnode: vNode): vnode is vStringNode;
 export type vNodeDefinition<P = HTMLElement, E = HTMLElementEventMap, T = never> = {
     type: string;
     node?: Node;

package/Node/vNode.types.js

@@ -1,2 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.isStringNode = isStringNode;
+function isStringNode(vnode) {
+    return vnode.type === "string";
+}

package/package.json

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