@shtabapp/ui-kit 1.84.0 → 1.85.1

package/dist/components/STable/STable.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1,1355 @@
+const require_SButton_types = require("../SButton/SButton.types.cjs");
+const require_SButton = require("../SButton/SButton.vue.cjs");
+const require_types = require("../../composables/connectedPosition/types.cjs");
+const require_SDropdown = require("../SDropdown/SDropdown.vue.cjs");
+const require_SDropdownMenu = require("../SDropdownMenu/SDropdownMenu.vue.cjs");
+const require_useSListEndReached = require("../../composables/useSListEndReached.cjs");
+const require_SToggle_types = require("../SToggle/SToggle.types.cjs");
+const require_SToggle = require("../SToggle/SToggle.vue.cjs");
+const require_STable_types = require("./STable.types.cjs");
+const require_tableSizes = require("./constants/tableSizes.cjs");
+const require_STableCheckbox = require("./parts/STableCheckbox.vue.cjs");
+const require_STableContentRow = require("./parts/STableContentRow.vue.cjs");
+const require_useTableColumns = require("./utils/useTableColumns.cjs");
+const require_useTableGridFocus = require("./utils/useTableGridFocus.cjs");
+const require_STableGroupRow = require("./parts/STableGroupRow.vue.cjs");
+const require_STableHeaderCell = require("./parts/STableHeaderCell.vue.cjs");
+const require_STablePlaceholderRow = require("./parts/STablePlaceholderRow.vue.cjs");
+const require_useFlatTableRows = require("./utils/useFlatTableRows.cjs");
+const require_STableRow = require("./parts/STableRow.vue.cjs");
+const require_STableSkeletonRow = require("./parts/STableSkeletonRow.vue.cjs");
+const require_useTableColumnDnd = require("./utils/useTableColumnDnd.cjs");
+const require_useTableCellPlans = require("./utils/useTableCellPlans.cjs");
+const require_useTableColumnResize = require("./utils/useTableColumnResize.cjs");
+const require_useTableGridKeyboard = require("./utils/useTableGridKeyboard.cjs");
+const require_useTableRowDnd = require("./utils/useTableRowDnd.cjs");
+const require_useTableRenderEntries = require("./utils/useTableRenderEntries.cjs");
+const require_useTableSelection = require("./utils/useTableSelection.cjs");
+const require_useTableServiceRows = require("./utils/useTableServiceRows.cjs");
+const require_useTableSorting = require("./utils/useTableSorting.cjs");
+const require_useTableRowHydration = require("./utils/useTableRowHydration.cjs");
+const require_useTableStickyRows = require("./utils/useTableStickyRows.cjs");
+const require_useTableStyleVars = require("./utils/useTableStyleVars.cjs");
+const require_useTableVirtualRows = require("./utils/useTableVirtualRows.cjs");
+let vue = require("vue");
+let _shtabapp_ui_kit_primitives = require("@shtabapp/ui-kit-primitives");
+let _vueuse_core = require("@vueuse/core");
+//#region src/components/STable/STable.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"role",
+	"aria-rowcount",
+	"aria-colcount",
+	"aria-busy"
+];
+var _hoisted_2 = { class: "s-ui-table__head" };
+var _hoisted_3 = {
+	class: "s-ui-table__head-row",
+	"aria-rowindex": 1
+};
+var _hoisted_4 = {
+	key: 0,
+	class: "s-ui-table__header-cell s-ui-table__filler-cell",
+	role: "presentation"
+};
+var _hoisted_5 = [
+	"id",
+	"data-column-key",
+	"data-section",
+	"aria-colindex",
+	"aria-sort",
+	"tabindex"
+];
+var _hoisted_6 = {
+	key: 2,
+	class: "s-ui-table__columns-manager"
+};
+var _hoisted_7 = { class: "s-ui-table__columns-item-main" };
+var _hoisted_8 = { class: "s-ui-table__columns-item-title" };
+var _hoisted_9 = [
+	"aria-label",
+	"aria-valuenow",
+	"aria-valuemin",
+	"aria-valuemax",
+	"aria-valuetext",
+	"onPointerdown",
+	"onKeydown",
+	"onDblclick"
+];
+var _hoisted_10 = { class: "s-ui-table__body" };
+var _hoisted_11 = {
+	key: 0,
+	class: "s-ui-table__empty-row",
+	"aria-rowindex": 2
+};
+var _hoisted_12 = ["colspan"];
+var _hoisted_13 = { class: "s-ui-table__empty-content" };
+var _hoisted_14 = { class: "s-ui-table__empty-text" };
+var _hoisted_15 = {
+	key: 0,
+	class: "s-ui-table__spacer",
+	"aria-hidden": "true"
+};
+var _hoisted_16 = ["colspan"];
+var _hoisted_17 = {
+	key: 0,
+	class: "s-ui-table__foot"
+};
+var _hoisted_18 = ["aria-rowindex"];
+var _hoisted_19 = {
+	key: 0,
+	class: "s-ui-table__aggregate-cell s-ui-table__filler-cell",
+	role: "presentation"
+};
+var _hoisted_20 = [
+	"id",
+	"aria-colindex",
+	"data-column-key",
+	"data-section",
+	"tabindex"
+];
+var _hoisted_21 = {
+	key: 1,
+	class: "s-ui-table__aggregate-text"
+};
+var STable_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
+	__name: "STable",
+	props: /*@__PURE__*/ (0, vue.mergeModels)({
+		items: {},
+		columns: {},
+		itemKey: {
+			type: [String, Function],
+			default: "id"
+		},
+		childrenKey: { default: "children" },
+		groupRow: { type: [String, Function] },
+		groupRowSticky: {
+			type: Boolean,
+			default: true
+		},
+		columnsManagerBodySticky: {
+			type: Boolean,
+			default: true
+		},
+		groupTotalKey: {},
+		groupContentColumnKey: {},
+		disabledKey: {},
+		selectable: {
+			type: Boolean,
+			default: false
+		},
+		cascadeSelection: {
+			type: Boolean,
+			default: false
+		},
+		isItemSelectable: { type: Function },
+		columnsManageable: { type: Boolean },
+		columnsManagerWidth: { default: () => 32 },
+		rowState: { type: Function },
+		rowColor: { type: Function },
+		expandColumnKey: {},
+		expandOnClick: {
+			type: Boolean,
+			default: false
+		},
+		treeIndent: { default: () => 18 },
+		depthFooter: {},
+		creationRow: {
+			type: Boolean,
+			default: false
+		},
+		creationContentColumnKey: {},
+		footerValues: {},
+		virtual: {
+			type: Boolean,
+			default: true
+		},
+		rowHeightMode: { default: () => require_STable_types.ESTableRowHeightMode.AUTO },
+		estimateRowSize: { default: () => 40 },
+		overscan: { default: () => 8 },
+		height: {},
+		maxHeight: {},
+		endReachedDistance: { default: 0 },
+		canLoadMore: { type: Function },
+		loading: {
+			type: Boolean,
+			default: false
+		},
+		loadingMore: {
+			type: Boolean,
+			default: false
+		},
+		skeletonRowCount: { default: () => 8 },
+		hasMoreChildrenKey: {},
+		loadingMoreChildrenKeys: { default: () => [] },
+		loadMoreContentColumnKey: {},
+		rowsDraggable: {
+			type: Boolean,
+			default: false
+		},
+		rowsDragMode: {},
+		isRowDraggable: { type: Function },
+		dragExpandDelayMs: { default: () => 500 },
+		dragInsideDelayMs: { default: () => require_tableSizes.TABLE_DROP_INSIDE_DELAY_MS },
+		columnsResizable: {
+			type: Boolean,
+			default: true
+		},
+		columnsDraggable: {
+			type: Boolean,
+			default: true
+		},
+		columnMenu: {
+			type: Boolean,
+			default: true
+		},
+		scrollSeekPlaceholders: {
+			type: Boolean,
+			default: true
+		},
+		rowClass: { type: Function },
+		rowStyle: { type: Function }
+	}, {
+		"modelValue": {},
+		"modelModifiers": {},
+		"selected": { default: () => [] },
+		"selectedModifiers": {},
+		"expanded": { default: () => [] },
+		"expandedModifiers": {},
+		"columnOrder": {},
+		"columnOrderModifiers": {},
+		"columnWidths": {},
+		"columnWidthsModifiers": {},
+		"hiddenColumns": {},
+		"hiddenColumnsModifiers": {},
+		"sortState": { default: () => [] },
+		"sortStateModifiers": {}
+	}),
+	emits: /*@__PURE__*/ (0, vue.mergeModels)([
+		"rowClick",
+		"rowContextMenu",
+		"cellClick",
+		"sortChange",
+		"endReached",
+		"loadMoreChildren",
+		"depthFooterClick",
+		"groupMenuOpen",
+		"columnResizeEnd",
+		"columnReorder",
+		"rowsReorder",
+		"rowsDrop"
+	], [
+		"update:modelValue",
+		"update:selected",
+		"update:expanded",
+		"update:columnOrder",
+		"update:columnWidths",
+		"update:hiddenColumns",
+		"update:sortState"
+	]),
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const modelValue = (0, vue.useModel)(__props, "modelValue");
+		const selected = (0, vue.useModel)(__props, "selected");
+		const expanded = (0, vue.useModel)(__props, "expanded");
+		const columnOrder = (0, vue.useModel)(__props, "columnOrder");
+		const columnWidths = (0, vue.useModel)(__props, "columnWidths");
+		const hiddenColumns = (0, vue.useModel)(__props, "hiddenColumns");
+		const sortState = (0, vue.useModel)(__props, "sortState");
+		const emit = __emit;
+		const slots = (0, vue.useSlots)();
+		const { t } = (0, _shtabapp_ui_kit_primitives.useUiKitI18n)();
+		const tableInstanceId = (0, vue.useId)();
+		const scrollElementRef = (0, vue.useTemplateRef)("scrollElementRef");
+		const tableElementRef = (0, vue.useTemplateRef)("tableElementRef");
+		const gridExitRef = (0, vue.useTemplateRef)("gridExitRef");
+		const tableRootRef = (0, vue.useTemplateRef)("tableRootRef");
+		const { width: scrollClientWidth, height: scrollClientHeight } = (0, _vueuse_core.useElementSize)(scrollElementRef);
+		const { primaryColumnKey, columnDescriptors, columnCssVars, totalWidth, columnCount } = require_useTableColumns.useTableColumns({
+			columns: () => __props.columns,
+			columnOrder,
+			columnWidths,
+			hiddenColumns,
+			hasIndicator: () => Boolean(slots.indicator),
+			hasCheckbox: () => __props.selectable,
+			hasRightEdge: () => Boolean(slots["right-edge"]),
+			hasColumnsManager: () => __props.columnsManageable,
+			columnsManagerWidth: () => __props.columnsManagerWidth,
+			columnsResizable: () => __props.columnsResizable,
+			columnsDraggable: () => __props.columnsDraggable,
+			viewportWidth: () => scrollClientWidth.value
+		});
+		const { treeIndex, snapshot, flatRows, toggleExpanded, expandAll, collapseAll } = require_useFlatTableRows.useFlatTableRows({
+			items: () => __props.items,
+			itemKey: () => __props.itemKey,
+			childrenKey: () => __props.childrenKey,
+			groupRow: () => __props.groupRow,
+			expanded,
+			depthFooter: () => __props.depthFooter,
+			hasMoreChildrenKey: () => __props.hasMoreChildrenKey
+		});
+		const { leadingDescriptors, trailingDescriptors, headerCells, getStickyCellStyle, getHeaderCellClasses, leadingCellPlans, trailingCellPlans, rowCellPlans } = require_useTableCellPlans.useTableCellPlans({
+			columnDescriptors,
+			hasTreeStructure: () => hasTreeStructure.value,
+			expandColumnKey: () => __props.expandColumnKey,
+			primaryColumnKey
+		});
+		const renderedColumnCount = (0, vue.computed)(() => {
+			return columnDescriptors.value.length + 1;
+		});
+		const hasTreeStructure = (0, vue.computed)(() => {
+			return treeIndex.value.expandableKeys.length > 0;
+		});
+		const tableRole = (0, vue.computed)(() => {
+			return hasTreeStructure.value ? "treegrid" : "grid";
+		});
+		const ariaRowCount = (0, vue.computed)(() => {
+			return flatRows.value.length + 1 + (__props.creationRow ? 1 : 0) + (__props.footerValues ? 1 : 0);
+		});
+		const virtualEnabled = (0, vue.computed)(() => {
+			return __props.virtual;
+		});
+		/** Модификаторы корня: фиксированные высоты строк режут контент выше строки. */
+		const rootClasses = (0, vue.computed)(() => {
+			return {
+				"s-ui-table--rows-fixed": __props.rowHeightMode === require_STable_types.ESTableRowHeightMode.FIXED,
+				"s-ui-table--columns-manager-body-static": !__props.columnsManagerBodySticky
+			};
+		});
+		const tfootBarStackHeight = (0, vue.computed)(() => {
+			let stackHeight = 0;
+			if (__props.footerValues) stackHeight += 40;
+			if (__props.creationRow) stackHeight += 40;
+			return stackHeight;
+		});
+		let rawFlatRows = [];
+		(0, vue.watch)(flatRows, (rows) => {
+			rawFlatRows = rows;
+		}, {
+			flush: "sync",
+			immediate: true
+		});
+		const { windowIndexes, uiTotalSize, modelScrollOffset, scrollToIndex, visibleRange, getRowOffset, getRowUiOffset, getRowIndexAtOffset, measureWindowRows, measureNewRows } = require_useTableVirtualRows.useTableVirtualRows({
+			rowCount: () => flatRows.value.length,
+			enabled: virtualEnabled,
+			autoMeasure: () => __props.rowHeightMode === require_STable_types.ESTableRowHeightMode.AUTO,
+			estimateRowSize: () => __props.estimateRowSize,
+			estimateRowSizeByIndex: void 0,
+			overscan: () => __props.overscan,
+			scrollElement: scrollElementRef,
+			getRowKey: (rowIndex) => rawFlatRows[rowIndex]?.key ?? rowIndex,
+			rowsVersion: flatRows,
+			viewportHeight: () => scrollClientHeight.value,
+			extraHeight: () => 40 + tfootBarStackHeight.value,
+			headerHeight: () => 40
+		});
+		const { isRowHydrated, hydratedKeys } = require_useTableRowHydration.useTableRowHydration({
+			windowIndexes,
+			visibleRange,
+			getRowKey: (rowIndex) => rawFlatRows[rowIndex]?.key,
+			rowsVersion: flatRows,
+			pinnedRowKey: () => modelValue.value,
+			enabled: () => virtualEnabled.value && __props.scrollSeekPlaceholders
+		});
+		(0, vue.watch)(hydratedKeys, measureNewRows, { flush: "post" });
+		const { resizingColumnKey, handleResizeHandlePointerdown, handleResizeHandleKeydown, handleResizeHandleDblclick } = require_useTableColumnResize.useTableColumnResize({
+			tableRootElement: tableRootRef,
+			scrollElement: scrollElementRef,
+			columnDescriptors,
+			columnWidths,
+			enabled: () => __props.columnsResizable,
+			onResizeEnd: (columnKey, committedWidth) => {
+				emit("columnResizeEnd", {
+					key: columnKey,
+					width: committedWidth
+				});
+			},
+			remeasureRows: () => {
+				measureWindowRows();
+			}
+		});
+		const resolvedRowsDragMode = (0, vue.computed)(() => {
+			if (__props.rowsDragMode) return __props.rowsDragMode;
+			return hasTreeStructure.value ? require_STable_types.ESTableRowsDragMode.TREE : require_STable_types.ESTableRowsDragMode.FLAT;
+		});
+		/** Итоговый порядок data-колонок после переноса source к target (edge left/right). */
+		const handleColumnReorder = (sourceKey, targetKey, edge) => {
+			const baseOrder = columnOrder.value?.length ? [...columnOrder.value] : __props.columns.map((tableColumn) => tableColumn.key);
+			__props.columns.forEach((tableColumn) => {
+				if (!baseOrder.includes(tableColumn.key)) baseOrder.push(tableColumn.key);
+			});
+			const withoutSource = baseOrder.filter((orderKey) => orderKey !== sourceKey);
+			const targetPosition = withoutSource.indexOf(targetKey);
+			if (targetPosition === -1) return;
+			const insertIndex = edge === "left" ? targetPosition : targetPosition + 1;
+			withoutSource.splice(insertIndex, 0, sourceKey);
+			columnOrder.value = withoutSource;
+			emit("columnReorder", {
+				key: sourceKey,
+				toIndex: insertIndex,
+				order: withoutSource
+			});
+		};
+		const { registerColumnHeaderElement, draggingColumnKey, dropLineStyle: columnDropLineStyle } = require_useTableColumnDnd.useTableColumnDnd({
+			tableId: tableInstanceId,
+			tableRootElement: tableRootRef,
+			enabled: () => __props.columnsDraggable,
+			columnDescriptors,
+			onReorder: handleColumnReorder,
+			isResizing: () => Boolean(resizingColumnKey.value)
+		});
+		const registerColumnDndRef = (refElement, columnKey) => {
+			if (refElement instanceof Element || refElement === null) registerColumnHeaderElement(columnKey, refElement);
+		};
+		const { registerRowElement: registerRowDndElement, draggingRowKey, dropIndicator: rowDropIndicator } = require_useTableRowDnd.useTableRowDnd({
+			tableId: tableInstanceId,
+			enabled: () => __props.rowsDraggable,
+			dragMode: resolvedRowsDragMode,
+			snapshot,
+			scrollElement: scrollElementRef,
+			isRowDraggable: () => __props.isRowDraggable,
+			dragExpandDelayMs: () => __props.dragExpandDelayMs,
+			dragInsideDelayMs: () => __props.dragInsideDelayMs,
+			isExpanded: (rowKey) => expanded.value.includes(rowKey),
+			onHoverExpand: (rowKey) => {
+				toggleExpanded(rowKey);
+			},
+			onReorder: (payload) => {
+				emit("rowsReorder", payload);
+			},
+			onTreeDrop: (payload) => {
+				emit("rowsDrop", payload);
+			},
+			resolveRowPreviewTitle: (flatRow) => {
+				return getGroupTitle(flatRow) ?? flatRow.key;
+			}
+		});
+		const registerRowDndRef = (refElement) => {
+			if (refElement instanceof Element || refElement === null) registerRowDndElement(refElement);
+		};
+		const getRowDropPosition = (rowKey) => {
+			const indicator = rowDropIndicator.value;
+			if (!indicator || indicator.targetKey !== rowKey) return;
+			if (indicator.action === require_STable_types.ESTableDropAction.CHILD) return "inside";
+			return indicator.action === require_STable_types.ESTableDropAction.BEFORE ? "before" : "after";
+		};
+		const { activeGroupRowIndex, activeDepthFooterRowIndex, activeDepthFooterRowIndexes, leavingDepthFooterRowIndex, slidingDepthFooterRowIndexes, farDepthFooterRowIndexes } = require_useTableStickyRows.useTableStickyRows({
+			snapshot,
+			visibleRange,
+			groupRowSticky: () => __props.groupRowSticky,
+			depthFooterSticky: () => __props.depthFooter?.sticky !== false,
+			bottomVisibleRowIndex: (0, vue.computed)(() => {
+				if (!virtualEnabled.value || scrollClientHeight.value === 0) return;
+				const contentOffset = modelScrollOffset.value + scrollClientHeight.value - 40 - tfootBarStackHeight.value;
+				return getRowIndexAtOffset(Math.max(0, contentOffset));
+			}),
+			getRowOffset
+		});
+		const { renderEntries } = require_useTableRenderEntries.useTableRenderEntries({
+			flatRows,
+			virtualEnabled,
+			windowIndexes,
+			uiTotalSize,
+			getRowUiOffset,
+			activeGroupRowIndex,
+			activeDepthFooterRowIndexes,
+			leavingDepthFooterRowIndex,
+			slidingDepthFooterRowIndexes,
+			farDepthFooterRowIndexes,
+			activeRowIndex: (0, vue.computed)(() => {
+				if (!modelValue.value) return;
+				return snapshot.value.getRowIndexByKey(modelValue.value);
+			})
+		});
+		const showEmptyState = (0, vue.computed)(() => {
+			return !__props.loading && flatRows.value.length === 0;
+		});
+		const { rootStyle, scrollStyle, tableStyle } = require_useTableStyleVars.useTableStyleVars({
+			tfootBarStackHeight,
+			hasFooterValues: () => Boolean(__props.footerValues),
+			scrollClientWidth: () => scrollClientWidth.value,
+			columnCssVars,
+			totalWidth,
+			height: () => __props.height,
+			maxHeight: () => __props.maxHeight
+		});
+		const { getColumnSortDirection, getColumnSortIndex, applySortCycle, applySortExact, getHeaderAriaSort, getHeaderSlotScope } = require_useTableSorting.useTableSorting({
+			sortState,
+			onSortChange: (sortEntries) => {
+				emit("sortChange", sortEntries);
+			}
+		});
+		const openMenuColumnKey = (0, vue.shallowRef)();
+		const setColumnMenuOpen = (columnKey, open) => {
+			openMenuColumnKey.value = open ? columnKey : void 0;
+		};
+		/** Имя ручки ресайза: без названия колонки все ручки шапки звучат одинаково. */
+		const getResizeHandleLabel = (descriptor) => {
+			const columnTitle = descriptor.column?.title;
+			if (!columnTitle) return t("table.resizeColumn");
+			return t("table.resizeNamedColumn", { title: columnTitle });
+		};
+		const resizeColumnByKeyboard = (descriptor, direction) => {
+			if (!__props.columnsResizable || !descriptor.resizable) return;
+			const nextWidth = Math.min(descriptor.maxWidth ?? Number.POSITIVE_INFINITY, Math.max(descriptor.minWidth, descriptor.width + direction * 8));
+			if (nextWidth === descriptor.width) return;
+			columnWidths.value = {
+				...columnWidths.value,
+				[descriptor.key]: nextWidth
+			};
+			emit("columnResizeEnd", {
+				key: descriptor.key,
+				width: nextWidth
+			});
+		};
+		const columnsMenuOpen = (0, vue.shallowRef)(false);
+		/**
+		* Колонки, которыми управляет кнопка в углу: data-колонки, которые разрешено скрывать.
+		* Главная колонка не участвует — она держит дерево и всегда видима.
+		*/
+		const manageableColumns = (0, vue.computed)(() => {
+			return __props.columns.filter((tableColumn) => {
+				return tableColumn.key !== primaryColumnKey.value && (tableColumn.hideable ?? true);
+			});
+		});
+		const isColumnHidden = (columnKey) => {
+			return (hiddenColumns.value ?? []).includes(columnKey);
+		};
+		const manageableColumnGroups = (0, vue.computed)(() => {
+			const columnEntries = manageableColumns.value.map((manageableColumn) => {
+				const hidden = isColumnHidden(manageableColumn.key);
+				return {
+					column: manageableColumn,
+					hidden,
+					classes: { "s-ui-table__columns-item--hidden": hidden }
+				};
+			});
+			return [columnEntries.filter((columnEntry) => !columnEntry.hidden), columnEntries.filter((columnEntry) => columnEntry.hidden)].filter((columnGroup) => columnGroup.length > 0);
+		});
+		const toggleColumnHidden = (columnKey) => {
+			const hiddenKeys = new Set(hiddenColumns.value ?? []);
+			if (hiddenKeys.has(columnKey)) hiddenKeys.delete(columnKey);
+			else hiddenKeys.add(columnKey);
+			hiddenColumns.value = [...hiddenKeys];
+		};
+		const hideColumnByKey = (columnKey) => {
+			const hiddenKeys = new Set(hiddenColumns.value ?? []);
+			hiddenKeys.add(columnKey);
+			hiddenColumns.value = [...hiddenKeys];
+		};
+		const selection = require_useTableSelection.useTableSelection({
+			selected,
+			cascade: () => __props.cascadeSelection,
+			treeIndex,
+			groupRow: () => __props.groupRow,
+			disabledKey: () => __props.disabledKey,
+			isItemSelectable: () => __props.isItemSelectable
+		});
+		const headerCheckState = selection.headerCheckState;
+		const isRowSelected = (rowKey) => {
+			return selection.isSelected(rowKey);
+		};
+		const isRowIndeterminate = (rowKey) => {
+			return __props.cascadeSelection && selection.getCheckState(rowKey) === require_STable_types.ESTableCheckState.INDETERMINATE;
+		};
+		const toggleRowSelected = (rowKey) => {
+			selection.toggleRow(rowKey);
+		};
+		const isRowDisabled = (flatRow) => {
+			return require_useFlatTableRows.resolveTableBooleanField(flatRow.item, __props.disabledKey);
+		};
+		/**
+		* Ключи кэша строки для `v-memo`. Длина массива обязана быть постоянной, поэтому
+		* значения строки берутся через `flatRow?.` и не выпадают на спейсерах.
+		*
+		* Кроме полей самой строки сюда входят пропсы, которые меняют её содержимое, но в
+		* данных строки не лежат (loadingMoreChildrenKeys, treeIndent, rowClass, rowState,
+		* rowColor, selectable, …): без них кэш заморозил бы, например, спиннер «Показать
+		* ещё» при смене ключей догрузки.
+		*/
+		const buildRowMemoKeys = ({ row: flatRow, spacerHeight, rowHeight, stuckTop, stuckBottom, stuckBottomLeaving, stuckBottomSliding, stuckBottomCoverHeight, stuckBottomFar }, placeholder) => {
+			return [
+				flatRow ?? spacerHeight,
+				flatRow?.index,
+				flatRow?.expanded,
+				flatRow?.item,
+				flatRow?.kind,
+				flatRow?.hasChildren,
+				flatRow?.depth,
+				flatRow?.parentKey,
+				flatRow ? isRowSelected(flatRow.key) : false,
+				flatRow ? isRowIndeterminate(flatRow.key) : false,
+				flatRow ? modelValue.value === flatRow.key : false,
+				flatRow ? getRowFocusColumnKey(flatRow.key) : void 0,
+				flatRow ? draggingRowKey.value === flatRow.key : false,
+				flatRow ? getRowDropPosition(flatRow.key) : void 0,
+				rowHeight,
+				stuckTop,
+				stuckBottom,
+				stuckBottomLeaving,
+				stuckBottomSliding,
+				stuckBottomCoverHeight,
+				stuckBottomFar,
+				columnDescriptors.value,
+				depthFooterColumnKey.value,
+				loadMoreColumnKey.value,
+				placeholder,
+				__props.loadingMoreChildrenKeys,
+				__props.treeIndent,
+				__props.rowClass,
+				__props.rowStyle,
+				__props.rowState,
+				__props.rowColor,
+				__props.selectable,
+				__props.cascadeSelection,
+				__props.rowsDraggable,
+				hasTreeStructure.value
+			];
+		};
+		/** Высота уходящего футера — переменная обрезки для следующего футера под ним. */
+		const getStuckCoverStyle = (coverHeight) => {
+			if (coverHeight === void 0) return;
+			return { "--s-ui-table-stuck-cover-height": `${coverHeight}px` };
+		};
+		/**
+		* Записи рендера с готовыми ключами кэша. Отдельный проход нужен из-за инструментов:
+		* выражения внутри `v-memo` vue-tsc не проверяет, поэтому хелпер, вызванный только
+		* оттуда, считался бы неиспользованным. Здесь он вызывается из скрипта.
+		*/
+		const renderRows = (0, vue.computed)(() => {
+			return renderEntries.value.map((entry) => {
+				const placeholder = entry.row?.kind === require_STable_types.ESTableRowKind.ROW && !isRowHydrated(entry.row.key);
+				return {
+					...entry,
+					placeholder,
+					memoKeys: buildRowMemoKeys(entry, placeholder)
+				};
+			});
+		});
+		const forwardedCellSlotNames = (0, vue.computed)(() => {
+			return Object.keys(slots).filter((slotName) => {
+				return slotName.startsWith("cell:");
+			});
+		});
+		const buildRowDomId = (rowKey) => {
+			return `s-ui-table-${tableInstanceId}-row-${rowKey}`;
+		};
+		const getRowSlotScope = (flatRow) => {
+			return {
+				...flatRow,
+				selected: isRowSelected(flatRow.key),
+				indeterminate: false,
+				active: modelValue.value === flatRow.key,
+				disabled: isRowDisabled(flatRow),
+				group: flatRow.kind === require_STable_types.ESTableRowKind.GROUP,
+				toggleExpanded: () => {
+					toggleExpanded(flatRow.key);
+				},
+				toggleSelected: () => {
+					toggleRowSelected(flatRow.key);
+				}
+			};
+		};
+		const { depthFooterColumnKey, groupColumnKey, creationColumnKey, loadMoreColumnKey, getGroupCount, getGroupTotal, getGroupTitle, getDepthIndentStyle, emitDepthFooterClick, getDepthFooterSlotScope, isLoadMoreRowLoading, emitLoadMoreChildren, getLoadMoreSlotScope, getFooterValueText, getFooterToneClass, getFooterSlotScope } = require_useTableServiceRows.useTableServiceRows({
+			columns: () => __props.columns,
+			primaryColumnKey,
+			treeNodeByKey: (0, vue.computed)(() => treeIndex.value.nodeByKey),
+			groupTotalKey: () => __props.groupTotalKey,
+			depthFooter: () => __props.depthFooter,
+			groupContentColumnKey: () => __props.groupContentColumnKey,
+			creationContentColumnKey: () => __props.creationContentColumnKey,
+			loadMoreContentColumnKey: () => __props.loadMoreContentColumnKey,
+			treeIndent: () => __props.treeIndent,
+			loadingMoreChildrenKeys: () => __props.loadingMoreChildrenKeys,
+			footerValues: () => __props.footerValues,
+			stuckDepthFooterRowIndex: activeDepthFooterRowIndex,
+			onDepthFooterClick: (payload) => {
+				emit("depthFooterClick", payload);
+			},
+			onLoadMoreChildren: (payload) => {
+				emit("loadMoreChildren", payload);
+			}
+		});
+		const getGroupSlotScope = (flatRow) => {
+			return {
+				...getRowSlotScope(flatRow),
+				count: getGroupCount(flatRow),
+				total: getGroupTotal(flatRow)
+			};
+		};
+		const handleRowClick = (flatRow, event) => {
+			if (isRowDisabled(flatRow)) return;
+			modelValue.value = flatRow.key;
+			if (__props.expandOnClick && (flatRow.hasChildren || flatRow.kind === require_STable_types.ESTableRowKind.GROUP)) toggleExpanded(flatRow.key);
+			emit("rowClick", {
+				key: flatRow.key,
+				item: flatRow.item,
+				event
+			});
+		};
+		const handleRowContextMenu = (flatRow, event) => {
+			emit("rowContextMenu", {
+				key: flatRow.key,
+				item: flatRow.item,
+				event
+			});
+		};
+		const dataColumnKeySet = (0, vue.computed)(() => {
+			const columnKeys = /* @__PURE__ */ new Set();
+			columnDescriptors.value.forEach((descriptor) => {
+				if (descriptor.column) columnKeys.add(descriptor.key);
+			});
+			return columnKeys;
+		});
+		const handleCellClick = (flatRow, columnKey, event) => {
+			if (!dataColumnKeySet.value.has(columnKey) || isRowDisabled(flatRow)) return;
+			emit("cellClick", {
+				key: flatRow.key,
+				item: flatRow.item,
+				columnKey,
+				event
+			});
+		};
+		const isRowNavigable = (flatRow) => {
+			if (!flatRow) return false;
+			return !isRowDisabled(flatRow);
+		};
+		const keyboardPageSize = (0, vue.computed)(() => {
+			const rowsViewport = scrollClientHeight.value - 40 - tfootBarStackHeight.value;
+			return Math.max(1, Math.floor(rowsViewport / __props.estimateRowSize));
+		});
+		require_useSListEndReached.useSListEndReached(() => scrollElementRef.value, {
+			distance: () => __props.endReachedDistance,
+			canLoadMore: () => __props.canLoadMore?.() ?? true,
+			onEndReached: () => {
+				emit("endReached", { direction: "bottom" });
+			}
+		});
+		const scrollToRow = (rowKey, options) => {
+			const rowIndex = snapshot.value.getRowIndexByKey(rowKey);
+			if (rowIndex === void 0) return;
+			if (virtualEnabled.value) {
+				scrollToIndex(rowIndex, options?.align ?? "auto");
+				return;
+			}
+			document.getElementById(buildRowDomId(rowKey))?.scrollIntoView({ block: options?.align === "center" ? "center" : "nearest" });
+		};
+		/** Идентификатор ячейки грида: по нему модель фокуса находит DOM-узел. */
+		const buildGridCellDomId = (address) => {
+			return `s-ui-table-${tableInstanceId}-cell-${address.section}-${address.rowKey ?? ""}-${address.columnKey}`;
+		};
+		const gridFocus = require_useTableGridFocus.useTableGridFocus({
+			tableRootElement: tableRootRef,
+			tableElement: tableElementRef,
+			exitElement: gridExitRef,
+			scrollElement: scrollElementRef,
+			columnDescriptors,
+			flatRows,
+			snapshot,
+			groupColumnKey,
+			depthFooterColumnKey,
+			loadMoreColumnKey,
+			creationColumnKey,
+			hasCreationRow: () => Boolean(__props.creationRow),
+			hasAggregateRow: () => Boolean(__props.footerValues),
+			isRowNavigable,
+			pageSize: keyboardPageSize,
+			buildCellDomId: buildGridCellDomId,
+			onBodyRowFocused: (rowKey) => {
+				modelValue.value = rowKey;
+			},
+			scrollToRowIndex: (rowIndex) => {
+				const flatRow = flatRows.value[rowIndex];
+				if (flatRow) scrollToRow(flatRow.key);
+			}
+		});
+		/** Префикс id ячеек тела: строки достраивают к нему ключ строки и колонки. */
+		const gridBodyCellIdPrefix = `s-ui-table-${tableInstanceId}-cell-${require_useTableGridFocus.ESTableGridSection.BODY}-`;
+		const gridCreationCellIdPrefix = `s-ui-table-${tableInstanceId}-cell-${require_useTableGridFocus.ESTableGridSection.CREATION}-`;
+		const getRowFocusColumnKey = (rowKey) => {
+			return gridFocus.focusedBodyRowKey.value === rowKey ? gridFocus.focusAddress.value.columnKey : void 0;
+		};
+		/** Колонка roving-фокуса для полос без ключа строки (шапка, tfoot). */
+		const getSectionFocusColumnKey = (section) => {
+			const address = gridFocus.focusAddress.value;
+			return address.section === section ? address.columnKey : void 0;
+		};
+		const getGridCellTabIndex = (section, rowKey, columnKey) => {
+			return gridFocus.getCellTabIndex(section, rowKey, columnKey);
+		};
+		const { handleGridFocusIn, handleGridKeydown } = require_useTableGridKeyboard.useTableGridKeyboard({
+			gridFocus,
+			columnDescriptors,
+			flatRows,
+			expandColumnKey: () => __props.expandColumnKey,
+			primaryColumnKey,
+			groupColumnKey,
+			selectable: () => __props.selectable,
+			openMenuColumnKey,
+			toggleExpanded,
+			toggleRowSelected: (rowKey) => {
+				selection.toggleRow(rowKey);
+			},
+			applySortCycle,
+			setColumnMenuOpen,
+			resizeColumnByKeyboard,
+			onDepthFooterActivate: emitDepthFooterClick,
+			onLoadMoreActivate: emitLoadMoreChildren,
+			onRowActivate: (flatRow, event) => {
+				emit("rowClick", {
+					key: flatRow.key,
+					item: flatRow.item,
+					event
+				});
+			}
+		});
+		const focusNavigation = async () => {
+			gridFocus.focusAddressNow(gridFocus.focusAddress.value);
+			await (0, vue.nextTick)();
+		};
+		const clearSelection = () => {
+			selection.clearSelection();
+		};
+		const getScrollElement = () => {
+			return scrollElementRef.value ?? void 0;
+		};
+		__expose({
+			focusNavigation,
+			scrollToRow,
+			expandAll,
+			collapseAll,
+			clearSelection,
+			getScrollElement
+		});
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+				ref_key: "tableRootRef",
+				ref: tableRootRef,
+				class: (0, vue.normalizeClass)(["s-ui-table", rootClasses.value]),
+				style: (0, vue.normalizeStyle)((0, vue.unref)(rootStyle))
+			}, [
+				(0, vue.createElementVNode)("div", {
+					ref_key: "scrollElementRef",
+					ref: scrollElementRef,
+					class: "s-ui-table__scroll",
+					style: (0, vue.normalizeStyle)((0, vue.unref)(scrollStyle))
+				}, [(0, vue.createElementVNode)("table", {
+					class: "s-ui-table__table",
+					style: (0, vue.normalizeStyle)((0, vue.unref)(tableStyle)),
+					role: tableRole.value,
+					"aria-rowcount": ariaRowCount.value,
+					"aria-colcount": (0, vue.unref)(columnCount),
+					"aria-busy": __props.loading || __props.loadingMore || void 0,
+					ref_key: "tableElementRef",
+					ref: tableElementRef,
+					tabindex: "-1",
+					onKeydown: _cache[5] || (_cache[5] = (...args) => (0, vue.unref)(handleGridKeydown) && (0, vue.unref)(handleGridKeydown)(...args)),
+					onFocusin: _cache[6] || (_cache[6] = (...args) => (0, vue.unref)(handleGridFocusIn) && (0, vue.unref)(handleGridFocusIn)(...args))
+				}, [
+					(0, vue.createElementVNode)("colgroup", null, [
+						((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(leadingDescriptors), (descriptor) => {
+							return (0, vue.openBlock)(), (0, vue.createElementBlock)("col", {
+								key: descriptor.key,
+								style: (0, vue.normalizeStyle)({ width: `var(${descriptor.liveWidthVar}, var(${descriptor.widthVar}))` })
+							}, null, 4);
+						}), 128)),
+						_cache[7] || (_cache[7] = (0, vue.createElementVNode)("col", { class: "s-ui-table__filler-col" }, null, -1)),
+						((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(trailingDescriptors), (descriptor) => {
+							return (0, vue.openBlock)(), (0, vue.createElementBlock)("col", {
+								key: descriptor.key,
+								style: (0, vue.normalizeStyle)({ width: `var(${descriptor.liveWidthVar}, var(${descriptor.widthVar}))` })
+							}, null, 4);
+						}), 128))
+					]),
+					(0, vue.createElementVNode)("thead", _hoisted_2, [(0, vue.createElementVNode)("tr", _hoisted_3, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(headerCells), ({ key: headerKey, descriptor }) => {
+						return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: headerKey }, [!descriptor ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("th", _hoisted_4)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("th", {
+							key: 1,
+							id: buildGridCellDomId({
+								section: (0, vue.unref)(require_useTableGridFocus.ESTableGridSection).HEADER,
+								columnKey: descriptor.key
+							}),
+							ref_for: true,
+							ref: (el) => registerColumnDndRef(el, descriptor.key),
+							class: (0, vue.normalizeClass)(["s-ui-table__header-cell", [(0, vue.unref)(getHeaderCellClasses)(descriptor), { "s-ui-table__header-cell--dragging": (0, vue.unref)(draggingColumnKey) === descriptor.key }]]),
+							style: (0, vue.normalizeStyle)((0, vue.unref)(getStickyCellStyle)(descriptor)),
+							"data-column-key": descriptor.key,
+							"data-section": (0, vue.unref)(require_useTableGridFocus.ESTableGridSection).HEADER,
+							"aria-colindex": descriptor.colIndex,
+							"aria-sort": (0, vue.unref)(getHeaderAriaSort)(descriptor),
+							tabindex: getGridCellTabIndex((0, vue.unref)(require_useTableGridFocus.ESTableGridSection).HEADER, void 0, descriptor.key),
+							scope: "col"
+						}, [descriptor.column ? ((0, vue.openBlock)(), (0, vue.createBlock)(require_STableHeaderCell.default, {
+							key: 0,
+							descriptor,
+							"sort-direction": (0, vue.unref)(getColumnSortDirection)(descriptor.key),
+							"sort-index": (0, vue.unref)(getColumnSortIndex)(descriptor.key),
+							"menu-enabled": __props.columnMenu,
+							"menu-open": openMenuColumnKey.value === descriptor.key,
+							"onUpdate:menuOpen": ($event) => setColumnMenuOpen(descriptor.key, $event),
+							onSortToggle: ($event) => (0, vue.unref)(applySortCycle)(descriptor.key, $event),
+							onSortSet: ($event) => (0, vue.unref)(applySortExact)(descriptor.key, $event),
+							onHide: ($event) => hideColumnByKey(descriptor.key)
+						}, (0, vue.createSlots)({ _: 2 }, [(0, vue.unref)(slots)[`header:${descriptor.key}`] ? {
+							name: "default",
+							fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, `header:${descriptor.key}`, (0, vue.mergeProps)({ ref_for: true }, (0, vue.unref)(getHeaderSlotScope)(descriptor)))]),
+							key: "0"
+						} : void 0, (0, vue.unref)(slots)[`header-menu:${descriptor.key}`] ? {
+							name: "menu",
+							fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, `header-menu:${descriptor.key}`, (0, vue.mergeProps)({ ref_for: true }, (0, vue.unref)(getHeaderSlotScope)(descriptor)))]),
+							key: "1"
+						} : void 0]), 1032, [
+							"descriptor",
+							"sort-direction",
+							"sort-index",
+							"menu-enabled",
+							"menu-open",
+							"onUpdate:menuOpen",
+							"onSortToggle",
+							"onSortSet",
+							"onHide"
+						])) : descriptor.service === (0, vue.unref)(require_useTableColumns.ESTableServiceColumn).CHECKBOX ? ((0, vue.openBlock)(), (0, vue.createBlock)(require_STableCheckbox.default, {
+							key: 1,
+							class: (0, vue.normalizeClass)(["s-ui-table__header-checkbox", { "s-ui-table__header-checkbox--active": (0, vue.unref)(headerCheckState) !== (0, vue.unref)(require_STable_types.ESTableCheckState).UNCHECKED }]),
+							"model-value": (0, vue.unref)(headerCheckState) === (0, vue.unref)(require_STable_types.ESTableCheckState).CHECKED,
+							indeterminate: (0, vue.unref)(headerCheckState) === (0, vue.unref)(require_STable_types.ESTableCheckState).INDETERMINATE,
+							"screen-reader-label": (0, vue.unref)(headerCheckState) === (0, vue.unref)(require_STable_types.ESTableCheckState).CHECKED ? (0, vue.unref)(t)("table.deselectAll") : (0, vue.unref)(t)("table.selectAll"),
+							"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => (0, vue.unref)(selection).toggleSelectAll())
+						}, null, 8, [
+							"class",
+							"model-value",
+							"indeterminate",
+							"screen-reader-label"
+						])) : descriptor.service === (0, vue.unref)(require_useTableColumns.ESTableServiceColumn).COLUMNS_MANAGER ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_6, [(0, vue.createVNode)((0, vue.unref)(require_SDropdown.default), {
+							modelValue: columnsMenuOpen.value,
+							"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => columnsMenuOpen.value = $event),
+							placement: (0, vue.unref)(require_types.ESDropdownPlacement).BOTTOM_END,
+							shift: "",
+							"fit-viewport": ""
+						}, {
+							trigger: (0, vue.withCtx)(({ toggle }) => [(0, vue.createVNode)((0, vue.unref)(require_SButton.default), {
+								class: "s-ui-table__columns-manager-button",
+								appearance: (0, vue.unref)(require_SButton_types.EButtonAppearance).BARE,
+								variant: (0, vue.unref)(require_SButton_types.EButtonVariant).MAIN,
+								size: (0, vue.unref)(require_SButton_types.EButtonSize).SMALL,
+								icon: "tablePlus",
+								"aria-label": (0, vue.unref)(t)("table.manageColumns"),
+								tabindex: "-1",
+								onClick: ($event) => toggle()
+							}, null, 8, [
+								"appearance",
+								"variant",
+								"size",
+								"aria-label",
+								"onClick"
+							])]),
+							content: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(require_SDropdownMenu.default), {
+								class: "s-ui-table__columns-menu",
+								width: 300
+							}, {
+								default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "columns-menu", {
+									columns: manageableColumns.value,
+									isColumnHidden,
+									toggleColumn: toggleColumnHidden
+								}, () => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(manageableColumnGroups.value, (columnGroup, groupIndex) => {
+									return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: groupIndex }, [groupIndex > 0 ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_shtabapp_ui_kit_primitives.SSeparator), {
+										key: 0,
+										class: "s-ui-table__columns-separator"
+									})) : (0, vue.createCommentVNode)("", true), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(columnGroup, (columnEntry) => {
+										return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_SToggle.default), {
+											key: columnEntry.column.key,
+											class: (0, vue.normalizeClass)(["s-ui-table__columns-item", columnEntry.classes]),
+											size: (0, vue.unref)(require_SToggle_types.ESToggleSize).SMALL,
+											"label-placement": (0, vue.unref)(require_SToggle_types.ESToggleLabelPlacement).LEFT,
+											"model-value": !columnEntry.hidden,
+											"onUpdate:modelValue": ($event) => toggleColumnHidden(columnEntry.column.key)
+										}, {
+											default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", _hoisted_7, [columnEntry.column.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_shtabapp_ui_kit_primitives.SIcon), {
+												key: 0,
+												name: columnEntry.column.icon,
+												size: 16
+											}, null, 8, ["name"])) : (0, vue.createCommentVNode)("", true), (0, vue.createElementVNode)("span", _hoisted_8, (0, vue.toDisplayString)(columnEntry.column.title ?? columnEntry.column.key), 1)])]),
+											_: 2
+										}, 1032, [
+											"class",
+											"size",
+											"label-placement",
+											"model-value",
+											"onUpdate:modelValue"
+										]);
+									}), 128))], 64);
+								}), 128))])]),
+								_: 3
+							})]),
+							_: 3
+						}, 8, ["modelValue", "placement"])])) : (0, vue.createCommentVNode)("", true), descriptor.resizable ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
+							key: 3,
+							class: (0, vue.normalizeClass)(["s-ui-table__resize-handle", { "s-ui-table__resize-handle--active": (0, vue.unref)(resizingColumnKey) === descriptor.key }]),
+							role: "separator",
+							"aria-orientation": "vertical",
+							"aria-label": getResizeHandleLabel(descriptor),
+							"aria-valuenow": descriptor.width,
+							"aria-valuemin": descriptor.minWidth,
+							"aria-valuemax": descriptor.maxWidth,
+							"aria-valuetext": (0, vue.unref)(t)("table.columnWidth", { width: String(descriptor.width) }),
+							tabindex: "-1",
+							onPointerdown: ($event) => (0, vue.unref)(handleResizeHandlePointerdown)($event, descriptor.key),
+							onKeydown: ($event) => (0, vue.unref)(handleResizeHandleKeydown)($event, descriptor.key),
+							onDblclick: ($event) => (0, vue.unref)(handleResizeHandleDblclick)(descriptor.key),
+							onClick: _cache[2] || (_cache[2] = (0, vue.withModifiers)(() => {}, ["stop"]))
+						}, null, 42, _hoisted_9)) : (0, vue.createCommentVNode)("", true)], 14, _hoisted_5))], 64);
+					}), 128))])]),
+					(0, vue.createElementVNode)("tbody", _hoisted_10, [
+						showEmptyState.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("tr", _hoisted_11, [(0, vue.createElementVNode)("td", {
+							class: "s-ui-table__empty-cell",
+							colspan: renderedColumnCount.value
+						}, [(0, vue.createElementVNode)("div", _hoisted_13, [(0, vue.renderSlot)(_ctx.$slots, "empty", {}, () => [(0, vue.createElementVNode)("span", _hoisted_14, (0, vue.toDisplayString)((0, vue.unref)(t)("table.empty")), 1)])])], 8, _hoisted_12)])) : (0, vue.createCommentVNode)("", true),
+						__props.loading ? ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, (0, vue.renderList)(__props.skeletonRowCount, (skeletonIndex) => {
+							return (0, vue.openBlock)(), (0, vue.createBlock)(require_STableSkeletonRow.default, {
+								key: `skeleton-${skeletonIndex}`,
+								"leading-plans": (0, vue.unref)(leadingCellPlans),
+								"trailing-plans": (0, vue.unref)(trailingCellPlans)
+							}, (0, vue.createSlots)({ _: 2 }, [(0, vue.unref)(slots)["skeleton-row"] ? {
+								name: "default",
+								fn: (0, vue.withCtx)((skeletonScope) => [(0, vue.renderSlot)(_ctx.$slots, "skeleton-row", { column: skeletonScope.descriptor.column })]),
+								key: "0"
+							} : void 0]), 1032, ["leading-plans", "trailing-plans"]);
+						}), 128)) : ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, (0, vue.renderList)(renderRows.value, ({ row: flatRow, renderKey, spacer, spacerHeight, rowHeight, stuckTop, stuckBottom, stuckBottomLeaving, stuckBottomSliding, stuckBottomCoverHeight, stuckBottomFar, placeholder, memoKeys: _memoKeys }, __, ___, _cached) => {
+							const _memo = _memoKeys;
+							if (_cached && _cached.el && _cached.key === renderKey && (0, vue.isMemoSame)(_cached, _memo)) return _cached;
+							const _item = ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: renderKey }, [spacer ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("tr", _hoisted_15, [(0, vue.createElementVNode)("td", {
+								class: "s-ui-table__spacer-cell",
+								colspan: renderedColumnCount.value,
+								style: (0, vue.normalizeStyle)({ height: `${spacerHeight}px` })
+							}, null, 12, _hoisted_16)])) : flatRow && flatRow.kind === (0, vue.unref)(require_STable_types.ESTableRowKind).GROUP ? ((0, vue.openBlock)(), (0, vue.createBlock)(require_STableGroupRow.default, {
+								key: 1,
+								id: buildRowDomId(flatRow.key),
+								stuck: stuckTop,
+								row: flatRow,
+								"dnd-ref": __props.rowsDraggable ? registerRowDndRef : void 0,
+								dragging: (0, vue.unref)(draggingRowKey) === flatRow.key,
+								"drop-position": getRowDropPosition(flatRow.key),
+								"row-index": flatRow.index,
+								"leading-plans": (0, vue.unref)(leadingCellPlans),
+								"trailing-plans": (0, vue.unref)(trailingCellPlans),
+								"group-column-key": (0, vue.unref)(groupColumnKey),
+								"tree-indent": __props.treeIndent,
+								count: (0, vue.unref)(getGroupCount)(flatRow),
+								total: (0, vue.unref)(getGroupTotal)(flatRow),
+								title: (0, vue.unref)(getGroupTitle)(flatRow),
+								"extra-row-style": __props.rowStyle?.(flatRow.item, flatRow),
+								expanded: flatRow.expanded,
+								active: modelValue.value === flatRow.key,
+								"cell-id-prefix": gridBodyCellIdPrefix,
+								"focus-column-key": getRowFocusColumnKey(flatRow.key),
+								treegrid: hasTreeStructure.value,
+								onToggle: ($event) => (0, vue.unref)(toggleExpanded)(flatRow.key),
+								onRowClick: ($event) => handleRowClick(flatRow, $event),
+								onMenuOpen: ($event) => emit("groupMenuOpen", {
+									key: flatRow.key,
+									item: flatRow.item
+								})
+							}, (0, vue.createSlots)({ _: 2 }, [
+								(0, vue.unref)(slots)["group-menu"] ? {
+									name: "menu",
+									fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "group-menu", (0, vue.mergeProps)({ ref_for: true }, getGroupSlotScope(flatRow)))]),
+									key: "0"
+								} : void 0,
+								(0, vue.unref)(slots)["group-row"] ? {
+									name: "row",
+									fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "group-row", (0, vue.mergeProps)({ ref_for: true }, getGroupSlotScope(flatRow)))]),
+									key: "1"
+								} : void 0,
+								(0, vue.unref)(slots)["group-cell"] ? {
+									name: "group-cell",
+									fn: (0, vue.withCtx)((groupCellScope) => [(0, vue.renderSlot)(_ctx.$slots, "group-cell", (0, vue.mergeProps)({ ref_for: true }, {
+										...getGroupSlotScope(flatRow),
+										...groupCellScope
+									}))]),
+									key: "2"
+								} : void 0,
+								(0, vue.unref)(slots)["group-title"] ? {
+									name: "title",
+									fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "group-title", (0, vue.mergeProps)({ ref_for: true }, getGroupSlotScope(flatRow)))]),
+									key: "3"
+								} : void 0,
+								(0, vue.unref)(slots)["group-actions"] ? {
+									name: "actions",
+									fn: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "group-actions", (0, vue.mergeProps)({ ref_for: true }, getGroupSlotScope(flatRow)))]),
+									key: "4"
+								} : void 0
+							]), 1032, [
+								"id",
+								"stuck",
+								"row",
+								"dnd-ref",
+								"dragging",
+								"drop-position",
+								"row-index",
+								"leading-plans",
+								"trailing-plans",
+								"group-column-key",
+								"tree-indent",
+								"count",
+								"total",
+								"title",
+								"extra-row-style",
+								"expanded",
+								"active",
+								"focus-column-key",
+								"treegrid",
+								"onToggle",
+								"onRowClick",
+								"onMenuOpen"
+							])) : flatRow && flatRow.kind === (0, vue.unref)(require_STable_types.ESTableRowKind).DEPTH_FOOTER ? ((0, vue.openBlock)(), (0, vue.createBlock)(require_STableContentRow.default, {
+								key: 2,
+								class: (0, vue.normalizeClass)(["s-ui-table__depth-footer-row", {
+									"s-ui-table__depth-footer-row--stuck": stuckBottom,
+									"s-ui-table__depth-footer-row--stuck-leaving": stuckBottomLeaving,
+									"s-ui-table__depth-footer-row--stuck-sliding": stuckBottomSliding,
+									"s-ui-table__depth-footer-row--stuck-covered": stuckBottomCoverHeight !== void 0,
+									"s-ui-table__depth-footer-row--stuck-covered-far": stuckBottomFar
+								}]),
+								style: (0, vue.normalizeStyle)(getStuckCoverStyle(stuckBottomCoverHeight)),
+								"data-index": flatRow.index,
+								"aria-rowindex": flatRow.index + 2,
+								cells: (0, vue.unref)(rowCellPlans),
+								"content-column-key": (0, vue.unref)(depthFooterColumnKey),
+								"cell-class": "s-ui-table__depth-footer-cell",
+								"content-class": "s-ui-table__depth-footer-content",
+								"content-style": (0, vue.unref)(getDepthIndentStyle)(flatRow.depth),
+								section: (0, vue.unref)(require_useTableGridFocus.ESTableGridSection).BODY,
+								"row-key": flatRow.key,
+								"cell-id-prefix": gridBodyCellIdPrefix,
+								"focus-column-key": getRowFocusColumnKey(flatRow.key)
+							}, {
+								default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "depth-footer", (0, vue.mergeProps)({ ref_for: true }, (0, vue.unref)(getDepthFooterSlotScope)(flatRow)))]),
+								_: 2
+							}, 1032, [
+								"class",
+								"style",
+								"data-index",
+								"aria-rowindex",
+								"cells",
+								"content-column-key",
+								"content-style",
+								"section",
+								"row-key",
+								"focus-column-key"
+							])) : flatRow && flatRow.kind === (0, vue.unref)(require_STable_types.ESTableRowKind).LOAD_MORE ? ((0, vue.openBlock)(), (0, vue.createBlock)(require_STableContentRow.default, {
+								key: 3,
+								class: "s-ui-table__load-more-row",
+								"data-index": flatRow.index,
+								"aria-rowindex": flatRow.index + 2,
+								cells: (0, vue.unref)(rowCellPlans),
+								"content-column-key": (0, vue.unref)(loadMoreColumnKey),
+								"content-class": "s-ui-table__load-more-content",
+								"content-style": (0, vue.unref)(getDepthIndentStyle)(flatRow.depth),
+								section: (0, vue.unref)(require_useTableGridFocus.ESTableGridSection).BODY,
+								"row-key": flatRow.key,
+								"cell-id-prefix": gridBodyCellIdPrefix,
+								"focus-column-key": getRowFocusColumnKey(flatRow.key)
+							}, {
+								default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "load-more", (0, vue.mergeProps)({ ref_for: true }, (0, vue.unref)(getLoadMoreSlotScope)(flatRow)), () => [(0, vue.createVNode)((0, vue.unref)(require_SButton.default), {
+									appearance: (0, vue.unref)(require_SButton_types.EButtonAppearance).BARE,
+									variant: (0, vue.unref)(require_SButton_types.EButtonVariant).NEUTRAL,
+									size: (0, vue.unref)(require_SButton_types.EButtonSize).SMALL,
+									loading: (0, vue.unref)(isLoadMoreRowLoading)(flatRow),
+									tabindex: "-1",
+									onClick: ($event) => (0, vue.unref)(emitLoadMoreChildren)(flatRow)
+								}, {
+									default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)((0, vue.unref)(t)("table.loadMore")), 1)]),
+									_: 1
+								}, 8, [
+									"appearance",
+									"variant",
+									"size",
+									"loading",
+									"onClick"
+								])])]),
+								_: 2
+							}, 1032, [
+								"data-index",
+								"aria-rowindex",
+								"cells",
+								"content-column-key",
+								"content-style",
+								"section",
+								"row-key",
+								"focus-column-key"
+							])) : flatRow && placeholder ? ((0, vue.openBlock)(), (0, vue.createBlock)(require_STablePlaceholderRow.default, {
+								key: 4,
+								"row-index": flatRow.index,
+								"row-key": flatRow.key,
+								cells: (0, vue.unref)(rowCellPlans),
+								"row-height": rowHeight
+							}, null, 8, [
+								"row-index",
+								"row-key",
+								"cells",
+								"row-height"
+							])) : flatRow ? ((0, vue.openBlock)(), (0, vue.createBlock)(require_STableRow.default, {
+								key: 5,
+								row: flatRow,
+								"row-index": flatRow.index,
+								"row-expanded": flatRow.expanded,
+								"leading-plans": (0, vue.unref)(leadingCellPlans),
+								"trailing-plans": (0, vue.unref)(trailingCellPlans),
+								"dnd-ref": __props.rowsDraggable ? registerRowDndRef : void 0,
+								dragging: (0, vue.unref)(draggingRowKey) === flatRow.key,
+								"drop-position": getRowDropPosition(flatRow.key),
+								"placeholder-height": rowHeight,
+								"dom-id": buildRowDomId(flatRow.key),
+								selected: isRowSelected(flatRow.key),
+								indeterminate: isRowIndeterminate(flatRow.key),
+								"row-selectable": __props.selectable && (0, vue.unref)(selection).isNodeSelectable(flatRow.key),
+								active: modelValue.value === flatRow.key,
+								disabled: isRowDisabled(flatRow),
+								"tree-indent": __props.treeIndent,
+								"row-state": __props.rowState?.(flatRow.item),
+								"row-color": __props.rowColor?.(flatRow.item, flatRow),
+								"extra-row-class": __props.rowClass?.(flatRow.item, flatRow),
+								"extra-row-style": __props.rowStyle?.(flatRow.item, flatRow),
+								"cell-id-prefix": gridBodyCellIdPrefix,
+								"focus-column-key": getRowFocusColumnKey(flatRow.key),
+								treegrid: hasTreeStructure.value,
+								onRowClick: ($event) => handleRowClick(flatRow, $event),
+								onRowContextMenu: ($event) => handleRowContextMenu(flatRow, $event),
+								onCellClick: (columnKey, cellEvent) => handleCellClick(flatRow, columnKey, cellEvent),
+								onToggleExpand: ($event) => (0, vue.unref)(toggleExpanded)(flatRow.key),
+								onToggleSelected: ($event) => toggleRowSelected(flatRow.key)
+							}, (0, vue.createSlots)({ _: 2 }, [
+								(0, vue.renderList)(forwardedCellSlotNames.value, (cellSlotName) => {
+									return {
+										name: cellSlotName,
+										fn: (0, vue.withCtx)((cellSlotScope) => [(0, vue.renderSlot)(_ctx.$slots, cellSlotName, (0, vue.mergeProps)({ ref_for: true }, cellSlotScope))])
+									};
+								}),
+								(0, vue.unref)(slots).chevron ? {
+									name: "chevron",
+									fn: (0, vue.withCtx)((rowSlotScope) => [(0, vue.renderSlot)(_ctx.$slots, "chevron", (0, vue.mergeProps)({ ref_for: true }, rowSlotScope))]),
+									key: "0"
+								} : void 0,
+								(0, vue.unref)(slots)["cell-actions"] ? {
+									name: "cell-actions",
+									fn: (0, vue.withCtx)((cellSlotScope) => [(0, vue.renderSlot)(_ctx.$slots, "cell-actions", (0, vue.mergeProps)({ ref_for: true }, cellSlotScope))]),
+									key: "1"
+								} : void 0,
+								(0, vue.unref)(slots).indicator ? {
+									name: "indicator",
+									fn: (0, vue.withCtx)((rowSlotScope) => [(0, vue.renderSlot)(_ctx.$slots, "indicator", (0, vue.mergeProps)({ ref_for: true }, rowSlotScope))]),
+									key: "2"
+								} : void 0,
+								(0, vue.unref)(slots).checkbox ? {
+									name: "checkbox",
+									fn: (0, vue.withCtx)((rowSlotScope) => [(0, vue.renderSlot)(_ctx.$slots, "checkbox", (0, vue.mergeProps)({ ref_for: true }, rowSlotScope))]),
+									key: "3"
+								} : void 0,
+								(0, vue.unref)(slots)["right-edge"] ? {
+									name: "right-edge",
+									fn: (0, vue.withCtx)((rowSlotScope) => [(0, vue.renderSlot)(_ctx.$slots, "right-edge", (0, vue.mergeProps)({ ref_for: true }, rowSlotScope))]),
+									key: "4"
+								} : void 0
+							]), 1032, [
+								"row",
+								"row-index",
+								"row-expanded",
+								"leading-plans",
+								"trailing-plans",
+								"dnd-ref",
+								"dragging",
+								"drop-position",
+								"placeholder-height",
+								"dom-id",
+								"selected",
+								"indeterminate",
+								"row-selectable",
+								"active",
+								"disabled",
+								"tree-indent",
+								"row-state",
+								"row-color",
+								"extra-row-class",
+								"extra-row-style",
+								"focus-column-key",
+								"treegrid",
+								"onRowClick",
+								"onRowContextMenu",
+								"onCellClick",
+								"onToggleExpand",
+								"onToggleSelected"
+							])) : (0, vue.createCommentVNode)("", true)], 64));
+							_item.memo = _memo;
+							return _item;
+						}, _cache, 3), 128)),
+						__props.loadingMore && !__props.loading ? ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 3 }, (0, vue.renderList)(Math.min(3, __props.skeletonRowCount), (skeletonIndex) => {
+							return (0, vue.openBlock)(), (0, vue.createBlock)(require_STableSkeletonRow.default, {
+								key: `skeleton-more-${skeletonIndex}`,
+								"leading-plans": (0, vue.unref)(leadingCellPlans),
+								"trailing-plans": (0, vue.unref)(trailingCellPlans)
+							}, (0, vue.createSlots)({ _: 2 }, [(0, vue.unref)(slots)["skeleton-row"] ? {
+								name: "default",
+								fn: (0, vue.withCtx)((skeletonScope) => [(0, vue.renderSlot)(_ctx.$slots, "skeleton-row", { column: skeletonScope.descriptor.column })]),
+								key: "0"
+							} : void 0]), 1032, ["leading-plans", "trailing-plans"]);
+						}), 128)) : (0, vue.createCommentVNode)("", true)
+					]),
+					__props.creationRow || __props.footerValues ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("tfoot", _hoisted_17, [__props.creationRow ? ((0, vue.openBlock)(), (0, vue.createBlock)(require_STableContentRow.default, {
+						key: 0,
+						class: "s-ui-table__create-row",
+						"aria-rowindex": (0, vue.unref)(flatRows).length + 2,
+						cells: (0, vue.unref)(rowCellPlans),
+						"content-column-key": (0, vue.unref)(creationColumnKey),
+						"cell-class": "s-ui-table__create-cell",
+						"content-class": "s-ui-table__create-content",
+						section: (0, vue.unref)(require_useTableGridFocus.ESTableGridSection).CREATION,
+						"cell-id-prefix": gridCreationCellIdPrefix,
+						"focus-column-key": getSectionFocusColumnKey((0, vue.unref)(require_useTableGridFocus.ESTableGridSection).CREATION)
+					}, {
+						default: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "creation-row")]),
+						_: 3
+					}, 8, [
+						"aria-rowindex",
+						"cells",
+						"content-column-key",
+						"section",
+						"focus-column-key"
+					])) : (0, vue.createCommentVNode)("", true), __props.footerValues ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("tr", {
+						key: 1,
+						class: "s-ui-table__aggregate-row",
+						"aria-rowindex": (0, vue.unref)(flatRows).length + 2 + (__props.creationRow ? 1 : 0)
+					}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(rowCellPlans), ({ key: cellKey, cellPlan }) => {
+						return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: cellKey }, [!cellPlan ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("td", _hoisted_19)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("td", {
+							key: 1,
+							id: buildGridCellDomId({
+								section: (0, vue.unref)(require_useTableGridFocus.ESTableGridSection).AGGREGATE,
+								columnKey: cellPlan.descriptor.key
+							}),
+							class: (0, vue.normalizeClass)(["s-ui-table__aggregate-cell", [cellPlan.cellClass, (0, vue.unref)(getFooterToneClass)(cellPlan.descriptor.key)]]),
+							style: (0, vue.normalizeStyle)(cellPlan.style),
+							"aria-colindex": cellPlan.descriptor.colIndex,
+							"data-column-key": cellPlan.descriptor.key,
+							"data-section": (0, vue.unref)(require_useTableGridFocus.ESTableGridSection).AGGREGATE,
+							tabindex: getGridCellTabIndex((0, vue.unref)(require_useTableGridFocus.ESTableGridSection).AGGREGATE, void 0, cellPlan.descriptor.key)
+						}, [cellPlan.descriptor.column ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [(0, vue.unref)(slots)[`footer:${cellPlan.descriptor.key}`] ? (0, vue.renderSlot)(_ctx.$slots, `footer:${cellPlan.descriptor.key}`, (0, vue.mergeProps)({
+							key: 0,
+							ref_for: true
+						}, (0, vue.unref)(getFooterSlotScope)(cellPlan.descriptor.key))) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_21, (0, vue.toDisplayString)((0, vue.unref)(getFooterValueText)(cellPlan.descriptor.key)), 1))], 64)) : (0, vue.createCommentVNode)("", true)], 14, _hoisted_20))], 64);
+					}), 128))], 8, _hoisted_18)) : (0, vue.createCommentVNode)("", true)])) : (0, vue.createCommentVNode)("", true)
+				], 44, _hoisted_1)], 4),
+				(0, vue.createElementVNode)("span", {
+					ref_key: "gridExitRef",
+					ref: gridExitRef,
+					class: "s-ui-table__grid-exit",
+					tabindex: "-1",
+					"aria-hidden": "true"
+				}, null, 512),
+				(0, vue.unref)(columnDropLineStyle) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+					key: 0,
+					class: "s-ui-table__column-drop-line",
+					style: (0, vue.normalizeStyle)((0, vue.unref)(columnDropLineStyle)),
+					"aria-hidden": "true"
+				}, null, 4)) : (0, vue.createCommentVNode)("", true)
+			], 6);
+		};
+	}
+});
+//#endregion
+exports.default = STable_vue_vue_type_script_setup_true_lang_default;