@svelte-lean/table 0.1.0

package/CHANGELOG.md

@@ -0,0 +1,7 @@
+# @svelte-lean/table
+
+## 0.1.0
+
+### Minor Changes
+
+- eb039db: Initial release: `<DataTable />` renders a native `<table>` over the `createTable()` engine, with state in one serializable object and grouping, pivot, clipboard, CSV export, server data sources and persisted state as separate entry points.

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Ömer Say
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,133 @@
+# @svelte-lean/table
+
+[Documentation](https://svelte-lean.vercel.app/table) ·
+[Getting started](https://svelte-lean.vercel.app/table/getting-started) ·
+[Repository](https://github.com/say16/svelte-lean/tree/main/packages/table) ·
+[Changelog](https://github.com/say16/svelte-lean/blob/main/packages/table/CHANGELOG.md)
+
+Svelte Lean Table: a data table for Svelte 5 that renders a native `<table>`, keeps its state in one
+plain object and adds capabilities through separate entry points. Part of the
+[Svelte Lean](https://github.com/say16/svelte-lean) ecosystem.
+
+> Preview release (`0.1.0-next`).
+
+## Install
+
+```bash
+yarn add @svelte-lean/table
+```
+
+Peer dependency: `svelte ^5.0.0`.
+
+## Use
+
+```svelte
+<script lang="ts">
+	import { DataTable, type Column } from '@svelte-lean/table';
+	import '@svelte-lean/table/style.css';
+
+	type Member = { id: number; name: string; revenue: number };
+	const data: Member[] = [
+		{ id: 1, name: 'Olivia Rhye', revenue: 1200 },
+		{ id: 2, name: 'Phoenix Baker', revenue: 9119 }
+	];
+	const columns: Column<Member>[] = [
+		{ id: 'name', header: 'Member' },
+		{ id: 'revenue', header: 'Revenue', align: 'end' }
+	];
+</script>
+
+<DataTable {data} {columns} getRowId={(row) => row.id} />
+```
+
+Sorting, search, column filters, pagination, selection, expansion, tree rows, sticky headers, column
+pinning, resizing, visibility and ordering, inline editing, cell ranges, row reordering and loading,
+empty and error states are props of `<DataTable />`. State is a serializable `TableState` object:
+pass `bind:state` or `onStateChange` to own it.
+
+Keyboard: with `onEdit` or `onCellRangeChange` the body is one Tab stop (roving `tabindex` over
+cells, arrow keys move, Enter/F2 edits, focus returns to the cell after an edit). Text direction
+follows the nearest `dir` attribute unless the `dir` prop is given. `selection: 'single'` needs an
+`id` prop so the row radios share a name and form one native radio group.
+
+Composition hooks:
+
+- `headerCell` receives a `HeaderContext` (`column`, `sort`, `sorting`, `toggleSort()`,
+  `setSorting()`): with `sortable: false` a header hosts its own sort control, and `sortKeys` lists
+  further sort ids that count as the column's sort. `sortDescFirst` starts a column descending.
+- `empty` receives `{ search, filtered, loading }`; `rowDetails` receives the row and
+  `{ rowId, index, collapse }`. A `<DataTable>` inside `rowDetails` keeps its own styles and
+  keyboard behavior; `expandColumn` puts the toggle in a leading column of its own.
+- `onRowClick` ignores clicks on controls and inside `[data-no-row-click]`; rows then answer Enter
+  and Space. `rowLabel` names row controls. `rowClass` can tint a row by setting
+  `--slean-table-row-bg`.
+- Server tables: `manual` with `rowCount`, or `pageCount` when the total is unknown; `searchDelay`
+  debounces the search box and the filter inputs; `searchText` replaces what a row is searched by;
+  `state.search` applies without the table's own search box. `loading` without rows draws
+  `skeletonRows`; `fetching` dims the body.
+- `pageSizeOptions`, numbered pages, `placeholder` for empty values, `headerClass`, per-row `class`.
+
+## Below the component
+
+`createTable()` is the engine `<DataTable />` renders. Use it to build a different renderer or to drive
+the table from application code. Options are read lazily, so getters keep it reactive.
+
+```ts
+import { createTable } from '@svelte-lean/table';
+
+const table = createTable({
+	data: () => rows, // `$state` in the caller stays reactive through the getter
+	columns,
+	getRowId: (row) => row.id,
+	state: () => tableState, // a getter makes the table controlled …
+	onStateChange: (next) => (tableState = next) // … and every change is reported here
+});
+
+table.toggleSort('revenue');
+table.model.rows; // paginated, sorted, filtered row nodes
+table.visibleColumns; // leaf columns in pin and user order
+```
+
+`createTable()` uses Svelte runes and therefore needs the Svelte compiler (any Svelte 5 project has
+it). `createRowModel()` and the other helpers in `@svelte-lean/table/core` are pure functions; that
+entry imports nothing from Svelte and runs under plain Node (checked by `fixtures/_shared/pack-smoke.mjs`).
+
+## Package shape
+
+Everything above is the root entry. Larger workflows are explicit entry points that never load unless
+imported:
+
+```ts
+import { DataTable, createTable, createRowModel } from '@svelte-lean/table';
+import { groupBy, summarize } from '@svelte-lean/table/grouping';
+import { pivot } from '@svelte-lean/table/pivot';
+import { createHistory, applyEdit } from '@svelte-lean/table/editing';
+import { copyRange, pasteRange } from '@svelte-lean/table/clipboard';
+import { toCsv, downloadText } from '@svelte-lean/table/export';
+import { createDataSource } from '@svelte-lean/table/server';
+import { serializeState, restoreState } from '@svelte-lean/table/state';
+import '@svelte-lean/table/style.css';
+```
+
+`style.css` styles the `slean-table-` classes. Its rules sit in the `slean.components` cascade layer
+with `:where()` selectors, so unlayered application CSS overrides them without `!important`. It reads
+`@svelte-lean/styles` tokens (`--slean-surface`, `--slean-fg`, `--slean-border`, `--slean-accent`,
+`--slean-radius-*`, …) when they are defined; the fallbacks are the same defaults written with
+`light-dark()`, so they follow the page's `color-scheme`. Override any `--slean-table-*` property
+(`--slean-table-header-bg`, `--slean-table-row-hover`, `--slean-table-cell-padding-y`, … listed on
+the Layout page) on `.slean-table` or a class passed through `class` to restyle a table. The selection
+checkboxes carry `data-slean="checkbox"`: with `@svelte-lean/styles/checkbox.css` loaded they take the
+Checkbox primitive's look (Tier 0, no runtime).
+
+TypeScript: types resolve under `moduleResolution` `bundler` and `node16`/`nodenext` (ESM); the
+build writes a `.d.svelte.ts` declaration next to each component for the latter.
+
+Bundle sizes per entry are measured by `yarn size` into `artifacts/size.json`; the values on the
+documentation site come from that file.
+
+## Documentation
+
+The documentation site of the Svelte Lean monorepo (`apps/docs`) contains the examples and the API
+reference.
+
+MIT

package/dist/clipboard.d.ts

@@ -0,0 +1,8 @@
+import type { CellRange, Column, EditEvent, RowId } from './types.js';
+export declare function rangeBounds<T>(range: CellRange, rows: readonly T[], columns: readonly Column<T>[], getRowId: (row: T) => RowId): [number, number, number, number] | null;
+export declare function copyRange<T>(range: CellRange, rows: readonly T[], columns: readonly Column<T>[], getRowId: (row: T) => RowId): string;
+/** Produces validated changes; the application decides when and how to commit the batch. */
+export declare function pasteRange<T>(text: string, start: {
+    row: number;
+    column: number;
+}, rows: readonly T[], columns: readonly Column<T>[], getRowId: (row: T) => RowId): EditEvent<T>[];

package/dist/clipboard.js

@@ -0,0 +1,49 @@
+import { parseDelimited } from './export.js';
+import { parseEdit, editEvent } from './editing.js';
+import { valueOf } from './core.js';
+export function rangeBounds(range, rows, columns, getRowId) {
+    const a = rows.findIndex((row) => getRowId(row) === range.start.row), b = rows.findIndex((row) => getRowId(row) === range.end.row);
+    const c = columns.findIndex((col) => col.id === range.start.column), d = columns.findIndex((col) => col.id === range.end.column);
+    return Math.min(a, b, c, d) < 0
+        ? null
+        : [Math.min(a, b), Math.max(a, b), Math.min(c, d), Math.max(c, d)];
+}
+export function copyRange(range, rows, columns, getRowId) {
+    const bounds = rangeBounds(range, rows, columns, getRowId);
+    if (!bounds)
+        return '';
+    const [r0, r1, c0, c1] = bounds;
+    const quote = (value) => {
+        const text = String(value ?? '');
+        return /[\t\n\r"]/.test(text) ? `"${text.replaceAll('"', '""')}"` : text;
+    };
+    return rows
+        .slice(r0, r1 + 1)
+        .map((row) => columns
+        .slice(c0, c1 + 1)
+        .map((col) => quote(valueOf(row, col)))
+        .join('\t'))
+        .join('\n');
+}
+/** Produces validated changes; the application decides when and how to commit the batch. */
+export function pasteRange(text, start, rows, columns, getRowId) {
+    const changes = [];
+    for (const [ri, cells] of parseDelimited(text, '\t').entries()) {
+        const row = rows[start.row + ri];
+        if (row === undefined)
+            break;
+        for (const [ci, text] of cells.entries()) {
+            const col = columns[start.column + ci];
+            if (!col)
+                break;
+            if (!col.editable || (typeof col.editable === 'function' && !col.editable(row)))
+                continue;
+            const value = parseEdit(col, text, row);
+            const error = col.validate?.(value, row);
+            if (error)
+                throw new Error(`${col.header}: ${error}`);
+            changes.push(editEvent(row, getRowId(row), col, value));
+        }
+    }
+    return changes;
+}

package/dist/core.d.ts

@@ -0,0 +1,41 @@
+import type { Column, Filter, TableState, ModelContext, RowId, RowModel, RowNode, Sort } from './types.js';
+export type * from './types.js';
+export declare function defaultState(patch?: Partial<TableState>): TableState;
+export declare function valueOf<T>(row: T, column: Column<T>): unknown;
+export declare function leafColumns<T>(columns: readonly Column<T>[]): Column<T>[];
+export declare function visibleColumns<T>(columns: readonly Column<T>[], state: TableState): Column<T>[];
+export declare function fold(value: unknown, locale?: string): string;
+export declare function matchesFilter(value: unknown, filter: Filter, locale?: string): boolean;
+/**
+ * Cycles one sort id through none → ascending → descending → none, or none → descending →
+ * ascending → none with `descFirst`. `multi` keeps the other sorted ids.
+ */
+export declare function toggleSort(sorting: Sort[], id: string, multi?: boolean, descFirst?: boolean): Sort[];
+/** The first sort entry on the column's id or one of its `sortKeys`, with its precedence. */
+export declare function sortOf<T>(sorting: readonly Sort[], column: Pick<Column<T>, 'id' | 'sortKeys'>): {
+    id: string;
+    desc: boolean;
+    index: number;
+} | undefined;
+/** Clamps a requested width to the column's `minWidth`/`maxWidth` (defaults 64 and 1200). */
+export declare function clampWidth<T>(column: Column<T>, width: number): number;
+export declare function columnWidth<T>(column: Column<T>, state: TableState): number;
+export declare function toggleId(ids: RowId[], id: RowId): RowId[];
+export declare function toggleSelection(current: RowId[], eligible: RowId[], select?: boolean): RowId[];
+export declare function flattenRows<T>(nodes: readonly RowNode<T>[], expanded?: ReadonlySet<RowId>): RowNode<T>[];
+/**
+ * Search reads declared searchable columns only, never arbitrary hidden payload fields, unless
+ * `searchText` says what a row's searchable text is.
+ */
+export declare function prepareRows<T>(context: ModelContext<T>): RowNode<T>[];
+export declare function paginateNodes<T>(nodes: RowNode<T>[], context: ModelContext<T>): RowModel<T>;
+export declare function createRowModel<T>(context: ModelContext<T>): RowModel<T>;
+export interface HeaderCell<T> {
+    key: string;
+    column: Column<T>;
+    colSpan: number;
+    rowSpan: number;
+}
+/** Reordering/pinning may split a group; render each contiguous fragment truthfully. */
+export declare function headerRows<T>(columns: readonly Column<T>[], visible: readonly Column<T>[]): HeaderCell<T>[][];
+export declare function reorder<T>(items: readonly T[], source: T, target: T): T[];

package/dist/core.js

@@ -0,0 +1,277 @@
+export function defaultState(patch = {}) {
+    return {
+        sorting: [],
+        filters: [],
+        search: '',
+        pageIndex: 0,
+        pageSize: 20,
+        selection: [],
+        expanded: [],
+        hidden: [],
+        order: [],
+        widths: {},
+        pinning: {},
+        rowPinning: { top: [], bottom: [] },
+        ...patch
+    };
+}
+export function valueOf(row, column) {
+    if (typeof column.accessor === 'function')
+        return column.accessor(row);
+    const path = String(column.accessor ?? column.id).split('.');
+    return path.reduce((value, key) => value != null && typeof value === 'object'
+        ? value[key]
+        : undefined, row);
+}
+export function leafColumns(columns) {
+    return columns.flatMap((column) => column.children?.length ? leafColumns(column.children) : [column]);
+}
+export function visibleColumns(columns, state) {
+    const hidden = new Set(state.hidden);
+    const order = new Map(state.order.map((id, index) => [id, index]));
+    const pin = (column) => state.pinning[column.id] ?? column.pin;
+    const zone = (column) => pin(column) === 'left' ? 0 : pin(column) === 'right' ? 2 : 1;
+    return leafColumns(columns)
+        .filter((c) => !hidden.has(c.id))
+        .sort((a, b) => zone(a) - zone(b) || (order.get(a.id) ?? Infinity) - (order.get(b.id) ?? Infinity));
+}
+export function fold(value, locale) {
+    return String(value ?? '')
+        .replace(/[ıİ]/g, 'i')
+        .normalize('NFD')
+        .replace(/[\u0300-\u036f]/g, '')
+        .toLocaleLowerCase(locale);
+}
+export function matchesFilter(value, filter, locale) {
+    const wanted = filter.value;
+    const op = filter.operator ?? 'contains';
+    if (op === 'empty')
+        return wanted === false ? value != null && value !== '' : value == null || value === '';
+    if (wanted == null || wanted === '')
+        return true;
+    if (op === 'in')
+        return Array.isArray(wanted) && wanted.some((item) => Object.is(item, value));
+    if (op === 'contains')
+        return fold(value, locale).includes(fold(wanted, locale));
+    if (op === 'startsWith')
+        return fold(value, locale).startsWith(fold(wanted, locale));
+    if (op === 'equals')
+        return fold(value, locale) === fold(wanted, locale);
+    if (value == null || value === '')
+        return false;
+    const numeric = (input) => input instanceof Date ? input.getTime() : Number(input);
+    const n = numeric(value);
+    if (op === 'between')
+        return (Array.isArray(wanted) &&
+            (wanted[0] == null || wanted[0] === '' || n >= numeric(wanted[0])) &&
+            (wanted[1] == null || wanted[1] === '' || n <= numeric(wanted[1])));
+    const target = numeric(wanted);
+    if (!Number.isFinite(n) || !Number.isFinite(target))
+        return false;
+    if (op === 'gt')
+        return n > target;
+    if (op === 'gte')
+        return n >= target;
+    if (op === 'lt')
+        return n < target;
+    return n <= target;
+}
+/**
+ * Cycles one sort id through none → ascending → descending → none, or none → descending →
+ * ascending → none with `descFirst`. `multi` keeps the other sorted ids.
+ */
+export function toggleSort(sorting, id, multi = false, descFirst = false) {
+    const current = sorting.find((s) => s.id === id);
+    const next = !current
+        ? { id, desc: descFirst }
+        : current.desc === descFirst
+            ? { id, desc: !descFirst }
+            : null;
+    const others = multi ? sorting.filter((s) => s.id !== id) : [];
+    return next ? [...others, next] : others;
+}
+/** The first sort entry on the column's id or one of its `sortKeys`, with its precedence. */
+export function sortOf(sorting, column) {
+    const index = sorting.findIndex((sort) => sort.id === column.id || !!column.sortKeys?.includes(sort.id));
+    const sort = sorting[index];
+    return sort ? { id: sort.id, desc: sort.desc, index } : undefined;
+}
+/** Clamps a requested width to the column's `minWidth`/`maxWidth` (defaults 64 and 1200). */
+export function clampWidth(column, width) {
+    return Math.max(column.minWidth ?? 64, Math.min(column.maxWidth ?? 1200, Number.isFinite(width) ? width : 160));
+}
+export function columnWidth(column, state) {
+    return clampWidth(column, state.widths[column.id] ?? column.width ?? 160);
+}
+export function toggleId(ids, id) {
+    return ids.includes(id) ? ids.filter((item) => item !== id) : [...ids, id];
+}
+export function toggleSelection(current, eligible, select) {
+    const set = new Set(current);
+    const add = select ?? !eligible.every((id) => set.has(id));
+    for (const id of eligible)
+        if (add)
+            set.add(id);
+        else
+            set.delete(id);
+    return [...set];
+}
+export function flattenRows(nodes, expanded) {
+    const result = [];
+    for (const node of nodes) {
+        result.push(node);
+        if (!expanded || expanded.has(node.id))
+            result.push(...flattenRows(node.children, expanded));
+    }
+    return result;
+}
+/**
+ * Search reads declared searchable columns only, never arbitrary hidden payload fields, unless
+ * `searchText` says what a row's searchable text is.
+ */
+export function prepareRows(context) {
+    const { data, getRowId, getSubRows, state, manual, locale, searchText } = context;
+    const columns = leafColumns(context.columns);
+    const byId = new Map(columns.map((c) => [c.id, c]));
+    const terms = fold(state.search, locale).split(/\s+/).filter(Boolean);
+    const searchColumns = columns.filter((c) => c.searchable !== false && !state.hidden.includes(c.id));
+    const searched = (row) => {
+        if (!terms.length)
+            return true;
+        if (searchText) {
+            const text = fold(searchText(row), locale);
+            return terms.every((term) => text.includes(term));
+        }
+        return terms.every((term) => searchColumns.some((col) => fold(valueOf(row, col), locale).includes(term)));
+    };
+    const collator = new Intl.Collator(locale, { numeric: true, sensitivity: 'base' });
+    const seen = new Set();
+    const compare = (a, b) => {
+        if (a.data === undefined || b.data === undefined)
+            return 0;
+        for (const sort of state.sorting) {
+            const col = byId.get(sort.id);
+            if (!col || col.sortable === false)
+                continue;
+            const av = valueOf(a.data, col), bv = valueOf(b.data, col);
+            const emptyA = av == null || av === '' || (typeof av === 'number' && Number.isNaN(av));
+            const emptyB = bv == null || bv === '' || (typeof bv === 'number' && Number.isNaN(bv));
+            if (emptyA || emptyB) {
+                if (emptyA !== emptyB)
+                    return emptyA ? 1 : -1;
+                continue;
+            }
+            const result = col.compare
+                ? col.compare(av, bv, a.data, b.data)
+                : typeof av === 'number' && typeof bv === 'number'
+                    ? av - bv
+                    : av instanceof Date && bv instanceof Date
+                        ? av.getTime() - bv.getTime()
+                        : collator.compare(String(av), String(bv));
+            if (result)
+                return sort.desc ? -result : result;
+        }
+        return 0;
+    };
+    const walk = (rows, depth) => {
+        if (depth > 100)
+            throw new Error('Tree depth exceeds 100. Check for cycles.');
+        const result = [];
+        for (const row of rows) {
+            const id = getRowId(row);
+            if ((typeof id !== 'string' && typeof id !== 'number') ||
+                (typeof id === 'number' && !Number.isFinite(id)))
+                throw new Error('getRowId must return a finite number or string.');
+            if (seen.has(id))
+                throw new Error(`Duplicate row id: ${String(id)}`);
+            seen.add(id);
+            const children = walk(getSubRows?.(row) ?? [], depth + 1);
+            const matches = manual ||
+                (state.filters.every((filter) => {
+                    const col = byId.get(filter.id);
+                    return (!col ||
+                        (col.filter
+                            ? col.filter(valueOf(row, col), filter, row)
+                            : matchesFilter(valueOf(row, col), filter, locale)));
+                }) &&
+                    searched(row));
+            if (matches || children.length)
+                result.push({ id, data: row, depth, children, kind: 'row' });
+        }
+        return !manual && state.sorting.length ? result.sort(compare) : result;
+    };
+    return walk(data, 0);
+}
+export function paginateNodes(nodes, context) {
+    const { state, manual } = context;
+    const total = manual ? Math.max(0, context.rowCount ?? nodes.length) : nodes.length;
+    const size = Math.max(0, Math.floor(state.pageSize));
+    const unpinnedCount = manual
+        ? total
+        : nodes.filter((n) => !state.rowPinning.top.includes(n.id) && !state.rowPinning.bottom.includes(n.id)).length;
+    const pageCount = !size
+        ? 1
+        : manual && context.pageCount !== undefined
+            ? Math.max(1, Math.floor(context.pageCount))
+            : Math.max(1, Math.ceil(unpinnedCount / size));
+    const pageIndex = Math.max(0, Math.min(Math.floor(state.pageIndex), pageCount - 1));
+    const all = flattenRows(nodes).filter((node) => node.kind === 'row');
+    const top = new Set(state.rowPinning.top), bottom = new Set(state.rowPinning.bottom);
+    const page = manual || !size
+        ? nodes
+        : nodes
+            .filter((node) => !top.has(node.id) && !bottom.has(node.id))
+            .slice(pageIndex * size, (pageIndex + 1) * size);
+    const roots = [
+        ...nodes.filter((node) => top.has(node.id)),
+        ...page.filter((node) => !top.has(node.id) && !bottom.has(node.id)),
+        ...nodes.filter((node) => bottom.has(node.id) && !top.has(node.id))
+    ];
+    return { rows: flattenRows(roots, new Set(state.expanded)), total, pageCount, pageIndex, all };
+}
+export function createRowModel(context) {
+    return paginateNodes(prepareRows(context), context);
+}
+/** Reordering/pinning may split a group; render each contiguous fragment truthfully. */
+export function headerRows(columns, visible) {
+    const paths = new Map();
+    const walk = (cols, parents) => {
+        for (const col of cols)
+            if (col.children?.length)
+                walk(col.children, [...parents, col]);
+            else
+                paths.set(col.id, [...parents, col]);
+    };
+    walk(columns, []);
+    const depth = Math.max(1, ...visible.map((c) => paths.get(c.id)?.length ?? 1));
+    return Array.from({ length: depth }, (_, level) => {
+        const result = [];
+        for (const col of visible) {
+            const path = paths.get(col.id) ?? [col];
+            const node = path[level];
+            if (!node)
+                continue;
+            const group = level < path.length - 1;
+            const previous = result.at(-1);
+            if (group && previous && previous.column === node)
+                previous.colSpan++;
+            else
+                result.push({
+                    key: `${node.id}:${result.length}`,
+                    column: node,
+                    colSpan: 1,
+                    rowSpan: group ? 1 : depth - level
+                });
+        }
+        return result;
+    });
+}
+export function reorder(items, source, target) {
+    const from = items.indexOf(source), to = items.indexOf(target);
+    if (from < 0 || to < 0 || from === to)
+        return [...items];
+    const result = [...items];
+    result.splice(from, 1);
+    result.splice(to, 0, source);
+    return result;
+}

package/dist/editing.d.ts

@@ -0,0 +1,16 @@
+import type { Column, EditEvent, RowId } from './types.js';
+/** Immutable setter rejects prototype-mutating paths. Accessor functions need an app setter. */
+export declare function setValue<T>(row: T, path: string, value: unknown): T;
+export declare function applyEdit<T>(rows: readonly T[], event: EditEvent<T>, columns: readonly Column<T>[], getRowId: (row: T) => RowId): T[];
+export declare function parseEdit<T>(column: Column<T>, text: string, row: T): unknown;
+/** Caller-owned history: use immutable values, no hidden row mutation. */
+export declare function createHistory<T>(initial: T, limit?: number): {
+    readonly value: T;
+    readonly canUndo: boolean;
+    readonly canRedo: boolean;
+    commit(value: T): T;
+    undo(): T;
+    redo(): T;
+    reset(value: T): void;
+};
+export declare function editEvent<T>(row: T, rowId: RowId, column: Column<T>, value: unknown): EditEvent<T>;

package/dist/editing.js

@@ -0,0 +1,79 @@
+import { valueOf } from './core.js';
+/** Immutable setter rejects prototype-mutating paths. Accessor functions need an app setter. */
+export function setValue(row, path, value) {
+    const parts = path.split('.');
+    if (!parts.length ||
+        parts.some((p) => !p || ['__proto__', 'prototype', 'constructor'].includes(p)))
+        throw new Error('Unsafe field path.');
+    const clone = (source, index) => {
+        const object = source != null && typeof source === 'object' ? source : {};
+        // Every segment is a non-empty string: the guard above rejected empty and unsafe ones.
+        const key = parts[index];
+        return { ...object, [key]: index === parts.length - 1 ? value : clone(object[key], index + 1) };
+    };
+    return clone(row, 0);
+}
+export function applyEdit(rows, event, columns, getRowId) {
+    const column = columns.find((c) => c.id === event.columnId);
+    if (!column || typeof column.accessor === 'function')
+        throw new Error('Use an application setter for computed/accessor-function columns.');
+    return rows.map((row) => getRowId(row) === event.rowId
+        ? setValue(row, String(column.accessor ?? column.id), event.value)
+        : row);
+}
+export function parseEdit(column, text, row) {
+    if (column.parse)
+        return column.parse(text, row);
+    if (column.editor === 'number') {
+        if (!text.trim())
+            return null;
+        const number = Number(text);
+        if (!Number.isFinite(number))
+            throw new Error('Enter a valid number.');
+        return number;
+    }
+    return text;
+}
+/** Caller-owned history: use immutable values, no hidden row mutation. */
+export function createHistory(initial, limit = 100) {
+    let past = [], present = initial, future = [];
+    return {
+        get value() {
+            return present;
+        },
+        get canUndo() {
+            return past.length > 0;
+        },
+        get canRedo() {
+            return future.length > 0;
+        },
+        commit(value) {
+            past = [...past, present].slice(-Math.max(1, limit));
+            present = value;
+            future = [];
+            return present;
+        },
+        undo() {
+            if (past.length) {
+                future.push(present);
+                present = past.pop();
+            }
+            return present;
+        },
+        redo() {
+            if (future.length) {
+                past.push(present);
+                present = future.pop();
+            }
+            return present;
+        },
+        reset(value) {
+            past = [];
+            future = [];
+            present = value;
+        }
+    };
+}
+export function editEvent(row, rowId, column, value) {
+    return { row, rowId, columnId: column.id, previous: valueOf(row, column), value };
+}

package/dist/export.d.ts

@@ -0,0 +1,11 @@
+import type { Column } from './types.js';
+export interface CsvOptions {
+    delimiter?: ',' | ';' | '\t';
+    bom?: boolean;
+    protectFormulas?: boolean;
+    headers?: boolean;
+}
+export declare function toCsv<T>(rows: readonly T[], columns: readonly Column<T>[], options?: CsvOptions): string;
+export declare function downloadText(content: string, filename: string, type?: string): void;
+/** RFC-style quoted cells, including embedded line breaks and escaped quotes. */
+export declare function parseDelimited(text: string, delimiter?: string): string[][];