json-renderers 1.12.3 → 1.13.3

package/src/v9/navTabs/fragments.json

@@ -1,59 +0,0 @@
-{
-    "navTabsList": {
-        "tagName": "ul",
-        "attributes": {
-            "class": "nav nav-tabs",
-            "role": "tablist"
-        },
-        "jsonToSpec": {
-            "operation": "loopArray",
-            "source": "tabs",
-            "template": {
-                "tagName": "li",
-                "attributes": {
-                    "class": "nav-item",
-                    "role": "presentation"
-                },
-                "children": [
-                    {
-                        "tagName": "button",
-                        "attributes": {
-                            "class": "nav-link ${activeClass}",
-                            "id": "${id}-tab",
-                            "data-bs-toggle": "tab",
-                            "data-bs-target": "#${id}-pane",
-                            "type": "button",
-                            "role": "tab",
-                            "aria-controls": "${id}-pane",
-                            "aria-selected": "${isSelected}"
-                        },
-                        "textContent": "${label}"
-                    }
-                ]
-            }
-        },
-        "children": []
-    },
-    "tabContent": {
-        "tagName": "div",
-        "attributes": {
-            "class": "tab-content pt-3"
-        },
-        "jsonToSpec": {
-            "operation": "loopArray",
-            "source": "tabs",
-            "template": {
-                "tagName": "div",
-                "attributes": {
-                    "class": "tab-pane fade ${showActiveClass}",
-                    "id": "${id}-pane",
-                    "role": "tabpanel",
-                    "aria-labelledby": "${id}-tab",
-                    "tabindex": "0"
-                },
-                "textContent": "${content}"
-            }
-        },
-        "children": []
-    }
-}

package/src/v9/navTabs/index.js

@@ -1,82 +0,0 @@
-import skeletonToSpec from "../../../../../skeletonToSpec/v3/index.js";
-import jsonToSpec from "../../../jsonToSpec/v2/index.js";
-import jsonToTag from "../../../jsonToTag/v2/index.js";
-
-import skeletonJson from './skeleton.json' with {type: 'json'};
-import fragmentsJson from './fragments.json' with {type: 'json'};
-
-const startFunc = ({
-    targetHtmlId,
-    inTargetHtmlId,
-    inTabs = [],
-    inData = [],
-    inSkeletonType = "default",
-    inShowLog = false
-} = {}) => {
-    const localTargetHtmlId = inTargetHtmlId ?? targetHtmlId;
-    const localTabs = inTabs;
-    const localData = inData;
-    const localSkeletonType = inSkeletonType;
-    const localShowLog = inShowLog;
-
-    try {
-        let tabsArray = [];
-
-        if (Array.isArray(localTabs) && localTabs.length > 0) {
-            tabsArray = localTabs.map((tab, idx) => ({
-                id: tab.id ?? `tab-${idx + 1}`,
-                label: tab.label ?? tab.title ?? `Tab ${idx + 1}`,
-                activeClass: tab.activeClass ?? (idx === 0 ? "active" : ""),
-                showActiveClass: tab.showActiveClass ?? (idx === 0 ? "show active" : ""),
-                isSelected: tab.isSelected ?? (idx === 0 ? "true" : "false"),
-                content: tab.content ?? ""
-            }));
-        } else if (Array.isArray(localData) && localData.length > 0) {
-            tabsArray = localData.map((row, idx) => {
-                const id = `tab-${row.VOUCHERNUMBER ?? row.id ?? idx + 1}`;
-                const label = row.REFERENCE || row.VOUCHERTYPENAME || `Tab ${idx + 1}`;
-                const isActive = idx === 0;
-                return {
-                    id,
-                    label,
-                    activeClass: isActive ? "active" : "",
-                    showActiveClass: isActive ? "show active" : "",
-                    isSelected: isActive ? "true" : "false",
-                    content: ""
-                };
-            });
-        }
-
-        const dataAsJson = { tabs: tabsArray };
-
-        const rawSkeleton = skeletonJson[localSkeletonType] ?? skeletonJson.default ?? skeletonJson;
-        const targetSkeleton = structuredClone(rawSkeleton);
-
-        if (localShowLog) console.log("navTabs targetSkeleton : ", targetSkeleton);
-
-        const structureJson = skeletonToSpec({
-            inSkeleton: targetSkeleton,
-            inFragments: fragmentsJson
-        });
-        if (localShowLog) console.log("navTabs structureJson : ", structureJson);
-
-        const specAsJsonToDom = jsonToSpec({ specJson: structureJson, dataJson: dataAsJson, showLog: false });
-        if (localShowLog) console.log("navTabs specAsJsonToDom : ", specAsJsonToDom);
-
-        const fromRenderer = jsonToTag(specAsJsonToDom);
-
-        const html = (typeof localTargetHtmlId === "string")
-            ? document.getElementById(localTargetHtmlId)
-            : localTargetHtmlId;
-
-        if (!html) return fromRenderer;
-
-        html.append(fromRenderer);
-        return fromRenderer;
-    } catch (error) {
-        console.log("error : ", error);
-    };
-};
-
-export { startFunc };
-export default startFunc;

