@atscript/vue-table 0.1.133 → 0.1.135

package/dist/{use-table-state-D6dHOFrA.cjs → use-table-state-jljSQQ8m.cjs}

@@ -1,3 +1,4 @@
+const require_get_cell_value = require("./get-cell-value-CJT4fk4y.cjs");
 let _atscript_ui = require("@atscript/ui");
 let vue = require("vue");
 let _atscript_ui_table = require("@atscript/ui-table");
@@ -43,18 +44,25 @@ function rowActionGate(row) {
 	return names ? gateFor(new Set(names)) : null;
 }
 /**
-* Filter a `{default, others, rows}` triple through an availability `gate`.
-* When `gate` is `null`, returns the input `buckets` reference unchanged so
-* source-array references stay stable downstream (no spurious recomputes in
-* consumers that compare array identity). Shared by the single-row
-* (`applyRowGate`) and bulk (`applyRowsGate`) paths.
+* Walk a `{default, others, rows}` triple once: keep the actions `gate`
+* admits, then run each survivor through `map`. Both are optional — with
+* neither, the input `buckets` reference comes back unchanged so source-array
+* references stay stable downstream (no spurious recomputes in consumers that
+* compare array identity). Shared by the single-row (`applyRowGate`), bulk
+* (`applyRowsGate`) and per-screen-policy paths.
 */
