@keshavsoft/kschema-cli 1.12.13 → 1.12.15

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/BuildVertical/start.js

@@ -0,0 +1,80 @@
+import { renderTableHeading } from "./BuildFirstColumn/TableHeading/start.js";
+import { initTable } from "./BuildTable/init.js";
+import { refreshTable } from "./BuildTable/refresh.js";
+import { buildForm } from "./BuildForm/start.js";
+import { buildDataLists } from "./BuildDataLists/addToDom.js";
+
+const render1 = ({ inContainerEl, inDataStore, inDom, inServices, inOptions, inEndPoints }) => {
+    buildDataLists({
+        inContainerEl,
+        inDataStore,
+        inDom
+    });
+
+    if (inOptions.vertical.showVertical) {
+        buildForm({
+            inContainerEl,
+            inDataStore,
+            inDom
+        });
+    };
+
+    renderTableHeading({
+        inContainerEl,
+        inDataStore,
+        inDom
+    });
+
+    buildTable({
+        inContainerEl,
+        inDataStore,
+        inDom,
+        inServices,
+        inOptions,
+        inEndPoints
+    });
+};
+
+const refresh = ({ inContainerEl, inDataStore, inDom, inServices, inOptions, inEndPoints }) => {
+    buildDataLists({
+        inContainerEl,
+        inDataStore,
+        inDom
+    });
+
+    refreshTable({
+        inContainerEl,
+        inDataStore,
+        inDom,
+        inServices,
+        inOptions,
+        inEndPoints
+    });
+};
+
+const initRender = ({ inContainerEl, inDataStore, inDom, inServices, inOptions, inEndPoints }) => {
+    if (inOptions.vertical.showVertical) {
+        buildForm({
+            inContainerEl,
+            inDataStore,
+            inDom
+        });
+    };
+
+    renderTableHeading({
+        inContainerEl,
+        inDataStore,
+        inDom
+    });
+
+    initTable({
+        inContainerEl,
+        inDataStore,
+        inDom,
+        inServices,
+        inOptions,
+        inEndPoints
+    });
+};
+
+export { initRender, refresh };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/Core/applyMode.js

@@ -0,0 +1,41 @@
+const applyMode = (config) => {
+
+    if (config.mode === "create") {
+        delete config.endPoints?.find;
+
+        // 🔥 ADD THIS LINE
+        config.options.table.showTable = false;
+
+        if (config.layout.type === "vertical-table") {
+            config.options.table.showTable = true;
+            config.options.table.isDisabled = false;
+        };
+
+        if (config.layout.type === "table") {
+            config.options.table.showTable = true;
+            config.options.table.isDisabled = false;
+            config.options.table.showFooter = true;
+
+            config.options.vertical.showVertical = false;
+        };
+    };
+
+    if (config.mode === "show") {
+        if (config.layout.type === "vertical") {
+            config.options.table.showTable = false;
+            config.options.table.isDisabled = true;
+
+            config.options.vertical.isDisabled = true;
+            config.options.vertical.showSaveButton = false;
+
+            if (!config.endPoints?.find) {
+                throw new Error("find endpoint required");
+            };
+        };
+
+    };
+
+    return config;
+};
+
+export { applyMode };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/Core/loadDataFlow.js

@@ -0,0 +1,24 @@
+// /Core/loadDataFlow.js
+
+import { loadInitialData } from "../DataLayer/loadInitialData.js";
+import { loadDataLists } from "../Services/dataListLoader.js";
+
+export const loadDataFlow = async ({
+    config,
+    services,
+    dataStore,
+    endPoints
+}) => {
+    await loadInitialData({
+        config,
+        services,
+        dataStore,
+        endPoints
+    });
+
+    await loadDataLists({
+        inDataStore: dataStore,
+        inServices: services,
+        inEndpoints: endPoints
+    });
+};

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/DataLayer/loadInitialData.js

