@shtabapp/ui-kit 1.75.0 → 1.76.0

package/dist/{STable-G2k-tI4g.js → STable-BVGHC_FJ.js}

@@ -1,13 +1,13 @@
 import { n as e, t } from "./contrastSurfaceTextColor-BDlLSSXC.js";
 import { t as n } from "./colorValue-CSh0chxp.js";
-import { i as r, n as i, r as a, t as o } from "./SButton-LAOBxpd4.js";
-import { i as s, t as c } from "./SCheckbox-BMkOc5cn.js";
+import { i as r, n as i, r as a, t as o } from "./SButton-DIWMMCSc.js";
+import { i as s, t as c } from "./SCheckbox-Dulusx5v.js";
 import { s as l } from "./useFloatingOverlay-TxzVisMJ.js";
 import { t as u } from "./SDropdown-cNmJ5Lrz.js";
 import { t as d } from "./SDropdownMenu-2koPU6IG.js";
 import { a as f, o as p, r as m } from "./treeKeyboardNavigation-SmxTdnDz.js";
-import { t as h } from "./SListItem-BOSQGRWA.js";
-import { n as g, r as _, t as v } from "./SToggle-sGw-LSNd.js";
+import { t as h } from "./SListItem-CDlsjhA3.js";
+import { n as g, r as _, t as v } from "./SToggle-MSdprnRP.js";
 import { Fragment as y, computed as b, createBlock as x, createCommentVNode as S, createElementBlock as C, createElementVNode as w, createSlots as T, createTextVNode as E, createVNode as D, defineComponent as O, isMemoSame as k, markRaw as A, mergeModels as j, mergeProps as M, nextTick as ee, normalizeClass as N, normalizeStyle as P, onBeforeUnmount as F, onMounted as I, openBlock as L, ref as R, renderList as z, renderSlot as B, shallowRef as V, toDisplayString as H, toRaw as te, toValue as U, unref as W, useId as ne, useModel as re, useSlots as ie, useTemplateRef as ae, watch as G, withCtx as K, withModifiers as oe } from "vue";
 import { ESSkeletonType as se, SIcon as ce, SSeparator as le, SSkeleton as ue, useUiKitI18n as de } from "@shtabapp/ui-kit-primitives";
 import { tryOnScopeDispose as fe, useElementSize as pe, useEventListener as me, useRafFn as he, useResizeObserver as ge, useTimeoutFn as _e } from "@vueuse/core";
@@ -554,7 +554,11 @@ var J = /* @__PURE__ */ function(e) {
 		},
 		dropPosition: {},
 		cellIdPrefix: {},