-function applyGate(buckets, gate) {
-	if (!gate) return buckets;
+function applyGate(buckets, gate, map) {
+	if (!gate && !map) return buckets;
+	const keep = gate ?? (() => true);
+	const walk = (list) => {
+		const kept = gate ? list.filter(keep) : list;
+		return map ? kept.map(map) : kept;
+	};
+	const def = buckets.default;
 	return {
-		default: buckets.default && gate(buckets.default) ? buckets.default : void 0,
-		others: buckets.others.filter(gate),
-		rows: buckets.rows.filter(gate)
+		default: def && keep(def) ? map ? map(def) : def : void 0,
+		others: walk(buckets.others),
+		rows: walk(buckets.rows)
 	};
 }
 /**
@@ -281,12 +289,16 @@ async function triggerAction(state, action, ctx, event) {
 		if (input === null) return;
 		state.actions.invoke(action, pk, {
 			event,
-			input
+			input,
+			row: ctx.row
 		});
 		return;
 	}
 	if (!await confirmAction(state, action, ctx)) return;
-	state.actions.invoke(action, pk, { event });
+	state.actions.invoke(action, pk, {
+		event,
+		row: ctx.row
+	});
 }
 /**
 * Pick the `pk` argument to forward to `state.actions.invoke` based on the
@@ -308,6 +320,75 @@ function idsForAction(level, pk) {
 	return pk === void 0 ? [] : [pk];
 }
 //#endregion
+//#region src/composables/state/row-actions-config.ts
+/** The app definition behind a client-only action, or `undefined` for a server action. */
+function localActionOf(action) {
+	return action.$local;
+}
+/** Wrap an app-owned action in the descriptor shape the row-actions cell renders. */
+function toLocalActionInfo(local) {
+	return {
+		name: local.name,
+		label: local.label,
+		level: "row",
+		processor: "custom",
+		value: "",
+		icon: local.icon,
+		intent: local.intent,
+		promptText: local.promptText,
+		$local: local
+	};
+}
+/**
+* Render-time href for a row action, whichever kind it is: a client-only
+* action builds its own from the row — still mapped through
+* `state.resolveHref`, so router base paths apply exactly as they do for a
+* server `navigate` action — and a server action goes through
+* {@link actionHref}.
+*/
+function rowActionHref(state, action, id, row) {
+	const local = localActionOf(action);
+	if (local) return local.href && row !== void 0 ? state.resolveHref(local.href(row)) : void 0;
+	return actionHref(state, action, id);
+}
+const EMPTY = Object.freeze([]);
+/** The identity policy — used when no `RowActionsConfig` is wired. */
+const PASS_THROUGH = {
+	apply: (buckets) => buckets,
+	extra: () => EMPTY
+};
+/** Compile a per-screen {@link RowActionsConfig} into a {@link RowActionsPolicy}. */
+function compileRowActionsConfig(config) {
+	if (!config) return PASS_THROUGH;
+	const include = config.include ? new Set(config.include) : null;
+	const exclude = config.exclude ? new Set(config.exclude) : null;
+	const overrides = config.overrides;
+	const gate = (a) => (!include || include.has(a.name)) && !exclude?.has(a.name);
+	const decorate = overrides ? (action) => {
+		const patch = overrides[action.name];
+		if (!patch) return action;
+		const next = { ...action };
+		for (const key of [
+			"label",
+			"icon",
+			"intent",
+			"promptText"
+		]) {
+			const value = patch[key];
+			if (value !== void 0) next[key] = value;
+		}
+		return next;
+	} : void 0;
+	const locals = (config.extra ?? []).filter((local) => !exclude?.has(local.name));
+	return {
+		apply: (buckets) => applyGate(buckets, gate, decorate),
+		extra: (row) => {
+			if (locals.length === 0) return EMPTY;
+			return (row === void 0 ? locals : locals.filter((l) => l.enabled?.(row) !== false)).map(toLocalActionInfo);
+		}
+	};
+}
+//#endregion
 //#region src/composables/state/create-actions.ts
 const REMOVE_NAME = REMOVE_PROCESSOR;
 const REMOVE_DEFAULTS = {
@@ -340,13 +421,16 @@ function createActions(opts) {
 		let result;
 		try {
 			switch (action.processor) {
-				case "custom":
+				case "custom": {
+					const local = localActionOf(action);
+					if (local?.onInvoke) await local.onInvoke(callOpts?.row ?? {}, Array.isArray(pk) ? pk[0] : pk);
 					result = {
 						ok: true,
 						kind: "custom",
 						dispatched: true
 					};
 					break;
+				}
 				case "navigate":
 					await opts.client.action(action.name, pk);
 					result = {
@@ -1440,17 +1524,21 @@ const DEFAULT_BLOCK_SIZE = 100;
 const DEFAULT_DRAG_RELEASE_DEBOUNCE_MS = 300;
 const DEFAULT_ITEMS_PER_PAGE = 25;
 let _tblUid = 0;
+/** Shared empty sorter list — keeps `splitSorters` identity-stable. */
+const EMPTY_SORTERS = Object.freeze([]);
 /**
-* Coerce a primitive cell value to a string for the static-mode query
-* function's substring search and locale-aware sort. Objects fall back to
-* `""` so `'[object Object]'` never leaks into the search index. Module
-* scope so it's not recreated on every fetch.
+* Build the value reader used for in-memory sorting: a display column's
+* `sortValue(row)` wins for its own key, everything else reads the row by
+* path. Returns `getCellValue` itself when no display column defines one.
 */
-function cellAsString(v) {
-	if (v == null) return "";
-	if (typeof v === "string") return v;
-	if (typeof v === "number" || typeof v === "boolean") return v.toString();
-	return "";
+function createSortValueReader(display) {
+	const map = /* @__PURE__ */ new Map();
+	for (const d of display ?? []) if (d.sortValue) map.set(d.key, d.sortValue);
+	if (map.size === 0) return require_get_cell_value.getCellValue;
+	return (row, field) => {
+		const fn = map.get(field);
+		return fn ? fn(row) : require_get_cell_value.getCellValue(row, field);
+	};
 }
 /**
 * Promise-based dialog slot. A second `request()` while one is open
@@ -1526,6 +1614,13 @@ function createTableState(opts) {
 	});
 	const rowDelete = (0, vue.ref)(false);
 	const includeActions = (0, vue.ref)(false);
+	const rowActions = (0, vue.ref)(void 0);
+	/**
+	* The per-screen row-action policy, compiled once per config change instead
+	* of once per row per render — and read by every surface that renders row
+	* actions, so the cell and the selection toolbar can't drift apart.
+	*/
+	const rowActionsPolicy = (0, vue.computed)(() => compileRowActionsConfig(rowActions.value));
 	const filters = (0, vue.shallowRef)({});
 	const results = (0, vue.shallowRef)([]);
 	const resultsStart = (0, vue.ref)(0);
@@ -1612,23 +1707,65 @@ function createTableState(opts) {
 	let generation = 0;
 	let queryDetected = false;
 	let skipPaginationWatch = 0;
-	function buildCurrentQuery() {
+	/**
+	* Paths of client-owned columns — they have no server field behind them, so
+	* they are stripped from `$select` and from `$sort`. Recomputed only when
+	* the column set changes.
+	*/
+	const localColumnPaths = (0, vue.computed)(() => {
+		const out = /* @__PURE__ */ new Set();
+		for (const c of allColumns.value) if (c.local) out.add(c.path);
+		return out;
+	});
+	/**
+	* The active sorters split by who applies them: `server` goes into `$sort`,
+	* `local` targets a client-owned column and is applied in memory. One pass,
+	* one dependency — the two halves are complements.
+	*/
+	const splitSorters = (0, vue.computed)(() => {
+		const paths = localColumnPaths.value;
+		if (paths.size === 0) return {
+			local: EMPTY_SORTERS,
+			server: sorters.value
+		};
+		const local = [];
+		const server = [];
+		for (const s of sorters.value) (paths.has(s.field) ? local : server).push(s);
+		return {
+			local,
+			server
+		};
+	});
+	/** `true` while the query deliberately drops user sorters to keep search relevance. */
+	function sortersIgnored() {
+		return ignoreSortersWhenSearched.value && !!searchTerm.value;
+	}
+	/** Reads the value a sorter orders by — a display column's `sortValue` wins. */
+	const sortValueOf = createSortValueReader(opts.displayColumns);
+	function applyLocalSort(rows) {
+		if (queryOpts?.preSorted) return rows;
+		if (splitSorters.value.local.length === 0 || sortersIgnored()) return rows;
+		return (0, _atscript_ui_table.sortRowsLocally)(rows, queryOpts?.forceSorters?.length ? (0, _atscript_ui_table.mergeSorters)(queryOpts.forceSorters, sorters.value) : sorters.value, sortValueOf);
+	}
+	function buildCurrentQuery(buildOpts) {
 		const available = tableDef.value?.fetchableFields ?? new Set(allColumns.value.map((c) => c.path));
 		const extra = /* @__PURE__ */ new Set();
 		for (const c of columns.value) for (const p of c.selectWith ?? []) if (available.has(p)) extra.add(p);
 		if (queryOpts?.alwaysSelected) {
 			for (const p of queryOpts.alwaysSelected) if (available.has(p)) extra.add(p);
 		}
+		const localPaths = localColumnPaths.value;
+		const requested = buildOpts?.columnPaths ?? columnNames.value;
 		return (0, _atscript_ui_table.buildTableQuery)({
-			visibleColumnPaths: columnNames.value,
+			visibleColumnPaths: localPaths.size ? requested.filter((p) => !localPaths.has(p)) : requested,
 			extraSelect: extra.size ? [...extra] : void 0,
-			sorters: sorters.value,
+			sorters: splitSorters.value.server,
 			forceSorters: queryOpts?.forceSorters,
 			filters: filters.value,
 			forceFilters: queryOpts?.forceFilters,
 			search: searchTerm.value || void 0,
-			ignoreSorters: ignoreSortersWhenSearched.value && !!searchTerm.value,
-			includeActions: includeActions.value
+			ignoreSorters: sortersIgnored(),
+			includeActions: buildOpts?.includeActions ?? includeActions.value
 		});
 	}
 	function dispatchPages(query, page, size) {
@@ -1646,6 +1783,19 @@ function createTableState(opts) {
 	/** -1 == nothing active. */
 	const activeIndex = (0, vue.ref)(-1);
 	const navMode = (0, vue.ref)("pagination");
+	/**
+	* Whether a sorter on a client-owned column does anything right now — the
+	* one rule every surface that renders a sort affordance reads, so the
+	* header and the config dialog cannot disagree about it.
+	*
+	* Sorting a client-owned column happens in memory over the loaded page.
+	* Window mode has no page: it caches rows by absolute index and drops them
+	* as the viewport moves, so behind a server fetcher the order would shift
+	* under the user as they scrolled. `preSorted` is the case where it would
+	* not — the in-memory provider orders the whole dataset before it slices,
+	* so every absolute index arrives already in place.
+	*/
+	const localSortAvailable = (0, vue.computed)(() => navMode.value !== "window" || !!queryOpts?.preSorted);
 	const isQueryBlocked = (0, vue.computed)(() => {
 		const blocked = queryOpts?.blockQuery;
 		return typeof blocked === "function" ? !!blocked() : !!blocked;
@@ -1840,6 +1990,7 @@ function createTableState(opts) {
 		selectableCount,
 		selectAll,
 		rowDelete,
+		rowActions,
 		includeActions,
 		activeIndex,
 		navMode,
@@ -1870,6 +2021,12 @@ function createTableState(opts) {
 		queryNext,
 		loadRange,
 		invalidate,
+		buildQuery: buildCurrentQuery,
+		fetchPage: dispatchPages,
+		localColumnPaths,
+		applyLocalSort,
+		localSortAvailable,
+		rowActionsPolicy,
 		dataAt,
 		loadingAt,
 		errorAt,
@@ -2028,6 +2185,11 @@ function createTableState(opts) {
 		if ((0, _atscript_ui_table.sortersEqual)(prev, next)) return;
 		if (searchTerm.value) setIgnoreSortersInternal(false);
 		if (!queryDetected) return;
+		const paths = localColumnPaths.value;
+		if (paths.size > 0) {
+			const keep = (s) => !paths.has(s.field);
+			if ((0, _atscript_ui_table.sortersEqual)(prev.filter(keep), next.filter(keep))) return;
+		}
 		requestRefresh();
 	}, { immediate: false });
 	(0, vue.watch)(() => searchTerm.value, (next, prev) => {
@@ -2098,10 +2260,11 @@ function createTableState(opts) {
 		state,
 		internals: {
 			init(def) {
-				allColumns.value = def.columns;
-				const reconciled = (0, _atscript_ui_table.reconcileColumnWidthDefaults)(def.columns, columnWidths.value);
+				const merged = (0, _atscript_ui_table.mergeDisplayColumns)(def.columns, opts.displayColumns ?? []);
+				allColumns.value = merged;
+				const reconciled = (0, _atscript_ui_table.reconcileColumnWidthDefaults)(merged, columnWidths.value);
 				if (reconciled !== columnWidths.value) columnWidths.value = reconciled;
-				if (columnNames.value.length === 0) columnNames.value = def.columns.map((c) => c.path);
+				if (columnNames.value.length === 0) columnNames.value = merged.map((c) => c.path);
 				tableDef.value = def;
 			},
 			resetPagination
@@ -2115,6 +2278,7 @@ function createTableState(opts) {
 */
 function createStaticTableState(opts) {
 	let _state = null;
+	let fetcher = null;
 	const queryFn = (q, page, size) => {
 		if (!_state) return Promise.resolve({
 			data: [],
@@ -2123,13 +2287,21 @@ function createStaticTableState(opts) {
 			itemsPerPage: size,
 			pages: 1
 		});
-		return buildStaticQueryFn(opts, _state)(q, page, size);
+		fetcher ??= buildStaticQueryFn(opts, _state);
+		return fetcher(q, page, size);
 	};
 	const result = createTableState({
 		client: {},
 		selection: opts.selection,
 		limit: opts.limit,
-		query: { fn: queryFn }
+		displayColumns: opts.displayColumns,
+		model: opts.model,
+		actions: opts.actions,
+		query: {
+			fn: queryFn,
+			queryOnMount: opts.queryOnMount,
+			preSorted: true
+		}
 	});
 	_state = result.state;
 	result.state.loadingMetadata.value = false;
@@ -2161,26 +2333,24 @@ function createStaticTableState(opts) {
 }
 function buildStaticQueryFn(opts, state) {
 	const searchPaths = opts.searchPaths ?? [];
+	const sortValueOf = createSortValueReader(opts.displayColumns);
+	let sortedFrom = null;
+	let sortedBy = null;
+	let sorted = [];
+	function sortedRows(all) {
+		const by = state.sorters.value;
+		if (all !== sortedFrom || by !== sortedBy) {
+			sorted = (0, _atscript_ui_table.sortRowsLocally)(all, by, sortValueOf);
+			sortedFrom = all;
+			sortedBy = by;
+		}
+		return sorted;
+	}
 	return (_query, page, size) => {
-		let filtered = opts.rows;
+		const all = (0, vue.toValue)(opts.rows);
+		let filtered = opts.localSort === false ? all : sortedRows(all);
 		const term = state.searchTerm.value.trim().toLowerCase();
-		if (term && searchPaths.length > 0) filtered = filtered.filter((row) => searchPaths.some((p) => cellAsString(row[p]).toLowerCase().includes(term)));
-		const active = state.sorters.value;
-		if (active.length > 0) filtered = filtered.toSorted((a, b) => {
-			for (const s of active) {
-				const dir = s.direction === "desc" ? -1 : 1;
-				const av = a[s.field];
-				const bv = b[s.field];
-				if (typeof av === "number" && typeof bv === "number") {
-					if (av < bv) return -dir;
-					if (av > bv) return dir;
-				} else {
-					const cmp = cellAsString(av).localeCompare(cellAsString(bv));
-					if (cmp !== 0) return cmp * dir;
-				}
-			}
-			return 0;
-		});
+		if (term && searchPaths.length > 0) filtered = filtered.filter((row) => searchPaths.some((p) => (0, _atscript_ui_table.cellAsString)(require_get_cell_value.getCellValue(row, p)).toLowerCase().includes(term)));
 		const start = (page - 1) * size;
 		return Promise.resolve({
 			data: filtered.slice(start, start + size),
@@ -2270,12 +2440,6 @@ Object.defineProperty(exports, "ROW_ACTIONS_TYPE", {
 		return ROW_ACTIONS_TYPE;
 	}
 });
-Object.defineProperty(exports, "actionHref", {
-	enumerable: true,
-	get: function() {
-		return actionHref;
-	}
-});
 Object.defineProperty(exports, "applyRowGate", {
 	enumerable: true,
 	get: function() {
@@ -2372,6 +2536,12 @@ Object.defineProperty(exports, "readPresetLabel", {
 		return readPresetLabel;
 	}
 });
+Object.defineProperty(exports, "rowActionHref", {
+	enumerable: true,
+	get: function() {
+		return rowActionHref;
+	}
+});
 Object.defineProperty(exports, "triggerAction", {
 	enumerable: true,
 	get: function() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atscript/vue-table",
-  "version": "0.1.133",
+  "version": "0.1.135",
   "description": "Type-driven table components for Atscript with Vue 3",
   "keywords": [
     "atscript",
@@ -162,9 +162,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@atscript/ui": "^0.1.133",
-    "@atscript/vue-form": "^0.1.133",
-    "@atscript/ui-table": "^0.1.133"
+    "@atscript/ui": "^0.1.135",
+    "@atscript/ui-table": "^0.1.135",
+    "@atscript/vue-form": "^0.1.135"
   },
   "devDependencies": {
     "@atscript/db-client": "^0.1.129",