@shtabapp/ui-kit 1.88.1 → 1.89.0

package/dist/components/STable/utils/useTableColumns.d.ts

@@ -52,6 +52,8 @@ export type TSTableCellRenderPlan<TItem extends Record<string, unknown> = Record
         right?: string;
         '--s-ui-table-cell-inline-offset'?: string;
     };
+    /** Ячейка тела занимает и место колонки управления колонками (а без правых колонок — филлера). */
+    colspan?: number;
     /** В этой колонке рисуются шеврон дерева и отступ уровня. */
     chevron: boolean;
 };
@@ -76,8 +78,13 @@ export interface IUseTableColumnsOptions<TItem extends Record<string, unknown>>
     columnsDraggable: MaybeRefOrGetter<boolean>;
     /** Ширина вьюпорта скроллера (content-box, без скроллбара) — излишек уходит гибким колонкам. */
     viewportWidth: MaybeRefOrGetter<number>;
+    /**
+     * Замеренная ширина несжимаемого контента ячеек (кнопки, теги) по ключу колонки: колонка не
+     * бывает уже, иначе контент вылезает из ячейки под sticky-right и за край таблицы.
+     */
+    contentWidths?: Ref<Record<string, number>>;
 }
-export declare const useTableColumns: <TItem extends Record<string, unknown>>({ columns, columnOrder, columnWidths, hiddenColumns, hasIndicator, hasCheckbox, hasRightEdge, hasColumnsManager, columnsManagerWidth, columnsResizable, columnsDraggable, viewportWidth, }: IUseTableColumnsOptions<TItem>) => {
+export declare const useTableColumns: <TItem extends Record<string, unknown>>({ columns, columnOrder, columnWidths, hiddenColumns, hasIndicator, hasCheckbox, hasRightEdge, hasColumnsManager, columnsManagerWidth, columnsResizable, columnsDraggable, viewportWidth, contentWidths, }: IUseTableColumnsOptions<TItem>) => {
     primaryColumnKey: import("vue").ComputedRef<string | undefined>;
     orderedDataColumns: import("vue").ComputedRef<ISTableColumn<TItem>[]>;
     columnDescriptors: import("vue").ComputedRef<TSTableColumnDescriptor<TItem>[]>;

package/dist/components/STable/utils/useTableColumns.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTableColumns.d.ts","sourceRoot":"","sources":["../../../../src/components/STable/utils/useTableColumns.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"useTableColumns.d.ts","sourceRoot":"","sources":["../../../../src/components/STable/utils/useTableColumns.ts"],"names":[],"mappings":"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"}

package/dist/components/STable/utils/useTableColumns.js

@@ -110,7 +110,7 @@ var distributeTableColumnWidths = (descriptors, viewportWidth) => {
 		} : descriptor;
 	});
 };