@@ -0,0 +1,48 @@
+const getIdFromUrl = () => {
+    const params = new URLSearchParams(window.location.search);
+    return params.get("pk");
+};
+
+const loadInitialData = async ({
+    config,
+    services,
+    dataStore,
+    endPoints
+}) => {
+    const { data } = config;
+
+    // 1. Static data
+    if (Array.isArray(data)) {
+        dataStore.setData(data);
+        return;
+    }
+
+    // 2. Read API
+    if (endPoints?.read) {
+        const dataFromFetch = await services.actions.getData({
+            inEndPoint: endPoints.read
+        });
+
+        if (!Array.isArray(dataFromFetch)) {
+            throw new Error("read endpoint must return array");
+        }
+
+        dataStore.setData(dataFromFetch);
+    }
+// debugger;
+    // 3. Find API (dynamic id)
+    if (endPoints?.find) {
+        const id = getIdFromUrl();
+
+        if (id) {
+            const dataFromFetch = await services.actions.find({
+                inEndPoint: endPoints.find,
+                id
+            });
+
+            dataStore.setFindData(dataFromFetch);
+        }
+    }
+};
+
+export { loadInitialData };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/DomManipulation/start.js

@@ -0,0 +1,45 @@
+export const getDomManipulation = () => {
+
+    const getTableHeader = (tableContainer) => {
+        return tableContainer.querySelector(".theadClass");
+    };
+
+    const getTableFooter = (tableContainer) => {
+        return tableContainer.querySelector(".tFootClass");
+    };
+
+    const getTableBody = (tableContainer) => {
+        return tableContainer.querySelector(".tbodyClass");
+    };
+
+    const getSearchInput = (tableContainer) => {
+        return tableContainer.querySelector(".tableSearchClass");
+    };
+
+    const getSearchSingleColumnInput = (tableContainer) => {
+        return tableContainer.querySelector(".tableSearchSingleColumnClass");
+    };
+
+    const getTableNameClass = (tableContainer) => {
+        return tableContainer.querySelector(".tableNameClass");
+    };
+
+    const getDataListContainerClass = (tableContainer) => {
+        return tableContainer.querySelector(".dataListContainerClass");
+    };
+
+    const getFirstRowClass = (tableContainer) => {
+        return tableContainer.querySelector(".firstRowClass");
+    };
+
+    const getInputValueFromRow = (tr, key) => {
+        return tr.querySelector(`[name="${key}"]`)?.value || "";
+    };
+
+    return {
+        getTableHeader, getTableBody, getSearchInput,
+        getSearchSingleColumnInput,
+        getTableNameClass, getTableFooter, getDataListContainerClass,
+        getInputValueFromRow, getFirstRowClass
+    };
+};

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/FocusSet/V1/focusSet.js

@@ -0,0 +1,21 @@
+const focusToEl = ({ inContainerEl }) => {
+
+    // 1. try footer inputs
+    let el = inContainerEl.querySelector(
+        "tfoot input, tfoot select, tfoot textarea"
+    );
+
+    if (el) {
+        el.focus();
+        return;
+    }
+
+    // 2. fallback → search input (header/global)
+    el = document.querySelector("input[type='search'], input[placeholder*='search']");
+
+    if (el && el.offsetParent !== null) { // visible check
+        el.focus();
+    }
+};
+
+export { focusToEl };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/FocusSet/V2/focusSet.js

@@ -0,0 +1,44 @@
+const focusToEl = ({ inContainerEl, inPriority }) => {
+
+    const containerEl = inContainerEl;
+    const priority = inPriority;
+
+    let el = null;
+
+    for (let i = 0; i < priority.length; i++) {
+
+        const type = priority[i];
+
+        // 🔹 vertical
+        if (type === "vertical") {
+            const findVertical = "verticalForm";
+
+            el = containerEl.querySelector(
+                `.${findVertical} input, .${findVertical} select, .${findVertical} textarea`
+            );
+        }
+
+        // 🔹 footer
+        else if (type === "footer") {
+            el = containerEl.querySelector(
+                "tfoot input, tfoot select, tfoot textarea"
+            );
+        }
+
+        // 🔹 search
+        else if (type === "search") {
+            el = document.querySelector(
+                "input[type='search'], input[placeholder*='search']"
+            );
+        }
+
+        // ✅ if found → focus and stop
+        if (el && el.offsetParent !== null) {
+            el.focus();
+            return;
+        }
+    }
+
+};
+
+export { focusToEl };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/HtmlState/start.js

