@keshavsoft/kschema-cli 1.13.5 → 1.13.7

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildTotal/initRender.js

@@ -0,0 +1,118 @@
+import { renderTableHeading } from "./BuildFirstColumn/TableHeading/start.js";
+import { initTable } from "./BuildTableVersions/V2/init.js";
+import { buildForm } from "./BuildForm/start.js";
+import { buildDataLists } from "./BuildDataLists/addToDom.js";
+import { hookAllListeners } from "./AddListeners/start.js";
+import { afterMutation } from "./afterMutation.js";
+
+const initRender = ({ inContainerEl, inDataStore, inDom, inServices, inOptions, inEndPoints,
+    inColumnsConfig, inUiClasses, callbacks }) => {
+
+    const data = inDataStore.getData();
+    const columns = inDataStore.getColumns();
+    const visibleColumns = inDataStore.getVisibleColumns();
+    const visibleColumnsConfig = inDataStore.getVisibleColumnsConfig();
+    // debugger
+    const defaultRow = inDataStore.getDefaultRow();
+
+    const isBuildDataLists = inOptions.dataList.show;
+    const showActions = inOptions.table.showRowOptions;
+    const showSerial = inOptions.table.showSerial;
+    const showTable = inOptions.table.showTable;
+    // debugger;
+    const handleDelete = async ({ presentPk }) => {
+        await inServices.actions.remove({
+            inEndPoint: inEndPoints.delete,
+            id: presentPk
+        })
+        debugger;
+        afterMutation({
+            inServices, inEndPoints, inDataStore, inContainerEl,
+            inDom, inOptions, inVisibleColumns: visibleColumns,
+            onDelete: handleDelete, isBuildDataLists,
+            inShowActions: showActions,
+            inShowSerial: showSerial, inShowTable: showTable
+        });
+    };
+    // debugger;
+    if (isBuildDataLists) {
+        buildDataLists({
+            inContainerEl,
+            inDataStore,
+            inDom,
+            inVisibleColumns: visibleColumns,
+            inData: data
+        });
+    };
+
+    if (inOptions.vertical.showVertical) {
+        const inIsDisabled = inOptions.vertical.isDisabled;
+        const showSaveButton = inOptions.vertical.showSaveButton;
+        const findData = inDataStore.getFindData();
+        // debugger;
+        buildForm({
+            inContainerEl,
+            inDataStore,
+            inDom,
+            inServices,
+            inOptions,
+            inEndPoints,
+            inColumnsConfig,
+            inShowFooter: inOptions.table.showFooter,
+            inData: data,
+            inVisibleColumns: visibleColumns,
+            inVisibleColumnsConfig: visibleColumnsConfig,
+            onDelete: handleDelete,
+            inShowActions: showActions,
+            inShowSerial: showSerial,
+            isBuildDataLists,
+            inDefaultRow: defaultRow,
+            uiClasses: inUiClasses.form,
+            inIsDisabled: inIsDisabled,
+            showSaveButton,
+            inFindData: findData,
+            inShowTable: showTable,
+            incallbacks: callbacks
+        });
+    };
+
+    if (inOptions.firstRow.showSearch) {
+        renderTableHeading({
+            inContainerEl,
+            inDataStore,
+            inDom
+        });
+    } else {
+        const firstRow = inDom.getFirstRowClass(inContainerEl);
+
+        firstRow.style.display = "none";
+    };
+
+    if (showTable) {
+        const inIsDisabled = inOptions.table.isDisabled;
+
+        initTable({
+            inContainerEl,
+            inDataStore,
+            inDom,
+            inServices,
+            inOptions,
+            inEndPoints,
+            inColumnsConfig,
+            inShowFooter: inOptions.table.showFooter,
+            inData: data,
+            inVisibleColumns: visibleColumns,
+            onDelete: handleDelete,
+            inShowActions: showActions,
+            inShowSerial: showSerial,
+            inIsDisabled: inIsDisabled,
+            inDefaultRow: defaultRow,
+            inUiClasses: inUiClasses.table,
+            inShowTable: showTable
+        });
+    };
+
+    hookAllListeners({ inContainerEl, inDataStore, inDom, inOptions });
+};
+
+export { initRender };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildTotal/refresh.js

