@soxa-ui/plugins 0.0.0-stage → 0.3.0-beta.1

package/dist/custom/table/grid/grid.plugin.js

@@ -0,0 +1,356 @@
+import { TBasePlugin } from "../../../base/base.class.js";
+import { TCollectionBundlesPlugin } from "../../collection/bundles.plugin.js";
+import { TElementPlugin } from "../../element/element.plugin.js";
+import { TCollectionElements } from "../../collection/collection-elements.plugin.js";
+import { isFocusableElement } from "../../../utils/isFocusableElement.js";
+import { closestControl, tabStops } from "../../../utils/tabStops.js";
+import { tabStopsAfter } from "../../../utils/tabStopsAfter.js";
+import { tabStopsBefore } from "../../../utils/tabStopsBefore.js";
+import { focusFirst } from "../../../utils/focusFirst.js";
+import { arrowStep, slideDirection } from "../../slide/direction.js";
+//#region src/custom/table/grid/grid.plugin.ts
+/** На сколько строк ведут PageUp и PageDown — пока опция не задана. */
+var PAGE_STEP = 10;
+/**
+* Ось строки сетки: колонки идут к её концу. По ней направление письма
+* сводится в сторону стрелок (`slideDirection`): в RTL → ведёт к началу.
+*/
+var AXIS = {
+	orientation: "horizontal",
+	inverted: false
+};
+/** Ребёнок узла с классом — только прямые дети: во вложенной таблице свои части. */
+function childOf(node, className) {
+	if (!node) return null;
+	return Array.from(node.children).find((child) => child.classList.contains(className)) ?? null;
+}
+/**
+* TTableGridPlugin — сетка таблицы в документе (APG Data Grid): клавиши,
+* выбор строки нажатием и DOM-фокус за фокусом сетки.
+*
+* Операции над DOM — здесь, фокус и выбор — у расширения `grid` коллекции
+* строк: плагин переводит клавиши и нажатия в его команды (`focusCell`,
+* `moveFocus`, `moveFocusToEdge`, `chooseRow`). Какая ячейка под фокусом,
+* решает расширение, а плагин ставит на неё DOM-фокус. Движок плагин узнаёт
+* от реестра bundles, узлы строк — от реестра узлов. Вне сетки плагин не
+* делает ничего.
+*
+* **Ячейки** плагин находит по строкам: шапка — строка шапки своей таблицы
+* (прямыми детьми, по классам владельца), строка тела — узел строки
+* коллекции. Ячейки строки идут по колонкам сетки: колонка выбора и
+* показанные колонки, — как их рисует таблица. Ячейки вложенной таблицы не
+* её: строк этой таблицы у них нет.
+*
+* **Остановка Tab — сама таблица.** Фокус, пришедший на корень, — Tab в
+* таблицу или нажатие мимо ячеек — плагин переводит на ячейку под фокусом
+* сетки. Пришедший с клавиатуры снаружи на виджет внутри ячейки (Shift+Tab
+* из-за таблицы) — тоже: у сетки одна остановка. Tab с ячейки уводит фокус
+* из таблицы — к остановке за ней или, с Shift, перед ней: внутри у ячеек
+* бывают свои поля и кнопки, и браузер повёл бы по ним.
+*
+* **Клавиши** — только с самой ячейки: ←/→ (по вычисленному направлению
+* письма), ↑/↓, Home/End — края строки, Ctrl+Home/End — края сетки,
+* PageUp/PageDown — на `pageStep` строк. Пробел (и Shift+пробел) на строке —
+* её выбор, на ячейке колонки выбора шапки — все показанные строки или
+* снять их; Ctrl/Cmd+A в `multiple` — выбрать все. Enter на заголовке
+* сортируемой колонки сортирует, на остальных ячейках, как и F2, уводит
+* фокус к первой остановке внутри ячейки. Там клавиши принадлежат виджетам,
+* а сетке — только Escape и F2 (обратно на ячейку) и Tab (по кругу остановок
+* ячейки). Ctrl+Shift+←/→ — перестановка колонки, её ведёт свой плагин.
+*
+* **Нажатие** по строке — где угодно, кроме контролов внутри ячейки, —
+* выбор строки, как у строки ListBox. Фокус на ячейку ставит сам браузер
+* (`tabindex="-1"`), а плагин сообщает его сетке (`focusin`).
+*/
+var TTableGridPlugin = class extends TBasePlugin {
+	_owner = null;
+	_root = null;
+	_engine = null;
+	_elements = null;
+	_pageStep = PAGE_STEP;
+	/** Фокус придёт от нажатия указателя, а не с клавиатуры. */
+	_pointer = false;
+	_frame = null;
+	install(ctx, options) {
+		super.install(ctx, options);
+		this._pageStep = options?.pageStep ?? this._pageStep;
+		this._owner = ctx.getInstance() ?? null;
+		this._elements = ctx.get(TCollectionElements) ?? null;
+		const element = ctx.get(TElementPlugin);
+		element?.events.on("ready", (node) => this._attach(node));
+		element?.events.on("removed", () => this._detach());
+		ctx.get(TCollectionBundlesPlugin)?.events.on("engine:bound", (engine) => {
+			this._engine = engine;
+			this._listenTo(engine.extensions.grid.events, "change:focusedCell", ({ newValue }) => this._follow(newValue));
+		});
+	}
+	destroy() {
+		this._detach();
+		this._owner = null;
+		this._engine = null;
+		this._elements = null;
+		super.destroy();
+	}
+	_attach(root) {
+		this._detach();
+		this._root = root;
+		const target = root;
+		target.addEventListener("focusin", this._onFocusIn);
+		target.addEventListener("keydown", this._onKeyDown);
+		target.addEventListener("pointerdown", this._onPointerDown);
+		target.addEventListener("click", this._onClick);
+	}
+	_detach() {
+		this._cancelFrame();
+		const target = this._root;
+		target?.removeEventListener("focusin", this._onFocusIn);
+		target?.removeEventListener("keydown", this._onKeyDown);
+		target?.removeEventListener("pointerdown", this._onPointerDown);
+		target?.removeEventListener("click", this._onClick);
+		this._root = null;
+	}
+	/** Расширение сетки, пока таблица в сетке. */
+	get _grid() {
+		const grid = this._engine?.extensions.grid;
+		return grid?.grid ? grid : null;
+	}
+	_headRow() {
+		const owner = this._owner;
+		if (!owner || !this._root) return null;
+		return childOf(childOf(this._root, owner.classes.resolve("__head")), owner.classes.resolve("__head-row"));
+	}
+	_body() {
+		const owner = this._owner;
+		return owner && this._root ? childOf(this._root, owner.classes.resolve("__body")) : null;
+	}
+	/** Строка сетки, чей узел — `line`; чужой узел — `undefined`. */
+	_rowOf(line) {
+		if (line === this._headRow()) return "head";
+		if (!this._body() || line.parentElement !== this._body()) return void 0;
+		return this._engine?.extensions.batch.shown.find((row) => this._elements?.getElementByItem(row) === line);
+	}
+	/** Узел строки сетки — пока он в теле своей таблицы. */
+	_lineOf(row) {
+		if (row === "head") return this._headRow();
+		const line = this._elements?.getElementByItem(row) ?? null;
+		return line && line.parentElement === this._body() ? line : null;
+	}
+	/**
+	* Ячейка сетки, в которой лежит цель, — её строка, колонка и узел. Ячейки
+	* строки идут по колонкам сетки; строка ещё не дорисовала смену колонок —
+	* ячейки нет: место в строке не совпало бы с колонкой.
+	*/
+	_cellOf(target) {
+		const grid = this._grid;
+		const root = this._root;
+		if (!grid || !root || !(target instanceof Element) || !root.contains(target)) return void 0;
+		const columns = grid.gridColumns;
+		for (let node = target; node && node !== root; node = node.parentElement) {
+			const line = node.parentElement;
+			const row = line ? this._rowOf(line) : void 0;
+			if (!line || row === void 0) continue;
+			if (line.children.length !== columns.length) return void 0;
+			return {
+				row,
+				column: columns[Array.from(line.children).indexOf(node)],
+				element: node
+			};
+		}
+	}
+	/** Узел ячейки сетки — пока её строка дорисована по колонкам сетки. */
+	_cellElement(cell) {
+		const grid = this._grid;
+		const line = this._lineOf(cell.row);
+		if (!grid || !line) return null;
+		const columns = grid.gridColumns;
+		if (line.children.length !== columns.length) return null;
+		return line.children[columns.indexOf(cell.column)] ?? null;
+	}
+	/**
+	* Фокус сетки перешёл — DOM-фокус за ним, если он в сетке: на корне или на
+	* ячейке. Фокус на виджете внутри ячейки плагин не трогает: там с
+	* клавишами работает виджет. Вне таблицы фокус сетка помнит до Tab в неё.
+	*/
+	_follow = (cell) => {
+		const root = this._root;
+		const active = root?.ownerDocument.activeElement;
+		if (!root || !cell || !active || !root.contains(active)) return;
+		if (active !== root && this._cellOf(active)?.element !== active) return;
+		this._focus(cell);
+	};
+	/**
+	* DOM-фокус — на узел ячейки. Узла ещё нет — строку перерисовывают после
+	* смены, которая её показала, — ждём кадр.
+	*/
+	_focus(cell) {
+		this._cancelFrame();
+		if (this._focusNow(cell)) return;
+		this._frame = requestAnimationFrame(() => {
+			this._frame = null;
+			this._focusNow(cell);
+		});
+	}
+	_focusNow(cell) {
+		const element = this._cellElement(cell);
+		if (!isFocusableElement(element)) return false;
+		if (element.ownerDocument.activeElement !== element) element.focus();
+		return true;
+	}
+	_cancelFrame() {
+		if (this._frame === null) return;
+		cancelAnimationFrame(this._frame);
+		this._frame = null;
+	}
+	_onPointerDown = () => {
+		this._pointer = true;
+	};
+	_onFocusIn = (event) => {
+		const pointer = this._pointer;
+		const grid = this._grid;
+		const root = this._root;
+		const target = event.target;
+		this._pointer = false;
+		if (!grid || !root) return;
+		if (target === root) {
+			if (grid.focusedCell) this._focus(grid.focusedCell);
+			return;
+		}
+		const hit = this._cellOf(target);
+		if (!hit) return;
+		const related = event.relatedTarget;
+		const fromOutside = !(related instanceof Node && root.contains(related));
+		if (target !== hit.element && fromOutside && !pointer) {
+			if (grid.focusedCell) this._focus(grid.focusedCell);
+			return;
+		}
+		grid.focusCell(hit.row, hit.column);
+	};
+	_onKeyDown = (event) => {
+		this._pointer = false;
+		if (event.defaultPrevented) return;
+		const hit = this._cellOf(event.target);
+		if (!hit) return;
+		if (event.target === hit.element) this._navigate(event, hit);
+		else this._interact(event, hit);
+	};
+	/** Клавиша с самой ячейки — ходьба по сетке, выбор и вход в ячейку. */
+	_navigate(event, hit) {
+		const action = this._actionOf(event, hit);
+		if (!action) return;
+		event.preventDefault();
+		action();
+	}
+	/** Что клавиша на ячейке делает; не наша клавиша — `null`. */
+	_actionOf(event, hit) {
+		const grid = this._grid;
+		const root = this._root;
+		const engine = this._engine;
+		if (!grid || !root || !engine || event.altKey) return null;
+		const command = event.ctrlKey || event.metaKey;
+		if (event.key === "Tab" && !command) return () => this._leave(event.shiftKey);
+		if (command && !event.shiftKey && event.code === "KeyA") {
+			if (engine.extensions.selection.mode !== "multiple") return null;
+			return () => engine.extensions.table.selectShown();
+		}
+		if (command) {
+			if (event.shiftKey || event.metaKey) return null;
+			if (event.key === "Home") return () => grid.moveFocusToEdge("start", "grid");
+			if (event.key === "End") return () => grid.moveFocusToEdge("end", "grid");
+			return null;
+		}
+		switch (event.key) {
+			case " ": return () => this._choose(hit);
+			case "Enter": return () => this._activate(hit);
+			case "F2": return () => this._enter(hit.element);
+		}
+		if (event.shiftKey) return null;
+		switch (event.key) {
+			case "ArrowUp": return () => grid.moveFocus(-1, 0);
+			case "ArrowDown": return () => grid.moveFocus(1, 0);
+			case "Home": return () => grid.moveFocusToEdge("start", "row");
+			case "End": return () => grid.moveFocusToEdge("end", "row");
+			case "PageUp": return () => grid.moveFocus(-this._pageStep, 0);
+			case "PageDown": return () => grid.moveFocus(this._pageStep, 0);
+		}
+		const step = event.key.startsWith("Arrow") ? arrowStep(slideDirection(AXIS, root), event.key) : null;
+		return step === null ? null : () => grid.moveFocus(0, step);
+	}
+	/**
+	* Пробел: на строке — её выбор, на ячейке колонки выбора шапки — все
+	* показанные строки или снять их, как её чекбокс. Остальным ячейкам шапки
+	* пробел ничего не делает, но страницу не листает.
+	*/
+	_choose(hit) {
+		const engine = this._engine;
+		if (!engine) return;
+		if (hit.row !== "head") {
+			engine.extensions.grid.chooseRow(hit.row);
+			return;
+		}
+		if (hit.column !== "select" || engine.extensions.selection.mode !== "multiple") return;
+		const { table } = engine.extensions;
+		if (table.shownSelection === "all") table.deselectShown();
+		else table.selectShown();
+	}
+	/** Enter: заголовок сортируемой колонки сортирует, остальные ячейки — вход в ячейку. */
+	_activate(hit) {
+		const column = hit.column;
+		if (hit.row === "head" && column !== "select" && column.sortable) {
+			this._engine?.extensions.sort.toggle(column.field);
+			return;
+		}
+		this._enter(hit.element);
+	}
+	/** Фокус — к первой остановке внутри ячейки: дальше клавиши принадлежат её виджетам. */
+	_enter(cell) {
+		focusFirst(tabStops(cell));
+	}
+	/**
+	* Tab с ячейки — из таблицы: к остановке за ней, с Shift — перед ней.
+	* Остановки нет — фокус снимается, и следующий Tab начнёт с края
+	* документа: внутри таблицы браузер повёл бы по полям ячеек.
+	*/
+	_leave(backward) {
+		const root = this._root;
+		if (!root) return;
+		const stops = backward ? tabStopsBefore(root).reverse() : tabStopsAfter(root, null);
+		if (focusFirst(stops)) return;
+		const active = root.ownerDocument.activeElement;
+		if (isFocusableElement(active)) active.blur();
+	}
+	/**
+	* Клавиша с виджета внутри ячейки. Escape и F2 возвращают фокус на ячейку,
+	* Tab ходит по кругу остановок ячейки: из сетки уводит Tab только с самой
+	* ячейки. Остальное — виджета.
+	*/
+	_interact(event, hit) {
+		if (event.altKey || event.ctrlKey || event.metaKey) return;
+		if (event.key === "Escape" || event.key === "F2") {
+			if (!isFocusableElement(hit.element)) return;
+			event.preventDefault();
+			hit.element.focus();
+			return;
+		}
+		if (event.key !== "Tab") return;
+		const target = event.target;
+		const stops = tabStops(hit.element);
+		const at = target instanceof Node ? stops.findIndex((stop) => stop.contains(target)) : -1;
+		event.preventDefault();
+		if (stops.length === 0) return;
+		const next = (at + (event.shiftKey ? -1 : 1) + stops.length) % stops.length;
+		focusFirst([stops[next]]);
+	}
+	/**
+	* Нажатие по строке — её выбор, как у строки ListBox. Контролы внутри
+	* ячейки — чекбокс строки, кнопки и поля слота — нажимаются сами.
+	*/
+	_onClick = (event) => {
+		if (event.defaultPrevented) return;
+		const hit = this._cellOf(event.target);
+		if (!hit || hit.row === "head" || !(event.target instanceof Element)) return;
+		if (closestControl(event.target, hit.element)) return;
+		this._engine?.extensions.grid.chooseRow(hit.row);
+	};
+};
+//#endregion
+export { TTableGridPlugin };

