@lowdefy/blocks-table 0.0.0-experimental-20260929110023

package/dist/features/editing/computeEditTargets.js

@@ -0,0 +1,108 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import findCellByKey from './findCellByKey.js';
+import { ROW_CONTROLS_KEY } from './rowControlsColumn.js';
+const EMPTY = [];
+function isEditingCell({ session, rowId, colKey }) {
+    return Boolean(session) && session.rowId === rowId && session.colKey === colKey;
+}
+// The rendered cells the editing layer draws into: the open editor's cell, cells with an edit
+// saving or failed and the handle of a row move saving or failed (Table), and cells failing
+// inline validation (TableInput). Only cells in the rendered window are found, so the work per
+// scroll frame is bounded by the window, and a cell that scrolls back in gets its editor or
+// marker again.
+function computeEditTargets({ api, session }) {
+    const scroller = api.scrollerRef.current;
+    const { invalid, moveOverlay, overlay } = api.editing;
+    const moveMarked = Boolean(moveOverlay) && moveOverlay.status !== 'saved';
+    if (!scroller || !session && overlay.size === 0 && invalid.size === 0 && !moveMarked) {
+        return EMPTY;
+    }
+    const targets = [];
+    if (session) {
+        const element = findCellByKey({
+            api,
+            rowId: session.rowId,
+            colKey: session.colKey
+        });
+        if (element) targets.push({
+            id: `editor:${session.id}`,
+            kind: 'editor',
+            element
+        });
+    }
+    overlay.forEach((entry, id)=>{
+        if (entry.status === 'saved') return;
+        if (isEditingCell({
+            session,
+            rowId: entry.rowKey,
+            colKey: entry.colKey
+        })) return;
+        const element = findCellByKey({
+            api,
+            rowId: entry.rowKey,
+            colKey: entry.colKey
+        });
+        if (!element) return;
+        targets.push({
+            id: `mark:${id}`,
+            kind: 'marker',
+            element,
+            message: entry.message ?? null,
+            status: entry.status
+        });
+    });
+    if (moveMarked) {
+        const element = findCellByKey({
+            api,
+            rowId: moveOverlay.rowKey,
+            colKey: ROW_CONTROLS_KEY
+        });
+        if (element) {
+            targets.push({
+                id: 'move',
+                kind: 'marker',
+                element,
+                message: moveOverlay.message,
+                status: moveOverlay.status
+            });
+        }
+    }
+    if (invalid.size > 0) {
+        scroller.querySelectorAll('.lf-table-body [data-row-key]').forEach((rowElement)=>{
+            const rowId = rowElement.dataset.rowKey;
+            const cells = invalid.get(rowId);
+            if (!cells) return;
+            cells.forEach((message, colKey)=>{
+                if (isEditingCell({
+                    session,
+                    rowId,
+                    colKey
+                })) return;
+                const element = rowElement.querySelector(`[data-lf-cell][data-col-key="${CSS.escape(colKey)}"]`);
+                if (!element) return;
+                targets.push({
+                    id: `invalid:${rowId}\u0000${colKey}`,
+                    kind: 'marker',
+                    element,
+                    message,
+                    status: 'invalid'
+                });
+            });
+        });
+    }
+    return targets;
+}
+export default computeEditTargets;

package/dist/features/editing/computeRowMove.js

@@ -0,0 +1,78 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import { get } from '@lowdefy/helpers';
+import positionBetween, { POSITION_STEP } from './positionBetween.js';
+// A row move (drag or Alt+Shift+Arrow) on the rows in display order. `gap` is the insertion
+// point (0 = before the first row, rows.length = after the last). Returns null when the row
+// would land where it is, else
+//   { rowKey, fromIndex, toIndex, beforeKey, afterKey, order, position, positions }
+// `order` is every key in the new order. With `positionField`, one new position is computed for
+// the moved row (fractional indexing), so a save writes one row: `positions` is
+// `{ [rowKey]: position }`. Only when there is no room between the neighbours is the whole list
+// renumbered in steps of 1024, and `positions` holds every row whose position changed.
+function computeRowMove({ rows, getKey, positionField, rowKey, gap }) {
+    const from = rows.findIndex((row)=>String(getKey(row)) === String(rowKey));
+    if (from === -1) return null;
+    const clamped = Math.min(Math.max(gap, 0), rows.length);
+    const to = clamped > from ? clamped - 1 : clamped;
+    if (to === from) return null;
+    const moving = rows[from];
+    const rest = [
+        ...rows.slice(0, from),
+        ...rows.slice(from + 1)
+    ];
+    const before = rest[to - 1];
+    const after = rest[to];
+    const arranged = [
+        ...rest.slice(0, to),
+        moving,
+        ...rest.slice(to)
+    ];
+    const move = {
+        rowKey: getKey(moving),
+        fromIndex: from,
+        toIndex: to,
+        beforeKey: before === undefined ? null : getKey(before),
+        afterKey: after === undefined ? null : getKey(after),
+        order: arranged.map(getKey),
+        position: undefined,
+        positions: undefined
+    };
+    if (!positionField) return move;
+    const position = positionBetween({
+        // A neighbour without a position is null (no room), unlike a missing neighbour.
+        before: before === undefined ? undefined : get(before, positionField, {
+            default: null
+        }),
+        after: after === undefined ? undefined : get(after, positionField, {
+            default: null
+        })
+    });
+    if (position !== null) {
+        move.position = position;
+        move.positions = {
+            [String(move.rowKey)]: position
+        };
+        return move;
+    }
+    move.positions = {};
+    arranged.forEach((row, index)=>{
+        const renumbered = (index + 1) * POSITION_STEP;
+        if (get(row, positionField) !== renumbered) move.positions[String(getKey(row))] = renumbered;
+    });
+    move.position = (to + 1) * POSITION_STEP;
+    return move;
+}
+export default computeRowMove;