@@ -0,0 +1,31 @@
+import { buildDataLists } from "./BuildDataLists/addToDom.js";
+import { pureBuildBody } from "./BuildTableVersions/V2/BuildBodyVersions/V1/pureBuildBody.js";
+
+const refreshTable = ({ inContainerEl, inDataStore, inDom, inOptions, inVisibleColumns,
+    inServices, inEndPoints, onDelete, isBuildDataLists = false, inShowActions, inShowSerial }) => {
+    const data = inDataStore.getData();
+    const visibleColumns = inVisibleColumns;
+
+    if (isBuildDataLists) {
+        buildDataLists({
+            inContainerEl,
+            inDataStore,
+            inDom
+        });
+    };
+
+    pureBuildBody({
+        inContainerEl,
+        inData: data,
+        inVisibleColumns: visibleColumns,
+        inDom,
+        options: {
+            showActions: inShowActions,
+            showSerial: inShowSerial,
+            onEdit: ({ item }) => console.log("edit", item),
+            onDelete
+        }
+    });
+};
+
+export { refreshTable };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildTotal/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/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/AddListeners/start.js

@@ -0,0 +1,15 @@
+import { funcToRun as funcToRunFortableSearch } from "./tableSearch/start.js";
+
+const hookAllListeners = ({ inContainerEl, inDataStore, inDom, inOptions }) => {
+    const columns = inDataStore.getColumns();
+    const visibleColumns = inDataStore.getVisibleColumns();
+
+    funcToRunFortableSearch({
+        inContainerEl, inDataStore,
+        inDom, inColumns: columns,
+        inVisibleColumns: visibleColumns,
+        inOptions
+    });
+};
+
+export { hookAllListeners };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/AddListeners/tableSearch/atThatState.js

@@ -0,0 +1,23 @@
+import { buildRows } from './orchestrator.js';
+
+const buildBodyAtThatState = ({
+    inColumns,
+    inDataToShow,
+    inContainerEl,
+    inDom,
+    searchValue = ""
+}) => {
+
+    const tableBody = inDom.getTableBody(inContainerEl);
+    tableBody.innerHTML = '';
+
+    const rows = buildRows({
+        data: inDataToShow,
+        columns: inColumns,
+        searchValue
+    });
+
+    rows.forEach(tr => tableBody.appendChild(tr));
+};
+
+export { buildBodyAtThatState };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/AddListeners/tableSearch/createCell.js

@@ -0,0 +1,12 @@
+import { highlightText } from "./highlight.js";
+
+const createCell = ({ value, searchValue }) => {
+    const td = document.createElement('td');
+    td.className = 'px-4 py-2 border';
+
+    td.innerHTML = highlightText(value, searchValue);
+
+    return td;
+};
+
+export { createCell };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/AddListeners/tableSearch/createRow.js

@@ -0,0 +1,35 @@
+import { createCell } from './createCell.js';
+
+const createIndexCell = (index) => {
+    const td = document.createElement('td');
+    td.className = 'px-4 py-2 border text-right';
+    td.textContent = index + 1;
+    return td;
+};
+
+const createDataCells = ({ item, columns, searchValue }) => {
+    return columns.map(k => {
+        const value = (item[k] ?? '').toString();
+
+        return createCell({
+            value,
+            searchValue
+        });
+    });
+};
+
+const createRow = ({ item, columns, index, searchValue }) => {
+    const tr = document.createElement('tr');
+    tr.className = 'border-t hover:bg-blue-100 odd:bg-gray-100';
+
+    // 1. index column
+    tr.appendChild(createIndexCell(index));
+
+    // 2. data columns
+    const cells = createDataCells({ item, columns, searchValue });
+    cells.forEach(td => tr.appendChild(td));
+
+    return tr;
+};
+
+export { createRow };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/AddListeners/tableSearch/highlight.js

@@ -0,0 +1,14 @@
+const escapeRegex = (str) => {
+    return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+};
+
+const highlightText = (text, search) => {
+    if (!search) return text;
+
+    const safeSearch = escapeRegex(search);
+    const regex = new RegExp(`(${safeSearch})`, "gi");
+
+    return text.replace(regex, `<span class="bg-yellow-300">$1</span>`);
+};
+
+export { highlightText };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/AddListeners/tableSearch/inputFunc.js