package/dist/custom/table/grid/index.d.ts

@@ -0,0 +1,2 @@
+export * from './types';
+export * from './grid.plugin';

package/dist/custom/table/grid/types.d.ts

@@ -0,0 +1,22 @@
+import type { TTableGridColumn, TTableGridRow } from '@soxa-ui/core';
+import type { TPluginEvents } from '../../../base';
+/**
+ * Своих событий у плагина нет: куда встал фокус и что выбрано, сообщает
+ * коллекция — расширение `grid` и выбор строк. Второй путь к тем же фактам
+ * разошёлся бы с первым.
+ */
+export type TTableGridPluginEvents = TPluginEvents;
+export interface ITableGridPluginOptions {
+    /**
+     * На сколько строк ведут PageUp и PageDown. По умолчанию — 10: APG
+     * оставляет число автору, и десять строк — около экрана таблицы обычной
+     * высоты.
+     */
+    pageStep?: number;
+}
+/** Ячейка сетки в документе — её строка и колонка в сетке и узел. */
+export type TTableGridHit = {
+    row: TTableGridRow;
+    column: TTableGridColumn;
+    element: Element;
+};

package/dist/custom/table/index.d.ts

@@ -0,0 +1,8 @@
+export * from './row-ids';
+export * from './column-ids';
+export * from './column-resize';
+export * from './names';
+export * from './column-names';
+export * from './column-reorder';
+export * from './grid';
+export * from './layout';

