@atscript/vue-table 0.1.146 → 0.1.148

package/dist/{as-preset-picker-CbZDGPaf.mjs → as-preset-picker-DkZ7sinz.mjs}

@@ -1,5 +1,5 @@
-import { a as useTableContext, d as ASPECT_LABELS, f as ownerNameOf, p as readPresetLabel, u as ASPECT_ICONS } from "./use-table-state-DuY-Mf8e.mjs";
-import { t as errorMessage } from "./error-message-gNEXnnbb.mjs";
+import { a as useTableContext, d as ASPECT_LABELS, f as ownerNameOf, p as readPresetLabel, u as ASPECT_ICONS } from "./use-table-state-CIoWhwTD.mjs";
+import { t as errorMessage } from "./error-message-rziSiSjs.mjs";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, h, nextTick, normalizeClass, onScopeDispose, openBlock, ref, renderList, shallowRef, toDisplayString, unref, vModelCheckbox, vModelText, watch, withCtx, withDirectives, withKeys, withModifiers } from "vue";
 import { isSystemPresetId } from "@atscript/ui-table";
 import { DropdownMenuContent, DropdownMenuItem, DropdownMenuPortal, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuTrigger } from "reka-ui";

package/dist/as-preset-picker.cjs

@@ -1,2 +1,2 @@
-const require_as_preset_picker = require("./as-preset-picker-CVgyZBG7.cjs");
+const require_as_preset_picker = require("./as-preset-picker-CjSXtx83.cjs");
 module.exports = require_as_preset_picker.as_preset_picker_default;

package/dist/as-preset-picker.d.mts

@@ -1,2 +1,2 @@
-import { t as _default } from "./as-preset-picker.vue-OaAV2v9z.mjs";
+import { t as _default } from "./as-preset-picker.vue-DAUZOlOD.mjs";
 export { _default as default };

package/dist/as-preset-picker.mjs

@@ -1,2 +1,2 @@
-import { t as as_preset_picker_default } from "./as-preset-picker-CbZDGPaf.mjs";
+import { t as as_preset_picker_default } from "./as-preset-picker-DkZ7sinz.mjs";
 export { as_preset_picker_default as default };

package/dist/{as-residual-filter-CUTouIn5.mjs → as-residual-filter-DHfbtTQj.mjs}

@@ -1,4 +1,5 @@
-import { a as useTableContext } from "./use-table-state-DuY-Mf8e.mjs";
+import { a as useTableContext } from "./use-table-state-CIoWhwTD.mjs";
+import { t as useConditionFormat } from "./use-condition-format-5LcuInDy.mjs";
 import { computed, createElementBlock, createElementVNode, defineComponent, openBlock, toDisplayString, unref } from "vue";
 import { formatFilterExpr } from "@atscript/ui-table";
 //#region src/components/defaults/as-residual-filter.vue?vue&type=script&setup=true&lang.ts