@@ -0,0 +1,37 @@
+import { pureBuildBody } from "../../BuildTableVersions/V2/BuildBodyVersions/V1/pureBuildBody.js";
+
+let timer;
+
+const inputFuncToRun = ({ e, inDataStore, inVisibleColumns, inContainerEl, inDom, inOptions }) => {
+    const columns = inVisibleColumns;
+
+    clearTimeout(timer);
+
+    timer = setTimeout(() => {
+        const searchValue = e.target.value;
+
+        // 1. global search
+        inDataStore.setSearchConfig({
+            type: "global",
+            value: searchValue
+        });
+
+        const dataToShow = inDataStore.getFinalData();
+debugger;
+        pureBuildBody({
+            inContainerEl,
+            inVisibleColumns: columns,
+            inData: dataToShow,
+            inDom,
+            searchValue,
+            options: {
+                showActions: inOptions?.table?.showRowOptions,
+                showSerial: inOptions?.table.showSerial,
+                onEdit: ({ item }) => console.log("edit", item),
+                onDelete: ({ index }) => console.log("delete", index)
+            }
+        });
+    }, 300);
+};
+
+export { inputFuncToRun };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/AddListeners/tableSearch/multiColumn.js

@@ -0,0 +1,42 @@
+import { buildBodyAtThatState } from "./atThatState.js";
+
+let timer;
+
+const transform = (inSearchValue) => {
+    const splitColumns = inSearchValue.split(",");
+
+    return splitColumns.map(element => {
+        const splitValues = element.split(":");
+
+        return {
+            key: splitValues[0],
+            value: splitValues[1]
+        };
+    });
+};
+
+const inputFuncToRun = ({ e, inDataStore, inColumns, inContainerEl, inDom }) => {
+    clearTimeout(timer);
+
+    timer = setTimeout(() => {
+        const searchValue = e.target.value;
+        const splitColumns = transform(searchValue);
+
+        // 3. multi column
+        inDataStore.setSearchConfig({
+            type: "multi",
+            filters: splitColumns
+        });
+
+        // 2. Re-render UI
+        const dataToShow = inDataStore.getFinalData();
+        buildBodyAtThatState({
+            inColumns,
+            inDataToShow: dataToShow,
+            inContainerEl, inDom
+        });
+
+    }, 300);
+};
+
+export { inputFuncToRun };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/AddListeners/tableSearch/orchestrator.js

@@ -0,0 +1,14 @@
+import { createRow } from "./createRow.js";
+
+const buildRows = ({ data, columns, searchValue }) => {
+    return data.map((item, index) => {
+        return createRow({
+            item,
+            columns,
+            index,
+            searchValue
+        });
+    });
+};
+
+export { buildRows };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/AddListeners/tableSearch/singleColumn.js

@@ -0,0 +1,29 @@
+import { buildBodyAtThatState } from "./atThatState.js";
+
+let timer;
+
+const inputFuncToRun = ({ e, inDataStore, inColumns, inContainerEl, inDom }) => {
+    clearTimeout(timer);
+
+    timer = setTimeout(() => {
+        const searchValue = e.target.value;
+        const splitValues = searchValue.split(":");
+
+        // 2. single column search
+        inDataStore.setSearchConfig({
+            type: "column",
+            key: splitValues[0],
+            value: splitValues[1]
+        });
+        // 2. Re-render UI
+        const dataToShow = inDataStore.getFinalData();
+        buildBodyAtThatState({
+            inColumns,
+            inDataToShow: dataToShow,
+            inContainerEl, inDom
+        });
+
+    }, 300);
+};
+
+export { inputFuncToRun };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/AddListeners/tableSearch/start.js

@@ -0,0 +1,27 @@
+import { inputFuncToRun } from "./inputFunc.js";
+import { inputFuncToRun as singleColumn } from "./singleColumn.js";
+import { inputFuncToRun as multiColumn } from "./multiColumn.js";
+
+const funcToRun = ({ inContainerEl, inDataStore, inDom, inColumns, inVisibleColumns, inOptions }) => {
+    const htmlElement = inDom.getSearchInput(inContainerEl);
+    // debugger;
+    if (htmlElement.classList.contains('ks-search-allColumns')) {
+        htmlElement.addEventListener("input", (e) => {
+            inputFuncToRun({ e, inDataStore, inVisibleColumns, inContainerEl, inDom, inOptions });
+        });
+    };
+
+    if (htmlElement.classList.contains('singleColumn')) {
+        htmlElement.addEventListener("input", (e) => {
+            singleColumn({ e, inDataStore, inColumns, inContainerEl, inDom });
+        });
+    };
+
+    if (htmlElement.classList.contains('multiColumn')) {
+        htmlElement.addEventListener("input", (e) => {
+            multiColumn({ e, inDataStore, inColumns, inContainerEl, inDom });
+        });
+    };
+};
+
+export { funcToRun };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/BuildDataLists/addToDom.js