package/dist/custom/table/layout/index.d.ts

@@ -0,0 +1,2 @@
+export * from './types';
+export * from './layout.plugin';

package/dist/custom/table/layout/layout.plugin.d.ts

@@ -0,0 +1,52 @@
+import type { ITable } from '@soxa-ui/core';
+import { TBasePlugin } from '../../../base';
+import type { IPluginContext } from '../../../base';
+import type { TTableLayoutPluginEvents } from './types';
+/**
+ * TTableLayoutPlugin — место под колонки таблицы: ширина её окна без колонки
+ * выбора.
+ *
+ * Ширины колонок раскладывает ядро — расширение колонок коллекции строк, по
+ * месту и `columnFit` таблицы: фиксированная раскладка браузера не читает
+ * `min-width` и `max-width` ячеек и не умеет делить место между колонками с
+ * границами. Место — то, что знает только живой документ, и его мерит плагин
+ * (`notifySpace`). Движок он узнаёт от реестра bundles (`engine:bound`).
+ *
+ * **Окно** — родитель корня с классом `__viewport` владельца: таблицу в нём
+ * рисует разметка, и прокрутку окну включает тема по признаку «колонки шире
+ * места». Окна нет — места нет, и ширины гибких колонок решает тема.
+ *
+ * **Замер — раз в кадр**, по размеру окна и корня: корень меняется от колонки
+ * выбора и размера таблицы. Место — внутренняя ширина окна минус ячейка
+ * колонки выбора в шапке, вниз до целого. Ширину окна наблюдатель отдаёт сам,
+ * а пишет плагин только в кадре: высота окна зависит от таблицы, и запись
+ * прямо в колбэке наблюдателя свернулась бы в его петлю.
+ *
+ * Корень сняли или плагин уничтожен — место неизвестно: движок, пришедший
+ * снаружи, переживает таблицу, и прежнее место ему больше не верно.
+ */
+export declare class TTableLayoutPlugin extends TBasePlugin<ITable, TTableLayoutPluginEvents> {
+    private _owner;
+    private _engine;
+    private _root;
+    private _viewport;
+    private _observer;
+    private _frame;
+    /** Внутренняя ширина окна, px, — из последнего уведомления наблюдателя */
+    private _inner;
+    install(ctx: IPluginContext): void;
+    destroy(): void;
+    private _attach;
+    private _detach;
+    private _unobserve;
+    /** Окно — родитель корня с классом `__viewport` владельца. */
+    private _viewportOf;
+    /** Ячейка колонки выбора в шапке своей таблицы — прямыми детьми. */
+    private _selectOf;
+    /** Ширину окна наблюдатель отдаёт сам; замер — в кадре. */
+    private readonly _onResize;
+    /** Замер — раз в кадр: подряд идущие поводы схлопываются в один. */
+    private _schedule;
+    private _cancel;
+    private _measure;
+}