-		focusColumnKey: {}
+		focusColumnKey: {},
+		treegrid: {
+			type: Boolean,
+			default: !1
+		}
 	},
 	emits: [
 		"toggle",
@@ -581,8 +585,8 @@ var J = /* @__PURE__ */ function(e) {
 			style: P(e.extraRowStyle),
 			"data-index": e.rowIndex,
 			"aria-rowindex": e.rowIndex + 2,
-			"aria-level": e.row.depth + 1,
-			"aria-expanded": e.row.hasChildren ? e.expanded : void 0,
+			"aria-level": e.treegrid ? e.row.depth + 1 : void 0,
+			"aria-expanded": e.treegrid && e.row.hasChildren ? e.expanded : void 0,
 			onClick: b[3] ||= (e) => n("rowClick", e)
 		}, [
 			(L(!0), C(y, null, z(e.leadingPlans, (m) => (L(), C("td", {
@@ -1112,7 +1116,11 @@ var J = /* @__PURE__ */ function(e) {
 		},
 		placeholderHeight: {},
 		cellIdPrefix: {},
-		focusColumnKey: {}
+		focusColumnKey: {},
+		treegrid: {
+			type: Boolean,
+			default: !1
+		}
 	},
 	emits: [
 		"rowClick",
@@ -1195,8 +1203,8 @@ var J = /* @__PURE__ */ function(e) {
 			style: P(h.value),
 			"data-index": e.rowIndex,
 			"aria-rowindex": e.rowIndex + 2,
-			"aria-level": e.row.depth + 1,
-			"aria-expanded": e.row.hasChildren ? e.rowExpanded : void 0,
+			"aria-level": e.treegrid ? e.row.depth + 1 : void 0,
+			"aria-expanded": e.treegrid && e.row.hasChildren ? e.rowExpanded : void 0,
 			"aria-selected": e.selected || void 0,
 			onClick: F,
 			onContextmenu: p[3] ||= (e) => n("rowContextMenu", e)
@@ -2482,6 +2490,10 @@ var J = /* @__PURE__ */ function(e) {
 	class: "s-ui-table__columns-manager"
 }, Un = { class: "s-ui-table__columns-item-main" }, Wn = { class: "s-ui-table__columns-item-title" }, Gn = [
 	"aria-label",
+	"aria-valuenow",
+	"aria-valuemin",
+	"aria-valuemax",
+	"aria-valuetext",
 	"onPointerdown",
 	"onKeydown",
 	"onDblclick"
@@ -2760,7 +2772,7 @@ var J = /* @__PURE__ */ function(e) {
 			onTreeDrop: (e) => {
 				j("rowsDrop", e);
 			},
-			resolveRowPreviewTitle: (e) => Dn(e) ?? e.key
+			resolveRowPreviewTitle: (e) => On(e) ?? e.key
 		}), ht = (e) => {
 			(e instanceof Element || e === null) && dt(e);
 		}, gt = (e) => {
@@ -2806,7 +2818,10 @@ var J = /* @__PURE__ */ function(e) {
 			}
 		}), Lt = V(), Rt = (e, t) => {
 			Lt.value = t ? e : void 0;
-		}, zt = (t, n) => {
+		}, zt = (e) => {
+			let t = e.column?.title;
+			return t ? I("table.resizeNamedColumn", { title: t }) : I("table.resizeColumn");
+		}, Bt = (t, n) => {
 			if (!e.columnsResizable || !t.resizable) return;
 			let r = Math.min(t.maxWidth ?? Infinity, Math.max(t.minWidth, t.width + n * 8));
 			r !== t.width && (h.value = {
@@ -2816,9 +2831,9 @@ var J = /* @__PURE__ */ function(e) {
 				key: t.key,
 				width: r
 			}));
-		}, Bt = V(!1), Vt = b(() => e.columns.filter((e) => e.key !== me.value && (e.hideable ?? !0))), Ut = (e) => (O.value ?? []).includes(e), Wt = b(() => {
-			let e = Vt.value.map((e) => {
-				let t = Ut(e.key);
+		}, Vt = V(!1), Ut = b(() => e.columns.filter((e) => e.key !== me.value && (e.hideable ?? !0))), Wt = (e) => (O.value ?? []).includes(e), Gt = b(() => {
+			let e = Ut.value.map((e) => {
+				let t = Wt(e.key);
 				return {
 					column: e,
 					hidden: t,
@@ -2826,22 +2841,22 @@ var J = /* @__PURE__ */ function(e) {
 				};
 			});
 			return [e.filter((e) => !e.hidden), e.filter((e) => e.hidden)].filter((e) => e.length > 0);
-		}), Gt = (e) => {
+		}), qt = (e) => {
 			let t = new Set(O.value ?? []);
 			t.has(e) ? t.delete(e) : t.add(e), O.value = [...t];
-		}, qt = (e) => {
+		}, Jt = (e) => {
 			let t = new Set(O.value ?? []);
 			t.add(e), O.value = [...t];
-		}, Jt = yn({
+		}, Yt = yn({
 			selected: c,
 			cascade: () => e.cascadeSelection,
 			treeIndex: ye,
 			groupRow: () => e.groupRow,
 			disabledKey: () => e.disabledKey,
 			isItemSelectable: () => e.isItemSelectable
-		}), Yt = Jt.headerCheckState, Xt = (e) => Jt.isSelected(e), Zt = (t) => e.cascadeSelection && Jt.getCheckState(t) === Z.INDETERMINATE, Qt = (e) => {
-			Jt.toggleRow(e);
-		}, $t = (t) => Ht(t.item, e.disabledKey), en = ({ row: t, spacerHeight: n, rowHeight: r, stuckTop: i, stuckBottom: a, stuckBottomLeaving: o, stuckBottomSliding: c, stuckBottomCoverHeight: l, stuckBottomFar: u }, d) => [
+		}), Xt = Yt.headerCheckState, Zt = (e) => Yt.isSelected(e), Qt = (t) => e.cascadeSelection && Yt.getCheckState(t) === Z.INDETERMINATE, $t = (e) => {
+			Yt.toggleRow(e);
+		}, en = (t) => Ht(t.item, e.disabledKey), tn = ({ row: t, spacerHeight: n, rowHeight: r, stuckTop: i, stuckBottom: a, stuckBottomLeaving: o, stuckBottomSliding: c, stuckBottomCoverHeight: l, stuckBottomFar: u }, d) => [
 			t ?? n,
 			t?.index,
 			t?.expanded,
@@ -2850,10 +2865,10 @@ var J = /* @__PURE__ */ function(e) {
 			t?.hasChildren,
 			t?.depth,
 			t?.parentKey,
-			t ? Xt(t.key) : !1,
 			t ? Zt(t.key) : !1,
+			t ? Qt(t.key) : !1,
 			t ? s.value === t.key : !1,
-			t ? _r(t.key) : void 0,
+			t ? vr(t.key) : void 0,
 			t ? pt.value === t.key : !1,
 			t ? gt(t.key) : void 0,
 			r,
@@ -2864,8 +2879,8 @@ var J = /* @__PURE__ */ function(e) {
 			l,
 			u,
 			he.value,
-			ln.value,
-			pn.value,
+			un.value,
+			Cn.value,
 			d,
 			e.loadingMoreChildrenKeys,
 			e.treeIndent,
@@ -2875,30 +2890,31 @@ var J = /* @__PURE__ */ function(e) {
 			e.rowColor,
 			e.selectable,
 			e.cascadeSelection,
-			e.rowsDraggable
-		], tn = (e) => {
+			e.rowsDraggable,
+			Ae.value
+		], nn = (e) => {
 			if (e !== void 0) return { "--s-ui-table-stuck-cover-height": `${e}px` };
-		}, nn = b(() => wt.value.map((e) => {
+		}, an = b(() => wt.value.map((e) => {
 			let t = e.row?.kind === Q.ROW && !$e(e.row.key);
 			return {
 				...e,
 				placeholder: t,
-				memoKeys: en(e, t)
+				memoKeys: tn(e, t)
 			};
-		})), an = b(() => Object.keys(F).filter((e) => e.startsWith("cell:"))), on = (e) => `s-ui-table-${R}-row-${e}`, cn = (e) => ({
+		})), on = b(() => Object.keys(F).filter((e) => e.startsWith("cell:"))), cn = (e) => `s-ui-table-${R}-row-${e}`, ln = (e) => ({
 			...e,
-			selected: Xt(e.key),
+			selected: Zt(e.key),
 			indeterminate: !1,
 			active: s.value === e.key,
-			disabled: $t(e),
+			disabled: en(e),
 			group: e.kind === Q.GROUP,
 			toggleExpanded: () => {
 				xe(e.key);
 			},
 			toggleSelected: () => {
-				Qt(e.key);
+				$t(e.key);
 			}
-		}), { depthFooterColumnKey: ln, groupColumnKey: un, creationColumnKey: dn, loadMoreColumnKey: pn, getGroupCount: Cn, getGroupTotal: Tn, getGroupTitle: Dn, getDepthIndentStyle: On, emitDepthFooterClick: kn, getDepthFooterSlotScope: An, isLoadMoreRowLoading: jn, emitLoadMoreChildren: Mn, getLoadMoreSlotScope: Nn, getFooterValueText: Pn, getFooterToneClass: Fn, getFooterSlotScope: ir } = bn({
+		}), { depthFooterColumnKey: un, groupColumnKey: dn, creationColumnKey: pn, loadMoreColumnKey: Cn, getGroupCount: Tn, getGroupTotal: Dn, getGroupTitle: On, getDepthIndentStyle: kn, emitDepthFooterClick: An, getDepthFooterSlotScope: jn, isLoadMoreRowLoading: Mn, emitLoadMoreChildren: Nn, getLoadMoreSlotScope: Pn, getFooterValueText: Fn, getFooterToneClass: ir, getFooterSlotScope: ar } = bn({
 			columns: () => e.columns,
 			primaryColumnKey: me,
 			treeNodeByKey: b(() => ye.value.nodeByKey),
@@ -2917,35 +2933,35 @@ var J = /* @__PURE__ */ function(e) {
 			onLoadMoreChildren: (e) => {
 				j("loadMoreChildren", e);
 			}
-		}), ar = (e) => ({
-			...cn(e),
-			count: Cn(e),
-			total: Tn(e)
-		}), or = (t, n) => {
-			$t(t) || (s.value = t.key, e.expandOnClick && (t.hasChildren || t.kind === Q.GROUP) && xe(t.key), j("rowClick", {
+		}), or = (e) => ({
+			...ln(e),
+			count: Tn(e),
+			total: Dn(e)
+		}), sr = (t, n) => {
+			en(t) || (s.value = t.key, e.expandOnClick && (t.hasChildren || t.kind === Q.GROUP) && xe(t.key), j("rowClick", {
 				key: t.key,
 				item: t.item,
 				event: n
 			}));
-		}, sr = (e, t) => {
+		}, cr = (e, t) => {
 			j("rowContextMenu", {
 				key: e.key,
 				item: e.item,
 				event: t
 			});
-		}, cr = b(() => {
+		}, lr = b(() => {
 			let e = /* @__PURE__ */ new Set();
 			return he.value.forEach((t) => {
 				t.column && e.add(t.key);
 			}), e;
-		}), lr = (e, t, n) => {
-			!cr.value.has(t) || $t(e) || j("cellClick", {
+		}), ur = (e, t, n) => {
+			!lr.value.has(t) || en(e) || j("cellClick", {
 				key: e.key,
 				item: e.item,
 				columnKey: t,
 				event: n
 			});
-		}, ur = (e) => e ? !$t(e) : !1, dr = b(() => {
+		}, dr = (e) => e ? !en(e) : !1, fr = b(() => {
 			let t = fe.value - 40 - Re.value;
 			return Math.max(1, Math.floor(t / e.estimateRowSize));
 		});
@@ -2956,59 +2972,59 @@ var J = /* @__PURE__ */ function(e) {
 				j("endReached", { direction: "bottom" });
 			}
 		});
-		let fr = (e, t) => {
+		let pr = (e, t) => {
 			let n = be.value.getRowIndexByKey(e);
 			if (n !== void 0) {
 				if (Ie.value) {
 					Ue(n, t?.align ?? "auto");
 					return;
 				}
-				document.getElementById(on(e))?.scrollIntoView({ block: t?.align === "center" ? "center" : "nearest" });
+				document.getElementById(cn(e))?.scrollIntoView({ block: t?.align === "center" ? "center" : "nearest" });
 			}
-		}, pr = (e) => `s-ui-table-${R}-cell-${e.section}-${e.rowKey ?? ""}-${e.columnKey}`, mr = ft({
+		}, mr = (e) => `s-ui-table-${R}-cell-${e.section}-${e.rowKey ?? ""}-${e.columnKey}`, hr = ft({
 			tableRootElement: se,
 			tableElement: U,
 			scrollElement: te,
 			columnDescriptors: he,
 			flatRows: q,
 			snapshot: be,
-			groupColumnKey: un,
-			depthFooterColumnKey: ln,
-			loadMoreColumnKey: pn,
-			creationColumnKey: dn,
+			groupColumnKey: dn,
+			depthFooterColumnKey: un,
+			loadMoreColumnKey: Cn,
+			creationColumnKey: pn,
 			hasCreationRow: () => !!e.creationRow,
 			hasAggregateRow: () => !!e.footerValues,
-			isRowNavigable: ur,
-			pageSize: dr,
-			buildCellDomId: pr,
+			isRowNavigable: dr,
+			pageSize: fr,
+			buildCellDomId: mr,
 			onBodyRowFocused: (e) => {
 				s.value = e;
 			},
 			scrollToRowIndex: (e) => {
 				let t = q.value[e];
-				t && fr(t.key);
+				t && pr(t.key);
 			}
-		}), hr = `s-ui-table-${R}-cell-${$.BODY}-`, gr = `s-ui-table-${R}-cell-${$.CREATION}-`, _r = (e) => mr.focusedBodyRowKey.value === e ? mr.focusAddress.value.columnKey : void 0, vr = (e) => {
-			let t = mr.focusAddress.value;
+		}), gr = `s-ui-table-${R}-cell-${$.BODY}-`, _r = `s-ui-table-${R}-cell-${$.CREATION}-`, vr = (e) => hr.focusedBodyRowKey.value === e ? hr.focusAddress.value.columnKey : void 0, yr = (e) => {
+			let t = hr.focusAddress.value;
 			return t.section === e ? t.columnKey : void 0;
-		}, yr = (e, t, n) => mr.getCellTabIndex(e, t, n), { handleGridFocusIn: br, handleGridKeydown: xr } = gn({
-			gridFocus: mr,
+		}, br = (e, t, n) => hr.getCellTabIndex(e, t, n), { handleGridFocusIn: xr, handleGridKeydown: Sr } = gn({
+			gridFocus: hr,
 			columnDescriptors: he,
 			flatRows: q,
 			expandColumnKey: () => e.expandColumnKey,
 			primaryColumnKey: me,
-			groupColumnKey: un,
+			groupColumnKey: dn,
 			selectable: () => e.selectable,
 			openMenuColumnKey: Lt,
 			toggleExpanded: xe,
 			toggleRowSelected: (e) => {
-				Jt.toggleRow(e);
+				Yt.toggleRow(e);
 			},
 			applySortCycle: Nt,
 			setColumnMenuOpen: Rt,
-			resizeColumnByKeyboard: zt,
-			onDepthFooterActivate: kn,
-			onLoadMoreActivate: Mn,
+			resizeColumnByKeyboard: Bt,
+			onDepthFooterActivate: An,
+			onLoadMoreActivate: Nn,
 			onRowActivate: (e, t) => {
 				j("rowClick", {
 					key: e.key,
@@ -3019,13 +3035,13 @@ var J = /* @__PURE__ */ function(e) {
 		});
 		return t({
 			focusNavigation: async () => {
-				mr.focusAddressNow(mr.focusAddress.value), await ee();
+				hr.focusAddressNow(hr.focusAddress.value), await ee();
 			},
-			scrollToRow: fr,
+			scrollToRow: pr,
 			expandAll: Se,
 			collapseAll: Ce,
 			clearSelection: () => {
-				Jt.clearSelection();
+				Yt.clearSelection();
 			},
 			getScrollElement: () => te.value ?? void 0
 		}), (t, n) => (L(), C("div", {
@@ -3048,8 +3064,8 @@ var J = /* @__PURE__ */ function(e) {
 			ref_key: "tableElementRef",
 			ref: U,
 			tabindex: "-1",
-			onKeydown: n[5] ||= (...e) => W(xr) && W(xr)(...e),
-			onFocusin: n[6] ||= (...e) => W(br) && W(br)(...e)
+			onKeydown: n[5] ||= (...e) => W(Sr) && W(Sr)(...e),
+			onFocusin: n[6] ||= (...e) => W(xr) && W(xr)(...e)
 		}, [
 			w("colgroup", null, [
 				(L(!0), C(y, null, z(W(we), (e) => (L(), C("col", {
@@ -3064,7 +3080,7 @@ var J = /* @__PURE__ */ function(e) {
 			]),
 			w("thead", Rn, [w("tr", zn, [(L(!0), C(y, null, z(W(Ee), ({ key: s, descriptor: c }) => (L(), C(y, { key: s }, [c ? (L(), C("th", {
 				key: 1,
-				id: pr({
+				id: mr({
 					section: W($).HEADER,
 					columnKey: c.key
 				}),
@@ -3076,7 +3092,7 @@ var J = /* @__PURE__ */ function(e) {
 				"data-section": W($).HEADER,
 				"aria-colindex": c.colIndex,
 				"aria-sort": W(Ft)(c),
-				tabindex: yr(W($).HEADER, void 0, c.key),
+				tabindex: br(W($).HEADER, void 0, c.key),
 				scope: "col"
 			}, [c.column ? (L(), x(Dt, {
 				key: 0,
@@ -3088,7 +3104,7 @@ var J = /* @__PURE__ */ function(e) {
 				"onUpdate:menuOpen": (e) => Rt(c.key, e),
 				onSortToggle: (e) => W(Nt)(c.key, e),
 				onSortSet: (e) => W(Pt)(c.key, e),
-				onHide: (e) => qt(c.key)
+				onHide: (e) => Jt(c.key)
 			}, T({ _: 2 }, [W(F)[`header:${c.key}`] ? {
 				name: "default",
 				fn: K(() => [B(t.$slots, `header:${c.key}`, M({ ref_for: !0 }, W(It)(c)))]),
@@ -3109,19 +3125,19 @@ var J = /* @__PURE__ */ function(e) {
 				"onHide"
 			])) : c.service === W(qe).CHECKBOX ? (L(), x(We, {
 				key: 1,
-				class: N(["s-ui-table__header-checkbox", { "s-ui-table__header-checkbox--active": W(Yt) !== W(Z).UNCHECKED }]),
-				"model-value": W(Yt) === W(Z).CHECKED,
-				indeterminate: W(Yt) === W(Z).INDETERMINATE,
-				"screen-reader-label": W(Yt) === W(Z).CHECKED ? W(I)("table.deselectAll") : W(I)("table.selectAll"),
-				"onUpdate:modelValue": n[0] ||= (e) => W(Jt).toggleSelectAll()
+				class: N(["s-ui-table__header-checkbox", { "s-ui-table__header-checkbox--active": W(Xt) !== W(Z).UNCHECKED }]),
+				"model-value": W(Xt) === W(Z).CHECKED,
+				indeterminate: W(Xt) === W(Z).INDETERMINATE,
+				"screen-reader-label": W(Xt) === W(Z).CHECKED ? W(I)("table.deselectAll") : W(I)("table.selectAll"),
+				"onUpdate:modelValue": n[0] ||= (e) => W(Yt).toggleSelectAll()
 			}, null, 8, [
 				"class",
 				"model-value",
 				"indeterminate",
 				"screen-reader-label"
 			])) : c.service === W(qe).COLUMNS_MANAGER ? (L(), C("div", Hn, [D(W(u), {
-				modelValue: Bt.value,
-				"onUpdate:modelValue": n[1] ||= (e) => Bt.value = e,
+				modelValue: Vt.value,
+				"onUpdate:modelValue": n[1] ||= (e) => Vt.value = e,
 				placement: W(l).BOTTOM_END,
 				shift: "",
 				"fit-viewport": ""
@@ -3147,10 +3163,10 @@ var J = /* @__PURE__ */ function(e) {
 					width: 300
 				}, {
 					default: K(() => [B(t.$slots, "columns-menu", {
-						columns: Vt.value,
-						isColumnHidden: Ut,
-						toggleColumn: Gt
-					}, () => [(L(!0), C(y, null, z(Wt.value, (e, t) => (L(), C(y, { key: t }, [t > 0 ? (L(), x(W(le), {
+						columns: Ut.value,
+						isColumnHidden: Wt,
+						toggleColumn: qt
+					}, () => [(L(!0), C(y, null, z(Gt.value, (e, t) => (L(), C(y, { key: t }, [t > 0 ? (L(), x(W(le), {
 						key: 0,
 						class: "s-ui-table__columns-separator"
 					})) : S("", !0), (L(!0), C(y, null, z(e, (e) => (L(), x(W(v), {
@@ -3159,7 +3175,7 @@ var J = /* @__PURE__ */ function(e) {
 						size: W(_).SMALL,
 						"label-placement": W(g).LEFT,
 						"model-value": !e.hidden,
-						"onUpdate:modelValue": (t) => Gt(e.column.key)
+						"onUpdate:modelValue": (t) => qt(e.column.key)
 					}, {
 						default: K(() => [w("span", Un, [e.column.icon ? (L(), x(W(ce), {
 							key: 0,
@@ -3182,7 +3198,11 @@ var J = /* @__PURE__ */ function(e) {
 				class: N(["s-ui-table__resize-handle", { "s-ui-table__resize-handle--active": W(tt) === c.key }]),
 				role: "separator",
 				"aria-orientation": "vertical",
-				"aria-label": W(I)("table.resizeColumn"),
+				"aria-label": zt(c),
+				"aria-valuenow": c.width,
+				"aria-valuemin": c.minWidth,
+				"aria-valuemax": c.maxWidth,
+				"aria-valuetext": W(I)("table.columnWidth", { width: String(c.width) }),
 				tabindex: "-1",
 				onPointerdown: (e) => W(nt)(e, c.key),
 				onKeydown: (e) => W(rt)(e, c.key),
@@ -3202,7 +3222,7 @@ var J = /* @__PURE__ */ function(e) {
 					name: "default",
 					fn: K((e) => [B(t.$slots, "skeleton-row", { column: e.descriptor.column })]),
 					key: "0"
-				} : void 0]), 1032, ["leading-plans", "trailing-plans"]))), 128)) : (L(!0), C(y, { key: 2 }, z(nn.value, ({ row: n, renderKey: c, spacer: l, spacerHeight: u, rowHeight: d, stuckTop: f, stuckBottom: p, stuckBottomLeaving: m, stuckBottomSliding: h, stuckBottomCoverHeight: g, stuckBottomFar: _, placeholder: v, memoKeys: b }, O, A, ee) => {
+				} : void 0]), 1032, ["leading-plans", "trailing-plans"]))), 128)) : (L(!0), C(y, { key: 2 }, z(an.value, ({ row: n, renderKey: c, spacer: l, spacerHeight: u, rowHeight: d, stuckTop: f, stuckBottom: p, stuckBottomLeaving: m, stuckBottomSliding: h, stuckBottomCoverHeight: g, stuckBottomFar: _, placeholder: v, memoKeys: b }, O, A, ee) => {
 					let R = b;
 					if (ee && ee.el && ee.key === c && k(ee, R)) return ee;
 					let V = (L(), C(y, { key: c }, [l ? (L(), C("tr", Zn, [w("td", {
@@ -3211,7 +3231,7 @@ var J = /* @__PURE__ */ function(e) {
 						style: P({ height: `${u}px` })
 					}, null, 12, Qn)])) : n && n.kind === W(Q).GROUP ? (L(), x(yt, {
 						key: 1,
-						id: on(n.key),
+						id: cn(n.key),
 						stuck: f,
 						row: n,
 						"dnd-ref": e.rowsDraggable ? ht : void 0,
@@ -3220,18 +3240,19 @@ var J = /* @__PURE__ */ function(e) {
 						"row-index": n.index,
 						"leading-plans": W(ke),
 						"trailing-plans": W(J),
-						"group-column-key": W(un),
+						"group-column-key": W(dn),
 						"tree-indent": e.treeIndent,
-						count: W(Cn)(n),
-						total: W(Tn)(n),
-						title: W(Dn)(n),
+						count: W(Tn)(n),
+						total: W(Dn)(n),
+						title: W(On)(n),
 						"extra-row-style": e.rowStyle?.(n.item, n),
 						expanded: n.expanded,
 						active: s.value === n.key,
-						"cell-id-prefix": hr,
-						"focus-column-key": _r(n.key),
+						"cell-id-prefix": gr,
+						"focus-column-key": vr(n.key),
+						treegrid: Ae.value,
 						onToggle: (e) => W(xe)(n.key),
-						onRowClick: (e) => or(n, e),
+						onRowClick: (e) => sr(n, e),
 						onMenuOpen: (e) => j("groupMenuOpen", {
 							key: n.key,
 							item: n.item
@@ -3239,30 +3260,30 @@ var J = /* @__PURE__ */ function(e) {
 					}, T({ _: 2 }, [
 						W(F)["group-menu"] ? {
 							name: "menu",
-							fn: K(() => [B(t.$slots, "group-menu", M({ ref_for: !0 }, ar(n)))]),
+							fn: K(() => [B(t.$slots, "group-menu", M({ ref_for: !0 }, or(n)))]),
 							key: "0"
 						} : void 0,
 						W(F)["group-row"] ? {
 							name: "row",
-							fn: K(() => [B(t.$slots, "group-row", M({ ref_for: !0 }, ar(n)))]),
+							fn: K(() => [B(t.$slots, "group-row", M({ ref_for: !0 }, or(n)))]),
 							key: "1"
 						} : void 0,
 						W(F)["group-cell"] ? {
 							name: "group-cell",
 							fn: K((e) => [B(t.$slots, "group-cell", M({ ref_for: !0 }, {
-								...ar(n),
+								...or(n),
 								...e
 							}))]),
 							key: "2"
 						} : void 0,
 						W(F)["group-title"] ? {
 							name: "title",
-							fn: K(() => [B(t.$slots, "group-title", M({ ref_for: !0 }, ar(n)))]),
+							fn: K(() => [B(t.$slots, "group-title", M({ ref_for: !0 }, or(n)))]),
 							key: "3"
 						} : void 0,
 						W(F)["group-actions"] ? {
 							name: "actions",
-							fn: K(() => [B(t.$slots, "group-actions", M({ ref_for: !0 }, ar(n)))]),
+							fn: K(() => [B(t.$slots, "group-actions", M({ ref_for: !0 }, or(n)))]),
 							key: "4"
 						} : void 0
 					]), 1032, [
@@ -3284,6 +3305,7 @@ var J = /* @__PURE__ */ function(e) {
 						"expanded",
 						"active",
 						"focus-column-key",
+						"treegrid",
 						"onToggle",
 						"onRowClick",
 						"onMenuOpen"
@@ -3296,20 +3318,20 @@ var J = /* @__PURE__ */ function(e) {
 							"s-ui-table__depth-footer-row--stuck-covered": g !== void 0,
 							"s-ui-table__depth-footer-row--stuck-covered-far": _
 						}]),
-						style: P(tn(g)),
+						style: P(nn(g)),
 						"data-index": n.index,
 						"aria-rowindex": n.index + 2,
 						cells: W(Y),
-						"content-column-key": W(ln),
+						"content-column-key": W(un),
 						"cell-class": "s-ui-table__depth-footer-cell",
 						"content-class": "s-ui-table__depth-footer-content",
-						"content-style": W(On)(n.depth),
+						"content-style": W(kn)(n.depth),
 						section: W($).BODY,
 						"row-key": n.key,
-						"cell-id-prefix": hr,
-						"focus-column-key": _r(n.key)
+						"cell-id-prefix": gr,
+						"focus-column-key": vr(n.key)
 					}, {
-						default: K(() => [B(t.$slots, "depth-footer", M({ ref_for: !0 }, W(An)(n)))]),
+						default: K(() => [B(t.$slots, "depth-footer", M({ ref_for: !0 }, W(jn)(n)))]),
 						_: 2
 					}, 1032, [
 						"class",
@@ -3328,21 +3350,21 @@ var J = /* @__PURE__ */ function(e) {
 						"data-index": n.index,
 						"aria-rowindex": n.index + 2,
 						cells: W(Y),
-						"content-column-key": W(pn),
+						"content-column-key": W(Cn),
 						"content-class": "s-ui-table__load-more-content",
-						"content-style": W(On)(n.depth),
+						"content-style": W(kn)(n.depth),
 						section: W($).BODY,
 						"row-key": n.key,
-						"cell-id-prefix": hr,
-						"focus-column-key": _r(n.key)
+						"cell-id-prefix": gr,
+						"focus-column-key": vr(n.key)
 					}, {
-						default: K(() => [B(t.$slots, "load-more", M({ ref_for: !0 }, W(Nn)(n)), () => [D(W(o), {
+						default: K(() => [B(t.$slots, "load-more", M({ ref_for: !0 }, W(Pn)(n)), () => [D(W(o), {
 							appearance: W(i).BARE,
 							variant: W(r).NEUTRAL,
 							size: W(a).SMALL,
-							loading: W(jn)(n),
+							loading: W(Mn)(n),
 							tabindex: "-1",
-							onClick: (e) => W(Mn)(n)
+							onClick: (e) => W(Nn)(n)
 						}, {
 							default: K(() => [E(H(W(I)("table.loadMore")), 1)]),
 							_: 1
@@ -3385,26 +3407,27 @@ var J = /* @__PURE__ */ function(e) {
 						dragging: W(pt) === n.key,
 						"drop-position": gt(n.key),
 						"placeholder-height": d,
-						"dom-id": on(n.key),
-						selected: Xt(n.key),
-						indeterminate: Zt(n.key),
-						"row-selectable": e.selectable && W(Jt).isNodeSelectable(n.key),
+						"dom-id": cn(n.key),
+						selected: Zt(n.key),
+						indeterminate: Qt(n.key),
+						"row-selectable": e.selectable && W(Yt).isNodeSelectable(n.key),
 						active: s.value === n.key,
-						disabled: $t(n),
+						disabled: en(n),
 						"tree-indent": e.treeIndent,
 						"row-state": e.rowState?.(n.item),
 						"row-color": e.rowColor?.(n.item, n),
 						"extra-row-class": e.rowClass?.(n.item, n),
 						"extra-row-style": e.rowStyle?.(n.item, n),
-						"cell-id-prefix": hr,
-						"focus-column-key": _r(n.key),
-						onRowClick: (e) => or(n, e),
-						onRowContextMenu: (e) => sr(n, e),
-						onCellClick: (e, t) => lr(n, e, t),
+						"cell-id-prefix": gr,
+						"focus-column-key": vr(n.key),
+						treegrid: Ae.value,
+						onRowClick: (e) => sr(n, e),
+						onRowContextMenu: (e) => cr(n, e),
+						onCellClick: (e, t) => ur(n, e, t),
 						onToggleExpand: (e) => W(xe)(n.key),
-						onToggleSelected: (e) => Qt(n.key)
+						onToggleSelected: (e) => $t(n.key)
 					}, T({ _: 2 }, [
-						z(an.value, (e) => ({
+						z(on.value, (e) => ({
 							name: e,
 							fn: K((n) => [B(t.$slots, e, M({ ref_for: !0 }, n))])
 						})),
@@ -3433,7 +3456,7 @@ var J = /* @__PURE__ */ function(e) {
 							fn: K((e) => [B(t.$slots, "right-edge", M({ ref_for: !0 }, e))]),
 							key: "4"
 						} : void 0
-					]), 1032, /* @__PURE__ */ "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.onRowClick.onRowContextMenu.onCellClick.onToggleExpand.onToggleSelected".split("."))) : S("", !0)], 64));
+					]), 1032, /* @__PURE__ */ "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".split("."))) : S("", !0)], 64));
 					return V.memo = R, V;
 				}, n, 3), 128)),
 				e.loadingMore && !e.loading ? (L(!0), C(y, { key: 3 }, z(Math.min(3, e.skeletonRowCount), (e) => (L(), x(sn, {
@@ -3451,12 +3474,12 @@ var J = /* @__PURE__ */ function(e) {
 				class: "s-ui-table__create-row",
 				"aria-rowindex": W(q).length + 2,
 				cells: W(Y),
-				"content-column-key": W(dn),
+				"content-column-key": W(pn),
 				"cell-class": "s-ui-table__create-cell",
 				"content-class": "s-ui-table__create-content",
 				section: W($).CREATION,
-				"cell-id-prefix": gr,
-				"focus-column-key": vr(W($).CREATION)
+				"cell-id-prefix": _r,
+				"focus-column-key": yr(W($).CREATION)
 			}, {
 				default: K(() => [B(t.$slots, "creation-row")]),
 				_: 3
@@ -3472,20 +3495,20 @@ var J = /* @__PURE__ */ function(e) {
 				"aria-rowindex": W(q).length + 2 + +!!e.creationRow
 			}, [(L(!0), C(y, null, z(W(Y), ({ key: e, cellPlan: n }) => (L(), C(y, { key: e }, [n ? (L(), C("td", {
 				key: 1,
-				id: pr({
+				id: mr({
 					section: W($).AGGREGATE,
 					columnKey: n.descriptor.key
 				}),
-				class: N(["s-ui-table__aggregate-cell", [n.cellClass, W(Fn)(n.descriptor.key)]]),
+				class: N(["s-ui-table__aggregate-cell", [n.cellClass, W(ir)(n.descriptor.key)]]),
 				style: P(n.style),
 				"aria-colindex": n.descriptor.colIndex,
 				"data-column-key": n.descriptor.key,
 				"data-section": W($).AGGREGATE,
-				tabindex: yr(W($).AGGREGATE, void 0, n.descriptor.key)
+				tabindex: br(W($).AGGREGATE, void 0, n.descriptor.key)
 			}, [n.descriptor.column ? (L(), C(y, { key: 0 }, [W(F)[`footer:${n.descriptor.key}`] ? B(t.$slots, `footer:${n.descriptor.key}`, M({
 				key: 0,
 				ref_for: !0
-			}, W(ir)(n.descriptor.key))) : (L(), C("span", rr, H(W(Pn)(n.descriptor.key)), 1))], 64)) : S("", !0)], 14, nr)) : (L(), C("td", tr))], 64))), 128))], 8, er)) : S("", !0)])) : S("", !0)
+			}, W(ar)(n.descriptor.key))) : (L(), C("span", rr, H(W(Fn)(n.descriptor.key)), 1))], 64)) : S("", !0)], 14, nr)) : (L(), C("td", tr))], 64))), 128))], 8, er)) : S("", !0)])) : S("", !0)
 		], 44, Ln)], 4), W(lt) ? (L(), C("div", {
 			key: 0,
 			class: "s-ui-table__column-drop-line",