@@ -0,0 +1,16 @@
+export const createState = () => {
+    let tableContainerId = "kSTableContainer";
+    const tableNameClass = "tableNameClass";
+
+    return {
+        setTableContainerId(val) {
+            tableContainerId = val;
+        },
+        getTableContainerId() {
+            return tableContainerId;
+        },
+        getTableNameClass() {
+            return tableNameClass;
+        }
+    };
+};

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/CreateHeaderRow/CreateHeaderCell/assemble.js

@@ -0,0 +1,6 @@
+const assembleHeader = (wrapper, text, icon) => {
+    wrapper.appendChild(text);
+    wrapper.appendChild(icon);
+};
+
+export { assembleHeader };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/CreateHeaderRow/CreateHeaderCell/createSortIcon.js

@@ -0,0 +1,25 @@
+const createSortIcon = () => {
+    const svgNS = "http://www.w3.org/2000/svg";
+
+    const svg = document.createElementNS(svgNS, "svg");
+    svg.setAttribute("viewBox", "0 0 24 24");
+    svg.setAttribute("fill", "none");
+    svg.setAttribute("stroke", "currentColor");
+    svg.setAttribute("stroke-width", "2");
+    svg.setAttribute("class", "w-4 h-4 text-gray-400");
+    svg.setAttribute("data-sort-icon", "true");
+
+    const path = document.createElementNS(svgNS, "path");
+    path.setAttribute("stroke-linecap", "round");
+    path.setAttribute("stroke-linejoin", "round");
+    path.setAttribute(
+        "d",
+        "M8.25 15L12 18.75 15.75 15m-7.5-6L12 5.25 15.75 9"
+    );
+
+    svg.appendChild(path);
+
+    return svg;
+};
+
+export { createSortIcon };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/CreateHeaderRow/CreateHeaderCell/createTH.js

@@ -0,0 +1,12 @@
+const createTH = (key) => {
+    const th = document.createElement("th");
+
+    th.className =
+        "px-6 py-3 text-left border-b border-gray-200 bg-gray-50 hover:bg-gray-100 transition-colors cursor-pointer";
+
+    th.dataset.key = key;
+
+    return th;
+};
+
+export { createTH };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/CreateHeaderRow/CreateHeaderCell/createText.js

@@ -0,0 +1,7 @@
+const createText = (key) => {
+    const span = document.createElement("span");
+    span.textContent = key;
+    return span;
+};
+
+export { createText };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/CreateHeaderRow/CreateHeaderCell/createWrapper.js

@@ -0,0 +1,14 @@
+import { createText } from "./createText.js";
+import { createSortIcon } from "./createSortIcon.js";
+
+const createWrapper = (key) => {
+    const div = document.createElement("div");
+    div.className = "flex items-center gap-1 text-base font-bold text-gray-800";
+
+    div.appendChild(createText(key));
+    div.appendChild(createSortIcon());
+
+    return div;
+};
+
+export { createWrapper };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/CreateHeaderRow/CreateHeaderCell/start.js

@@ -0,0 +1,15 @@
+import { createTH } from "./createTH.js";
+import { createWrapper } from "./createWrapper.js";
+
+const createHeaderCell = (key) => {
+    const th = createTH(key);
+
+    const wrapper = createWrapper(key);
+
+    // attach to TH
+    th.appendChild(wrapper);
+
+    return th;
+};
+
+export { createHeaderCell };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/CreateHeaderRow/insertCells.js

@@ -0,0 +1,9 @@
+import { createHeaderCell } from "./CreateHeaderCell/start.js";
+
+const startFunc = (keys, tr, options = {}) => {
+    keys.forEach(key => {
+        tr.appendChild(createHeaderCell(key));
+    });
+};
+
+export { startFunc };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/CreateHeaderRow/start.js

