@feugene/granularity 0.18.0 → 0.20.0

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

@@ -1,1053 +0,0 @@
-import { o as useGrComponentSize } from "../../../chunks/context-BSYR7RZs.js";
-import { n as useGranularityTranslations } from "../../../chunks/granularityI18n-BC5zsj_d.js";
-import { t as GrIcon_default } from "../../GrIcon/chunks/GrIcon-BvA2ZGXP.js";
-import { useVirtualList } from "../../../composables/useVirtualList.js";
-import { t as GrCheckbox_default } from "../../GrCheckbox/chunks/GrCheckbox-BLOp8452.js";
-import { useDragGesture } from "../../../composables/useDragGesture.js";
-import { t as GrTable_default } from "../../GrTable/chunks/GrTable-BfqgwETQ.js";
-import { useAnnouncer } from "../../../composables/useAnnouncer.js";
-import { n as insertionIndex, r as moveItem, t as useDragSort } from "../../../chunks/useDragSort-0l47h4yb.js";
-import { useRovingFocus } from "../../../composables/useRovingFocus.js";
-import { C as selectColumnWidths, S as selectCheckboxSizes, T as spinnerSizes, _ as headerGaps, a as columnDropAfterClass, b as rowHeightEstimates, c as columnHandleClass, d as columnPinnedLeftEdgeClass, f as columnPinnedRightEdgeClass, g as columnResizerLineClass, h as columnResizerLineActiveClass, i as columnDraggingClass, l as columnHandleIconClass, m as columnResizerHoverClass, o as columnDropBeforeClass, p as columnResizerClass, r as cellPaddings, s as columnHandleActiveClass, u as columnPinnedClass, v as headerTextSizes, w as sortIconSizes, x as rowSelectedClass, y as placeholderPaddings } from "../../../chunks/config-DEvsMTQE.js";
-import { t as arrow_up_default } from "../../../chunks/arrow-up-C_G4jg8M.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, markRaw, mergeProps, nextTick, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useId, watch, withCtx, withModifiers } from "vue";
-//#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 ~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-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",
-	style: { pointerEvents: "none" }
-};
-var _hoisted_16 = ["colspan"];
-var _hoisted_17 = [
-	"data-row-key",
-	"data-selected",
-	"aria-rowindex",
-	"onClick"
-];
-var _hoisted_18 = {
-	key: 1,
-	"aria-hidden": "true",
-	"data-gr-datatable-spacer": "after",
-	style: { pointerEvents: "none" }
-};
-var _hoisted_19 = ["colspan"];
-/**
-* `GrDataTable` — data-таблица поверх `GrTable` с сортировкой по клику
-* на заголовок и scoped-слотами ячеек (`#cell-<key>`), `#header-<key>`,
-* `#caption`, `#footer`, `#empty`, `#loading`.
-*
-* Сортировка, включая крайние случаи с пустыми и смешанными значениями, живёт
-* в `grDataTableSort.ts` — см. `docs/components/GrDataTable.md`.
-*/
-var MIN_COLUMN_WIDTH = 48;
-/** Шаг клавиатуры и крупный шаг — как у `GrSplitter`. */
-var RESIZE_STEP = 16;
-var RESIZE_BIG_STEP = 48;
-var SELECT_COLUMN_KEY = "__select__";
-//#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
-		},
-		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 }
-	},
-	emits: [
-		"update:sortKey",
-		"update:sortDir",
-		"sortChange",
-		"update:selected",
-		"rowClick",
-		"update:columnOrder",
-		"columnReorder",
-		"update:columnWidths",
-		"columnResize"
-	],
-	setup(__props, { expose: __expose, emit: __emit }) {
-		const props = __props;
-		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 internalSortKey = ref(props.initialSortKey ?? "");
-		const internalSortDir = ref(props.initialSortDir);
-		const isSortKeyControlled = computed(() => props.sortKey !== void 0);
-		const isSortDirControlled = computed(() => props.sortDir !== void 0);
-		const currentSortKey = computed(() => props.sortKey ?? internalSortKey.value);
-		const currentSortDir = computed(() => props.sortDir ?? internalSortDir.value);
-		function applySort(key, dir) {
-			if (!isSortKeyControlled.value) internalSortKey.value = key;
-			if (!isSortDirControlled.value) internalSortDir.value = dir;
-			emit("update:sortKey", key);
-			emit("update:sortDir", dir);
-			emit("sortChange", {
-				key,
-				dir
-			});
-		}
-		const sortedRows = computed(() => {
-			if (props.externalSort) return [...props.rows];
-			const key = currentSortKey.value;
-			if (!key) return [...props.rows];
-			return sortRows(props.rows, key, currentSortDir.value, locale.value);
-		});
-		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 (props.sortCycle === "asc-desc-none") {
-				applySort("", "asc");
-				return;
-			}
-			applySort(col.key, "asc");
-		}
-		function cellAlign(col) {
-			if (col.align === "right") return "text-right";
-			if (col.align === "center") return "text-center";
-			return "text-left";
-		}
-		/**
-		* Синтетические ключи для строк, у которых поле `rowKey` пустое.
-		*
-		* Без них строка получила бы `String(undefined ?? '')` — **один и тот же** ключ
-		* на всю таблицу: Vue переиспользовал бы DOM не по назначению, а выбор одной
-		* строки помечал бы выбранными все. Ключ привязан к идентичности объекта,
-		* поэтому переживает сортировку и не зависит от индекса.
-		*/
-		const syntheticKeys = /* @__PURE__ */ new WeakMap();
-		let syntheticKeyCounter = 0;
-		const missingKeyWarned = ref(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.value && process.env.NODE_ENV !== "production") {
-				missingKeyWarned.value = true;
-				console.warn(`[GrDataTable] У строки нет значения по ключу "${String(props.rowKey)}". Задайте \`rowKey\` (поле или функцию) — иначе выбор строк и переиспользование DOM работают по синтетическому ключу, который не переживёт перезагрузку данных.`);
-			}
-			return generated;
-		}
-		function rowKeyValue(row) {
-			const rk = props.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);
-		}
-		function ariaSortFor(col) {
-			if (!col.sortable) return void 0;
-			if (currentSortKey.value !== col.key) return "none";
-			return currentSortDir.value === "asc" ? "ascending" : "descending";
-		}
-		/**
-		* Подсказка «что сделает нажатие» — 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]);
-		/**
-		* Номер строки и полное их число объявляем только при виртуализации: иначе
-		* диктор считает строки по разметке, а там всего окно. Заголовок — строка
-		* первая, поэтому строки набора начинаются со второй.
-		*/
-		const ariaRowCount = computed(() => props.virtual ? sortedRows.value.length + 1 : void 0);
-		function ariaRowIndex(index) {
-			return props.virtual ? index + 2 : void 0;
-		}
-		const isEmpty = computed(() => sortedRows.value.length === 0);
-		const totalColumns = computed(() => props.columns.length + (props.selectable ? 1 : 0));
-		/** Uncontrolled-состояние; в controlled-режиме перекрывается пропом `columnOrder`. */
-		const internalColumnOrder = ref(props.columns.map((col) => String(col.key)));
-		/**
-		* Колонки в пользовательском порядке.
-		*
-		* Состав задаёт `columns`, порядок — только порядок: ключ, которого в наборе
-		* нет, игнорируется, а колонка, которой нет в порядке (её только что добавили),
-		* встаёт в конец. Иначе правка `columns` теряла бы колонки молча.
-		*/
-		const orderedColumns = computed(() => {
-			const order = props.columnOrder ?? internalColumnOrder.value;
-			const remaining = new Map(props.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 props.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 tableMinWidth = computed(() => {
-			const cols = orderedColumns.value;
-			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 columnKeys = computed(() => orderedColumns.value.map((col) => String(col.key)));
-		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 indexOfColumn(key) {
-			return columnKeys.value.indexOf(key);
-		}
-		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);
-		}
-		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;
-			emit("update:columnOrder", next);
-			emit("columnReorder", {
-				key,
-				from,
-				to
-			});
-			announce(t("gr.dataTable.columnMoved", "Column {label} moved to position {position} of {count}", {
-				label,
-				position: to + 1,
-				count: keys.length
-			}));
-		}
-		const columnSort = useDragSort({
-			items: () => columnKeys.value,
-			elementFor: (key) => headerCellEls.get(key) ?? null,
-			orientation: () => "horizontal",
-			disabled: () => !props.reorderableColumns || props.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)
-		});
-		function sameGroup(from, to) {
-			const cols = orderedColumns.value;
-			if (!cols[from] || !cols[to]) return false;
-			return pinGroupOf(cols[from]) === pinGroupOf(cols[to]);
-		}
-		/**
-		* Кольцо роверного фокуса по ручкам: одна остановка `Tab` на всю шапку.
-		* Иначе таблица из десяти колонок добавляла бы десять таб-стопов подряд.
-		*/
-		const columnRoving = useRovingFocus({
-			items: () => props.reorderableColumns ? columnKeys.value : [],
-			elementFor: (key) => columnHandleEls.get(key) ?? null,
-			orientation: () => "horizontal",
-			wrap: () => false
-		});
-		async function onColumnHandleKeydown(event, key) {
-			if (!props.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;
-		}
-		const columnHandleLabel = (col) => t("gr.dataTable.moveColumn", "Move column {label}", { label: col.label });
-		/** Уже колонки не бывает: в неё перестаёт помещаться даже стрелка сортировки. */
-		const internalColumnWidths = ref({});
-		const columnWidths = computed(() => props.columnWidths ?? internalColumnWidths.value);
-		/** Фактические ширины шапки: заполняются замером, см. `measureLayout`. */
-		const measuredColumnWidths = ref({});
-		/** Ширина колонки: заданная пользователем сильнее объявленной в `columns`. */
-		function widthOf(col) {
-			return columnWidths.value[String(col.key)] ?? col.width;
-		}
-		const resizingKey = ref(null);
-		let pendingResizeKey = null;
-		let resizeStartX = 0;
-		let resizeStartWidth = 0;
-		let widthBeforeResize;
-		function setColumnWidth(key, width) {
-			const next = {
-				...columnWidths.value,
-				[key]: Math.max(MIN_COLUMN_WIDTH, Math.round(width))
-			};
-			internalColumnWidths.value = next;
-			emit("update:columnWidths", next);
-		}
-		function announceWidth(key) {
-			const col = orderedColumns.value.find((item) => String(item.key) === key);
-			if (!col) return;
-			announce(t("gr.dataTable.columnResized", "Column {label} is {width} pixels wide", {
-				label: col.label,
-				width: columnWidths.value[key] ?? 0
-			}));
-		}
-		const resizeGesture = useDragGesture({
-			disabled: () => !props.resizableColumns || props.loading,
-			onStart: (event) => {
-				const key = pendingResizeKey;
-				const el = key === null ? null : 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;
-				emit("columnResize", {
-					key,
-					width: 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;
-				internalColumnWidths.value = next;
-				emit("update:columnWidths", 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];
-			internalColumnWidths.value = next;
-			emit("update:columnWidths", next);
-			emit("columnResize", {
-				key,
-				width: 0
-			});
-		}
-		function resizeByKeyboard(key, delta) {
-			const measured = headerCellEls.get(key)?.getBoundingClientRect().width ?? MIN_COLUMN_WIDTH;
-			const current = columnWidths.value[key] ?? measured;
-			setColumnWidth(key, current + delta);
-			emit("columnResize", {
-				key,
-				width: columnWidths.value[key] ?? current
-			});
-			announceWidth(key);
-		}
-		function onResizerKeydown(event, key) {
-			if (!props.resizableColumns || props.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);
-			}
-		}
-		function resizerLabel(col) {
-			return t("gr.dataTable.resizeColumn", "Width of column {label}", { label: col.label });
-		}
-		/**
-		* Ручка ресайза — фокусируемый `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 ?? MIN_COLUMN_WIDTH;
-		}
-		/** Служебная колонка выбора в реестре ячеек: своего ключа у неё нет. */
-		const hasPinnedLeft = computed(() => orderedColumns.value.some((col) => col.pinned === "left"));
-		const pinnedOffsets = ref({});
-		/**
-		* Смещения липких колонок считаются по **измеренным** ширинам соседей: колонка
-		* может жить на авторазметке, и тогда взять смещение больше неоткуда. Отсюда же
-		* порядок: замер после отрисовки, а не в вычислении.
-		*/
-		function measurePinnedOffsets() {
-			const next = {};
-			const cols = orderedColumns.value;
-			let left = props.selectable && hasPinnedLeft.value ? headerCellEls.get(SELECT_COLUMN_KEY)?.getBoundingClientRect().width ?? 0 : 0;
-			for (const col of cols) {
-				if (col.pinned !== "left") continue;
-				next[String(col.key)] = left;
-				left += 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 += headerCellEls.get(String(col.key))?.getBoundingClientRect().width ?? 0;
-			}
-			pinnedOffsets.value = next;
-		}
-		function measureColumnWidths() {
-			if (!props.resizableColumns) return;
-			const next = {};
-			for (const col of orderedColumns.value) {
-				const key = String(col.key);
-				const width = headerCellEls.get(key)?.getBoundingClientRect().width;
-				if (width) next[key] = Math.round(width);
-			}
-			measuredColumnWidths.value = 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) {
-			if (col.pinned === "left") return orderedColumns.value[index + 1]?.pinned === "left" ? "" : columnPinnedLeftEdgeClass;
-			if (col.pinned === "right") return orderedColumns.value[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 = headerCellEls.get(SELECT_COLUMN_KEY) ?? headerCellEls.get(columnKeys.value[0]);
-			if (el?.parentElement) layoutObserver.observe(el.parentElement);
-		});
-		onUnmounted(() => {
-			layoutObserver?.disconnect();
-			layoutObserver = null;
-		});
-		watch(() => [
-			orderedColumns.value,
-			columnWidths.value,
-			props.loading,
-			props.rows.length
-		], () => void nextTick(measureLayout));
-		/**
-		* Живой регион существует с первого рендера и пуст, пока объявлять нечего.
-		* Регион, который появляется уже с текстом, часть 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 internalSelected = ref([]);
-		const isSelectedControlled = computed(() => props.selected !== void 0);
-		const selectedKeys = computed(() => new Set(props.selected ?? internalSelected.value));
-		function isRowSelectable(row) {
-			return props.selectableRow ? props.selectableRow(row) : true;
-		}
-		function isRowSelected(row) {
-			return selectedKeys.value.has(rowKeyValue(row));
-		}
-		/** «Выбрать все» работает по видимым и выбираемым строкам — они же считают состояние шапки. */
-		const selectableRows = computed(() => sortedRows.value.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];
-			emit("update:selected", [...next]);
-		}
-		function toggleRow(row) {
-			if (!isRowSelectable(row)) return;
-			const key = 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(rowKeyValue(row));
-				emitSelected(next);
-				return;
-			}
-			for (const row of selectableRows.value) next.add(rowKeyValue(row));
-			emitSelected(next);
-		}
-		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);
-		}
-		const scrollTo = (options) => {
-			scrollEl()?.scrollTo(options);
-		};
-		function clearSort() {
-			applySort("", "asc");
-		}
-		__expose({
-			/** Прокрутить к строке по её ключу. `false` — строки нет в DOM. */
-			scrollToRow,
-			/** Прокрутить скролл-контейнер таблицы. */
-			scrollTo,
-			/** Снять сортировку (эквивалент третьего состояния). */
-			clearSort,
-			/** Отметить/снять все выбираемые строки. */
-			toggleAll
-		});
-		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
-				}, [__props.selectable ? (openBlock(), createElementBlock("th", {
-					key: 0,
-					ref: (el) => registerEl(unref(headerCellEls), SELECT_COLUMN_KEY, el),
-					class: normalizeClass(["text-left", [
-						selectColumnClass.value,
-						cellClass.value,
-						hasPinnedLeft.value ? unref(columnPinnedClass) : ""
-					]]),
-					style: normalizeStyle(hasPinnedLeft.value ? { left: "0px" } : void 0),
-					scope: "col"
-				}, [createVNode(GrCheckbox_default, {
-					"data-gr-datatable-select-all": "",
-					"model-value": allSelected.value,
-					indeterminate: someSelected.value,
-					size: checkboxSize.value,
-					disabled: __props.loading || selectableRows.value.length === 0,
-					"aria-label": unref(t)("gr.dataTable.selectAll", "Select all rows"),
-					"onUpdate:modelValue": toggleAll
-				}, null, 8, [
-					"model-value",
-					"indeterminate",
-					"size",
-					"disabled",
-					"aria-label"
-				])], 6)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(orderedColumns.value, (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" : "",
-							draggingColumnKey.value === String(col.key) ? unref(columnDraggingClass) : "",
-							columnDropClass(colIndex),
-							...pinnedCellClass(col, colIndex)
-						]]),
-						"data-column-key": col.key,
-						style: normalizeStyle({
-							...columnWidthStyle(widthOf(col)),
-							...pinnedStyleOf(col)
-						}),
-						"aria-sort": 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) => onColumnHandleKeydown($event, String(col.key)),
-						onFocus: ($event) => unref(columnRoving).setActive(String(col.key)),
-						onClick: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop"]))
-					}, [createElementVNode("span", {
-						class: normalizeClass(unref(columnHandleIconClass)),
-						"aria-hidden": "true"
-					}, null, 2)], 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) => 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, [currentSortKey.value === col.key && currentSortDir.value === "asc" ? (openBlock(), createBlock(GrIcon_default, {
-							key: 0,
-							size: sortIconSize.value
-						}, {
-							default: withCtx(() => [createVNode(unref(arrow_up_default))]),
-							_: 1
-						}, 8, ["size"])) : currentSortKey.value === col.key && currentSortDir.value === "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": resizerValue(col),
-						"aria-valuemin": MIN_COLUMN_WIDTH,
-						"aria-valuetext": `${resizerValue(col)}px`,
-						onPointerdown: ($event) => onResizerPointerDown($event, String(col.key)),
-						onKeydown: ($event) => onResizerKeydown($event, String(col.key)),
-						onDblclick: ($event) => resetColumnWidth(String(col.key)),
-						onClick: _cache[1] || (_cache[1] = withModifiers(() => {}, ["stop"]))
-					}, [createElementVNode("span", {
-						class: normalizeClass([
-							unref(columnResizerLineClass),
-							unref(columnResizerHoverClass),
-							resizingKey.value === 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, [createElementVNode("span", {
-					class: normalizeClass(["i-lucide-loader-circle block animate-spin", spinnerClass.value]),
-					"aria-hidden": "true"
-				}, null, 2), 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("tr", mergeProps({
-							key: rowKeyValue(row),
-							ref_for: true,
-							ref: (el) => __props.virtual && unref(virtualizer).measure(index, el),
-							class: ["border-t border-[var(--gr-brd)]", [isRowSelected(row) ? unref(rowSelectedClass) : "", rowClassName(row, index)]],
-							"data-gr-datatable-row": "",
-							"data-row-key": rowKeyValue(row),
-							"data-selected": __props.selectable && isRowSelected(row) ? "true" : void 0,
-							"aria-rowindex": ariaRowIndex(index)
-						}, { ref_for: true }, __props.rowProps?.(row, index), { onClick: ($event) => onRowClick(row, index, $event) }), [__props.selectable ? (openBlock(), createElementBlock("td", {
-							key: 0,
-							class: normalizeClass(["text-left", [
-								selectColumnClass.value,
-								cellClass.value,
-								hasPinnedLeft.value ? unref(columnPinnedClass) : "",
-								hasPinnedLeft.value && isRowSelected(row) ? unref(rowSelectedClass) : ""
-							]]),
-							style: normalizeStyle(hasPinnedLeft.value ? { left: "0px" } : void 0)
-						}, [isRowSelectable(row) ? (openBlock(), createBlock(GrCheckbox_default, {
-							key: 0,
-							"data-gr-datatable-select-row": "",
-							"model-value": isRowSelected(row),
-							size: checkboxSize.value,
-							"aria-label": unref(t)("gr.dataTable.selectRow", "Select row"),
-							onClick: _cache[2] || (_cache[2] = withModifiers(() => {}, ["stop"])),
-							"onUpdate:modelValue": ($event) => toggleRow(row)
-						}, null, 8, [
-							"model-value",
-							"size",
-							"aria-label",
-							"onUpdate:modelValue"
-						])) : createCommentVNode("", true)], 6)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(orderedColumns.value, (col, colIndex) => {
-							return openBlock(), createElementBlock("td", {
-								key: col.key,
-								class: normalizeClass([
-									cellClass.value,
-									cellAlign(col),
-									...pinnedCellClass(col, colIndex),
-									col.pinned && isRowSelected(row) ? unref(rowSelectedClass) : ""
-								]),
-								style: normalizeStyle({
-									...columnWidthStyle(widthOf(col)),
-									...pinnedStyleOf(col)
-								})
-							}, [renderSlot(_ctx.$slots, `cell-${col.key}`, {
-								row,
-								index
-							}, () => [createElementVNode("span", null, toDisplayString(cellValue(row, col.key)), 1)])], 6);
-						}), 128))], 16, _hoisted_17);
-					}), 128)),
-					__props.virtual && spacerAfter.value > 0 ? (openBlock(), createElementBlock("tr", _hoisted_18, [createElementVNode("td", {
-						colspan: totalColumns.value,
-						style: normalizeStyle({
-							height: `${spacerAfter.value}px`,
-							padding: "0",
-							border: "0"
-						})
-					}, null, 12, _hoisted_19)])) : createCommentVNode("", true)
-				], 64))]),
-				_: 2
-			}, [_ctx.$slots.footer ? {
-				name: "footer",
-				fn: withCtx(() => [renderSlot(_ctx.$slots, "footer")]),
-				key: "0"
-			} : void 0]), 1040);
-		};
-	}
-});
-//#endregion
-export { sortRows as i, compareCells as n, isEmptyCell as r, GrDataTable_default as t };