@feugene/granularity 0.46.0 → 0.48.0

package/dist/components/GrDataTable/chunks/GrDataTable-DQxYYgQk.js

@@ -0,0 +1,1519 @@
+import { a as useGrComponentSize } from "../../../chunks/context-CPMRfwVr.js";
+import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
+import { t as loader_circle_default } from "../../../chunks/loader-circle-CfVLz7lb.js";
+import { t as GrIcon_default } from "../../GrIcon/chunks/GrIcon-DTZIgmje.js";
+import { useVirtualList } from "../../../composables/useVirtualList.js";
+import { useRovingFocus } from "../../../composables/useRovingFocus.js";
+import { t as GrSkeleton_default } from "../../GrSkeleton/chunks/GrSkeleton-CgfXxPQ2.js";
+import { t as GrButton_default } from "../../GrButton/chunks/GrButton-CS4TqMtG.js";
+import { useAnnouncer } from "../../../composables/useAnnouncer.js";
+import { useDragGesture } from "../../../composables/useDragGesture.js";
+import { t as chevron_right_default } from "../../../chunks/chevron-right-C6Z01h0X.js";
+import { t as GrCheckbox_default } from "../../GrCheckbox/chunks/GrCheckbox-Dp201frb.js";
+import { t as GrTable_default } from "../../GrTable/chunks/GrTable-CKJ-HrsN.js";
+import { i as moveItem, r as insertionIndex } from "../../../chunks/dragSortGeometry-CY-llfrQ.js";
+import { useDragSort } from "../../../composables/useDragSort.js";
+import { A as selectCheckboxSizes, C as expandIconClass, D as placeholderPaddings, E as headerTextSizes, M as sortIconSizes, N as spinnerSizes, O as rowHeightEstimates, P as summaryRowClass, S as expandColumnWidths, T as headerGaps, _ as detailContentClass, a as columnDropAfterClass, b as detailRowClass, c as columnHandleClass, d as columnPinnedRightEdgeClass, f as columnResizerClass, g as detailCellClass, h as columnResizerLineClass, i as columnDraggingClass, j as selectColumnWidths, k as rowSelectedClass, l as columnPinnedClass, m as columnResizerLineActiveClass, o as columnDropBeforeClass, p as columnResizerHoverClass, r as cellPaddings, s as columnHandleActiveClass, u as columnPinnedLeftEdgeClass, v as detailErrorClass, w as expandIconOpenClass, x as expandButtonClass, y as detailPaddings } from "../../../chunks/config-Bs1HwUcx.js";
+import { t as arrow_up_default } from "../../../chunks/arrow-up-C_G4jg8M.js";
+import { t as grip_vertical_default } from "../../../chunks/grip-vertical-lRha2S7q.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, markRaw, mergeProps, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onMounted, onUnmounted, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useId, watch, watchEffect, withCtx, withModifiers } from "vue";
+//#region src/components/GrDataTable/composables/useDataTableRowKeys.ts
+function useDataTableRowKeys(options) {
+	const syntheticKeys = /* @__PURE__ */ new WeakMap();
+	let syntheticKeyCounter = 0;
+	let missingKeyWarned = false;
+	function syntheticRowKey(row) {
+		const existing = syntheticKeys.get(row);
+		if (existing !== void 0) return existing;
+		syntheticKeyCounter += 1;
+		const generated = `gr-row-${syntheticKeyCounter}`;
+		syntheticKeys.set(row, generated);
+		if (!missingKeyWarned && process.env.NODE_ENV !== "production") {
+			missingKeyWarned = true;
+			console.warn(`[GrDataTable] У строки нет значения по ключу "${String(options.rowKey())}". Задайте \`rowKey\` (поле или функцию) — иначе выбор строк и переиспользование DOM работают по синтетическому ключу, который не переживёт перезагрузку данных.`);
+		}
+		return generated;
+	}
+	function rowKeyValue(row) {
+		const rk = options.rowKey();
+		if (typeof rk === "function") return rk(row);
+		const value = row[rk];
+		if (typeof value === "string" && value !== "") return value;
+		if (typeof value === "number") return value;
+		return syntheticRowKey(row);
+	}
+	return { rowKeyValue };
+}
+//#endregion
+//#region src/components/GrDataTable/grDataTableSort.ts
+/** Пустое значение ячейки: нечего сравнивать, место таким — в конце списка. */
+function isEmptyCell(value) {
+	if (value === null || value === void 0) return true;
+	return typeof value === "string" && value.trim() === "";
+}
+/**
+* Число, с которым имеет смысл сравнивать: сам `number`, числовая строка, `Date`
+* (по таймстампу), `boolean` (`false` < `true`). Иначе — `null`, и сравнение
+* уходит в строковую ветку.
+*/
+function toComparableNumber(value) {
+	if (typeof value === "number") return Number.isFinite(value) ? value : null;
+	if (typeof value === "boolean") return value ? 1 : 0;
+	if (typeof value === "bigint") return Number(value);
+	if (value instanceof Date) {
+		const time = value.getTime();
+		return Number.isNaN(time) ? null : time;
+	}
+	if (typeof value === "string") {
+		const trimmed = value.trim();
+		if (trimmed === "") return null;
+		const parsed = Number(trimmed);
+		return Number.isFinite(parsed) ? parsed : null;
+	}
+	return null;
+}
+/**
+* Сравнивает два значения ячейки. Возвращает готовую разницу с учётом `dir` —
+* кроме пустых значений: они всегда в конце, иначе «пустые» в `desc` уезжали бы
+* наверх и таблица выглядела бы сломанной.
+*/
+function compareCells(a, b, dir, locale) {
+	const aEmpty = isEmptyCell(a);
+	const bEmpty = isEmptyCell(b);
+	if (aEmpty || bEmpty) return aEmpty && bEmpty ? 0 : aEmpty ? 1 : -1;
+	const aNum = toComparableNumber(a);
+	const bNum = toComparableNumber(b);
+	const result = aNum !== null && bNum !== null ? aNum - bNum : String(a).localeCompare(String(b), locale, {
+		sensitivity: "base",
+		numeric: true
+	});
+	return dir === "asc" ? result : -result;
+}
+/**
+* Новый отсортированный массив. Исходный не мутируется: `rows` приходят пропом,
+* сортировка на месте меняла бы данные потребителя.
+*/
+function sortRows(rows, key, dir, locale) {
+	return [...rows].sort((a, b) => compareCells(a[key], b[key], dir, locale));
+}
+//#endregion
+//#region src/components/GrDataTable/composables/useDataTableSort.ts
+function useDataTableSort(options) {
+	const internalSortKey = ref(options.initialSortKey() ?? "");
+	const internalSortDir = ref(options.initialSortDir());
+	const isSortKeyControlled = computed(() => options.sortKey() !== void 0);
+	const isSortDirControlled = computed(() => options.sortDir() !== void 0);
+	const currentSortKey = computed(() => options.sortKey() ?? internalSortKey.value);
+	const currentSortDir = computed(() => options.sortDir() ?? internalSortDir.value);
+	function applySort(key, dir) {
+		if (!isSortKeyControlled.value) internalSortKey.value = key;
+		if (!isSortDirControlled.value) internalSortDir.value = dir;
+		options.onSortChange(key, dir);
+	}
+	const sortedRows = computed(() => {
+		if (options.externalSort()) return [...options.rows()];
+		const key = currentSortKey.value;
+		if (!key) return [...options.rows()];
+		return sortRows(options.rows(), key, currentSortDir.value, options.locale());
+	});
+	function toggleSort(col) {
+		if (!col.sortable) return;
+		if (currentSortKey.value !== col.key) {
+			applySort(col.key, "asc");
+			return;
+		}
+		if (currentSortDir.value === "asc") {
+			applySort(col.key, "desc");
+			return;
+		}
+		if (options.sortCycle() === "asc-desc-none") {
+			applySort("", "asc");
+			return;
+		}
+		applySort(col.key, "asc");
+	}
+	function clearSort() {
+		applySort("", "asc");
+	}
+	function ariaSortFor(col) {
+		if (!col.sortable) return void 0;
+		if (currentSortKey.value !== col.key) return "none";
+		return currentSortDir.value === "asc" ? "ascending" : "descending";
+	}
+	return {
+		currentSortKey,
+		currentSortDir,
+		sortedRows,
+		toggleSort,
+		clearSort,
+		ariaSortFor
+	};
+}
+//#endregion
+//#region src/components/GrDataTable/composables/useDataTableSelection.ts
+function useDataTableSelection(options) {
+	const internalSelected = ref([]);
+	const isSelectedControlled = computed(() => options.selected() !== void 0);
+	const selectedKeys = computed(() => new Set(options.selected() ?? internalSelected.value));
+	function isRowSelectable(row) {
+		const predicate = options.selectableRow();
+		return predicate ? predicate(row) : true;
+	}
+	function isRowSelected(row) {
+		return selectedKeys.value.has(options.rowKeyValue(row));
+	}
+	/** «Выбрать все» работает по видимым и выбираемым строкам — они же считают состояние шапки. */
+	const selectableRows = computed(() => options.rows().filter(isRowSelectable));
+	const allSelected = computed(() => selectableRows.value.length > 0 && selectableRows.value.every(isRowSelected));
+	const someSelected = computed(() => selectableRows.value.some(isRowSelected) && !allSelected.value);
+	function emitSelected(next) {
+		if (!isSelectedControlled.value) internalSelected.value = [...next];
+		options.onSelectedChange([...next]);
+	}
+	function toggleRow(row) {
+		if (!isRowSelectable(row)) return;
+		const key = options.rowKeyValue(row);
+		const next = new Set(selectedKeys.value);
+		if (next.has(key)) next.delete(key);
+		else next.add(key);
+		emitSelected(next);
+	}
+	function toggleAll() {
+		const next = new Set(selectedKeys.value);
+		if (allSelected.value) {
+			for (const row of selectableRows.value) next.delete(options.rowKeyValue(row));
+			emitSelected(next);
+			return;
+		}
+		for (const row of selectableRows.value) next.add(options.rowKeyValue(row));
+		emitSelected(next);
+	}
+	return {
+		selectedKeys,
+		isRowSelectable,
+		isRowSelected,
+		selectableRows,
+		allSelected,
+		someSelected,
+		toggleRow,
+		toggleAll
+	};
+}
+//#endregion
+//#region src/components/GrDataTable/composables/useDataTableColumnOrder.ts
+function useDataTableColumnOrder(options) {
+	/** Uncontrolled-состояние; в controlled-режиме перекрывается пропом `columnOrder`. */
+	const internalColumnOrder = ref(options.columns().map((col) => String(col.key)));
+	/**
+	* Колонки в пользовательском порядке.
+	*
+	* Состав задаёт `columns`, порядок — только порядок: ключ, которого в наборе
+	* нет, игнорируется, а колонка, которой нет в порядке (её только что
+	* добавили), встаёт в конец. Иначе правка `columns` теряла бы колонки молча.
+	*/
+	const orderedColumns = computed(() => {
+		const order = options.columnOrder() ?? internalColumnOrder.value;
+		const remaining = new Map(options.columns().map((col) => [String(col.key), col]));
+		const ordered = [];
+		for (const key of order) {
+			const col = remaining.get(key);
+			if (!col) continue;
+			remaining.delete(key);
+			ordered.push(col);
+		}
+		for (const col of options.columns()) if (remaining.has(String(col.key))) ordered.push(col);
+		return ordered.sort((a, b) => pinGroupOf(a) - pinGroupOf(b));
+	});
+	/** Группа закрепления: 0 — слева, 1 — обычная колонка, 2 — справа. */
+	function pinGroupOf(col) {
+		if (col.pinned === "left") return 0;
+		if (col.pinned === "right") return 2;
+		return 1;
+	}
+	const columnKeys = computed(() => orderedColumns.value.map((col) => String(col.key)));
+	function indexOfColumn(key) {
+		return columnKeys.value.indexOf(key);
+	}
+	function sameGroup(from, to) {
+		const cols = orderedColumns.value;
+		if (!cols[from] || !cols[to]) return false;
+		return pinGroupOf(cols[from]) === pinGroupOf(cols[to]);
+	}
+	function applyColumnMove(from, to) {
+		const keys = columnKeys.value;
+		if (from < 0 || to < 0 || to >= keys.length || from === to) return;
+		if (!sameGroup(from, to)) return;
+		const key = keys[from];
+		const label = orderedColumns.value[from]?.label ?? key;
+		const next = moveItem(keys, from, to);
+		internalColumnOrder.value = next;
+		options.onOrderChange(next, {
+			key,
+			from,
+			to
+		});
+		options.announceMove(label, to + 1, keys.length);
+	}
+	const columnSort = useDragSort({
+		items: () => columnKeys.value,
+		elementFor: (key) => options.headerCellEls.get(key) ?? null,
+		orientation: () => "horizontal",
+		disabled: () => !options.reorderableColumns() || options.loading(),
+		resolveTarget: (hit, source) => {
+			const to = insertionIndex(hit, indexOfColumn(source), columnKeys.value.length);
+			return sameGroup(indexOfColumn(source), to) ? to : null;
+		},
+		onDrop: (source, to) => applyColumnMove(indexOfColumn(source), to)
+	});
+	/**
+	* Кольцо роверного фокуса по ручкам: одна остановка `Tab` на всю шапку.
+	* Иначе таблица из десяти колонок добавляла бы десять таб-стопов подряд.
+	*/
+	const columnRoving = useRovingFocus({
+		items: () => options.reorderableColumns() ? columnKeys.value : [],
+		elementFor: (key) => options.columnHandleEls.get(key) ?? null,
+		orientation: () => "horizontal",
+		wrap: () => false
+	});
+	async function onColumnHandleKeydown(event, key) {
+		if (!options.reorderableColumns()) return;
+		if (event.shiftKey && (event.key === "ArrowLeft" || event.key === "ArrowRight")) {
+			event.preventDefault();
+			const from = indexOfColumn(key);
+			applyColumnMove(from, event.key === "ArrowLeft" ? from - 1 : from + 1);
+			await nextTick();
+			await columnRoving.focusKey(key);
+			return;
+		}
+		columnRoving.handleNavigationKeys(event);
+	}
+	const draggingColumnKey = computed(() => columnSort.mode.value === null ? null : columnSort.source.value);
+	/** Полоса места вставки — на колонке-соседе, со стороны движения. */
+	function columnDropClass(index) {
+		const target = columnSort.target.value;
+		if (!columnSort.isActive.value || target === null || target !== index) return "";
+		const active = columnSort.source.value === null ? -1 : indexOfColumn(columnSort.source.value);
+		if (index === active) return "";
+		return target < active ? columnDropBeforeClass : columnDropAfterClass;
+	}
+	return {
+		orderedColumns,
+		columnKeys,
+		pinGroupOf,
+		indexOfColumn,
+		draggingColumnKey,
+		columnDropClass,
+		onColumnHandleKeydown,
+		columnSort,
+		columnRoving
+	};
+}
+/** Шаг клавиатуры и крупный шаг — как у `GrSplitter`. */
+var RESIZE_STEP = 16;
+var RESIZE_BIG_STEP = 48;
+function useDataTableColumnWidths(options) {
+	const internalColumnWidths = ref({});
+	const columnWidths = computed(() => options.columnWidths() ?? internalColumnWidths.value);
+	/** Фактические ширины шапки: заполняются замером раскладки. */
+	const measuredColumnWidths = ref({});
+	function setMeasuredWidths(widths) {
+		measuredColumnWidths.value = widths;
+	}
+	/** Ширина колонки: заданная пользователем сильнее объявленной в `columns`. */
+	function widthOf(col) {
+		return columnWidths.value[String(col.key)] ?? col.width;
+	}
+	/**
+	* Сумма заданных ширин — минимальная ширина таблицы.
+	*
+	* Без неё фиксированная раскладка вписывает таблицу в контейнер и делит место
+	* пропорционально: колонка, которую пользователь растянул, ужимается обратно, а
+	* горизонтальной прокрутки — той самой, ради которой закрепляют колонки, — не
+	* возникает. Считается, только когда ширина известна у **всех** колонок: с
+	* одной неизвестной сумма врала бы.
+	*/
+	const tableMinWidth = computed(() => {
+		const cols = options.orderedColumns();
+		if (cols.length === 0) return void 0;
+		let total = 0;
+		for (const col of cols) {
+			const width = widthOf(col);
+			if (typeof width !== "number") return void 0;
+			total += width;
+		}
+		return total;
+	});
+	const resizingKey = ref(null);
+	let pendingResizeKey = null;
+	let resizeStartX = 0;
+	let resizeStartWidth = 0;
+	let widthBeforeResize;
+	function commitWidths(next) {
+		internalColumnWidths.value = next;
+		options.onWidthsChange(next);
+	}
+	function setColumnWidth(key, width) {
+		commitWidths({
+			...columnWidths.value,
+			[key]: Math.max(48, Math.round(width))
+		});
+	}
+	function announceWidth(key) {
+		const col = options.orderedColumns().find((item) => String(item.key) === key);
+		if (!col) return;
+		options.announceWidth(col.label, columnWidths.value[key] ?? 0);
+	}
+	const resizeGesture = useDragGesture({
+		disabled: () => !options.resizableColumns() || options.loading(),
+		onStart: (event) => {
+			const key = pendingResizeKey;
+			const el = key === null ? null : options.headerCellEls.get(key);
+			if (key === null || !el) return false;
+			resizeStartX = event.clientX;
+			resizeStartWidth = el.getBoundingClientRect().width;
+			widthBeforeResize = columnWidths.value[key];
+			resizingKey.value = key;
+		},
+		onMove: (event) => {
+			if (resizingKey.value === null) return;
+			event.preventDefault();
+			setColumnWidth(resizingKey.value, resizeStartWidth + (event.clientX - resizeStartX));
+		},
+		onEnd: () => {
+			const key = resizingKey.value;
+			resizingKey.value = null;
+			if (key === null) return;
+			options.onColumnResize(key, columnWidths.value[key] ?? Math.round(resizeStartWidth));
+			announceWidth(key);
+		},
+		onCancel: () => {
+			const key = resizingKey.value;
+			resizingKey.value = null;
+			if (key === null) return;
+			const next = { ...columnWidths.value };
+			if (widthBeforeResize === void 0) delete next[key];
+			else next[key] = widthBeforeResize;
+			commitWidths(next);
+		}
+	});
+	function onResizerPointerDown(event, key) {
+		pendingResizeKey = key;
+		resizeGesture.start(event);
+	}
+	/** Сброс к авторазметке: колонка снова считается по содержимому. */
+	function resetColumnWidth(key) {
+		if (columnWidths.value[key] === void 0) return;
+		const next = { ...columnWidths.value };
+		delete next[key];
+		commitWidths(next);
+		options.onColumnResize(key, 0);
+	}
+	function resizeByKeyboard(key, delta) {
+		const measured = options.headerCellEls.get(key)?.getBoundingClientRect().width ?? 48;
+		const current = columnWidths.value[key] ?? measured;
+		setColumnWidth(key, current + delta);
+		options.onColumnResize(key, columnWidths.value[key] ?? current);
+		announceWidth(key);
+	}
+	function onResizerKeydown(event, key) {
+		if (!options.resizableColumns() || options.loading()) return;
+		const step = event.shiftKey ? RESIZE_BIG_STEP : RESIZE_STEP;
+		if (event.key === "ArrowLeft" || event.key === "ArrowRight") {
+			event.preventDefault();
+			resizeByKeyboard(key, event.key === "ArrowLeft" ? -step : step);
+			return;
+		}
+		if (event.key === "Enter") {
+			event.preventDefault();
+			resetColumnWidth(key);
+		}
+	}
+	/**
+	* Ручка ресайза — фокусируемый `separator`, а значит обязана называть текущее
+	* значение с первого рендера, до всякого перетаскивания. Заданной ширины у
+	* колонки может не быть вовсе (авторазметка), поэтому за значением идём к
+	* измеренной; до замера остаётся объявленная в `columns`, а её тоже может не
+	* быть — тогда минимум.
+	*/
+	function resizerValue(col) {
+		const key = String(col.key);
+		const declared = typeof col.width === "number" ? col.width : void 0;
+		return columnWidths.value[key] ?? measuredColumnWidths.value[key] ?? declared ?? 48;
+	}
+	return {
+		columnWidths,
+		measuredColumnWidths,
+		setMeasuredWidths,
+		widthOf,
+		tableMinWidth,
+		resizingKey,
+		onResizerPointerDown,
+		onResizerKeydown,
+		resetColumnWidth,
+		resizerValue
+	};
+}
+//#endregion
+//#region src/components/GrDataTable/composables/useDataTableLayout.ts
+/** Служебная колонка выбора в реестре ячеек: своего ключа у неё нет. */
+var SELECT_COLUMN_KEY = "__select__";
+function useDataTableLayout(options) {
+	const hasPinnedLeft = computed(() => options.orderedColumns().some((col) => col.pinned === "left"));
+	const pinnedOffsets = ref({});
+	/**
+	* Смещения липких колонок считаются по **измеренным** ширинам соседей: колонка
+	* может жить на авторазметке, и тогда взять смещение больше неоткуда. Отсюда же
+	* порядок: замер после отрисовки, а не в вычислении.
+	*/
+	function measurePinnedOffsets() {
+		const next = {};
+		const cols = options.orderedColumns();
+		let left = options.selectable() && hasPinnedLeft.value ? options.headerCellEls.get("__select__")?.getBoundingClientRect().width ?? 0 : 0;
+		for (const col of cols) {
+			if (col.pinned !== "left") continue;
+			next[String(col.key)] = left;
+			left += options.headerCellEls.get(String(col.key))?.getBoundingClientRect().width ?? 0;
+		}
+		let right = 0;
+		for (let index = cols.length - 1; index >= 0; index -= 1) {
+			const col = cols[index];
+			if (col.pinned !== "right") continue;
+			next[String(col.key)] = right;
+			right += options.headerCellEls.get(String(col.key))?.getBoundingClientRect().width ?? 0;
+		}
+		pinnedOffsets.value = next;
+	}
+	function measureColumnWidths() {
+		if (!options.resizableColumns()) return;
+		const next = {};
+		for (const col of options.orderedColumns()) {
+			const key = String(col.key);
+			const width = options.headerCellEls.get(key)?.getBoundingClientRect().width;
+			if (width) next[key] = Math.round(width);
+		}
+		options.onMeasuredWidths(next);
+	}
+	function measureLayout() {
+		measurePinnedOffsets();
+		measureColumnWidths();
+	}
+	function pinnedStyleOf(col) {
+		if (!col.pinned) return void 0;
+		const offset = pinnedOffsets.value[String(col.key)] ?? 0;
+		return col.pinned === "left" ? { left: `${offset}px` } : { right: `${offset}px` };
+	}
+	/** Тень рисует только крайняя колонка группы — иначе полос было бы столько же, сколько колонок. */
+	function pinnedEdgeClass(col, index) {
+		const cols = options.orderedColumns();
+		if (col.pinned === "left") return cols[index + 1]?.pinned === "left" ? "" : columnPinnedLeftEdgeClass;
+		if (col.pinned === "right") return cols[index - 1]?.pinned === "right" ? "" : columnPinnedRightEdgeClass;
+		return "";
+	}
+	function pinnedCellClass(col, index) {
+		if (!col.pinned) return [];
+		return [columnPinnedClass, pinnedEdgeClass(col, index)];
+	}
+	/**
+	* Ширину колонки меняет не только правка пропов: окно, шрифт и содержимое
+	* ячейки двигают её сами. `ResizeObserver` — единственный способ узнать об этом;
+	* в jsdom и на сервере его нет, там хватает пересчёта по изменению данных.
+	*/
+	let layoutObserver = null;
+	onMounted(() => {
+		measureLayout();
+		if (typeof ResizeObserver === "undefined") return;
+		layoutObserver = new ResizeObserver(() => measureLayout());
+		const el = options.headerCellEls.get("__select__") ?? options.headerCellEls.get(options.columnKeys()[0]);
+		if (el?.parentElement) layoutObserver.observe(el.parentElement);
+	});
+	onUnmounted(() => {
+		layoutObserver?.disconnect();
+		layoutObserver = null;
+	});
+	watch(options.watchSources, () => void nextTick(measureLayout));
+	return {
+		hasPinnedLeft,
+		pinnedStyleOf,
+		pinnedCellClass,
+		measureLayout
+	};
+}
+//#endregion
+//#region src/components/GrDataTable/composables/useDataTableExpansion.ts
+function useDataTableExpansion(options) {
+	const internalExpanded = ref([]);
+	const isExpandedControlled = computed(() => options.expandedKeys() !== void 0);
+	const expandedKeys = computed(() => new Set(options.expandedKeys() ?? internalExpanded.value));
+	const states = ref(/* @__PURE__ */ new Map());
+	const data = ref(/* @__PURE__ */ new Map());
+	/**
+	* Летящие запросы по ключу. Счётчик поколений отдельно от контроллера: ответ,
+	* стартовавший раньше и пришедший позже, обязан проиграть последнему, а
+	* `abort()` сам по себе этого не гарантирует — промис уже мог разрешиться.
+	*/
+	const inflight = /* @__PURE__ */ new Map();
+	const generation = /* @__PURE__ */ new Map();
+	function setState(key, state) {
+		const next = new Map(states.value);
+		next.set(key, state);
+		states.value = next;
+	}
+	function cancel(key) {
+		inflight.get(key)?.abort();
+		inflight.delete(key);
+		generation.set(key, (generation.get(key) ?? 0) + 1);
+	}
+	function isRowExpandable(row) {
+		const predicate = options.expandableRow();
+		return predicate ? predicate(row) : true;
+	}
+	function isRowExpanded(row) {
+		return expandedKeys.value.has(options.rowKeyValue(row));
+	}
+	function detailStateOf(row) {
+		return states.value.get(options.rowKeyValue(row)) ?? "idle";
+	}
+	function detailDataOf(row) {
+		return data.value.get(options.rowKeyValue(row));
+	}
+	async function load(row, key) {
+		const loadDetail = options.loadDetail();
+		if (!loadDetail) return;
+		cancel(key);
+		const controller = new AbortController();
+		inflight.set(key, controller);
+		const seq = generation.get(key) ?? 0;
+		setState(key, "loading");
+		try {
+			const result = await loadDetail(row, controller.signal);
+			if (seq !== generation.get(key)) return;
+			const next = new Map(data.value);
+			next.set(key, result);
+			data.value = next;
+			setState(key, "ready");
+		} catch (error) {
+			if (seq !== generation.get(key) || controller.signal.aborted) return;
+			setState(key, "error");
+			options.onDetailLoadError(row, key, error);
+		} finally {
+			if (inflight.get(key) === controller) inflight.delete(key);
+		}
+	}
+	function commit(keys) {
+		if (!isExpandedControlled.value) internalExpanded.value = keys;
+		options.onExpandedChange(keys);
+	}
+	function toggleRow(row) {
+		if (!isRowExpandable(row)) return;
+		const key = options.rowKeyValue(row);
+		if (expandedKeys.value.has(key)) {
+			cancel(key);
+			if (states.value.get(key) === "loading") setState(key, "idle");
+			commit([...expandedKeys.value].filter((item) => item !== key));
+			options.onCollapse(row, key);
+			return;
+		}
+		commit(options.accordion() ? [key] : [...expandedKeys.value, key]);
+		options.onExpand(row, key);
+		if (options.loadDetail() && states.value.get(key) !== "ready") load(row, key);
+	}
+	function collapseAll() {
+		for (const key of expandedKeys.value) cancel(key);
+		commit([]);
+	}
+	function retryDetail(row) {
+		load(row, options.rowKeyValue(row));
+	}
+	function invalidateDetail(key) {
+		if (key === void 0) {
+			for (const item of inflight.keys()) cancel(item);
+			states.value = /* @__PURE__ */ new Map();
+			data.value = /* @__PURE__ */ new Map();
+			return;
+		}
+		cancel(key);
+		const nextStates = new Map(states.value);
+		nextStates.delete(key);
+		states.value = nextStates;
+		const nextData = new Map(data.value);
+		nextData.delete(key);
+		data.value = nextData;
+	}
+	/**
+	* Смена идентичности набора сбрасывает загруженное — то же правило, что у
+	* виртуализатора: мутация массива на месте сохраняет, замена сбрасывает.
+	* Иначе строка показывала бы подробности прошлого набора данных.
+	*/
+	watch(() => options.rows(), () => invalidateDetail());
+	onBeforeUnmount(() => {
+		for (const key of inflight.keys()) cancel(key);
+	});
+	return {
+		expandedKeys,
+		isRowExpandable,
+		isRowExpanded,
+		toggleRow,
+		collapseAll,
+		detailStateOf,
+		detailDataOf,
+		retryDetail,
+		invalidateDetail
+	};
+}
+//#endregion
+//#region ~icons/lucide/arrow-down
+var _hoisted_1$1 = {
+	viewBox: "0 0 24 24",
+	width: "1.2em",
+	height: "1.2em"
+};
+function render$1(_ctx, _cache) {
+	return openBlock(), createElementBlock("svg", _hoisted_1$1, [..._cache[0] || (_cache[0] = [createElementVNode("path", {
+		fill: "none",
+		stroke: "currentColor",
+		"stroke-linecap": "round",
+		"stroke-linejoin": "round",
+		"stroke-width": "2",
+		d: "M12 5v14m7-7l-7 7l-7-7"
+	}, null, -1)])]);
+}
+var arrow_down_default = markRaw({
+	name: "lucide-arrow-down",
+	render: render$1
+});
+//#endregion
+//#region src/components/GrDataTable/GrDataTable.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["id"];
+var _hoisted_2 = ["aria-rowindex"];
+var _hoisted_3 = ["data-column-key", "aria-sort"];
+var _hoisted_4 = [
+	"tabindex",
+	"aria-label",
+	"disabled",
+	"onPointerdown",
+	"onKeydown",
+	"onFocus"
+];
+var _hoisted_5 = ["onClick"];
+var _hoisted_6 = { class: "sr-only" };
+var _hoisted_7 = {
+	class: "inline-flex",
+	"aria-hidden": "true"
+};
+var _hoisted_8 = {
+	key: 2,
+	class: "text-[var(--gr-muted-fg)]"
+};
+var _hoisted_9 = [
+	"aria-label",
+	"aria-valuenow",
+	"aria-valuemin",
+	"aria-valuetext",
+	"onPointerdown",
+	"onKeydown",
+	"onDblclick"
+];
+var _hoisted_10 = {
+	key: 0,
+	"data-gr-datatable-loading": ""
+};
+var _hoisted_11 = ["colspan"];
+var _hoisted_12 = { class: "inline-flex items-center gap-2" };
+var _hoisted_13 = {
+	key: 1,
+	"data-gr-datatable-empty": ""
+};
+var _hoisted_14 = ["colspan"];
+var _hoisted_15 = {
+	key: 0,
+	"aria-hidden": "true",
+	"data-gr-datatable-spacer": "before",
+	"data-gr-table-off-grid": "",
+	style: { pointerEvents: "none" }
+};
+var _hoisted_16 = ["colspan"];
+var _hoisted_17 = [
+	"data-row-key",
+	"data-selected",
+	"aria-rowindex",
+	"onClick"
+];
+var _hoisted_18 = [
+	"aria-expanded",
+	"aria-controls",
+	"aria-label",
+	"onClick"
+];
+var _hoisted_19 = ["id"];
+var _hoisted_20 = ["colspan"];
+var _hoisted_21 = {
+	key: 0,
+	"data-gr-datatable-detail-loading": ""
+};
+var _hoisted_22 = {
+	key: 1,
+	"aria-hidden": "true",
+	"data-gr-datatable-spacer": "after",
+	"data-gr-table-off-grid": "",
+	style: { pointerEvents: "none" }
+};
+var _hoisted_23 = ["colspan"];
+var _hoisted_24 = ["aria-rowindex"];
+var _hoisted_25 = ["data-column-key"];
+//#endregion
+//#region src/components/GrDataTable/GrDataTable.vue
+var GrDataTable_default = /* @__PURE__ */ defineComponent({
+	__name: "GrDataTable",
+	props: {
+		rows: {},
+		columns: {},
+		rowKey: {
+			type: [String, Function],
+			default: "id"
+		},
+		initialSortKey: { default: void 0 },
+		initialSortDir: { default: "asc" },
+		sortKey: { default: void 0 },
+		sortDir: { default: void 0 },
+		sortCycle: { default: "asc-desc" },
+		externalSort: {
+			type: Boolean,
+			default: false
+		},
+		selectable: {
+			type: Boolean,
+			default: false
+		},
+		selected: { default: void 0 },
+		selectableRow: {
+			type: Function,
+			default: void 0
+		},
+		loading: {
+			type: Boolean,
+			default: false
+		},
+		loadingText: { default: void 0 },
+		emptyText: { default: void 0 },
+		rowClass: {
+			type: [String, Function],
+			default: void 0
+		},
+		rowProps: {
+			type: Function,
+			default: void 0
+		},
+		summaryRow: { default: void 0 },
+		size: { default: void 0 },
+		caption: { default: void 0 },
+		ariaLabel: { default: void 0 },
+		ariaLabelledby: { default: void 0 },
+		regionLabel: { default: void 0 },
+		stickyHeader: {
+			type: Boolean,
+			default: false
+		},
+		virtual: {
+			type: Boolean,
+			default: false
+		},
+		maxHeight: { default: void 0 },
+		reorderableColumns: {
+			type: Boolean,
+			default: false
+		},
+		columnOrder: { default: void 0 },
+		resizableColumns: {
+			type: Boolean,
+			default: false
+		},
+		columnWidths: { default: void 0 },
+		expandable: {
+			type: Boolean,
+			default: false
+		},
+		expandedKeys: { default: void 0 },
+		expandableRow: {
+			type: Function,
+			default: void 0
+		},
+		loadDetail: {
+			type: Function,
+			default: void 0
+		},
+		accordion: {
+			type: Boolean,
+			default: false
+		},
+		expandColumn: {
+			type: Boolean,
+			default: true
+		}
+	},
+	emits: [
+		"update:sortKey",
+		"update:sortDir",
+		"sortChange",
+		"update:selected",
+		"rowClick",
+		"update:columnOrder",
+		"columnReorder",
+		"update:columnWidths",
+		"columnResize",
+		"update:expandedKeys",
+		"expand",
+		"collapse",
+		"detailLoadError"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		if (process.env.NODE_ENV !== "production") watchEffect(() => {
+			if (!Array.isArray(props.rows)) console.warn(`[granularity] GrDataTable: обязательный проп \`rows\` должен быть массивом — получено ${String(props.rows)}.`);
+			if (!Array.isArray(props.columns)) console.warn(`[granularity] GrDataTable: обязательный проп \`columns\` должен быть массивом — получено ${String(props.columns)}.`);
+		});
+		const emit = __emit;
+		const { t, locale } = useGranularityTranslations();
+		const { announce } = useAnnouncer();
+		const resolvedLoadingText = computed(() => props.loadingText ?? t("gr.dataTable.loading", "Loading…"));
+		const resolvedEmptyText = computed(() => props.emptyText ?? t("gr.dataTable.empty", "No data"));
+		const { currentSortKey, currentSortDir, sortedRows, toggleSort, clearSort, ariaSortFor } = useDataTableSort({
+			rows: () => props.rows,
+			sortKey: () => props.sortKey,
+			sortDir: () => props.sortDir,
+			initialSortKey: () => props.initialSortKey,
+			initialSortDir: () => props.initialSortDir,
+			externalSort: () => props.externalSort,
+			sortCycle: () => props.sortCycle,
+			locale: () => locale.value,
+			onSortChange: (key, dir) => {
+				emit("update:sortKey", key);
+				emit("update:sortDir", dir);
+				emit("sortChange", {
+					key,
+					dir
+				});
+			}
+		});
+		function cellAlign(col) {
+			if (col.align === "right") return "text-right";
+			if (col.align === "center") return "text-center";
+			return "text-left";
+		}
+		const { rowKeyValue } = useDataTableRowKeys({ rowKey: () => props.rowKey });
+		/**
+		* Подсказка «что сделает нажатие» — visually hidden текстом **после** подписи
+		* колонки, а не `aria-label`'ом на кнопке. `aria-label` подменял бы собой имя
+		* `<th>`, и AT при переходе по ячейкам вместо «Название» читала бы
+		* «Отсортировано по Название по возрастанию, нажмите…». Текущее состояние
+		* сортировки при этом объявляет `aria-sort` на самом `<th>`.
+		*/
+		function sortHint(col) {
+			if (currentSortKey.value !== col.key) return t("gr.dataTable.sortAsc", "Activate to sort ascending");
+			if (currentSortDir.value === "asc") return t("gr.dataTable.sortDesc", "Activate to sort descending");
+			return props.sortCycle === "asc-desc-none" ? t("gr.dataTable.sortNone", "Activate to remove sorting") : t("gr.dataTable.sortAsc", "Activate to sort ascending");
+		}
+		const resolvedSize = useGrComponentSize(() => props.size, { component: "GrDataTable" });
+		const cellClass = computed(() => cellPaddings[resolvedSize.value]);
+		const placeholderClass = computed(() => placeholderPaddings[resolvedSize.value]);
+		const headerTextClass = computed(() => headerTextSizes[resolvedSize.value]);
+		const headerGapClass = computed(() => headerGaps[resolvedSize.value]);
+		const selectColumnClass = computed(() => selectColumnWidths[resolvedSize.value]);
+		const spinnerClass = computed(() => spinnerSizes[resolvedSize.value]);
+		const sortIconSize = computed(() => sortIconSizes[resolvedSize.value]);
+		const checkboxSize = computed(() => selectCheckboxSizes[resolvedSize.value]);
+		/**
+		* Номер строки и полное их число объявляем только при виртуализации: иначе
+		* диктор считает строки по разметке, а там всего окно. Заголовок — строка
+		* первая, поэтому строки набора начинаются со второй.
+		*/
+		/**
+		* Итог показывается, только когда набор на экране: «Итого 1 234» над спиннером —
+		* утверждение о том, чего ещё не показали. Пустой набор при этом итог не гасит:
+		* «Итого 0» под «нет данных» осмысленно, и считает его потребитель.
+		*
+		* Предикат один на всех: шаблон, `aria-rowcount` и номер строки обязаны сходиться,
+		* иначе диктор объявит строку, которой в разметке нет.
+		*/
+		const hasSummary = computed(() => props.summaryRow != null && !props.loading);
+		const ariaRowCount = computed(() => props.virtual ? sortedRows.value.length + 1 + (hasSummary.value ? 1 : 0) : void 0);
+		function ariaRowIndex(index) {
+			return props.virtual ? index + 2 : void 0;
+		}
+		/** Итог идёт следующим номером за последней строкой набора. */
+		const summaryAriaRowIndex = computed(() => props.virtual ? sortedRows.value.length + 2 : void 0);
+		const isEmpty = computed(() => sortedRows.value.length === 0);
+		/**
+		* Значение итога по ключу колонки. Как и `cellValue`, отдаёт сырое: отсутствие
+		* ключа даёт пустую ячейку, а ноль — это значение, а не пустота.
+		*/
+		function summaryValue(key) {
+			return props.summaryRow?.[key];
+		}
+		/**
+		* Раскрытие выключено при виртуализации целиком — см. предупреждение ниже.
+		* Объявлено здесь, а не рядом с ним: от него зависит `colspan` служебных строк.
+		*/
+		const expandEnabled = computed(() => props.expandable && !props.virtual);
+		/** Своя колонка с кнопкой: её может не быть, если кнопку ставит потребитель. */
+		const expandColumnVisible = computed(() => expandEnabled.value && props.expandColumn);
+		const totalColumns = computed(() => props.columns.length + (props.selectable ? 1 : 0) + (expandColumnVisible.value ? 1 : 0));
+		/**
+		* Карты живут в компоненте, а не в модуле: наполняет их шаблон, а читают все
+		* три колоночных модуля — порядок тянет за ячейку, ширина её замеряет,
+		* раскладка считает по ней смещения закрепления.
+		*/
+		const headerCellEls = /* @__PURE__ */ new Map();
+		const columnHandleEls = /* @__PURE__ */ new Map();
+		function registerEl(store, key, el) {
+			if (el instanceof HTMLElement) {
+				store.set(key, el);
+				return;
+			}
+			const previous = store.get(key);
+			if (previous && !previous.isConnected) store.delete(key);
+		}
+		const { orderedColumns, columnKeys, draggingColumnKey, columnDropClass, onColumnHandleKeydown, columnSort, columnRoving } = useDataTableColumnOrder({
+			columns: () => props.columns,
+			columnOrder: () => props.columnOrder,
+			reorderableColumns: () => props.reorderableColumns,
+			loading: () => props.loading,
+			headerCellEls,
+			columnHandleEls,
+			onOrderChange: (order, moved) => {
+				emit("update:columnOrder", order);
+				emit("columnReorder", moved);
+			},
+			announceMove: (label, position, count) => {
+				announce(t("gr.dataTable.columnMoved", "Column {label} moved to position {position} of {count}", {
+					label,
+					position,
+					count
+				}));
+			}
+		});
+		const { columnWidths, setMeasuredWidths, widthOf, tableMinWidth, resizingKey, onResizerPointerDown, onResizerKeydown, resetColumnWidth, resizerValue } = useDataTableColumnWidths({
+			orderedColumns: () => orderedColumns.value,
+			columnWidths: () => props.columnWidths,
+			resizableColumns: () => props.resizableColumns,
+			loading: () => props.loading,
+			headerCellEls,
+			onWidthsChange: (widths) => emit("update:columnWidths", widths),
+			onColumnResize: (key, width) => emit("columnResize", {
+				key,
+				width
+			}),
+			announceWidth: (label, width) => {
+				announce(t("gr.dataTable.columnResized", "Column {label} is {width} pixels wide", {
+					label,
+					width
+				}));
+			}
+		});
+		const { hasPinnedLeft, pinnedStyleOf, pinnedCellClass } = useDataTableLayout({
+			orderedColumns: () => orderedColumns.value,
+			columnKeys: () => columnKeys.value,
+			selectable: () => props.selectable,
+			resizableColumns: () => props.resizableColumns,
+			headerCellEls,
+			watchSources: () => [
+				orderedColumns.value,
+				columnWidths.value,
+				props.loading,
+				props.rows.length
+			],
+			onMeasuredWidths: setMeasuredWidths
+		});
+		const tableProps = computed(() => ({
+			size: resolvedSize.value,
+			ariaLabel: props.ariaLabel,
+			ariaLabelledby: props.ariaLabelledby,
+			regionLabel: props.regionLabel,
+			stickyHeader: props.stickyHeader,
+			maxHeight: props.maxHeight,
+			rowCount: ariaRowCount.value,
+			fixedLayout: props.virtual || props.resizableColumns,
+			tableMinWidth: tableMinWidth.value
+		}));
+		function columnHandleLabel(col) {
+			return t("gr.dataTable.moveColumn", "Move column {label}", { label: col.label });
+		}
+		function resizerLabel(col) {
+			return t("gr.dataTable.resizeColumn", "Width of column {label}", { label: col.label });
+		}
+		/** Уже колонки не бывает: в неё перестаёт помещаться даже стрелка сортировки. */
+		/**
+		* Живой регион существует с первого рендера и пуст, пока объявлять нечего.
+		* Регион, который появляется уже с текстом, часть AT не объявляет вовсе —
+		* а именно так вело себя `role="status"` внутри строки загрузки.
+		*/
+		const liveMessage = computed(() => {
+			if (props.loading) return resolvedLoadingText.value;
+			if (isEmpty.value) return resolvedEmptyText.value;
+			return "";
+		});
+		function cellValue(row, key) {
+			return row[key];
+		}
+		function rowClassName(row, index) {
+			const source = props.rowClass;
+			return typeof source === "function" ? source(row, index) : source;
+		}
+		function onRowClick(row, index, event) {
+			emit("rowClick", {
+				row,
+				index,
+				event
+			});
+		}
+		const { isRowSelectable, isRowSelected, selectableRows, allSelected, someSelected, toggleRow, toggleAll } = useDataTableSelection({
+			rows: () => sortedRows.value,
+			selected: () => props.selected,
+			selectableRow: () => props.selectableRow,
+			rowKeyValue,
+			onSelectedChange: (keys) => emit("update:selected", keys)
+		});
+		const expandDetailId = useId();
+		const { isRowExpandable, isRowExpanded, toggleRow: toggleRowExpanded, detailStateOf, detailDataOf, retryDetail, invalidateDetail } = useDataTableExpansion({
+			expandedKeys: () => props.expandedKeys,
+			rows: () => props.rows,
+			expandableRow: () => props.expandableRow,
+			loadDetail: () => props.loadDetail,
+			accordion: () => props.accordion,
+			rowKeyValue,
+			onExpandedChange: (keys) => emit("update:expandedKeys", keys),
+			onExpand: (row, key) => {
+				emit("expand", {
+					row,
+					key
+				});
+				announce(t("gr.dataTable.detailExpanded", "Row details shown"));
+			},
+			onCollapse: (row, key) => {
+				emit("collapse", {
+					row,
+					key
+				});
+				announce(t("gr.dataTable.detailCollapsed", "Row details hidden"));
+			},
+			onDetailLoadError: (row, key, error) => emit("detailLoadError", {
+				row,
+				key,
+				error
+			})
+		});
+		/** Id строки подробностей: адресат `aria-controls` у кнопки. */
+		function detailRowId(row) {
+			return `${expandDetailId}-${rowKeyValue(row)}`;
+		}
+		/**
+		* Раскрытие и виртуализация вместе пока не работают: замер виртуализатора висит
+		* на самой строке, и высота второго яруса в него не попадает — распорка
+		* разъедется молча. Запрет снимется, когда пара строк переедет в свою группу
+		* `<tbody>`; до тех пор лучше предупредить, чем показать прыгающую таблицу.
+		*/
+		if (process.env.NODE_ENV !== "production") watchEffect(() => {
+			if (props.expandable && props.virtual) console.warn("[granularity] GrDataTable: `expandable` вместе с `virtual` пока не поддержан — раскрытие выключено. Замер виртуализатора висит на строке и не видит высоту подробностей, поэтому распорки разъезжаются.");
+		});
+		const tableRef = ref(null);
+		const rootId = useId();
+		function rootEl() {
+			return tableRef.value?.$el ?? null;
+		}
+		/** Скролл-контейнер таблицы — он же элемент с `maxHeight`. */
+		function scrollEl() {
+			const root = rootEl();
+			return root?.matches("[data-gr-table-scroll]") ? root : root?.querySelector("[data-gr-table-scroll]") ?? null;
+		}
+		/**
+		* Виртуализация строк.
+		*
+		* Распорки здесь не псевдоэлементы, как у списочных компонентов: `<tbody>`
+		* игнорирует `padding`, а псевдоэлемент внутри группы строк не образует строку
+		* с управляемой высотой. Поэтому срезанное держат две служебные `<tr>` — той же
+		* формы, что строки загрузки и пустоты у `GrTable`.
+		*/
+		const scrollContainer = ref(null);
+		onMounted(() => {
+			scrollContainer.value = scrollEl();
+		});
+		const virtualizer = useVirtualList({
+			container: scrollContainer,
+			count: () => props.virtual ? sortedRows.value.length : 0,
+			source: () => sortedRows.value,
+			itemSize: () => rowHeightEstimates[resolvedSize.value],
+			viewportSize: () => typeof props.maxHeight === "number" ? props.maxHeight : void 0
+		});
+		/** Строки к отрисовке вместе с их абсолютной позицией в наборе. */
+		const renderedRows = computed(() => {
+			const rows = sortedRows.value;
+			if (!props.virtual) return rows.map((row, index) => ({
+				row,
+				index
+			}));
+			const { start, end } = virtualizer.range.value;
+			return rows.slice(start, end).map((row, offset) => ({
+				row,
+				index: start + offset
+			}));
+		});
+		const spacerBefore = computed(() => props.virtual ? virtualizer.offset.value : 0);
+		const spacerAfter = computed(() => props.virtual ? virtualizer.offsetEnd.value : 0);
+		/** Ширина колонки: число трактуем как пиксели. */
+		function columnWidthStyle(width) {
+			if (width === void 0) return void 0;
+			return { width: typeof width === "number" ? `${width}px` : width };
+		}
+		function scrollToRow(key, options) {
+			const target = String(key);
+			if (props.virtual) {
+				const index = sortedRows.value.findIndex((row) => String(rowKeyValue(row)) === target);
+				if (index < 0) return false;
+				virtualizer.scrollToIndex(index);
+				nextTick(() => {
+					findRowEl(target)?.scrollIntoView?.(options ?? { block: "nearest" });
+				});
+				return true;
+			}
+			const row = findRowEl(target);
+			if (!row) return false;
+			row.scrollIntoView(options ?? { block: "nearest" });
+			return true;
+		}
+		function findRowEl(rowKey) {
+			const rows = rootEl()?.querySelectorAll("[data-gr-datatable-row]") ?? [];
+			return Array.prototype.find.call(rows, (el) => el.dataset.rowKey === rowKey);
+		}
+		function scrollTo(options) {
+			scrollEl()?.scrollTo(options);
+		}
+		__expose({
+			/** Прокрутить к строке по её ключу. `false` — строки нет в DOM. */
+			scrollToRow,
+			/** Прокрутить скролл-контейнер таблицы. */
+			scrollTo,
+			/** Снять сортировку (эквивалент третьего состояния). */
+			clearSort,
+			/** Отметить/снять все выбираемые строки. */
+			toggleAll,
+			/**
+			* Сбросить загруженные подробности: у одной строки либо у всех.
+			* Нужен, когда запись изменилась на сервере, — само по себе раскрытие
+			* держит загруженное, пока строка жива.
+			*/
+			invalidateDetail
+		});
+		/**
+		* Три семейства слотов по ключу колонки — `#cell-<key>` (`{ row, index }`),
+		* `#header-<key>` (`{ column }`) и `#summary-<key>` (`{ value, column }`) —
+		* попадают под общую индексную сигнатуру, а не под шаблонные.
+		*
+		* Шаблонные (`` `cell-${string}` ``) сужали бы тип слотов строже
+		* `InternalSlots`, и дженерик-компонент переставал приниматься `h()`: ломался
+		* бы рендер-функцией, оставаясь рабочим в шаблоне. Цена — пропсы этих трёх
+		* семейств не типизированы; они описаны здесь и на странице компонента.
+		*/
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(GrTable_default, mergeProps(tableProps.value, {
+				ref_key: "tableRef",
+				ref: tableRef,
+				"data-gr-datatable": ""
+			}), createSlots({
+				caption: withCtx(() => [renderSlot(_ctx.$slots, "caption", {}, () => [createTextVNode(toDisplayString(__props.caption), 1)]), createElementVNode("span", {
+					id: `${unref(rootId)}-live`,
+					"data-gr-datatable-live": "",
+					role: "status",
+					"aria-live": "polite"
+				}, toDisplayString(liveMessage.value), 9, _hoisted_1)]),
+				header: withCtx(() => [createElementVNode("tr", {
+					"data-gr-datatable-header": "",
+					"aria-rowindex": __props.virtual ? 1 : void 0
+				}, [
+					expandColumnVisible.value ? (openBlock(), createElementBlock("th", {
+						key: 0,
+						"data-gr-datatable-expand-head": "",
+						scope: "col",
+						class: normalizeClass([unref(expandColumnWidths)[unref(resolvedSize)], cellClass.value])
+					}, null, 2)) : createCommentVNode("", true),
+					__props.selectable ? (openBlock(), createElementBlock("th", {
+						key: 1,
+						ref: (el) => registerEl(unref(headerCellEls), unref(SELECT_COLUMN_KEY), el),
+						class: normalizeClass(["text-left", [
+							selectColumnClass.value,
+							cellClass.value,
+							unref(hasPinnedLeft) ? unref(columnPinnedClass) : ""
+						]]),
+						style: normalizeStyle(unref(hasPinnedLeft) ? { left: "0px" } : void 0),
+						scope: "col"
+					}, [createVNode(GrCheckbox_default, {
+						"data-gr-datatable-select-all": "",
+						"model-value": unref(allSelected),
+						indeterminate: unref(someSelected),
+						size: checkboxSize.value,
+						disabled: __props.loading || unref(selectableRows).length === 0,
+						"aria-label": unref(t)("gr.dataTable.selectAll", "Select all rows"),
+						"onUpdate:modelValue": unref(toggleAll)
+					}, null, 8, [
+						"model-value",
+						"indeterminate",
+						"size",
+						"disabled",
+						"aria-label",
+						"onUpdate:modelValue"
+					])], 6)) : createCommentVNode("", true),
+					(openBlock(true), createElementBlock(Fragment, null, renderList(unref(orderedColumns), (col, colIndex) => {
+						return openBlock(), createElementBlock("th", {
+							key: col.key,
+							ref_for: true,
+							ref: (el) => registerEl(unref(headerCellEls), String(col.key), el),
+							class: normalizeClass(["font-700", [
+								headerTextClass.value,
+								cellClass.value,
+								cellAlign(col),
+								__props.reorderableColumns || __props.resizableColumns ? "group relative" : "",
+								unref(draggingColumnKey) === String(col.key) ? unref(columnDraggingClass) : "",
+								unref(columnDropClass)(colIndex),
+								...unref(pinnedCellClass)(col, colIndex)
+							]]),
+							"data-column-key": col.key,
+							style: normalizeStyle({
+								...columnWidthStyle(unref(widthOf)(col)),
+								...unref(pinnedStyleOf)(col)
+							}),
+							"aria-sort": unref(ariaSortFor)(col),
+							scope: "col"
+						}, [createElementVNode("div", { class: normalizeClass(["inline-flex items-center", headerGapClass.value]) }, [__props.reorderableColumns ? (openBlock(), createElementBlock("button", {
+							key: 0,
+							ref_for: true,
+							ref: (el) => registerEl(unref(columnHandleEls), String(col.key), el),
+							type: "button",
+							"data-gr-datatable-column-handle": "",
+							class: normalizeClass([unref(columnHandleClass), unref(columnSort).isActive.value ? unref(columnHandleActiveClass) : ""]),
+							tabindex: unref(columnRoving).tabindexFor(String(col.key)),
+							"aria-label": columnHandleLabel(col),
+							disabled: __props.loading,
+							onPointerdown: ($event) => unref(columnSort).startFrom(String(col.key))($event),
+							onKeydown: ($event) => unref(onColumnHandleKeydown)($event, String(col.key)),
+							onFocus: ($event) => unref(columnRoving).setActive(String(col.key)),
+							onClick: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop"]))
+						}, [createVNode(unref(grip_vertical_default), {
+							class: "block",
+							"aria-hidden": "true"
+						})], 42, _hoisted_4)) : createCommentVNode("", true), col.sortable ? (openBlock(), createElementBlock("button", {
+							key: 1,
+							type: "button",
+							"data-gr-datatable-sort": "",
+							class: normalizeClass(["inline-flex items-center text-[var(--gr-muted-fg)] hover:text-[var(--gr-fg)] transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--gr-ring)] rounded-[var(--gr-radius-sm)]", headerGapClass.value]),
+							onClick: ($event) => unref(toggleSort)(col)
+						}, [
+							createElementVNode("span", null, [renderSlot(_ctx.$slots, `header-${col.key}`, { column: col }, () => [createTextVNode(toDisplayString(col.label), 1)])]),
+							createElementVNode("span", _hoisted_6, toDisplayString(sortHint(col)), 1),
+							createElementVNode("span", _hoisted_7, [unref(currentSortKey) === col.key && unref(currentSortDir) === "asc" ? (openBlock(), createBlock(GrIcon_default, {
+								key: 0,
+								size: sortIconSize.value
+							}, {
+								default: withCtx(() => [createVNode(unref(arrow_up_default))]),
+								_: 1
+							}, 8, ["size"])) : unref(currentSortKey) === col.key && unref(currentSortDir) === "desc" ? (openBlock(), createBlock(GrIcon_default, {
+								key: 1,
+								size: sortIconSize.value
+							}, {
+								default: withCtx(() => [createVNode(unref(arrow_down_default))]),
+								_: 1
+							}, 8, ["size"])) : createCommentVNode("", true)])
+						], 10, _hoisted_5)) : (openBlock(), createElementBlock("span", _hoisted_8, [renderSlot(_ctx.$slots, `header-${col.key}`, { column: col }, () => [createTextVNode(toDisplayString(col.label), 1)])]))], 2), __props.resizableColumns ? (openBlock(), createElementBlock("span", {
+							key: 0,
+							"data-gr-datatable-column-resizer": "",
+							role: "separator",
+							tabindex: "0",
+							"aria-orientation": "vertical",
+							class: normalizeClass(unref(columnResizerClass)),
+							"aria-label": resizerLabel(col),
+							"aria-valuenow": unref(resizerValue)(col),
+							"aria-valuemin": unref(48),
+							"aria-valuetext": `${unref(resizerValue)(col)}px`,
+							onPointerdown: ($event) => unref(onResizerPointerDown)($event, String(col.key)),
+							onKeydown: ($event) => unref(onResizerKeydown)($event, String(col.key)),
+							onDblclick: ($event) => unref(resetColumnWidth)(String(col.key)),
+							onClick: _cache[1] || (_cache[1] = withModifiers(() => {}, ["stop"]))
+						}, [createElementVNode("span", {
+							class: normalizeClass([
+								unref(columnResizerLineClass),
+								unref(columnResizerHoverClass),
+								unref(resizingKey) === String(col.key) ? unref(columnResizerLineActiveClass) : ""
+							]),
+							"aria-hidden": "true"
+						}, null, 2)], 42, _hoisted_9)) : createCommentVNode("", true)], 14, _hoisted_3);
+					}), 128))
+				], 8, _hoisted_2)]),
+				default: withCtx(() => [__props.loading ? (openBlock(), createElementBlock("tr", _hoisted_10, [createElementVNode("td", {
+					colspan: totalColumns.value,
+					class: normalizeClass(["text-center text-[var(--gr-muted-fg)]", placeholderClass.value])
+				}, [renderSlot(_ctx.$slots, "loading", {}, () => [createElementVNode("span", _hoisted_12, [createVNode(unref(loader_circle_default), {
+					class: normalizeClass(["block animate-spin", spinnerClass.value]),
+					"aria-hidden": "true"
+				}, null, 8, ["class"]), createElementVNode("span", null, toDisplayString(resolvedLoadingText.value), 1)])])], 10, _hoisted_11)])) : isEmpty.value ? (openBlock(), createElementBlock("tr", _hoisted_13, [createElementVNode("td", {
+					colspan: totalColumns.value,
+					class: normalizeClass(["text-center text-[var(--gr-muted-fg)]", placeholderClass.value])
+				}, [renderSlot(_ctx.$slots, "empty", {}, () => [createTextVNode(toDisplayString(resolvedEmptyText.value), 1)])], 10, _hoisted_14)])) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+					__props.virtual && spacerBefore.value > 0 ? (openBlock(), createElementBlock("tr", _hoisted_15, [createElementVNode("td", {
+						colspan: totalColumns.value,
+						style: normalizeStyle({
+							height: `${spacerBefore.value}px`,
+							padding: "0",
+							border: "0"
+						})
+					}, null, 12, _hoisted_16)])) : createCommentVNode("", true),
+					(openBlock(true), createElementBlock(Fragment, null, renderList(renderedRows.value, ({ row, index }) => {
+						return openBlock(), createElementBlock(Fragment, { key: unref(rowKeyValue)(row) }, [createElementVNode("tr", mergeProps({
+							ref_for: true,
+							ref: (el) => __props.virtual && unref(virtualizer).measure(index, el),
+							class: ["border-t border-[var(--gr-brd)]", [unref(isRowSelected)(row) ? unref(rowSelectedClass) : "", rowClassName(row, index)]],
+							"data-gr-datatable-row": "",
+							"data-row-key": unref(rowKeyValue)(row),
+							"data-selected": __props.selectable && unref(isRowSelected)(row) ? "true" : void 0,
+							"aria-rowindex": ariaRowIndex(index)
+						}, { ref_for: true }, __props.rowProps?.(row, index), { onClick: ($event) => onRowClick(row, index, $event) }), [
+							expandColumnVisible.value ? (openBlock(), createElementBlock("td", {
+								key: 0,
+								"data-gr-datatable-expand-cell": "",
+								class: normalizeClass(["text-left", [unref(expandColumnWidths)[unref(resolvedSize)], cellClass.value]])
+							}, [unref(isRowExpandable)(row) ? (openBlock(), createElementBlock("button", {
+								key: 0,
+								type: "button",
+								"data-gr-datatable-expand": "",
+								class: normalizeClass([unref(expandButtonClass), checkboxSize.value === "xs" ? "h-5 w-5" : "h-6 w-6"]),
+								"aria-expanded": unref(isRowExpanded)(row),
+								"aria-controls": detailRowId(row),
+								"aria-label": unref(isRowExpanded)(row) ? unref(t)("gr.dataTable.collapseRow", "Hide details") : unref(t)("gr.dataTable.expandRow", "Show details"),
+								onClick: withModifiers(($event) => unref(toggleRowExpanded)(row), ["stop"])
+							}, [renderSlot(_ctx.$slots, "expand-icon", {
+								expanded: unref(isRowExpanded)(row),
+								row
+							}, () => [createVNode(unref(chevron_right_default), { class: normalizeClass([unref(expandIconClass), unref(isRowExpanded)(row) ? unref(expandIconOpenClass) : ""]) }, null, 8, ["class"])])], 10, _hoisted_18)) : createCommentVNode("", true)], 2)) : createCommentVNode("", true),
+							__props.selectable ? (openBlock(), createElementBlock("td", {
+								key: 1,
+								class: normalizeClass(["text-left", [
+									selectColumnClass.value,
+									cellClass.value,
+									unref(hasPinnedLeft) ? unref(columnPinnedClass) : "",
+									unref(hasPinnedLeft) && unref(isRowSelected)(row) ? unref(rowSelectedClass) : ""
+								]]),
+								style: normalizeStyle(unref(hasPinnedLeft) ? { left: "0px" } : void 0)
+							}, [unref(isRowSelectable)(row) ? (openBlock(), createBlock(GrCheckbox_default, {
+								key: 0,
+								"data-gr-datatable-select-row": "",
+								"model-value": unref(isRowSelected)(row),
+								size: checkboxSize.value,
+								"aria-label": unref(t)("gr.dataTable.selectRow", "Select row"),
+								onClick: _cache[2] || (_cache[2] = withModifiers(() => {}, ["stop"])),
+								"onUpdate:modelValue": ($event) => unref(toggleRow)(row)
+							}, null, 8, [
+								"model-value",
+								"size",
+								"aria-label",
+								"onUpdate:modelValue"
+							])) : createCommentVNode("", true)], 6)) : createCommentVNode("", true),
+							(openBlock(true), createElementBlock(Fragment, null, renderList(unref(orderedColumns), (col, colIndex) => {
+								return openBlock(), createElementBlock("td", {
+									key: col.key,
+									class: normalizeClass([
+										cellClass.value,
+										cellAlign(col),
+										...unref(pinnedCellClass)(col, colIndex),
+										col.pinned && unref(isRowSelected)(row) ? unref(rowSelectedClass) : ""
+									]),
+									style: normalizeStyle({
+										...columnWidthStyle(unref(widthOf)(col)),
+										...unref(pinnedStyleOf)(col)
+									})
+								}, [renderSlot(_ctx.$slots, `cell-${col.key}`, {
+									row,
+									index,
+									expanded: unref(isRowExpanded)(row),
+									toggleExpand: () => unref(toggleRowExpanded)(row)
+								}, () => [createElementVNode("span", null, toDisplayString(cellValue(row, col.key)), 1)])], 6);
+							}), 128))
+						], 16, _hoisted_17), unref(isRowExpanded)(row) ? (openBlock(), createElementBlock("tr", {
+							key: 0,
+							id: detailRowId(row),
+							"data-gr-datatable-detail": "",
+							"data-gr-table-off-grid": "",
+							class: normalizeClass(unref(detailRowClass))
+						}, [createElementVNode("td", {
+							colspan: totalColumns.value,
+							class: normalizeClass([unref(detailCellClass), unref(detailPaddings)[unref(resolvedSize)]])
+						}, [createElementVNode("div", { class: normalizeClass(unref(detailContentClass)) }, [unref(detailStateOf)(row) === "loading" ? (openBlock(), createElementBlock("div", _hoisted_21, [renderSlot(_ctx.$slots, "detail-loading", { row }, () => [createVNode(GrSkeleton_default, { count: 2 })])])) : unref(detailStateOf)(row) === "error" ? (openBlock(), createElementBlock("div", {
+							key: 1,
+							class: normalizeClass(unref(detailErrorClass)),
+							"data-gr-datatable-detail-error": ""
+						}, [renderSlot(_ctx.$slots, "detail-error", {
+							row,
+							retry: () => unref(retryDetail)(row)
+						}, () => [createElementVNode("span", null, toDisplayString(unref(t)("gr.dataTable.detailError", "Could not load details")), 1), createVNode(GrButton_default, {
+							size: "xs",
+							tone: "danger",
+							variant: "outline",
+							onClick: ($event) => unref(retryDetail)(row)
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("gr.dataTable.detailRetry", "Retry")), 1)]),
+							_: 1
+						}, 8, ["onClick"])])], 2)) : renderSlot(_ctx.$slots, "detail", {
+							row,
+							index,
+							data: unref(detailDataOf)(row),
+							state: unref(detailStateOf)(row)
+						}, void 0, void 0, 2)], 2)], 10, _hoisted_20)], 10, _hoisted_19)) : createCommentVNode("", true)], 64);
+					}), 128)),
+					__props.virtual && spacerAfter.value > 0 ? (openBlock(), createElementBlock("tr", _hoisted_22, [createElementVNode("td", {
+						colspan: totalColumns.value,
+						style: normalizeStyle({
+							height: `${spacerAfter.value}px`,
+							padding: "0",
+							border: "0"
+						})
+					}, null, 12, _hoisted_23)])) : createCommentVNode("", true)
+				], 64))]),
+				_: 2
+			}, [_ctx.$slots.footer || hasSummary.value ? {
+				name: "footer",
+				fn: withCtx(() => [hasSummary.value ? (openBlock(), createElementBlock("tr", {
+					key: 0,
+					"data-gr-datatable-summary": "",
+					class: normalizeClass(unref(summaryRowClass)),
+					"aria-rowindex": summaryAriaRowIndex.value
+				}, [__props.selectable ? (openBlock(), createElementBlock("td", {
+					key: 0,
+					class: normalizeClass([
+						selectColumnClass.value,
+						cellClass.value,
+						unref(hasPinnedLeft) ? unref(columnPinnedClass) : ""
+					]),
+					style: normalizeStyle(unref(hasPinnedLeft) ? { left: "0px" } : void 0)
+				}, null, 6)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(unref(orderedColumns), (col, colIndex) => {
+					return openBlock(), createElementBlock("td", {
+						key: col.key,
+						"data-column-key": col.key,
+						class: normalizeClass([
+							cellClass.value,
+							cellAlign(col),
+							...unref(pinnedCellClass)(col, colIndex)
+						]),
+						style: normalizeStyle({
+							...columnWidthStyle(unref(widthOf)(col)),
+							...unref(pinnedStyleOf)(col)
+						})
+					}, [renderSlot(_ctx.$slots, `summary-${col.key}`, {
+						value: summaryValue(col.key),
+						column: col
+					}, () => [createElementVNode("span", null, toDisplayString(summaryValue(col.key)), 1)])], 14, _hoisted_25);
+				}), 128))], 10, _hoisted_24)) : createCommentVNode("", true), renderSlot(_ctx.$slots, "footer", {
+					columns: unref(orderedColumns),
+					totalColumns: totalColumns.value
+				})]),
+				key: "0"
+			} : void 0]), 1040);
+		};
+	}
+});
+//#endregion
+export { GrDataTable_default as t };