-var useTableColumns = ({ columns, columnOrder, columnWidths, hiddenColumns, hasIndicator, hasCheckbox, hasRightEdge, hasColumnsManager, columnsManagerWidth = 32, columnsResizable, columnsDraggable, viewportWidth }) => {
+var useTableColumns = ({ columns, columnOrder, columnWidths, hiddenColumns, hasIndicator, hasCheckbox, hasRightEdge, hasColumnsManager, columnsManagerWidth = 32, columnsResizable, columnsDraggable, viewportWidth, contentWidths }) => {
 	const primaryColumnKey = computed(() => {
 		const sourceColumns = toValue(columns);
 		return sourceColumns.find((tableColumn) => tableColumn.primary)?.key ?? sourceColumns[0]?.key;
@@ -163,21 +163,27 @@ var useTableColumns = ({ columns, columnOrder, columnWidths, hiddenColumns, hasI
 	* Базовая ширина: модель (ресайз/автофит) → `width` конфига → дефолт. Колонка без явной
 	* ширины гибкая — заполняет свободную ширину вьюпорта; sticky-right всегда фиксированные.
 	*/
-	const resolveColumnBaseWidth = (tableColumn, isPrimaryColumn) => {
+	const resolveColumnBaseWidth = (tableColumn, isPrimaryColumn, minWidth) => {
 		const modelWidth = columnWidths.value?.[tableColumn.key];
 		if (modelWidth) return {
-			baseWidth: modelWidth,
+			baseWidth: Math.max(minWidth, modelWidth),
 			flexible: false
 		};
 		if (tableColumn.width) return {
-			baseWidth: tableColumn.width,
+			baseWidth: Math.max(minWidth, tableColumn.width),
 			flexible: false
 		};
 		return {
-			baseWidth: resolveDefaultColumnWidth(isPrimaryColumn),
+			baseWidth: Math.max(minWidth, resolveDefaultColumnWidth(isPrimaryColumn)),
 			flexible: tableColumn.sticky !== ESTableColumnSticky.RIGHT
 		};
 	};
+	/** Нижняя граница ширины: `minWidth` конфига и замеренный несжимаемый контент ячеек. */
+	const resolveColumnMinWidth = (tableColumn) => {
+		const configMinWidth = tableColumn.minWidth ?? 60;
+		const contentWidth = contentWidths?.value[tableColumn.key] ?? 0;
+		return Math.max(configMinWidth, contentWidth);
+	};
 	/** Правые служебные колонки: right-edge, затем крайняя колонка управления колонками. */
 	const pushTrailingServiceColumns = (pushServiceColumn) => {
 		if (toValue(hasRightEdge)) pushServiceColumn("rightEdge", 40);
@@ -220,14 +226,15 @@ var useTableColumns = ({ columns, columnOrder, columnWidths, hiddenColumns, hasI
 			const isPrimaryColumn = tableColumn.key === primaryColumnKey.value;
 			const isLeadingColumn = Boolean(tableColumn.leading) && !isPrimaryColumn;
 			const sticky = isPrimaryColumn || isLeadingColumn ? ESTableColumnSticky.LEFT : tableColumn.sticky;
-			const { baseWidth, flexible } = resolveColumnBaseWidth(tableColumn, isPrimaryColumn);
+			const minWidth = resolveColumnMinWidth(tableColumn);
+			const { baseWidth, flexible } = resolveColumnBaseWidth(tableColumn, isPrimaryColumn, minWidth);
 			descriptors.push({
 				key: tableColumn.key,
 				column: tableColumn,
 				width: baseWidth,
 				baseWidth,
 				flexible,
-				minWidth: tableColumn.minWidth ?? 60,
+				minWidth,
 				maxWidth: tableColumn.maxWidth,
 				sticky,
 				align: tableColumn.align ?? ESTableColumnAlign.LEFT,

package/dist/components/STable/utils/useTableContentWidths.cjs

@@ -0,0 +1,63 @@
+let vue = require("vue");
+let _vueuse_core = require("@vueuse/core");
+//#region src/components/STable/utils/useTableContentWidths.ts
+/** Ячейки обычных строк тела: служебные колонки, групповые и футерные строки не меряются. */
+var MEASURED_CELL_BODY_SELECTOR = "tbody tr.s-ui-table__row > td[data-column-key]:not([data-column-key^=\"__s-ui-table-\"]) > .s-ui-table__cell-body";
+/**
+* Ширина несжимаемого контента ячеек по колонкам. При `table-layout: fixed` ячейка не растит
+* колонку: кнопки шире колонки вылезали из ячейки, уходили под sticky-right колонку управления и
+* растягивали скролл за край таблицы — прокрутка так и не показывала их целиком. Замер находит
+* ячейки, чей контент шире тела (`scrollWidth > clientWidth`), и поднимает нижнюю границу колонки.
+*
+* Текст с многоточием не переполняет тело (у него `min-width: 0` и свой `overflow`), поэтому
+* колонки с текстом не растут. Граница только растёт: иначе колонка дёргалась бы при прокрутке
+* виртуальных строк. Ячейка под ховером или фокусом пропускается — её раскрытые кнопки ячейки
+* (`cell-actions`) временные. Потолок — как у автофита по даблклику.
+*
+* Контент растёт и без смены данных: иконка кнопки догружается асинхронно, шрифт подменяется
+* после первого рендера. Поэтому замер идёт по любому изменению DOM таблицы и по `loadingdone`
+* шрифтов — не чаще раза за кадр.
+*/
+var useTableContentWidths = ({ scrollElement }) => {
+	const contentWidths = (0, vue.ref)({});
+	let frameId;
+	const measureContentWidths = () => {
+		frameId = void 0;
+		const container = (0, vue.toValue)(scrollElement);
+		if (!container) return;
+		const nextWidths = {};
+		container.querySelectorAll(MEASURED_CELL_BODY_SELECTOR).forEach((cellBody) => {
+			const cell = cellBody.parentElement;
+			const columnKey = cell?.dataset.columnKey;
+			if (!(cellBody instanceof HTMLElement) || !cell || !columnKey) return;
+			const overflow = cellBody.scrollWidth - cellBody.clientWidth;
+			if (overflow <= 0 || cell.matches(":hover, :focus-within")) return;
+			const headerCell = container.querySelector(`thead th[data-column-key="${CSS.escape(columnKey)}"]`);
+			const columnWidth = headerCell instanceof HTMLElement ? headerCell.offsetWidth : cell.offsetWidth;
+			const neededWidth = Math.min(640, Math.ceil(columnWidth + overflow));
+			if (neededWidth > (nextWidths[columnKey] ?? contentWidths.value[columnKey] ?? 0)) nextWidths[columnKey] = neededWidth;
+		});
+		if (Object.keys(nextWidths).length > 0) contentWidths.value = {
+			...contentWidths.value,
+			...nextWidths
+		};
+	};
+	const scheduleContentMeasure = () => {
+		if (frameId === void 0 && typeof requestAnimationFrame !== "undefined") frameId = requestAnimationFrame(measureContentWidths);
+	};
+	(0, _vueuse_core.useMutationObserver)(scrollElement, scheduleContentMeasure, {
+		childList: true,
+		subtree: true,
+		characterData: true
+	});
+	(0, _vueuse_core.useEventListener)(() => typeof document === "undefined" ? void 0 : document.fonts, "loadingdone", scheduleContentMeasure);
+	(0, _vueuse_core.tryOnScopeDispose)(() => {
+		if (frameId !== void 0) cancelAnimationFrame(frameId);
+	});
+	return {
+		contentWidths,
+		scheduleContentMeasure
+	};
+};
+//#endregion
+exports.useTableContentWidths = useTableContentWidths;

package/dist/components/STable/utils/useTableContentWidths.d.ts

@@ -0,0 +1,24 @@
+import { type MaybeRefOrGetter } from 'vue';
+export interface IUseTableContentWidthsOptions {
+    scrollElement: MaybeRefOrGetter<HTMLElement | null | undefined>;
+}
+/**
+ * Ширина несжимаемого контента ячеек по колонкам. При `table-layout: fixed` ячейка не растит
+ * колонку: кнопки шире колонки вылезали из ячейки, уходили под sticky-right колонку управления и
+ * растягивали скролл за край таблицы — прокрутка так и не показывала их целиком. Замер находит
+ * ячейки, чей контент шире тела (`scrollWidth > clientWidth`), и поднимает нижнюю границу колонки.
+ *
+ * Текст с многоточием не переполняет тело (у него `min-width: 0` и свой `overflow`), поэтому
+ * колонки с текстом не растут. Граница только растёт: иначе колонка дёргалась бы при прокрутке
+ * виртуальных строк. Ячейка под ховером или фокусом пропускается — её раскрытые кнопки ячейки
+ * (`cell-actions`) временные. Потолок — как у автофита по даблклику.
+ *
+ * Контент растёт и без смены данных: иконка кнопки догружается асинхронно, шрифт подменяется
+ * после первого рендера. Поэтому замер идёт по любому изменению DOM таблицы и по `loadingdone`
+ * шрифтов — не чаще раза за кадр.
+ */
+export declare const useTableContentWidths: ({ scrollElement }: IUseTableContentWidthsOptions) => {
+    contentWidths: import("vue").Ref<Record<string, number>, Record<string, number>>;
+    scheduleContentMeasure: () => void;
+};
+//# sourceMappingURL=useTableContentWidths.d.ts.map

package/dist/components/STable/utils/useTableContentWidths.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableContentWidths.d.ts","sourceRoot":"","sources":["../../../../src/components/STable/utils/useTableContentWidths.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgB,KAAK,gBAAgB,EAAE,MAAM,KAAK,CAAA;AAKzD,MAAM,WAAW,6BAA6B;IAC5C,aAAa,EAAE,gBAAgB,CAAC,WAAW,GAAG,IAAI,GAAG,SAAS,CAAC,CAAA;CAChE;AAMD;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,qBAAqB,GAAI,mBAAmB,6BAA6B;;;CAsErF,CAAA"}

package/dist/components/STable/utils/useTableContentWidths.js

@@ -0,0 +1,63 @@
+import { ref, toValue } from "vue";
+import { tryOnScopeDispose, useEventListener, useMutationObserver } from "@vueuse/core";
+//#region src/components/STable/utils/useTableContentWidths.ts
+/** Ячейки обычных строк тела: служебные колонки, групповые и футерные строки не меряются. */
+var MEASURED_CELL_BODY_SELECTOR = "tbody tr.s-ui-table__row > td[data-column-key]:not([data-column-key^=\"__s-ui-table-\"]) > .s-ui-table__cell-body";
+/**
+* Ширина несжимаемого контента ячеек по колонкам. При `table-layout: fixed` ячейка не растит
+* колонку: кнопки шире колонки вылезали из ячейки, уходили под sticky-right колонку управления и
+* растягивали скролл за край таблицы — прокрутка так и не показывала их целиком. Замер находит
+* ячейки, чей контент шире тела (`scrollWidth > clientWidth`), и поднимает нижнюю границу колонки.
+*
+* Текст с многоточием не переполняет тело (у него `min-width: 0` и свой `overflow`), поэтому
+* колонки с текстом не растут. Граница только растёт: иначе колонка дёргалась бы при прокрутке
+* виртуальных строк. Ячейка под ховером или фокусом пропускается — её раскрытые кнопки ячейки
+* (`cell-actions`) временные. Потолок — как у автофита по даблклику.
+*
+* Контент растёт и без смены данных: иконка кнопки догружается асинхронно, шрифт подменяется
+* после первого рендера. Поэтому замер идёт по любому изменению DOM таблицы и по `loadingdone`
+* шрифтов — не чаще раза за кадр.
+*/
+var useTableContentWidths = ({ scrollElement }) => {
+	const contentWidths = ref({});
+	let frameId;
+	const measureContentWidths = () => {
+		frameId = void 0;
+		const container = toValue(scrollElement);
+		if (!container) return;
+		const nextWidths = {};
+		container.querySelectorAll(MEASURED_CELL_BODY_SELECTOR).forEach((cellBody) => {
+			const cell = cellBody.parentElement;
+			const columnKey = cell?.dataset.columnKey;
+			if (!(cellBody instanceof HTMLElement) || !cell || !columnKey) return;
+			const overflow = cellBody.scrollWidth - cellBody.clientWidth;
+			if (overflow <= 0 || cell.matches(":hover, :focus-within")) return;
+			const headerCell = container.querySelector(`thead th[data-column-key="${CSS.escape(columnKey)}"]`);
+			const columnWidth = headerCell instanceof HTMLElement ? headerCell.offsetWidth : cell.offsetWidth;
+			const neededWidth = Math.min(640, Math.ceil(columnWidth + overflow));
+			if (neededWidth > (nextWidths[columnKey] ?? contentWidths.value[columnKey] ?? 0)) nextWidths[columnKey] = neededWidth;
+		});
+		if (Object.keys(nextWidths).length > 0) contentWidths.value = {
+			...contentWidths.value,
+			...nextWidths
+		};
+	};
+	const scheduleContentMeasure = () => {
+		if (frameId === void 0 && typeof requestAnimationFrame !== "undefined") frameId = requestAnimationFrame(measureContentWidths);
+	};
+	useMutationObserver(scrollElement, scheduleContentMeasure, {
+		childList: true,
+		subtree: true,
+		characterData: true
+	});
+	useEventListener(() => typeof document === "undefined" ? void 0 : document.fonts, "loadingdone", scheduleContentMeasure);
+	tryOnScopeDispose(() => {
+		if (frameId !== void 0) cancelAnimationFrame(frameId);
+	});
+	return {
+		contentWidths,
+		scheduleContentMeasure
+	};
+};
+//#endregion
+export { useTableContentWidths };