@@ -0,0 +1,67 @@
+const getSourceData = ({ cfg, inDataStore }) => {
+    if (!cfg.dataListSource) return [];
+
+    const [source, key] = cfg.dataListSource.split(".");
+
+    // 🔥 get endpoint map
+    const endpoints = inDataStore.getAllDataLists();
+
+    const endpointKey = endpoints?.[source];
+
+    if (!endpointKey) return [];
+    // debugger;
+    // 🔥 now fetch actual data using endpointKey
+    const data = inDataStore.getDataList(source) || [];
+
+    if (!key) return data;
+
+    return data.map(r => r?.[key]);
+};
+
+const getUniqueValues = (data) => {
+    return [...new Set(data.filter(Boolean))];
+};
+
+const createDataListEl = (col, values) => {
+    const datalist = document.createElement("datalist");
+    datalist.id = col + "List";
+
+    datalist.innerHTML = values
+        .map(v => `<option value="${v}">`)
+        .join("");
+
+    return datalist;
+};
+
+const buildDataLists = ({
+    inContainerEl,
+    inDataStore,
+    inDom,
+    inData
+}) => {
+    //   debugger;
+
+    const containerEl = inContainerEl;
+    const dom = inDom;
+
+    const configs = inDataStore.getDataListColumns();
+
+    const find = dom.getDataListContainerClass(containerEl);
+    if (!find) return;
+
+    find.innerHTML = "";
+
+    configs.forEach(cfg => {
+        const col = cfg.columnName;
+
+        // 🔥 CORE FIX
+        const sourceData = getSourceData({ cfg, inDataStore, inData });
+        const values = getUniqueValues(sourceData);
+
+        const datalist = createDataListEl(col, values);
+
+        find.appendChild(datalist);
+    });
+};
+
+export { buildDataLists };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/BuildFirstColumn/TableHeading/start.js

@@ -0,0 +1,14 @@
+const renderTableHeading = ({ inDataStore, inContainerEl, inDom }) => {
+    const dataStore = inDataStore;
+    const containerEl = inContainerEl;
+    const dom = inDom;
+
+    const tableName = dataStore.getTableName();
+
+    const find = dom.getTableNameClass(containerEl);
+    if (!find) return;
+
+    find.innerHTML = tableName;
+};
+
+export { renderTableHeading };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/BuildForm/V4/clearFormInputs.js

@@ -0,0 +1,13 @@
+const clearFormInputs = ({ inInputs }) => {
+    const inputs = inInputs;
+
+    Object.values(inputs).forEach(input => {
+        input.value = "";
+
+        if ("defaultValue" in input.dataset) {
+            input.value = input.dataset.defaultValue;
+        };
+    });
+};
+
+export { clearFormInputs };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/BuildForm/V4/collectFormData.js

@@ -0,0 +1,13 @@
+const collectFormData = ({ inInputs }) => {
+    const inputs = inInputs;
+
+    const newItem = {};
+
+    Object.keys(inputs).forEach(key => {
+        newItem[key] = inputs[key].value;
+    });
+
+    return newItem;
+};
+
+export { collectFormData };

package/bin/v13/commands/accounts/template/v9/Public/KSTableAi/V31/BuildVerticalWithVersions/V1/BuildForm/V4/createButton.js

@@ -0,0 +1,30 @@
+import { collectFormData } from "./collectFormData.js";
+import { clearFormInputs } from "./clearFormInputs.js";
+import { focusFirstInput } from "./focusFirstInput.js";
+
+const createButton = ({ inButtonClass, inInputs, inOnSubmit }) => {
+    const buttonClass = inButtonClass;
+    const inputs = inInputs;
+    const onSubmit = inOnSubmit;
+
+    const button = document.createElement('button');
+    button.textContent = 'Save';
+    button.className = buttonClass;
+
+    button.addEventListener('click', async (event) => {
+        event.preventDefault(); // 🔥 THIS IS THE KEY
+
+        const newItem = collectFormData({ inInputs: inputs });
+
+        const fromSubmit = await onSubmit(newItem);
+
+        if (fromSubmit) {
+            clearFormInputs({ inInputs });
+            focusFirstInput({ inInputs });
+        };
+    });
+
+    return button;
+};
+
+export { createButton };