package/dist/features/editing/createAddRow.js

@@ -0,0 +1,68 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import { get, set, type } from '@lowdefy/helpers';
+import addChangeRow from './addChangeRow.js';
+import createNewRow from './createNewRow.js';
+import generateRowKey from './generateRowKey.js';
+import positionBetween, { POSITION_STEP } from './positionBetween.js';
+// With a position field, an added row goes after the last data row (of every page).
+function nextPosition({ api, positionField }) {
+    const last = api.dataRows[api.dataRows.length - 1]?.original;
+    if (last === undefined) return positionBetween();
+    return positionBetween({
+        before: get(last, positionField)
+    }) ?? POSITION_STEP;
+}
+// "+ Add row": adds `{ rowKey, ...defaults }` to the changeset, then opens the editor on the new
+// row's first editable cell once it renders (the layer resolves `pendingStart` after the write).
+function createAddRow(api) {
+    return function addRow() {
+        const { editing } = api;
+        const { positionField } = editing.options;
+        const { rowKey, fields } = createNewRow({
+            specs: editing.specs,
+            keyField: editing.keyField,
+            generateKey: generateRowKey
+        });
+        if (positionField && type.isNone(get(fields, positionField))) {
+            set(fields, positionField, nextPosition({
+                api,
+                positionField
+            }));
+        }
+        const firstEditable = api.layout.cols.find((col)=>!col.special && editing.specs.get(col.key)?.editable);
+        api.actions.cancelEdit({
+            refocus: false
+        });
+        const changes = addChangeRow({
+            changes: editing.changes,
+            rowKey,
+            fields
+        });
+        const written = api.actions.writeChanges({
+            changes,
+            cause: 'add',
+            rowKey
+        });
+        if (written && firstEditable) {
+            editing.pendingStart = {
+                rowId: String(rowKey),
+                colKey: firstEditable.key
+            };
+        }
+        return written;
+    };
+}
+export default createAddRow;

package/dist/features/editing/createCancelEdit.js

@@ -0,0 +1,29 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import focusCell from './focusCell.js';
+// Esc: closes the editor and drops the draft; focus returns to the cell.
+function createCancelEdit(api) {
+    return function cancelEdit({ refocus = true } = {}) {
+        const session = api.editing.layer?.getSession();
+        if (!session) return;
+        api.editing.layer.setSession(null);
+        if (refocus) focusCell({
+            api,
+            rowId: session.rowId,
+            colKey: session.colKey
+        });
+    };
+}
+export default createCancelEdit;

package/dist/features/editing/createCommitEdit.js