@@ -0,0 +1,21 @@
+import { startFunc as insertRowCells } from "./insertCells.js";
+
+const startFunc = (keys) => {
+    const tr = document.createElement("tr");
+
+    tr.appendChild(getSerialColumn());
+
+    insertRowCells(keys, tr);
+
+    return tr;
+};
+
+const getSerialColumn = () => {
+    const thIndex = document.createElement("th");
+    thIndex.textContent = "#";
+    thIndex.className = "px-4 py-2 border";
+
+    return thIndex
+};
+
+export { startFunc };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/attachSortHandlers.js

@@ -0,0 +1,38 @@
+import { setSort } from "../tableStore.js";
+import { buildTableBody } from "../methods.js";
+import { updateHeaderUI } from "./updateHeaderUI.js";
+import { startFunc as getTHead } from "./getTHead.js";
+
+/**
+ * Handles what should happen when a user clicks a column header
+ * Flow:
+ * 1. Update sort state
+ * 2. Rebuild table body based on new sort
+ * 3. Reflect UI changes in header (active column + direction)
+ */
+const handleHeaderSort = (headerCell) => {
+    const key = headerCell.dataset.key;
+
+    setSort(key);
+    buildTableBody();
+    updateHeaderUI(headerCell, key);
+};
+const getSortableHeaders = () => {
+    return getTHead().querySelectorAll("th[data-key]");
+};
+
+/**
+ * Attaches sorting behavior to a header row (<tr>)
+ * Every <th data-key> becomes clickable and triggers sorting
+ */
+const attachSortHandlers = () => {
+    const sortableHeaders = getSortableHeaders();
+
+    sortableHeaders.forEach(headerCell => {
+        headerCell.addEventListener("click", (e) => {
+            handleHeaderSort(e.currentTarget);
+        });
+    });
+};
+
+export { attachSortHandlers };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/getTHead.js

@@ -0,0 +1,12 @@
+import { getHtmlId } from "../tableStore.js";
+
+const startFunc = () => {
+    const tableContainerId = getHtmlId();
+    const tableContainer = document.getElementById(tableContainerId);
+
+    const thead = tableContainer.querySelector("table thead");
+
+    return thead;
+};
+
+export { startFunc };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/sortData.js

@@ -0,0 +1,16 @@
+const startFunc = (key, dataRef, sortState) => {
+    const asc = sortState[key] = !sortState[key];
+
+    dataRef.sort((a, b) => {
+        const valA = (a[key] ?? '').toString().toLowerCase();
+        const valB = (b[key] ?? '').toString().toLowerCase();
+
+        return asc
+            ? valA.localeCompare(valB)
+            : valB.localeCompare(valA);
+    });
+
+    return asc;
+};
+
+export { startFunc };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/start.js

@@ -0,0 +1,9 @@
+import { startFunc as createHeaderRow } from "./CreateHeaderRow/start.js";
+
+const startFunc = ({ inColumns, inTableHeader }) => {
+    const tr = createHeaderRow(inColumns);
+
+    inTableHeader.appendChild(tr);
+};
+
+export { startFunc };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/SearchTable/updateHeaderUI.js

@@ -0,0 +1,49 @@
+import { getSortState } from "../tableStore.js";
+import { startFunc as getTHead } from "./getTHead.js";
+
+const ICON_DEFAULT = "M8.25 15L12 18.75 15.75 15m-7.5-6L12 5.25 15.75 9";
+const ICON_UP = "M5 15l7-7 7 7";
+const ICON_DOWN = "M19 9l-7 7-7-7";
+
+const getIconPath = (th) => {
+    return th.querySelector("[data-sort-icon] path");
+};
+
+// 🔹 Reset one column
+const resetColumn = (th) => {
+    const path = getIconPath(th);
+    if (!path) return;
+
+    path.setAttribute("d", ICON_DEFAULT);
+
+    th.classList.remove("text-gray-900");
+    th.classList.add("text-gray-700");
+};
+
+// 🔹 Activate one column
+const activateColumn = (th, asc) => {
+    const path = getIconPath(th);
+    if (!path) return;
+
+    path.setAttribute("d", asc ? ICON_UP : ICON_DOWN);
+
+    th.classList.remove("text-gray-700");
+    th.classList.add("text-gray-900");
+};
+
+// 🔹 Orchestration (NOW READABLE)
+const updateHeaderUI = (activeTh, key) => {
+    const { key: activeKey, asc } = getSortState();
+
+    // 1. Reset everything
+    const tableHead = getTHead();
+
+    tableHead.querySelectorAll("th[data-key]").forEach(resetColumn);
+
+    // 2. Activate selected
+    if (activeKey === key) {
+        activateColumn(activeTh, asc);
+    }
+};
+
+export { updateHeaderUI };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/Services/buildUrlWithParams.js