package/src/v9/navTabs/skeleton.json

@@ -1,18 +0,0 @@
-{
-    "default": {
-        "tagName": "div",
-        "attributes": {
-            "class": "bootstrap-nav-tabs"
-        },
-        "slots": [
-            "navTabsList",
-            "tabContent"
-        ]
-    },
-    "tabsOnly": {
-        "tagName": "div",
-        "slots": [
-            "navTabsList"
-        ]
-    }
-}

package/src/v9/registerGlobal.js

@@ -1,14 +0,0 @@
-import meta from "./meta.js";
-
-export const registerGlobal = (inFuncDefinition) => {
-    if (typeof globalThis === "undefined" || !inFuncDefinition) return;
-
-    globalThis.ks ??= {};
-
-    globalThis.ks.jsonRenderers ??= {
-        meta,
-        renderToDom: inFuncDefinition
-    };
-};
-
-export default registerGlobal;

package/src/v9/select/fragments.json

@@ -1 +0,0 @@
-{}

package/src/v9/select/index.js

@@ -1,34 +0,0 @@
-import jsonTraversal from "../../../node_modules/json-traversal/index.js";
-
-// import jsonToSpec from "../../../node_modules/json-to-spec/index.js";
-// import jsonToTag from "@keshavsoft/json-to-tag";
-import jsonToTag from "@keshavsoft/json-to-tag";
-
-import skeletonJson from "./skeleton.json" with { type: "json" };
-
-const startFunc = ({ targetHtmlId, inData,
-    inSkeletonType = "default", inClassToApply } = {}) => {
-
-    console.log("aaaaaaaaaa");
-
-    const skeletonNeeded = skeletonJson[inSkeletonType];
-    skeletonNeeded.mapping.attributes.class = `$${inClassToApply}`;
-    // skeletonNeeded.mapping.attributes.class = inClassToApply;
-    debugger;
-
-    const specAsJsonToDom = jsonTraversal.transform(inData, skeletonNeeded);
-
-    const container = document.getElementById(targetHtmlId);
-    if (container) container.innerHTML = "";
-
-    const createdElement = jsonToTag(specAsJsonToDom);
-
-    if (Array.isArray(createdElement)) {
-        // container.appendChild(createdElement)
-        createdElement.forEach(element => container.append(element));
-    } else {
-        container.append(createdElement);
-    };
-};
-
-export default startFunc;

package/src/v9/select/skeleton.json

@@ -1,23 +0,0 @@
-{
-    "default": {
-        "mapping": {
-            "tagName": "$select",
-            "attributes": {
-                "id": "$LedgerName",
-                "class": "$keshav"
-            },
-            "children": [
-                {
-                    "list": "LedgerName",
-                    "item": {
-                        "tagName": "$option",
-                        "attributes": {
-                            "value": ""
-                        },
-                        "textContent": ""
-                    }
-                }
-            ]
-        }
-    }
-}

package/src/v9/table/index.js

@@ -1,35 +0,0 @@
-import jsonToSpec from "json-to-spec";
-import jsonToTag from "@keshavsoft/json-to-tag";
-
-import skeletonJson from './skeleton.json' with { type: 'json' };
-
-// --- Story of Table Render ---
-const startFunc = ({
-    targetHtmlId,
-    inTargetHtmlId,
-    inColumns,
-    inData,
-} = {}) => {
-    const localTargetHtmlId = inTargetHtmlId ?? targetHtmlId;
-    const localData = inData ?? [];
-    const localColumns = inColumns;
-
-    let specAsJsonToDom = jsonToSpec(skeletonJson.default, {
-        columns: localColumns, data: localData
-    });
-
-    // console.log("specAsJsonToDom : ", specAsJsonToDom);
-
-    if (!("tagName" in specAsJsonToDom)) {
-        specAsJsonToDom = specAsJsonToDom.children;
-    };
-
-    const container = document.getElementById(localTargetHtmlId);
-
-    if (container) container.innerHTML = "";
-
-    const content = jsonToTag(specAsJsonToDom);
-    container.append(content);
-};
-
-export default startFunc;

package/src/v9/table/skeleton.json

@@ -1,47 +0,0 @@
-{
-    "default": {
-        "tagName": "table",
-        "attributes": {
-            "class": "table table-hover table-striped mb-0"
-        },
-        "children": [
-            {
-                "tagName": "thead",
-                "children": [
-                    {
-                        "tagName": "tr",
-                        "jsonToSpec": {
-                            "operation": "loopCollection",
-                            "source": "columns",
-                            "template": {
-                                "tagName": "th",
-                                "textContent": "${title}"
-                            }
-                        },
-                        "children": []
-                    }
-                ]
-            },
-            {
-                "tagName": "tbody",
-                "jsonToSpec": {
-                    "operation": "loopCollection",
-                    "source": "data",
-                    "template": {
-                        "tagName": "tr",
-                        "jsonToSpec": {
-                            "operation": "loopObject",
-                            "source": "data",
-                            "template": {
-                                "tagName": "td",
-                                "textContent": "${value}"
-                            }
-                        },
-                        "children": []
-                    }
-                },
-                "children": []
-            }
-        ]
-    }
-}