package/dist/custom/table/layout/layout.plugin.js

@@ -0,0 +1,122 @@
+import { TBasePlugin } from "../../../base/base.class.js";
+import { TCollectionBundlesPlugin } from "../../collection/bundles.plugin.js";
+import { TElementPlugin } from "../../element/element.plugin.js";
+//#region src/custom/table/layout/layout.plugin.ts
+/** Ребёнок узла с классом — только прямые дети: во вложенной таблице свои шапки. */
+function childOf(node, className) {
+	return Array.from(node.children).find((child) => child.classList.contains(className)) ?? null;
+}
+/**
+* TTableLayoutPlugin — место под колонки таблицы: ширина её окна без колонки
+* выбора.
+*
+* Ширины колонок раскладывает ядро — расширение колонок коллекции строк, по
+* месту и `columnFit` таблицы: фиксированная раскладка браузера не читает
+* `min-width` и `max-width` ячеек и не умеет делить место между колонками с
+* границами. Место — то, что знает только живой документ, и его мерит плагин
+* (`notifySpace`). Движок он узнаёт от реестра bundles (`engine:bound`).
+*
+* **Окно** — родитель корня с классом `__viewport` владельца: таблицу в нём
+* рисует разметка, и прокрутку окну включает тема по признаку «колонки шире
+* места». Окна нет — места нет, и ширины гибких колонок решает тема.
+*
+* **Замер — раз в кадр**, по размеру окна и корня: корень меняется от колонки
+* выбора и размера таблицы. Место — внутренняя ширина окна минус ячейка
+* колонки выбора в шапке, вниз до целого. Ширину окна наблюдатель отдаёт сам,
+* а пишет плагин только в кадре: высота окна зависит от таблицы, и запись
+* прямо в колбэке наблюдателя свернулась бы в его петлю.
+*
+* Корень сняли или плагин уничтожен — место неизвестно: движок, пришедший
+* снаружи, переживает таблицу, и прежнее место ему больше не верно.
+*/
+var TTableLayoutPlugin = class extends TBasePlugin {
+	_owner = null;
+	_engine = null;
+	_root = null;
+	_viewport = null;
+	_observer = null;
+	_frame = null;
+	/** Внутренняя ширина окна, px, — из последнего уведомления наблюдателя */
+	_inner = 0;
+	install(ctx) {
+		super.install(ctx);
+		this._owner = ctx.getInstance() ?? null;
+		const element = ctx.get(TElementPlugin);
+		element?.events.on("ready", (node) => this._attach(node));
+		element?.events.on("removed", () => this._detach());
+		ctx.get(TCollectionBundlesPlugin)?.events.on("engine:bound", (engine) => {
+			this._engine = engine;
+			this._schedule();
+		});
+	}
+	destroy() {
+		this._detach();
+		this._observer = null;
+		this._owner = null;
+		this._engine = null;
+		super.destroy();
+	}
+	_attach(root) {
+		this._unobserve();
+		this._root = root;
+		this._viewport = this._viewportOf(root);
+		if (!this._viewport) return;
+		const observer = this._observer ??= new ResizeObserver(this._onResize);
+		observer.observe(this._viewport);
+		observer.observe(root);
+	}
+	_detach() {
+		this._unobserve();
+		this._root = null;
+		this._viewport = null;
+		this._engine?.extensions.columns.notifySpace(0);
+	}
+	_unobserve() {
+		this._observer?.disconnect();
+		this._cancel();
+		this._inner = 0;
+	}
+	/** Окно — родитель корня с классом `__viewport` владельца. */
+	_viewportOf(root) {
+		const parent = root.parentElement;
+		const owner = this._owner;
+		if (!parent || !owner) return null;
+		return parent.classList.contains(owner.classes.resolve("__viewport")) ? parent : null;
+	}
+	/** Ячейка колонки выбора в шапке своей таблицы — прямыми детьми. */
+	_selectOf(root) {
+		const owner = this._owner;
+		if (!owner) return null;
+		const head = childOf(root, owner.classes.resolve("__head"));
+		const row = head && childOf(head, owner.classes.resolve("__head-row"));
+		return row && childOf(row, owner.classes.resolve("__select"));
+	}
+	/** Ширину окна наблюдатель отдаёт сам; замер — в кадре. */
+	_onResize = (entries) => {
+		for (const entry of entries) if (entry.target === this._viewport) this._inner = entry.contentRect.width;
+		this._schedule();
+	};
+	/** Замер — раз в кадр: подряд идущие поводы схлопываются в один. */
+	_schedule() {
+		if (this._frame !== null || !this._viewport) return;
+		this._frame = requestAnimationFrame(() => {
+			this._frame = null;
+			this._measure();
+		});
+	}
+	_cancel() {
+		if (this._frame === null) return;
+		cancelAnimationFrame(this._frame);
+		this._frame = null;
+	}
+	_measure() {
+		const root = this._root;
+		const columns = this._engine?.extensions.columns;
+		if (!root || !columns) return;
+		const select = this._selectOf(root);
+		const taken = select ? select.getBoundingClientRect().width : 0;
+		columns.notifySpace(Math.max(0, Math.floor(this._inner - taken)));
+	}
+};
+//#endregion
+export { TTableLayoutPlugin };