@@ -0,0 +1,124 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import findNextEditableCell from './findNextEditableCell.js';
+import focusCell from './focusCell.js';
+import fromEditorDraft from './fromEditorDraft.js';
+import setRowField from './setRowField.js';
+import validateCellValue from './validateCellValue.js';
+import valuesEqual from './valuesEqual.js';
+import scrollToCell from '../virtualization/scrollToCell.js';
+import isDataItem from '../../core/isDataItem.js';
+function openNext({ api, next }) {
+    scrollToCell({
+        api,
+        row: next.rowIndex,
+        col: next.colIndex
+    });
+    api.keyboard?.setActive({
+        row: next.rowIndex,
+        col: next.colIndex
+    });
+    api.actions.startEdit({
+        rowId: next.rowId,
+        colKey: next.colKey
+    });
+}
+// Commits the open editor (Enter, Tab, blur, or a pick in a select, date, switch or rating).
+// The draft is validated first: a failing `required` / `validate` keeps the editor open with the
+// message and returns false. An unchanged value closes the editor without an event. Otherwise the
+// editor closes and the value goes to the block: TableInput writes its rows, Table saves through
+// onCellEdit. `move` (Tab: 1, Shift+Tab: -1) opens the next editable cell, found in display
+// order before the write, so a re-sort caused by the edit does not change where Tab goes.
+function createCommitEdit(api) {
+    return function commitEdit({ move } = {}) {
+        const { editing } = api;
+        const session = editing.layer?.getSession();
+        if (!session) return true;
+        const row = api.table.getRow(session.rowId, true);
+        const col = api.layout.byKey.get(session.colKey);
+        if (!row || !col) {
+            editing.layer.setSession(null);
+            return true;
+        }
+        const spec = editing.specs.get(session.colKey);
+        const previous = col.accessor(row.original);
+        const draft = editing.layer.getDraft(session.id);
+        const value = draft.has ? fromEditorDraft({
+            spec,
+            draft: draft.value,
+            previous
+        }) : previous;
+        const changed = !valuesEqual(value, previous);
+        if (changed) {
+            const nextRow = setRowField({
+                row: row.original,
+                field: spec.field,
+                value
+            });
+            const message = validateCellValue({
+                spec,
+                row: nextRow,
+                value
+            });
+            if (message !== null) {
+                editing.layer.updateSession({
+                    error: message
+                });
+                return false;
+            }
+        }
+        const next = move ? findNextEditableCell({
+            rows: api.rows,
+            cols: api.layout.cols,
+            specs: editing.specs,
+            rowIndex: api.rows.findIndex((candidate)=>isDataItem(candidate) && candidate.id === session.rowId),
+            colIndex: col.index,
+            direction: move
+        }) : null;
+        editing.layer.setSession(null);
+        if (changed) {
+            const rowKey = api.config.getKey(row.original);
+            if (editing.input) {
+                api.actions.writeCell({
+                    rowKey,
+                    field: spec.field,
+                    value
+                });
+            } else {
+                api.actions.saveCellEdit({
+                    row: row.original,
+                    rowKey,
+                    spec,
+                    value,
+                    previous
+                });
+            }
+        }
+        if (next) {
+            openNext({
+                api,
+                next
+            });
+        } else {
+            focusCell({
+                api,
+                rowId: session.rowId,
+                colKey: session.colKey
+            });
+        }
+        return true;
+    };
+}
+export default createCommitEdit;

package/dist/features/editing/createDeleteRow.js

@@ -0,0 +1,39 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import removeChangeRow from './removeChangeRow.js';
+// Deletes a TableInput row (the row controls' delete button, or Delete on a focused row with
+// `deleteRows`). An editor open on that row closes without committing.
+function createDeleteRow(api) {
+    return function deleteRow({ rowId }) {
+        const row = api.table.getRow(rowId, true);
+        if (!row) return false;
+        const rowKey = api.config.getKey(row.original);
+        if (api.editing.layer?.getSession()?.rowId === rowId) {
+            api.actions.cancelEdit({
+                refocus: false
+            });
+        }
+        const changes = removeChangeRow({
+            changes: api.editing.changes,
+            rowKey
+        });
+        return api.actions.writeChanges({
+            changes,
+            cause: 'delete',
+            rowKey
+        });
+    };
+}
+export default createDeleteRow;

package/dist/features/editing/createEditSpecs.js

@@ -0,0 +1,80 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import dayjs from 'dayjs';
+import { type } from '@lowdefy/helpers';
+import compileCondition from '@lowdefy/blocks-antd/table/compileCondition.js';
+import normalizeOptions from '@lowdefy/blocks-antd/table/normalizeOptions.js';
+import collectRawColumns from './collectRawColumns.js';
+import getEditorKind from './getEditorKind.js';
+const DEFAULT_RATING_MAX = 5;
+function getEditable({ raw, defaultColumn, column }) {
+    if (!type.isUndefined(raw?.editable)) return raw.editable;
+    if (!type.isUndefined(defaultColumn?.editable)) return defaultColumn.editable;
+    return column.editable;
+}
+// Everything editing needs per column, compiled once per column config: the editor kind, the
+// row-level `editable: { when }` test, the `validate` tests and `required`, and the `default`
+// for added rows. Conditions compile with the shared condition core, so `editable.when` and
+// `validate[].pass` read exactly like filters and rules.
+function createEditSpecs({ columns, rawColumns, defaultColumn }) {
+    const rawByKey = collectRawColumns({
+        columns: rawColumns
+    });
+    const columnsByKey = Object.fromEntries(columns.map((column)=>[
+            column.key,
+            column
+        ]));
+    const now = dayjs();
+    const specs = new Map();
+    columns.forEach((column)=>{
+        const raw = rawByKey.get(column.key);
+        const kind = getEditorKind(column.type);
+        const editable = getEditable({
+            raw,
+            defaultColumn,
+            column
+        });
+        const validate = (raw?.validate ?? column.validate ?? []).map((rule)=>({
+                message: rule.message ?? 'Invalid value.',
+                test: compileCondition({
+                    condition: rule.pass,
+                    columnsByKey,
+                    column,
+                    now
+                })
+            }));
+        specs.set(column.key, {
+            column,
+            default: raw?.default,
+            editable: kind !== null && (editable === true || type.isObject(editable)),
+            field: column.field,
+            key: column.key,
+            kind,
+            max: column.cell?.max ?? DEFAULT_RATING_MAX,
+            options: normalizeOptions(column.options),
+            required: raw?.required === true,
+            type: column.type,
+            validate,
+            when: type.isObject(editable) ? compileCondition({
+                condition: editable.when,
+                columnsByKey,
+                column,
+                now
+            }) : null
+        });
+    });
+    return specs;
+}
+export default createEditSpecs;