@@ -21,10 +22,8 @@ var as_residual_filter_default = /* @__PURE__ */ defineComponent({
 	setup(__props) {
 		const props = __props;
 		const { state } = useTableContext();
-		const text = computed(() => {
-			const labels = new Map(state.allColumns.value.map((c) => [c.path, c.label]));
-			return formatFilterExpr(props.expr, (path) => labels.get(path));
-		});
+		const { formatValue, labelOf } = useConditionFormat(state);
+		const text = computed(() => formatFilterExpr(props.expr, labelOf, formatValue));
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
 				class: "as-residual-filter",

package/dist/{as-residual-filter-C8n7kdGW.cjs → as-residual-filter-XkXnMQNu.cjs}

@@ -1,4 +1,5 @@
-const require_use_table_state = require("./use-table-state-Ddr2UZzB.cjs");
+const require_use_table_state = require("./use-table-state-BQchKxUr.cjs");
+const require_use_condition_format = require("./use-condition-format-DrgfX6xL.cjs");
 let vue = require("vue");
 let _atscript_ui_table = require("@atscript/ui-table");
 //#region src/components/defaults/as-residual-filter.vue?vue&type=script&setup=true&lang.ts
@@ -21,10 +22,8 @@ var as_residual_filter_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	setup(__props) {
 		const props = __props;
 		const { state } = require_use_table_state.useTableContext();
-		const text = (0, vue.computed)(() => {
-			const labels = new Map(state.allColumns.value.map((c) => [c.path, c.label]));
-			return (0, _atscript_ui_table.formatFilterExpr)(props.expr, (path) => labels.get(path));
-		});
+		const { formatValue, labelOf } = require_use_condition_format.useConditionFormat(state);
+		const text = (0, vue.computed)(() => (0, _atscript_ui_table.formatFilterExpr)(props.expr, labelOf, formatValue));
 		return (_ctx, _cache) => {
 			return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
 				class: "as-residual-filter",

package/dist/as-residual-filter.cjs

@@ -1,2 +1,2 @@
-const require_as_residual_filter = require("./as-residual-filter-C8n7kdGW.cjs");
+const require_as_residual_filter = require("./as-residual-filter-XkXnMQNu.cjs");
 module.exports = require_as_residual_filter.as_residual_filter_default;

package/dist/as-residual-filter.d.cts

@@ -1,2 +1,2 @@
-import { t as _default } from "./as-residual-filter.vue-Dfw1l2wS.cjs";
+import { t as _default } from "./as-residual-filter.vue-CGXCipEn.cjs";
 export = _default;

package/dist/as-residual-filter.d.mts

@@ -1,2 +1,2 @@
-import { t as _default } from "./as-residual-filter.vue-N89YqlCz.mjs";
+import { t as _default } from "./as-residual-filter.vue-DbeOOtR7.mjs";
 export { _default as default };

package/dist/as-residual-filter.mjs

@@ -1,2 +1,2 @@
-import { t as as_residual_filter_default } from "./as-residual-filter-CUTouIn5.mjs";
+import { t as as_residual_filter_default } from "./as-residual-filter-DHfbtTQj.mjs";
 export { as_residual_filter_default as default };

package/dist/{as-row-actions-ed1P6GEJ.mjs → as-row-actions-BNQ7jrie.mjs}

@@ -1,5 +1,5 @@
-import { E as intentClass, M as triggerAction, N as triggerBindings, T as extractIdentifier, a as useTableContext, v as resolveRowActions, w as createNavigateGestures, y as rowActionHref } from "./use-table-state-DuY-Mf8e.mjs";
-import { t as as_action_menu_content_default } from "./as-action-menu-content-DoZnQP0I.mjs";
+import { A as intentClass, D as createNavigateGestures, O as extractIdentifier, R as triggerAction, a as useTableContext, k as identifierFieldsOf, v as resolveRowActions, y as rowActionHref, z as triggerBindings } from "./use-table-state-CIoWhwTD.mjs";
+import { t as as_action_menu_content_default } from "./as-action-menu-content-BBwL1YZU.mjs";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, resolveDynamicComponent, toDisplayString, unref, withCtx, withModifiers } from "vue";
 import { DropdownMenuPortal, DropdownMenuRoot, DropdownMenuTrigger } from "reka-ui";
 //#region src/components/defaults/as-row-actions.vue?vue&type=script&setup=true&lang.ts
@@ -40,10 +40,12 @@ var as_row_actions_default = /* @__PURE__ */ defineComponent({
 	setup(__props) {
 		const props = __props;
 		const { state } = useTableContext();
-		/** The row's identifier — the `pk` prop when given, else extracted from the row. */
+		/**
+		* The row's identifier — the `pk` prop when given, else extracted from the
+		* row (`identifierFields`: what a delegated action maps from rides along).
+		*/
 		function identifierOf() {
-			const preferredId = state.tableDef.value?.preferredId ?? [];
-			return props.pk !== void 0 ? props.pk : extractIdentifier(props.row, preferredId);
+			return props.pk !== void 0 ? props.pk : extractIdentifier(props.row, identifierFieldsOf(state.tableDef.value));
 		}
 		function promptCtx() {
 			const id = identifierOf();

package/dist/{as-row-actions-DfUL9sYB.cjs → as-row-actions-q_oMmUz1.cjs}

@@ -1,5 +1,5 @@
-const require_use_table_state = require("./use-table-state-Ddr2UZzB.cjs");
-const require_as_action_menu_content = require("./as-action-menu-content-FQ2miGid.cjs");
+const require_use_table_state = require("./use-table-state-BQchKxUr.cjs");
+const require_as_action_menu_content = require("./as-action-menu-content-DAOjkslC.cjs");
 let vue = require("vue");
 let reka_ui = require("reka-ui");
 //#region src/components/defaults/as-row-actions.vue?vue&type=script&setup=true&lang.ts
@@ -40,10 +40,12 @@ var as_row_actions_default = /* @__PURE__ */ (0, vue.defineComponent)({
 	setup(__props) {
 		const props = __props;
 		const { state } = require_use_table_state.useTableContext();
-		/** The row's identifier — the `pk` prop when given, else extracted from the row. */
+		/**
+		* The row's identifier — the `pk` prop when given, else extracted from the
+		* row (`identifierFields`: what a delegated action maps from rides along).
+		*/
 		function identifierOf() {
-			const preferredId = state.tableDef.value?.preferredId ?? [];
-			return props.pk !== void 0 ? props.pk : require_use_table_state.extractIdentifier(props.row, preferredId);
+			return props.pk !== void 0 ? props.pk : require_use_table_state.extractIdentifier(props.row, require_use_table_state.identifierFieldsOf(state.tableDef.value));
 		}
 		function promptCtx() {
 			const id = identifierOf();

package/dist/as-row-actions.cjs

@@ -1,2 +1,2 @@
-const require_as_row_actions = require("./as-row-actions-DfUL9sYB.cjs");
+const require_as_row_actions = require("./as-row-actions-q_oMmUz1.cjs");
 module.exports = require_as_row_actions.as_row_actions_default;

package/dist/as-row-actions.d.cts

@@ -1,2 +1,2 @@
-import { t as _default } from "./as-row-actions.vue-Ba3VO9W-.cjs";
+import { t as _default } from "./as-row-actions.vue-CnjcRD0P.cjs";
 export = _default;

package/dist/as-row-actions.d.mts

@@ -1,2 +1,2 @@
-import { t as _default } from "./as-row-actions.vue-CKOnE0eb.mjs";
+import { t as _default } from "./as-row-actions.vue-BB8ATWBY.mjs";
 export { _default as default };

package/dist/as-row-actions.mjs

@@ -1,2 +1,2 @@
-import { t as as_row_actions_default } from "./as-row-actions-ed1P6GEJ.mjs";
+import { t as as_row_actions_default } from "./as-row-actions-BNQ7jrie.mjs";
 export { as_row_actions_default as default };

package/dist/{as-row-actions.vue-Ba3VO9W-.d.cts → as-row-actions.vue-BB8ATWBY.d.mts}

@@ -1,4 +1,4 @@
-import { O as TVueTableActionInfo } from "./types-D1NxhrpW.cjs";
+import { L as TVueTableActionInfo } from "./intent-scope-CvD4YOvf.mjs";
 import * as vue from "vue";
 
 //#region src/components/defaults/as-row-actions.vue.d.ts

package/dist/{as-row-actions.vue-CKOnE0eb.d.mts → as-row-actions.vue-CnjcRD0P.d.cts}

@@ -1,4 +1,4 @@
-import { O as TVueTableActionInfo } from "./types-BEZ4_erB.mjs";
+import { L as TVueTableActionInfo } from "./intent-scope-CGch9yhy.cjs";
 import * as vue from "vue";
 
 //#region src/components/defaults/as-row-actions.vue.d.ts

package/dist/{as-select-cell-DwMfqBMV.cjs → as-select-cell-Dc3lArvR.cjs}

@@ -1,8 +1,8 @@
-const require_use_table_state = require("./use-table-state-Ddr2UZzB.cjs");
-const require_use_table_component = require("./use-table-component-BvAC82_c.cjs");
-const require_as_table_header_cell = require("./as-table-header-cell-BwaOPYwI.cjs");
-const require_as_row_actions = require("./as-row-actions-DfUL9sYB.cjs");
-const require_as_table_cell_value = require("./as-table-cell-value-COyZnwUj.cjs");
+const require_use_table_state = require("./use-table-state-BQchKxUr.cjs");
+const require_use_table_component = require("./use-table-component-CsdvdGJT.cjs");
+const require_as_table_header_cell = require("./as-table-header-cell-DB7Cdskr.cjs");
+const require_as_row_actions = require("./as-row-actions-q_oMmUz1.cjs");
+const require_as_table_cell_value = require("./as-table-cell-value-VWlXc5dA.cjs");
 let _atscript_ui = require("@atscript/ui");
 let vue = require("vue");
 //#region src/composables/use-cell-resolver.ts
@@ -486,6 +486,8 @@ var as_table_header_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		const HeaderCell = require_use_table_component.useTableComponent("headerCell", require_as_table_header_cell.as_table_header_cell_default);
 		const props = __props;
 		const emit = __emit;
+		const tableState = require_use_table_state.useTableContextOptional()?.state;
+		const NO_OP = () => {};
 		const sortMap = (0, vue.computed)(() => {
 			const map = {};
 			for (const s of props.sorters) map[s.field] = s.direction;
@@ -557,7 +559,10 @@ var as_table_header_default = /* @__PURE__ */ (0, vue.defineComponent)({
 				__props.hasSelectColumn ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("th", _hoisted_1$2, [(0, vue.renderSlot)(_ctx.$slots, "header-__select", {
 					state: __props.selectAllState,
 					toggle: toggleSelectAll,
-					selectedCount: __props.selectedCount ?? 0
+					selectedCount: __props.selectedCount ?? 0,
+					mode: (0, vue.unref)(tableState)?.querySelection.value ? "query" : "ids",
+					canSelectAllMatching: (0, vue.unref)(tableState)?.canSelectAllMatching.value ?? false,
+					selectAllMatching: (0, vue.unref)(tableState)?.selectAllMatching ?? NO_OP
 				}, () => [__props.selectAllState ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
 					key: 0,
 					class: (0, vue.normalizeClass)(["as-table-checkbox", {

package/dist/{as-select-cell-BMptU5sQ.mjs → as-select-cell-DjcPorVb.mjs}

@@ -1,8 +1,8 @@
-import { g as toggleRowAt, h as onSelectControlKeydown, o as useTableContextOptional } from "./use-table-state-DuY-Mf8e.mjs";
-import { t as useTableComponent } from "./use-table-component-DRMXTk9M.mjs";
-import { t as as_table_header_cell_default } from "./as-table-header-cell-Csv1KQDa.mjs";
-import { t as as_row_actions_default } from "./as-row-actions-ed1P6GEJ.mjs";
-import { t as as_table_cell_value_default } from "./as-table-cell-value-DoH8Mieo.mjs";
+import { g as toggleRowAt, h as onSelectControlKeydown, o as useTableContextOptional } from "./use-table-state-CIoWhwTD.mjs";
+import { t as useTableComponent } from "./use-table-component-Dy397695.mjs";
+import { t as as_table_header_cell_default } from "./as-table-header-cell-ahzAeHXj.mjs";
+import { t as as_row_actions_default } from "./as-row-actions-BNQ7jrie.mjs";
+import { t as as_table_cell_value_default } from "./as-table-cell-value-D-S127gr.mjs";
 import { UI_TABLE_ATTR, UI_TABLE_CLASSES, UI_TABLE_FN_ATTR, UI_TABLE_FN_CLASSES, UI_TABLE_FN_STYLES, UI_TABLE_STYLES, getFieldMeta, parseStaticAttrs, resolveAttrs, resolveFieldProp } from "@atscript/ui";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, normalizeClass, normalizeStyle, onBeforeUnmount, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, withModifiers } from "vue";
 //#region src/composables/use-cell-resolver.ts
@@ -486,6 +486,8 @@ var as_table_header_default = /* @__PURE__ */ defineComponent({
 		const HeaderCell = useTableComponent("headerCell", as_table_header_cell_default);
 		const props = __props;
 		const emit = __emit;
+		const tableState = useTableContextOptional()?.state;
+		const NO_OP = () => {};
 		const sortMap = computed(() => {
 			const map = {};
 			for (const s of props.sorters) map[s.field] = s.direction;
@@ -557,7 +559,10 @@ var as_table_header_default = /* @__PURE__ */ defineComponent({
 				__props.hasSelectColumn ? (openBlock(), createElementBlock("th", _hoisted_1$2, [renderSlot(_ctx.$slots, "header-__select", {
 					state: __props.selectAllState,
 					toggle: toggleSelectAll,
-					selectedCount: __props.selectedCount ?? 0
+					selectedCount: __props.selectedCount ?? 0,
+					mode: unref(tableState)?.querySelection.value ? "query" : "ids",
+					canSelectAllMatching: unref(tableState)?.canSelectAllMatching.value ?? false,
+					selectAllMatching: unref(tableState)?.selectAllMatching ?? NO_OP
 				}, () => [__props.selectAllState ? (openBlock(), createElementBlock("span", {
 					key: 0,
 					class: normalizeClass(["as-table-checkbox", {

package/dist/as-selection-banner-Ca9DWVdW.mjs

@@ -0,0 +1,189 @@
+import { B as ROW_ACTIONS_PATH, V as ROW_ACTIONS_TYPE, a as useTableContext, v as resolveRowActions } from "./use-table-state-CIoWhwTD.mjs";
+import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, nextTick, normalizeClass, openBlock, ref, renderSlot, toDisplayString, unref, watch } from "vue";
+import { reorderColumnNames } from "@atscript/ui-table";
+//#region src/composables/use-row-actions-column.ts
+/**
+* The synthesised row-actions pseudo-column, shared by `<AsTable>` and
+* `<AsWindowTable>`. Returns the renderer's effective column list — the base
+* columns with a fixed `__actions` column prepended / appended per
+* `placement` — and opts the table into per-row `$actions` while the column
+* is shown.
+*/
+function useRowActionsColumn(state, opts) {
+	const cellActions = computed(() => {
+		const r = resolveRowActions(state, void 0);
+		return [
+			...r.default ? [r.default] : [],
+			...r.others,
+			...r.rows,
+			...r.extra
+		];
+	});
+	watch(() => {
+		const placement = opts.placement();
+		if (!placement) return false;
+		if (placement === "merge-select" && opts.select() !== "none") return false;
+		return cellActions.value.length > 0;
+	}, (on) => {
+		state.includeActions.value = on;
+	}, { immediate: true });
+	const actionsCol = computed(() => {
+		const acts = cellActions.value;
+		return {
+			path: ROW_ACTIONS_PATH,
+			label: "",
+			type: ROW_ACTIONS_TYPE,
+			sortable: false,
+			filterable: false,
+			nullable: false,
+			order: 0,
+			fixed: true,
+			width: acts.length === 1 && !acts[0].icon ? "8em" : "4em"
+		};
+	});
+	return computed(() => {
+		const base = opts.columns();
+		const placement = opts.placement();
+		if (placement === false || placement === void 0) return base;
+		if (cellActions.value.length === 0) return base;
+		if (placement === "first") return [actionsCol.value, ...base];
+		if (placement === "last") return [...base, actionsCol.value];
+		if (opts.select() === "none") return [actionsCol.value, ...base];
+		return base;
+	});
+}
+//#endregion
+//#region src/composables/use-table-column-handlers.ts
+/**
+* Pure pass-through handlers shared between the pagination renderer
+* (`<AsTable>`) and the window renderer (`<AsWindowTableBase>`). Selection
+* and row-mouse handlers stay in their owning components because their
+* semantics diverge meaningfully (window has no "all" state; standalone
+* vs Reka renderModes need different gating).
+*/
+function useTableColumnHandlers(state) {
+	return {
+		onSort(column, direction) {
+			state.sorters.value = direction === null ? [] : [{
+				field: column.path,
+				direction
+			}];
+		},
+		onHide(column) {
+			state.columnNames.value = state.columnNames.value.filter((n) => n !== column.path);
+		},
+		onFilter(column) {
+			state.openFilterDialog(column);
+		},
+		onFiltersOff(column) {
+			state.removeFieldFilter(column.path);
+		},
+		onResetWidth(column) {
+			state.resetColumnWidth(column.path);
+		},
+		onReorder(fromPath, toPath, position) {
+			state.columnNames.value = reorderColumnNames(state.columnNames.value, fromPath, toPath, position);
+		},
+		onClearFilters() {
+			state.resetFilters();
+			if (state.searchTerm.value) state.searchTerm.value = "";
+		}
+	};
+}
+//#endregion
+//#region src/components/internal/as-selection-banner.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1 = ["data-kind"];
+const _hoisted_2 = { class: "as-selection-banner-text" };
+const _hoisted_3 = { class: "as-selection-banner-text" };
+//#endregion
+//#region src/components/internal/as-selection-banner.vue
+var as_selection_banner_default = /* @__PURE__ */ defineComponent({
+	__name: "as-selection-banner",
+	props: { scope: {
+		type: String,
+		required: true
+	} },
+	setup(__props) {
+		const props = __props;
+		const { state } = useTableContext();
+		const kind = computed(() => {
+			if (state.selectMode.value !== "multi") return null;
+			if (state.querySelection.value) return "query";
+			if (!state.canSelectAllMatching.value) return null;
+			const loaded = state.loadedEligiblePks.value.length;
+			return loaded > 0 && state.loadedSelectedCount.value === loaded ? "offer" : null;
+		});
+		const loadedCount = computed(() => state.loadedEligiblePks.value.length);
+		const offerText = computed(() => {
+			const n = loadedCount.value;
+			const where = props.scope === "page" ? "on this page" : "loaded";
+			return n === 1 ? `The 1 row ${where} is selected.` : `All ${n} rows ${where} are selected.`;
+		});
+		const queryText = computed(() => {
+			const n = state.selectedCount.value;
+			return n === 1 ? "1 matching row is selected." : `All ${n} matching rows are selected.`;
+		});
+		const rootRef = ref(null);
+		const btnRef = ref(null);
+		/**
+		* Keep keyboard focus when the banner's button is swapped — on the new
+		* button, or, once the banner is gone, on the table's select-all checkbox.
+		*/
+		async function refocus(hadFocus) {
+			if (!hadFocus) return;
+			await nextTick();
+			if (btnRef.value) {
+				btnRef.value.focus();
+				return;
+			}
+			rootRef.value?.parentElement?.querySelector(".as-th-select [role=checkbox][tabindex]")?.focus();
+		}
+		function hasFocus() {
+			return !!btnRef.value && btnRef.value === document.activeElement;
+		}
+		/** Run a banner action, keeping focus on the banner's button (see `refocus`). */
+		function keepingFocus(fn) {
+			return () => {
+				const focused = hasFocus();
+				fn();
+				refocus(focused);
+			};
+		}
+		const selectAllMatching = keepingFocus(() => state.selectAllMatching());
+		const clearSelection = keepingFocus(() => state.clearSelection());
+		return (_ctx, _cache) => {
+			return unref(state).selectMode.value === "multi" ? (openBlock(), createElementBlock("div", {
+				key: 0,
+				ref_key: "rootRef",
+				ref: rootRef,
+				role: "status",
+				"aria-live": "polite",
+				class: normalizeClass(kind.value ? "as-selection-banner" : "sr-only"),
+				"data-kind": kind.value ?? void 0
+			}, [kind.value ? renderSlot(_ctx.$slots, "default", {
+				key: 0,
+				selection: unref(state).selection.value,
+				canSelectAllMatching: unref(state).canSelectAllMatching.value,
+				selectAllMatching: unref(selectAllMatching),
+				clearSelection: unref(clearSelection),
+				loadedCount: loadedCount.value
+			}, () => [kind.value === "offer" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createElementVNode("span", _hoisted_2, toDisplayString(offerText.value), 1), createElementVNode("button", {
+				ref_key: "btnRef",
+				ref: btnRef,
+				type: "button",
+				class: "as-selection-banner-btn",
+				"data-select-all-matching": "",
+				onClick: _cache[0] || (_cache[0] = (...args) => unref(selectAllMatching) && unref(selectAllMatching)(...args))
+			}, " Select all " + toDisplayString(unref(state).totalCount.value) + " matching ", 513)], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createElementVNode("span", _hoisted_3, toDisplayString(queryText.value), 1), createElementVNode("button", {
+				ref_key: "btnRef",
+				ref: btnRef,
+				type: "button",
+				class: "as-selection-banner-btn",
+				"data-clear-selection": "",
+				onClick: _cache[1] || (_cache[1] = (...args) => unref(clearSelection) && unref(clearSelection)(...args))
+			}, " Clear selection ", 512)], 64))]) : createCommentVNode("v-if", true)], 10, _hoisted_1)) : createCommentVNode("v-if", true);
+		};
+	}
+});
+//#endregion
+export { useTableColumnHandlers as n, useRowActionsColumn as r, as_selection_banner_default as t };

package/dist/as-selection-banner-CxPXBztW.cjs

@@ -0,0 +1,206 @@
+const require_use_table_state = require("./use-table-state-BQchKxUr.cjs");
+let vue = require("vue");
+let _atscript_ui_table = require("@atscript/ui-table");
+//#region src/composables/use-row-actions-column.ts
+/**
+* The synthesised row-actions pseudo-column, shared by `<AsTable>` and
+* `<AsWindowTable>`. Returns the renderer's effective column list — the base
+* columns with a fixed `__actions` column prepended / appended per
+* `placement` — and opts the table into per-row `$actions` while the column
+* is shown.
+*/
+function useRowActionsColumn(state, opts) {
+	const cellActions = (0, vue.computed)(() => {
+		const r = require_use_table_state.resolveRowActions(state, void 0);
+		return [
+			...r.default ? [r.default] : [],
+			...r.others,
+			...r.rows,
+			...r.extra
+		];
+	});
+	(0, vue.watch)(() => {
+		const placement = opts.placement();
+		if (!placement) return false;
+		if (placement === "merge-select" && opts.select() !== "none") return false;
+		return cellActions.value.length > 0;
+	}, (on) => {
+		state.includeActions.value = on;
+	}, { immediate: true });
+	const actionsCol = (0, vue.computed)(() => {
+		const acts = cellActions.value;
+		return {
+			path: require_use_table_state.ROW_ACTIONS_PATH,
+			label: "",
+			type: require_use_table_state.ROW_ACTIONS_TYPE,
+			sortable: false,
+			filterable: false,
+			nullable: false,
+			order: 0,
+			fixed: true,
+			width: acts.length === 1 && !acts[0].icon ? "8em" : "4em"
+		};
+	});
+	return (0, vue.computed)(() => {
+		const base = opts.columns();
+		const placement = opts.placement();
+		if (placement === false || placement === void 0) return base;
+		if (cellActions.value.length === 0) return base;
+		if (placement === "first") return [actionsCol.value, ...base];
+		if (placement === "last") return [...base, actionsCol.value];
+		if (opts.select() === "none") return [actionsCol.value, ...base];
+		return base;
+	});
+}
+//#endregion
+//#region src/composables/use-table-column-handlers.ts
+/**
+* Pure pass-through handlers shared between the pagination renderer
+* (`<AsTable>`) and the window renderer (`<AsWindowTableBase>`). Selection
+* and row-mouse handlers stay in their owning components because their
+* semantics diverge meaningfully (window has no "all" state; standalone
+* vs Reka renderModes need different gating).
+*/
+function useTableColumnHandlers(state) {
+	return {
+		onSort(column, direction) {
+			state.sorters.value = direction === null ? [] : [{
+				field: column.path,
+				direction
+			}];
+		},
+		onHide(column) {
+			state.columnNames.value = state.columnNames.value.filter((n) => n !== column.path);
+		},
+		onFilter(column) {
+			state.openFilterDialog(column);
+		},
+		onFiltersOff(column) {
+			state.removeFieldFilter(column.path);
+		},
+		onResetWidth(column) {
+			state.resetColumnWidth(column.path);
+		},
+		onReorder(fromPath, toPath, position) {
+			state.columnNames.value = (0, _atscript_ui_table.reorderColumnNames)(state.columnNames.value, fromPath, toPath, position);
+		},
+		onClearFilters() {
+			state.resetFilters();
+			if (state.searchTerm.value) state.searchTerm.value = "";
+		}
+	};
+}
+//#endregion
+//#region src/components/internal/as-selection-banner.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1 = ["data-kind"];
+const _hoisted_2 = { class: "as-selection-banner-text" };
+const _hoisted_3 = { class: "as-selection-banner-text" };
+//#endregion
+//#region src/components/internal/as-selection-banner.vue
+var as_selection_banner_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	__name: "as-selection-banner",
+	props: { scope: {
+		type: String,
+		required: true
+	} },
+	setup(__props) {
+		const props = __props;
+		const { state } = require_use_table_state.useTableContext();
+		const kind = (0, vue.computed)(() => {
+			if (state.selectMode.value !== "multi") return null;
+			if (state.querySelection.value) return "query";
+			if (!state.canSelectAllMatching.value) return null;
+			const loaded = state.loadedEligiblePks.value.length;
+			return loaded > 0 && state.loadedSelectedCount.value === loaded ? "offer" : null;
+		});
+		const loadedCount = (0, vue.computed)(() => state.loadedEligiblePks.value.length);
+		const offerText = (0, vue.computed)(() => {
+			const n = loadedCount.value;
+			const where = props.scope === "page" ? "on this page" : "loaded";
+			return n === 1 ? `The 1 row ${where} is selected.` : `All ${n} rows ${where} are selected.`;
+		});
+		const queryText = (0, vue.computed)(() => {
+			const n = state.selectedCount.value;
+			return n === 1 ? "1 matching row is selected." : `All ${n} matching rows are selected.`;
+		});
+		const rootRef = (0, vue.ref)(null);
+		const btnRef = (0, vue.ref)(null);
+		/**
+		* Keep keyboard focus when the banner's button is swapped — on the new
+		* button, or, once the banner is gone, on the table's select-all checkbox.
+		*/
+		async function refocus(hadFocus) {
+			if (!hadFocus) return;
+			await (0, vue.nextTick)();
+			if (btnRef.value) {
+				btnRef.value.focus();
+				return;
+			}
+			rootRef.value?.parentElement?.querySelector(".as-th-select [role=checkbox][tabindex]")?.focus();
+		}
+		function hasFocus() {
+			return !!btnRef.value && btnRef.value === document.activeElement;
+		}
+		/** Run a banner action, keeping focus on the banner's button (see `refocus`). */
+		function keepingFocus(fn) {
+			return () => {
+				const focused = hasFocus();
+				fn();
+				refocus(focused);
+			};
+		}
+		const selectAllMatching = keepingFocus(() => state.selectAllMatching());
+		const clearSelection = keepingFocus(() => state.clearSelection());
+		return (_ctx, _cache) => {
+			return (0, vue.unref)(state).selectMode.value === "multi" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+				key: 0,
+				ref_key: "rootRef",
+				ref: rootRef,
+				role: "status",
+				"aria-live": "polite",
+				class: (0, vue.normalizeClass)(kind.value ? "as-selection-banner" : "sr-only"),
+				"data-kind": kind.value ?? void 0
+			}, [kind.value ? (0, vue.renderSlot)(_ctx.$slots, "default", {
+				key: 0,
+				selection: (0, vue.unref)(state).selection.value,
+				canSelectAllMatching: (0, vue.unref)(state).canSelectAllMatching.value,
+				selectAllMatching: (0, vue.unref)(selectAllMatching),
+				clearSelection: (0, vue.unref)(clearSelection),
+				loadedCount: loadedCount.value
+			}, () => [kind.value === "offer" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.createElementVNode)("span", _hoisted_2, (0, vue.toDisplayString)(offerText.value), 1), (0, vue.createElementVNode)("button", {
+				ref_key: "btnRef",
+				ref: btnRef,
+				type: "button",
+				class: "as-selection-banner-btn",
+				"data-select-all-matching": "",
+				onClick: _cache[0] || (_cache[0] = (...args) => (0, vue.unref)(selectAllMatching) && (0, vue.unref)(selectAllMatching)(...args))
+			}, " Select all " + (0, vue.toDisplayString)((0, vue.unref)(state).totalCount.value) + " matching ", 513)], 64)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [(0, vue.createElementVNode)("span", _hoisted_3, (0, vue.toDisplayString)(queryText.value), 1), (0, vue.createElementVNode)("button", {
+				ref_key: "btnRef",
+				ref: btnRef,
+				type: "button",
+				class: "as-selection-banner-btn",
+				"data-clear-selection": "",
+				onClick: _cache[1] || (_cache[1] = (...args) => (0, vue.unref)(clearSelection) && (0, vue.unref)(clearSelection)(...args))
+			}, " Clear selection ", 512)], 64))]) : (0, vue.createCommentVNode)("v-if", true)], 10, _hoisted_1)) : (0, vue.createCommentVNode)("v-if", true);
+		};
+	}
+});
+//#endregion
+Object.defineProperty(exports, "as_selection_banner_default", {
+	enumerable: true,
+	get: function() {
+		return as_selection_banner_default;
+	}
+});
+Object.defineProperty(exports, "useRowActionsColumn", {
+	enumerable: true,
+	get: function() {
+		return useRowActionsColumn;
+	}
+});
+Object.defineProperty(exports, "useTableColumnHandlers", {
+	enumerable: true,
+	get: function() {
+		return useTableColumnHandlers;
+	}
+});