package/dist/custom/table/layout/types.d.ts

@@ -0,0 +1,7 @@
+import type { TPluginEvents } from '../../../base';
+/**
+ * Своих событий у плагина нет: место он отдаёт расширению колонок, а что из
+ * него вышло — ширины колонок и `data-overflow` таблицы — сообщают они.
+ * Второй путь к тем же фактам через события плагина разошёлся бы с первым.
+ */
+export type TTableLayoutPluginEvents = TPluginEvents;

package/dist/custom/table/names/index.d.ts

@@ -0,0 +1,2 @@
+export { TTableNamesPlugin } from './names.plugin';
+export type { TTableNamesPluginEvents } from './types';

package/dist/custom/table/names/names.plugin.d.ts

@@ -0,0 +1,18 @@
+import type { TEventSink } from '@soxa-ui/core';
+import { TNamesPlugin } from '../../../locale/names.plugin';
+import type { TTranslations } from '../../../locale/types';
+import type { TTableNamesPluginEvents } from './types';
+/**
+ * TTableNamesPlugin — имя чекбокса «выбрать все» таблицы от локали.
+ *
+ * Выходом (`selectAll`), а не записью в набор: у ячейки шапки колонки выбора
+ * своего текста нет, а чекбокс — свой компонент, и имя ему разметка отдаёт
+ * пропом `aria_label`, который пишет его собственный `TAriaPlugin`.
+ */
+export declare class TTableNamesPlugin extends TNamesPlugin<object, TTableNamesPluginEvents> {
+    private _selectAll;
+    /** Имя чекбокса «выбрать все» в шапке колонки выбора. */
+    get selectAll(): string;
+    protected get _sink(): TEventSink<TTableNamesPluginEvents>;
+    protected _name(_owner: object, translations: TTranslations): void;
+}