@@ -0,0 +1,11 @@
+export const buildUrlWithParams = ({ baseUrl, params = {} }) => {
+    const url = new URL(baseUrl, window.location.origin);
+
+    Object.entries(params).forEach(([key, value]) => {
+        if (value !== null && value !== undefined) {
+            url.searchParams.set(key, value);
+        }
+    });
+
+    return url.toString();
+};

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/Services/createItem.js

@@ -0,0 +1,15 @@
+const createItem = async ({ inEndPoint, payload }) => {
+    const res = await fetch(inEndPoint, {
+        method: "POST",
+        headers: {
+            "Content-Type": "application/json"
+        },
+        body: JSON.stringify(payload)
+    });
+
+    if (!res.ok) throw new Error("Create failed");
+
+    return await res.json();
+};
+
+export { createItem };

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/Services/createServices.js

@@ -0,0 +1,51 @@
+import { createItem } from "./createItem.js";
+import { getDataFromFetch } from "./getData.js";
+import { deleteItem } from "./deleteItem.js";
+import { findItem } from "./findItem.js";
+
+export const createServices = ({ tableName }) => {
+    return {
+        actions: {
+            getData: ({ inEndPoint }) => getDataFromFetch({ inEndPoint }),
+            create: ({ inEndPoint, payload }) => createItem({ inEndPoint, payload }),
+            update: (id, payload) => updateItem({ tableName, id, payload }),
+            remove: ({ inEndPoint, id }) => deleteItem({ inEndPoint, id }),
+            find: ({ inEndPoint, id }) => findItem({ inEndPoint, id }),
+            vertical: {
+                save: async ({ inEndPoint, payload }) => {
+                    const res = await fetch(inEndPoint, {
+                        method: "POST",
+                        headers: {
+                            "Content-Type": "application/json"
+                        },
+                        body: JSON.stringify(payload)
+                    });
+
+                    return await res;
+                }
+            },
+            vertical: {
+                save: async ({ inEndPoint, payload }) => {
+                    const res = await fetch(inEndPoint, {
+                        method: "POST",
+                        headers: {
+                            "Content-Type": "application/json"
+                        },
+                        body: JSON.stringify(payload)
+                    });
+
+                    return await res;
+                }
+            },
+            table: {
+                delete: async ({ inEndPoint, id }) => {
+                    const res = await fetch(`${inEndPoint}/${id}`, {
+                        method: "DELETE"
+                    });
+
+                    return await res;
+                }
+            }
+        },
+    };
+};

package/bin/v12/commands/tally/template/v5/Public/KSTableAi/V21/Services/dataListLoader.js

@@ -0,0 +1,17 @@
+const loadDataLists = async ({ inEndpoints, inServices, inDataStore }) => {
+    const localEndpoints = Object.entries(inEndpoints?.dataListEndpoints || {});
+
+    if (localEndpoints.length === 0) return;
+
+    const results = await Promise.all(
+        localEndpoints.map(([key, ep]) =>
+            inServices.actions.getData({ inEndPoint: ep }).then(data => [key, data])
+        )
+    );
+// debugger;
+    results.forEach(([key, data]) => {
+        inDataStore.setDataList(key, data);
+    });
+};
+
+export { loadDataLists };