json-to-spec 21.1.1 → 23.1.1

package/docs/dist/min.js

@@ -1,116 +1,154 @@
-const u = {
-  version: "v21.0",
+const f = {
+  version: "v23.0",
   description: "Pure spec engine no document at all"
-}, i = (e) => {
+}, d = (e) => {
   typeof globalThis > "u" || !e || (globalThis.ks ?? (globalThis.ks = {}), globalThis.ks["json-to-spec"] = {
-    meta: u,
+    meta: f,
     buildSpecElement: e
   });
-}, f = ({ inSpec: e }) => {
-  const t = e;
-  return t == null;
-}, d = ({ inSpec: e }) => typeof Node < "u" && e instanceof Node, p = ({ inSpecJson: e }) => Array.isArray(e), y = ({ inArray: e = [], inShowLog: t = !1, inDataJson: o }) => {
-  const r = e, l = t, n = o;
-  return Array.isArray(r) ? r.map((c) => a({
-    inSpecJson: c,
-    inShowLog: l,
-    inDataJson: n
+}, y = ({ inSpec: e }) => {
+  const n = e;
+  return n == null;
+}, m = ({ inSpec: e }) => typeof Node < "u" && e instanceof Node, b = ({ inSpecJson: e }) => Array.isArray(e), A = ({ inArray: e = [], inShowLog: n = !1, inDataJson: o }) => {
+  const t = e, c = n, r = o;
+  return Array.isArray(t) ? t.map((s) => i({
+    inSpecJson: s,
+    inShowLog: c,
+    inDataJson: r
   })).flat().filter(Boolean) : [];
-}, s = (e, t) => typeof e != "string" ? e : e.replace(/\$\{([^}]+)\}/g, (o, r) => {
-  const l = r.trim().split(".");
-  let n = t;
-  for (const c of l) {
-    if (n == null)
+}, a = (e, n) => typeof e != "string" ? e : e.replace(/\$\{([^}]+)\}/g, (o, t) => {
+  const c = t.trim().split(".");
+  let r = n;
+  for (const s of c) {
+    if (r == null)
       return "";
-    n = n[c];
+    r = r[s];
   }
-  return n === null || typeof n == "string" || typeof n == "number" || typeof n == "boolean" ? String(n ?? "") : n;
-}), m = ({ inSpecJson: e, inData: t, inShowLog: o }) => ("key" in t && "value" in t ? "textContent" in e && (e.textContent = s(
-  e.textContent,
-  t
-)) : ("textContent" in e && (e.textContent = s(
-  e.textContent,
-  t
-)), "attributes" in e && (e.attributes = Object.fromEntries(
-  Object.entries(e.attributes).map(
-    ([r, l]) => [
-      r,
-      s(l, t)
-    ]
-  )
-)), "children" in e && (e.children = e.children.map((r) => a({
-  inSpecJson: r,
-  inShowLog: o,
-  inDataJson: t
-})))), e), b = ({ inTemplate: e, inDataAsArray: t }) => {
-  const o = t, r = e;
-  return o.map((n) => {
-    const c = structuredClone(r);
-    return a({
-      inSpecJson: c,
-      inDataJson: n
+  return r === null || typeof r == "string" || typeof r == "number" || typeof r == "boolean" ? String(r ?? "") : r;
+}), u = ({ inSpecJson: e, inData: n, inShowLog: o }) => {
+  const t = structuredClone(e);
+  return typeof n == "string" ? ("textContent" in t && (t.textContent === "${}" ? t.textContent = n : typeof t.textContent == "string" && (t.textContent = t.textContent.replaceAll("${}", () => n))), "attributes" in t && (t.attributes = Object.fromEntries(
+    Object.entries(t.attributes).map(
+      ([c, r]) => [
+        c,
+        r === "${}" ? n : typeof r == "string" ? r.replaceAll("${}", () => n) : r
+      ]
+    )
+  ))) : "key" in n && "value" in n ? "textContent" in t && (t.textContent = a(
+    t.textContent,
+    n
+  )) : ("textContent" in t && (t.textContent = a(
+    t.textContent,
+    n
+  )), "attributes" in t && (t.attributes = Object.fromEntries(
+    Object.entries(t.attributes).map(
+      ([c, r]) => [
+        c,
+        a(r, n)
+      ]
+    )
+  )), "children" in t && (t.children = t.children.map((c) => i({
+    inSpecJson: c,
+    inShowLog: o,
+    inDataJson: n
+  })))), t;
+}, j = ({ inTemplate: e, inDataAsArray: n }) => {
+  const o = n, t = e;
+  return Array.isArray(o) ? o.map((r) => {
+    const s = structuredClone(t);
+    return i({
+      inSpecJson: s,
+      inDataJson: r
     });
-  });
-}, h = ({ inTemplate: e, inDataAsObject: t }) => {
-  let o = [];
-  console.log("11111111--------loopObject : ", t);
-  for (const [r, l] of Object.entries(t)) {
-    const n = structuredClone(e), c = a({
-      inSpecJson: n,
-      inDataJson: { key: r, value: l }
+  }) : [];
+}, S = ({ inTemplate: e, inDataAsObject: n }) => {
+  const o = n, t = e;
+  if (o === null || typeof o != "object")
+    return [];
+  const c = [];
+  for (const [r, s] of Object.entries(o)) {
+    const l = structuredClone(t), p = i({
+      inSpecJson: l,
+      inDataJson: {
+        key: r,
+        value: s
+      }
     });
-    o.push(c);
+    c.push(p);
   }
-  return o;
-}, a = ({ inSpecJson: e, inShowLog: t = !1, inDataJson: o } = {}) => {
-  if (f({ inSpec: e })) return null;
-  if (d({ inSpec: e })) return e;
-  if (p({ inSpecJson: e }))
-    return y({
+  return c;
+}, i = ({
+  inSpecJson: e,
+  inShowLog: n = !1,
+  inDataJson: o
+} = {}) => {
+  if (y({ inSpec: e }))
+    return null;
+  if (m({ inSpec: e }))
+    return e;
+  if (b({ inSpecJson: e }))
+    return A({
       inArray: e,
-      inShowLog: t,
+      inShowLog: n,
       inDataJson: o
     });
   if ("jsonToSpec" in e) {
-    if ("isSpecBuilt" in e)
-      return e;
     if (e.jsonToSpec.operation === "loopArray") {
-      const r = b({
+      const c = j({
         inTemplate: e.jsonToSpec.template,
         inDataAsArray: o[e.jsonToSpec.source]
+      }), {
+        jsonToSpec: r,
+        ...s
+      } = e, l = {
+        ...s,
+        children: c
+      };
+      return u({
+        inSpecJson: l,
+        inShowLog: n,
+        inData: o
       });
-      e.children = r;
     }
     if (e.jsonToSpec.operation === "loopObject") {
-      const r = h({
+      const c = S({
         inTemplate: e.jsonToSpec.template,
         inDataAsObject: o
+      }), {
+        jsonToSpec: r,
+        ...s
+      } = e, l = {
+        ...s,
+        children: c
+      };
+      return u({
+        inSpecJson: l,
+        inShowLog: n,
+        inData: o
       });
-      e.children = r;
     }
-    e.isSpecBuilt = !0;
   }
-  return m({
+  return u({
     inSpecJson: e,
-    inShowLog: t,
+    inShowLog: n,
     inData: o
   });
-}, A = ({
+}, T = ({
   specJson: e,
-  showLog: t,
+  showLog: n,
   dataJson: o
 }) => {
   try {
-    return a({
+    return i({
       inSpecJson: e,
-      inShowLog: t,
+      inShowLog: n,
       inDataJson: o
     });
-  } catch (r) {
-    console.log("error : ", r);
+  } catch (t) {
+    console.log("error : ", t);
   }
 };
-i(A);
+d(T);
 export {
-  A as default
+  T as default
 };

package/docs/dist/v23/min.js

@@ -0,0 +1,154 @@
+const f = {
+  version: "v23.0",
+  description: "Pure spec engine no document at all"
+}, d = (e) => {
+  typeof globalThis > "u" || !e || (globalThis.ks ?? (globalThis.ks = {}), globalThis.ks["json-to-spec"] = {
+    meta: f,
+    buildSpecElement: e
+  });
+}, y = ({ inSpec: e }) => {
+  const n = e;
+  return n == null;
+}, m = ({ inSpec: e }) => typeof Node < "u" && e instanceof Node, b = ({ inSpecJson: e }) => Array.isArray(e), A = ({ inArray: e = [], inShowLog: n = !1, inDataJson: o }) => {
+  const t = e, c = n, r = o;
+  return Array.isArray(t) ? t.map((s) => i({
+    inSpecJson: s,
+    inShowLog: c,
+    inDataJson: r
+  })).flat().filter(Boolean) : [];
+}, a = (e, n) => typeof e != "string" ? e : e.replace(/\$\{([^}]+)\}/g, (o, t) => {
+  const c = t.trim().split(".");
+  let r = n;
+  for (const s of c) {
+    if (r == null)
+      return "";
+    r = r[s];
+  }
+  return r === null || typeof r == "string" || typeof r == "number" || typeof r == "boolean" ? String(r ?? "") : r;
+}), u = ({ inSpecJson: e, inData: n, inShowLog: o }) => {
+  const t = structuredClone(e);
+  return typeof n == "string" ? ("textContent" in t && (t.textContent === "${}" ? t.textContent = n : typeof t.textContent == "string" && (t.textContent = t.textContent.replaceAll("${}", () => n))), "attributes" in t && (t.attributes = Object.fromEntries(
+    Object.entries(t.attributes).map(
+      ([c, r]) => [
+        c,
+        r === "${}" ? n : typeof r == "string" ? r.replaceAll("${}", () => n) : r
+      ]
+    )
+  ))) : "key" in n && "value" in n ? "textContent" in t && (t.textContent = a(
+    t.textContent,
+    n
+  )) : ("textContent" in t && (t.textContent = a(
+    t.textContent,
+    n
+  )), "attributes" in t && (t.attributes = Object.fromEntries(
+    Object.entries(t.attributes).map(
+      ([c, r]) => [
+        c,
+        a(r, n)
+      ]
+    )
+  )), "children" in t && (t.children = t.children.map((c) => i({
+    inSpecJson: c,
+    inShowLog: o,
+    inDataJson: n
+  })))), t;
+}, j = ({ inTemplate: e, inDataAsArray: n }) => {
+  const o = n, t = e;
+  return Array.isArray(o) ? o.map((r) => {
+    const s = structuredClone(t);
+    return i({
+      inSpecJson: s,
+      inDataJson: r
+    });
+  }) : [];
+}, S = ({ inTemplate: e, inDataAsObject: n }) => {
+  const o = n, t = e;
+  if (o === null || typeof o != "object")
+    return [];
+  const c = [];
+  for (const [r, s] of Object.entries(o)) {
+    const l = structuredClone(t), p = i({
+      inSpecJson: l,
+      inDataJson: {
+        key: r,
+        value: s
+      }
+    });
+    c.push(p);
+  }
+  return c;
+}, i = ({
+  inSpecJson: e,
+  inShowLog: n = !1,
+  inDataJson: o
+} = {}) => {
+  if (y({ inSpec: e }))
+    return null;
+  if (m({ inSpec: e }))
+    return e;
+  if (b({ inSpecJson: e }))
+    return A({
+      inArray: e,
+      inShowLog: n,
+      inDataJson: o
+    });
+  if ("jsonToSpec" in e) {
+    if (e.jsonToSpec.operation === "loopArray") {
+      const c = j({
+        inTemplate: e.jsonToSpec.template,
+        inDataAsArray: o[e.jsonToSpec.source]
+      }), {
+        jsonToSpec: r,
+        ...s
+      } = e, l = {
+        ...s,
+        children: c
+      };
+      return u({
+        inSpecJson: l,
+        inShowLog: n,
+        inData: o
+      });
+    }
+    if (e.jsonToSpec.operation === "loopObject") {
+      const c = S({
+        inTemplate: e.jsonToSpec.template,
+        inDataAsObject: o
+      }), {
+        jsonToSpec: r,
+        ...s
+      } = e, l = {
+        ...s,
+        children: c
+      };
+      return u({
+        inSpecJson: l,
+        inShowLog: n,
+        inData: o
+      });
+    }
+  }
+  return u({
+    inSpecJson: e,
+    inShowLog: n,
+    inData: o
+  });
+}, T = ({
+  specJson: e,
+  showLog: n,
+  dataJson: o
+}) => {
+  try {
+    return i({
+      inSpecJson: e,
+      inShowLog: n,
+      inDataJson: o
+    });
+  } catch (t) {
+    console.log("error : ", t);
+  }
+};
+d(T);
+export {
+  T as default
+};

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "json-to-spec",
-  "version": "21.1.1",
+  "version": "23.1.1",
   "description": "Pure JSON Specification Compiler with jsonToSpec namespace: (structure, data) -> Spec JSON",
-  "main": "src/v19/index.js",
-  "module": "./src/v19/index.js",
+  "main": "src/v23/index.js",
+  "module": "./src/v23/index.js",
   "files": [
     "index.js",
     "src",
@@ -35,9 +35,9 @@
   "type": "module",
   "exports": {
     ".": {
-      "import": "./src/v19/index.js",
-      "require": "./src/v19/index.js",
-      "default": "./src/v19/index.js"
+      "import": "./src/v23/index.js",
+      "require": "./src/v23/index.js",
+      "default": "./src/v23/index.js"
     }
   },
   "bugs": {

package/src/index.js

@@ -1,2 +1,2 @@
-export { default } from "./v21/index.js";
-export * from "./v21/index.js";
+export { default } from "./v23/index.js";
+export * from "./v23/index.js";

package/src/v22/buildSpec/buildChildrenNodes.js

@@ -0,0 +1,24 @@
+import dispatchSpec from "./index.js";
+
+export const buildChildrenNodes = ({ inChildren, inShowLog = false, inOutput }) => {
+    const localChildren = inChildren;
+    const localShowLog = inShowLog;
+    const localOutput = inOutput;
+
+    if (!Array.isArray(localChildren)) return [];
+
+    return localChildren.map(child => {
+        if (typeof child === "string" || typeof child === "number") {
+            return typeof document !== "undefined"
+                ? document.createTextNode(String(child))
+                : String(child);
+        };
+        return dispatchSpec({
+            inSpec: child,
+            inShowLog: localShowLog,
+            inOutput: localOutput
+        });
+    }).flat().filter(Boolean);
+};
+
+export default buildChildrenNodes;

package/src/v22/buildSpec/buildSingleElement.js

@@ -0,0 +1,18 @@
+import buildChildrenNodes from "./buildChildrenNodes.js";
+import forSpecFunc from "./forSpec/v3/index.js";
+
+export const buildSingleElement = ({ inSpecJson, inShowLog = false, inDataJson }) => {
+
+    // debugger;
+
+    // const localChildrenNodes = Array.isArray(inSpecJson.children) && inSpecJson.children.length > 0
+    //     ? buildChildrenNodes({
+    //         inChildren: inSpecJson.children,
+    //         inShowLog, inOutput: localOutput
+    //     })
+    //     : [];
+
+    return forSpecFunc({ inSpecJson, inData: inDataJson });
+};
+
+export default buildSingleElement;

package/src/v22/buildSpec/buildSpecArray.js

@@ -0,0 +1,16 @@
+import dispatchSpec from "./index.js";
+
+export const buildSpecArray = ({ inArray = [], inShowLog = false, inDataJson }) => {
+    const localArray = inArray;
+    const localShowLog = inShowLog;
+    const localDataJson = inDataJson;
+
+    if (!Array.isArray(localArray)) return [];
+
+    return localArray.map(item => dispatchSpec({
+        inSpecJson: item,
+        inShowLog: localShowLog, inDataJson: localDataJson
+    })).flat().filter(Boolean);
+};
+
+export default buildSpecArray;

package/src/v22/buildSpec/forArray/v1/index.js

@@ -0,0 +1,27 @@
+import dispatchSpec from "../../index.js";
+
+const startFunc = ({ inTemplate, inDataAsArray }) => {
+
+    const localDataAsArray = inDataAsArray;
+    const localTemplate = inTemplate;
+
+    if (!Array.isArray(localDataAsArray)) {
+        return [];
+    };
+
+    const childrenArray = localDataAsArray.map(element => {
+
+        // console.log("OUTER forArray element:", element);
+
+        const newTemplate = structuredClone(localTemplate);
+
+        return dispatchSpec({
+            inSpecJson: newTemplate,
+            inDataJson: element
+        });
+    });
+
+    return childrenArray;
+};
+
+export default startFunc;

package/src/v22/buildSpec/forObject/v1/index.js

@@ -0,0 +1,47 @@
+import dispatchSpec from "../../index.js";
+
+const startFunc = ({ inTemplate, inDataAsObject }) => {
+
+    const localDataAsObject = inDataAsObject;
+    const localTemplate = inTemplate;
+
+    if (
+        localDataAsObject === null ||
+        typeof localDataAsObject !== "object"
+    ) {
+        return [];
+    };
+
+    const childrenArray = [];
+
+    for (const [key, value] of Object.entries(localDataAsObject)) {
+
+        // console.log(
+        //     "INNER:",
+        //     key,
+        //     value,
+        //     typeof value
+        // );
+
+        const newTemplate = structuredClone(localTemplate);
+
+        const createdElement = dispatchSpec({
+            inSpecJson: newTemplate,
+            inDataJson: {
+                key,
+                value
+            }
+        });
+
+        // console.log(
+        //     "INNER createdElement:",
+        //     createdElement
+        // );
+
+        childrenArray.push(createdElement);
+    };
+
+    return childrenArray;
+};
+
+export default startFunc;

package/src/v22/buildSpec/forSpec/v3/index.js

@@ -0,0 +1,84 @@
+import buildSpec from "../../index.js";
+
+const resolveTemplate = (template, data) => {
+    if (typeof template !== "string") {
+        return template;
+    }
+
+    return template.replace(/\$\{([^}]+)\}/g, (_, path) => {
+
+        const keys = path.trim().split(".");
+
+        let value = data;
+
+        for (const key of keys) {
+            if (value === null || value === undefined) {
+                return "";
+            }
+
+            value = value[key];
+        }
+
+        if (
+            value === null ||
+            typeof value === "string" ||
+            typeof value === "number" ||
+            typeof value === "boolean"
+        ) {
+            return String(value ?? "");
+        }
+
+        return value;
+    });
+};
+
+const startFunc = ({ inSpecJson, inData, inShowLog }) => {
+
+    // Create a completely new tree.
+    const newSpec = structuredClone(inSpecJson);
+
+    if ("key" in inData && "value" in inData) {
+
+        if ("textContent" in newSpec) {
+            newSpec.textContent = resolveTemplate(
+                newSpec.textContent,
+                inData
+            );
+        };
+
+    } else {
+
+        if ("textContent" in newSpec) {
+            newSpec.textContent = resolveTemplate(
+                newSpec.textContent,
+                inData
+            );
+        };
+
+        if ("attributes" in newSpec) {
+            newSpec.attributes = Object.fromEntries(
+                Object.entries(newSpec.attributes).map(
+                    ([attributeName, attributeValue]) => [
+                        attributeName,
+                        resolveTemplate(attributeValue, inData)
+                    ]
+                )
+            );
+        };
+
+        if ("children" in newSpec) {
+            newSpec.children = newSpec.children.map((child) => {
+                return buildSpec({
+                    inSpecJson: child,
+                    inShowLog: inShowLog,
+                    inDataJson: inData
+                });
+            });
+        };
+
+    };
+
+    return newSpec;
+};
+
+export default startFunc;

package/src/v22/buildSpec/forSpec.js

@@ -0,0 +1,76 @@
+import domElementBuilder from "./elementBuilder/index.js";
+import buildChildrenNodes from "./buildChildrenNodes.js";
+
+const resolvePath = (path, data) => {
+    const parts = path.split(".");
+
+    let value = data;
+
+    for (const part of parts) {
+        if (value === null || value === undefined) {
+            return undefined;
+        }
+
+        value = value[part];
+    }
+
+    return value;
+};
+
+const replaceValue = (value, data) => {
+
+    if (typeof value !== "string") {
+        return value;
+    }
+
+    const match = value.match(/^\$\{(.+?)\}$/);
+
+    if (!match) {
+        return value;
+    }
+
+    return resolvePath(match[1], data);
+};
+
+export const buildSingleElement = ({ raka, inShowLog = false, poka }) => {
+    if (!raka?.tagName) {
+        if (localShowLog) {
+            console.warn("[json-to-dom v23] Missing tagName on spec:", raka);
+        }
+        return null;
+    };
+
+    const localChildrenNodes = Array.isArray(raka.children) && raka.children.length > 0
+        ? buildChildrenNodes({
+            inChildren: raka.children,
+            inShowLog: localShowLog, inOutput: localOutput
+        })
+        : [];
+
+
+    if (poka.type === "dom") {
+        return domElementBuilder({
+            raka: {
+                ...raka,
+                children: localChildrenNodes
+            }
+        });
+    };
+
+    if (poka.type === "spec") {
+        // raka.textContent = poka.data;
+        console.log("raka :", raka, poka);
+        debugger;
+        raka.textContent = replaceValue(raka.textContent, poka.data);
+
+        return raka;
+        // return domElementBuilder({
+        //     inSpec: {
+        //         ...localSpec,
+        //         children: localChildrenNodes
+        //     }
+        // });
+    };
+};
+
+export default buildSingleElement;

package/src/v22/buildSpec/guards.js

@@ -0,0 +1,26 @@
+export const isNullOrUndefined = ({ inSpec }) => {
+    const localSpec = inSpec;
+    return localSpec === null || localSpec === undefined;
+};
+
+export const isDomNode = ({ inSpec }) => {
+    const localSpec = inSpec;
+    return typeof Node !== "undefined" && localSpec instanceof Node;
+};
+
+export const isSpecArray = ({ inSpecJson }) => {
+    const localSpec = inSpecJson;
+    return Array.isArray(localSpec);
+};
+
+export const isSpecObject = ({ inSpec }) => {
+    const localSpec = inSpec;
+    return typeof localSpec === "object" && localSpec !== null && !Array.isArray(localSpec);
+};
+
+export default {
+    isNullOrUndefined,
+    isDomNode,
+    isSpecArray,
+    isSpecObject
+};

package/src/v22/buildSpec/index.js

@@ -0,0 +1,97 @@
+import {
+    isNullOrUndefined,
+    isDomNode,
+    isSpecArray,
+    isSpecObject
+} from "./guards.js";
+
+import buildSpecArray from "./buildSpecArray.js";
+import buildSingleElement from "./forSpec/v3/index.js";
+import forArray from "./forArray/v1/index.js";
+import forObject from "./forObject/v1/index.js";
+
+const dispatchSpec = ({
+    inSpecJson,
+    inShowLog = false,
+    inDataJson
+} = {}) => {
+
+    if (isNullOrUndefined({ inSpec: inSpecJson })) {
+        return null;
+    };
+
+    if (isDomNode({ inSpec: inSpecJson })) {
+        return inSpecJson;
+    };
+
+    if (isSpecArray({ inSpecJson })) {
+        return buildSpecArray({
+            inArray: inSpecJson,
+            inShowLog,
+            inDataJson
+        });
+    };
+
+    if ("jsonToSpec" in inSpecJson) {
+
+        if (inSpecJson.jsonToSpec.operation === "loopArray") {
+
+            const fromArray = forArray({
+                inTemplate: inSpecJson.jsonToSpec.template,
+                inDataAsArray:
+                    inDataJson[inSpecJson.jsonToSpec.source]
+            });
+
+            const {
+                jsonToSpec,
+                ...specWithoutJsonToSpec
+            } = inSpecJson;
+
+            const newSpec = {
+                ...specWithoutJsonToSpec,
+                children: fromArray
+            };
+
+            return buildSingleElement({
+                inSpecJson: newSpec,
+                inShowLog,
+                inData: inDataJson
+            });
+        };
+
+        if (inSpecJson.jsonToSpec.operation === "loopObject") {
+
+            const fromObject = forObject({
+                inTemplate: inSpecJson.jsonToSpec.template,
+                inDataAsObject: inDataJson
+            });
+
+            const {
+                jsonToSpec,
+                ...specWithoutJsonToSpec
+            } = inSpecJson;
+
+            const newSpec = {
+                ...specWithoutJsonToSpec,
+                children: fromObject
+            };
+
+            return buildSingleElement({
+                inSpecJson: newSpec,
+                inShowLog,
+                inData: inDataJson
+            });
+        };
+    };
+
+    const toReturnObject = buildSingleElement({
+        inSpecJson,
+        inShowLog,
+        inData: inDataJson
+    });
+    console.log("toReturnObject : ", inSpecJson, toReturnObject);
+
+    return toReturnObject;
+};
+
+export default dispatchSpec;

package/src/v22/index.js

@@ -0,0 +1,21 @@
+import registerGlobal from "./registerGlobal.js";
+import buildSpec from "./buildSpec/index.js";
+
+const buildSpecElement = ({ specJson,
+    showLog, dataJson }) => {
+    try {
+
+        const element = buildSpec({
+            inSpecJson: specJson,
+            inShowLog: showLog, inDataJson: dataJson
+        });
+
+        return element;
+    } catch (error) {
+        console.log("error : ", error);
+    };
+};
+
+registerGlobal(buildSpecElement);
+
+export default buildSpecElement;

package/src/v22/meta.js

@@ -0,0 +1,6 @@
+export const meta = {
+    version: "v22.0",
+    description: "Pure spec engine no document at all"
+};
+
+export default meta;

package/src/v22/registerGlobal.js

@@ -0,0 +1,17 @@
+import meta from "./meta.js";
+
+/**
+ * 3. registerGlobal - Orchestration Step 3
+ * Safely registers the json-to-dom public API onto globalThis.ks in browser / SSR environments.
+ */
+export const registerGlobal = (inFuncDefinition) => {
+    if (typeof globalThis === "undefined" || !inFuncDefinition) return;
+
+    globalThis.ks ??= {};
+    globalThis.ks["json-to-spec"] = {
+        meta,
+        buildSpecElement: inFuncDefinition
+    };
+};
+
+export default registerGlobal;

package/src/v23/buildSpec/buildSpecArray.js

@@ -0,0 +1,16 @@
+import dispatchSpec from "./index.js";
+
+export const buildSpecArray = ({ inArray = [], inShowLog = false, inDataJson }) => {
+    const localArray = inArray;
+    const localShowLog = inShowLog;
+    const localDataJson = inDataJson;
+
+    if (!Array.isArray(localArray)) return [];
+
+    return localArray.map(item => dispatchSpec({
+        inSpecJson: item,
+        inShowLog: localShowLog, inDataJson: localDataJson
+    })).flat().filter(Boolean);
+};
+
+export default buildSpecArray;

package/src/v23/buildSpec/forArray/v1/index.js

@@ -0,0 +1,27 @@
+import dispatchSpec from "../../index.js";
+
+const startFunc = ({ inTemplate, inDataAsArray }) => {
+
+    const localDataAsArray = inDataAsArray;
+    const localTemplate = inTemplate;
+
+    if (!Array.isArray(localDataAsArray)) {
+        return [];
+    };
+
+    const childrenArray = localDataAsArray.map(element => {
+
+        // console.log("OUTER forArray element:", element);
+
+        const newTemplate = structuredClone(localTemplate);
+
+        return dispatchSpec({
+            inSpecJson: newTemplate,
+            inDataJson: element
+        });
+    });
+
+    return childrenArray;
+};
+
+export default startFunc;

package/src/v23/buildSpec/forArrayStrings/v1/index.js

@@ -0,0 +1,24 @@
+import dispatchSpec from "../../index.js";
+
+const startFunc = ({ inTemplate, inDataAsArray }) => {
+
+    const localDataAsArray = inDataAsArray;
+    const localTemplate = inTemplate;
+
+    if (!Array.isArray(localDataAsArray)) {
+        return [];
+    };
+
+    const childrenArray = localDataAsArray.map(element => {
+        const newTemplate = structuredClone(localTemplate);
+
+        return dispatchSpec({
+            inSpecJson: newTemplate,
+            inDataJson: element
+        });
+    });
+
+    return childrenArray;
+};
+
+export default startFunc;

package/src/v23/buildSpec/forObject/v1/index.js

@@ -0,0 +1,47 @@
+import dispatchSpec from "../../index.js";
+
+const startFunc = ({ inTemplate, inDataAsObject }) => {
+
+    const localDataAsObject = inDataAsObject;
+    const localTemplate = inTemplate;
+
+    if (
+        localDataAsObject === null ||
+        typeof localDataAsObject !== "object"
+    ) {
+        return [];
+    };
+
+    const childrenArray = [];
+
+    for (const [key, value] of Object.entries(localDataAsObject)) {
+
+        // console.log(
+        //     "INNER:",
+        //     key,
+        //     value,
+        //     typeof value
+        // );
+
+        const newTemplate = structuredClone(localTemplate);
+
+        const createdElement = dispatchSpec({
+            inSpecJson: newTemplate,
+            inDataJson: {
+                key,
+                value
+            }
+        });
+
+        // console.log(
+        //     "INNER createdElement:",
+        //     createdElement
+        // );
+
+        childrenArray.push(createdElement);
+    };
+
+    return childrenArray;
+};
+
+export default startFunc;

package/src/v23/buildSpec/forSpec/v3/index.js

@@ -0,0 +1,114 @@
+import buildSpec from "../../index.js";
+
+const resolveTemplate = (template, data) => {
+    if (typeof template !== "string") {
+        return template;
+    };
+
+    return template.replace(/\$\{([^}]+)\}/g, (_, path) => {
+
+        const keys = path.trim().split(".");
+
+        let value = data;
+
+        for (const key of keys) {
+            if (value === null || value === undefined) {
+                return "";
+            }
+
+            value = value[key];
+        }
+
+        if (
+            value === null ||
+            typeof value === "string" ||
+            typeof value === "number" ||
+            typeof value === "boolean"
+        ) {
+            return String(value ?? "");
+        }
+
+        return value;
+    });
+};
+
+const startFunc = ({ inSpecJson, inData, inShowLog }) => {
+    // console.log("inData : ", inData);
+
+    // Create a completely new tree.
+    const newSpec = structuredClone(inSpecJson);
+
+    if (typeof inData === 'string') {
+        // console.log("It's a string!");
+        // console.log("inData : ", inData, newSpec);
+        if ("textContent" in newSpec) {
+            if (newSpec.textContent === "${}") {
+                newSpec.textContent = inData;
+            } else if (typeof newSpec.textContent === "string") {
+                newSpec.textContent = newSpec.textContent.replaceAll("${}", () => inData);
+            };
+        };
+
+        if ("attributes" in newSpec) {
+            newSpec.attributes = Object.fromEntries(
+                Object.entries(newSpec.attributes).map(
+                    ([attributeName, attributeValue]) => [
+                        attributeName,
+                        attributeValue === "${}"
+                            ? inData
+                            : (typeof attributeValue === "string"
+                                ? attributeValue.replaceAll("${}", () => inData)
+                                : attributeValue)
+                    ]
+                )
+            );
+        };
+
+    } else {
+        if ("key" in inData && "value" in inData) {
+
+            if ("textContent" in newSpec) {
+                newSpec.textContent = resolveTemplate(
+                    newSpec.textContent,
+                    inData
+                );
+            };
+
+        } else {
+
+            if ("textContent" in newSpec) {
+                newSpec.textContent = resolveTemplate(
+                    newSpec.textContent,
+                    inData
+                );
+            };
+
+            if ("attributes" in newSpec) {
+                newSpec.attributes = Object.fromEntries(
+                    Object.entries(newSpec.attributes).map(
+                        ([attributeName, attributeValue]) => [
+                            attributeName,
+                            resolveTemplate(attributeValue, inData)
+                        ]
+                    )
+                );
+            };
+
+            if ("children" in newSpec) {
+                newSpec.children = newSpec.children.map((child) => {
+                    return buildSpec({
+                        inSpecJson: child,
+                        inShowLog: inShowLog,
+                        inDataJson: inData
+                    });
+                });
+            };
+
+        };
+
+    };
+
+    return newSpec;
+};
+
+export default startFunc;

package/src/v23/buildSpec/guards.js

@@ -0,0 +1,20 @@
+export const isNullOrUndefined = ({ inSpec }) => {
+    const localSpec = inSpec;
+    return localSpec === null || localSpec === undefined;
+};
+
+export const isDomNode = ({ inSpec }) => {
+    const localSpec = inSpec;
+    return typeof Node !== "undefined" && localSpec instanceof Node;
+};
+
+export const isSpecArray = ({ inSpecJson }) => {
+    const localSpec = inSpecJson;
+    return Array.isArray(localSpec);
+};
+
+export default {
+    isNullOrUndefined,
+    isDomNode,
+    isSpecArray
+};

package/src/v23/buildSpec/index.js

@@ -0,0 +1,122 @@
+import {
+    isNullOrUndefined,
+    isDomNode,
+    isSpecArray
+} from "./guards.js";
+
+import buildSpecArray from "./buildSpecArray.js";
+import buildSingleElement from "./forSpec/v3/index.js";
+import forArray from "./forArray/v1/index.js";
+import forObject from "./forObject/v1/index.js";
+import forArrayStrings from "./forArrayStrings/v1/index.js";
+
+const dispatchSpec = ({
+    inSpecJson,
+    inShowLog = false,
+    inDataJson
+} = {}) => {
+
+    if (isNullOrUndefined({ inSpec: inSpecJson })) {
+        return null;
+    };
+
+    if (isDomNode({ inSpec: inSpecJson })) {
+        return inSpecJson;
+    };
+
+    if (isSpecArray({ inSpecJson })) {
+        return buildSpecArray({
+            inArray: inSpecJson,
+            inShowLog,
+            inDataJson
+        });
+    };
+
+    if ("jsonToSpec" in inSpecJson) {
+
+        if (inSpecJson.jsonToSpec.operation === "loopArray") {
+
+            const fromArray = forArray({
+                inTemplate: inSpecJson.jsonToSpec.template,
+                inDataAsArray:
+                    inDataJson[inSpecJson.jsonToSpec.source]
+            });
+
+            const {
+                jsonToSpec,
+                ...specWithoutJsonToSpec
+            } = inSpecJson;
+
+            const newSpec = {
+                ...specWithoutJsonToSpec,
+                children: fromArray
+            };
+
+            return buildSingleElement({
+                inSpecJson: newSpec,
+                inShowLog,
+                inData: inDataJson
+            });
+        };
+        // may be this can be deleted
+        // if (inSpecJson.jsonToSpec.operation === "loopArrayStrings") {
+        //     debugger
+        //     const fromArray = forArrayStrings({
+        //         inTemplate: inSpecJson.jsonToSpec.template,
+        //         inDataAsArray:
+        //             inDataJson[inSpecJson.jsonToSpec.source]
+        //     });
+
+        //     const {
+        //         jsonToSpec,
+        //         ...specWithoutJsonToSpec
+        //     } = inSpecJson;
+
+        //     const newSpec = {
+        //         ...specWithoutJsonToSpec,
+        //         children: fromArray
+        //     };
+
+        //     return buildSingleElement({
+        //         inSpecJson: newSpec,
+        //         inShowLog,
+        //         inData: inDataJson
+        //     });
+        // };
+
+        if (inSpecJson.jsonToSpec.operation === "loopObject") {
+
+            const fromObject = forObject({
+                inTemplate: inSpecJson.jsonToSpec.template,
+                inDataAsObject: inDataJson
+            });
+
+            const {
+                jsonToSpec,
+                ...specWithoutJsonToSpec
+            } = inSpecJson;
+
+            const newSpec = {
+                ...specWithoutJsonToSpec,
+                children: fromObject
+            };
+
+            return buildSingleElement({
+                inSpecJson: newSpec,
+                inShowLog,
+                inData: inDataJson
+            });
+        };
+    };
+
+    const toReturnObject = buildSingleElement({
+        inSpecJson,
+        inShowLog,
+        inData: inDataJson
+    });
+    // console.log("toReturnObject : ", inSpecJson, toReturnObject);
+
+    return toReturnObject;
+};
+
+export default dispatchSpec;

package/src/v23/index.js

@@ -0,0 +1,21 @@
+import registerGlobal from "./registerGlobal.js";
+import buildSpec from "./buildSpec/index.js";
+
+const buildSpecElement = ({ specJson,
+    showLog, dataJson }) => {
+    try {
+
+        const element = buildSpec({
+            inSpecJson: specJson,
+            inShowLog: showLog, inDataJson: dataJson
+        });
+
+        return element;
+    } catch (error) {
+        console.log("error : ", error);
+    };
+};
+
+registerGlobal(buildSpecElement);
+
+export default buildSpecElement;

package/src/v23/meta.js

@@ -0,0 +1,6 @@
+export const meta = {
+    version: "v23.0",
+    description: "Pure spec engine no document at all"
+};
+
+export default meta;

package/src/v23/registerGlobal.js

@@ -0,0 +1,17 @@
+import meta from "./meta.js";
+
+/**
+ * 3. registerGlobal - Orchestration Step 3
+ * Safely registers the json-to-dom public API onto globalThis.ks in browser / SSR environments.
+ */
+export const registerGlobal = (inFuncDefinition) => {
+    if (typeof globalThis === "undefined" || !inFuncDefinition) return;
+
+    globalThis.ks ??= {};
+    globalThis.ks["json-to-spec"] = {
+        meta,
+        buildSpecElement: inFuncDefinition
+    };
+};
+
+export default registerGlobal;