package/dist/custom/table/names/names.plugin.js

@@ -0,0 +1,31 @@
+import { TNamesPlugin } from "../../../locale/names.plugin.js";
+//#region src/custom/table/names/names.plugin.ts
+/**
+* TTableNamesPlugin — имя чекбокса «выбрать все» таблицы от локали.
+*
+* Выходом (`selectAll`), а не записью в набор: у ячейки шапки колонки выбора
+* своего текста нет, а чекбокс — свой компонент, и имя ему разметка отдаёт
+* пропом `aria_label`, который пишет его собственный `TAriaPlugin`.
+*/
+var TTableNamesPlugin = class extends TNamesPlugin {
+	_selectAll = "";
+	/** Имя чекбокса «выбрать все» в шапке колонки выбора. */
+	get selectAll() {
+		return this._selectAll;
+	}
+	get _sink() {
+		return this.events;
+	}
+	_name(_owner, translations) {
+		const oldSelectAll = this.selectAll;
+		const selectAll = translations.table.selectAll;
+		if (this._selectAll === selectAll) return;
+		this._selectAll = selectAll;
+		this._sink.emit("change:selectAll", {
+			newValue: selectAll,
+			oldValue: oldSelectAll
+		});
+	}
+};
+//#endregion
+export { TTableNamesPlugin };

package/dist/custom/table/names/types.d.ts

@@ -0,0 +1,6 @@
+import type { TValuePayload } from '@soxa-ui/core';
+import type { TPluginEvents } from '../../../base';
+export type TTableNamesPluginEvents = TPluginEvents & {
+    /** change:selectAll — имя чекбокса «выбрать все» сменилось вместе с локалью */
+    'change:selectAll': (payload: TValuePayload<string>) => void;
+};

package/dist/custom/table/row-ids/index.d.ts

@@ -0,0 +1 @@
+export * from './row-ids.plugin';