package/dist/features/editing/createEmptyChanges.js

@@ -0,0 +1,23 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ // TableInput's value with nothing changed.
+function createEmptyChanges() {
+    return {
+        updated: {},
+        added: [],
+        removed: []
+    };
+}
+export default createEmptyChanges;

package/dist/features/editing/createMoveRow.js

@@ -0,0 +1,65 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import applyMoveToChanges from './applyMoveToChanges.js';
+import computeRowMove from './computeRowMove.js';
+import getDataGap from './getDataGap.js';
+// A row move from a drag drop or Alt+Shift+Arrow, on the rows in display order. Moves are only
+// offered while the display order is the data order (or the position order), so the move's
+// neighbours are the row's neighbours in the saved order. The move is computed over every data
+// row (`api.dataRows`), not only the current page, so its indices, neighbours, key order and
+// positions hold for the whole list. TableInput records the move in its changeset; Table saves it
+// through onRowMove. Returns the move, or null when nothing moved.
+function createMoveRow(api) {
+    return function moveRow({ rowId, gap }) {
+        const { editing } = api;
+        if (!editing.options.rowDrag || editing.reorderBlock.get()) return null;
+        const row = api.table.getRow(rowId, true);
+        if (!row) return null;
+        const move = computeRowMove({
+            rows: api.dataRows.map((dataRow)=>dataRow.original),
+            getKey: api.config.getKey,
+            positionField: editing.options.positionField,
+            rowKey: rowId,
+            gap: getDataGap({
+                api,
+                gap
+            })
+        });
+        if (!move) return null;
+        api.actions.cancelEdit({
+            refocus: false
+        });
+        if (editing.input) {
+            const changes = applyMoveToChanges({
+                changes: editing.changes,
+                move,
+                positionField: editing.options.positionField,
+                dataByKey: editing.getDataByKey()
+            });
+            api.actions.writeChanges({
+                changes,
+                cause: 'move',
+                rowKey: move.rowKey
+            });
+        } else {
+            api.actions.saveRowMove({
+                move,
+                row: row.original
+            });
+        }
+        return move;
+    };
+}
+export default createMoveRow;

package/dist/features/editing/createNewRow.js

@@ -0,0 +1,32 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import { serializer, set, type, unset } from '@lowdefy/helpers';
+// A row for "+ Add row": `fields` holds each column's `default` at its field. The row always gets
+// a generated temporary key, kept out of `fields` so the server assigns the real one (the table
+// shows the temporary key until then). A default on the key column is ignored: every added row
+// would share it, and changes are recorded by key.
+function createNewRow({ specs, keyField, generateKey }) {
+    const fields = {};
+    specs.forEach((spec)=>{
+        if (type.isUndefined(spec.default)) return;
+        set(fields, spec.field, serializer.copy(spec.default));
+    });
+    unset(fields, keyField);
+    return {
+        rowKey: generateKey(),
+        fields
+    };
+}
+export default createNewRow;

package/dist/features/editing/createResetChanges.js

@@ -0,0 +1,29 @@
+/*
+  Copyright 2020-2026 Lowdefy, Inc
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+*/ import createEmptyChanges from './createEmptyChanges.js';
+// TableInput's `resetChanges` method: drops every change (after the app saved them, or to
+// discard them) and the undo history. A method call is the app's, so no onChange fires.
+function createResetChanges(api) {
+    return function resetChanges() {
+        const { editing } = api;
+        api.actions.cancelEdit({
+            refocus: false
+        });
+        editing.undo.clear();
+        editing.changes = createEmptyChanges();
+        editing.input.methods.setValue(editing.changes);
+    };
+}
+export default createResetChanges;