@deot/vc 1.0.70 → 1.0.71

package/dist/index.umd.cjs

@@ -8089,16 +8089,6 @@
 		};
 	};
 	curry$2.placeholder = curry$2;
-	var factory = (key) => (...funcs) => {
-		if (funcs.length === 0) return (arg) => arg;
-		if (funcs.length === 1) return funcs[0];
-		return funcs[key]((a, b) => {
-			return function(...args) {
-				return a.call(this, b.apply(this, args));
-			};
-		});
-	};
-	var compose = factory("reduce");
 	var partial = (fn, ...partialArgs) => {
 		return function(...nextArgs) {
 			return fn.apply(this, mergeArgs(partialArgs, nextArgs, partial));
@@ -97189,7 +97179,7 @@ element.querySelector(thumbSelector);
 		if (blot.parent == null || blot.parent.statics.blotName === "scroll" || blot.parent.statics.scope !== blot.statics.scope) return formats;
 		return bubbleFormats(blot.parent, formats, filter);
 	}
-	var import_Delta$11, NEWLINE_LENGTH, Block, BlockEmbed;
+	var import_Delta$11, NEWLINE_LENGTH, Block$1, BlockEmbed;
 	var init_block = __esmMin((() => {
 		init_parchment();
 		import_Delta$11 = /* @__PURE__ */ __toESM(require_Delta(), 1);
@@ -97197,7 +97187,7 @@ element.querySelector(thumbSelector);
 		init_inline();
 		init_text();
 		NEWLINE_LENGTH = 1;
-		Block = class extends BlockBlot$1 {
+		Block$1 = class extends BlockBlot$1 {
 			cache = {};
 			delta() {
 				if (this.cache.delta == null) this.cache.delta = blockDelta(this);
@@ -97276,10 +97266,10 @@ element.querySelector(thumbSelector);
 				return next;
 			}
 		};
-		Block.blotName = "block";
-		Block.tagName = "P";
-		Block.defaultChild = Break;
-		Block.allowedChildren = [
+		Block$1.blotName = "block";
+		Block$1.tagName = "P";
+		Block$1.defaultChild = Break;
+		Block$1.allowedChildren = [
 			Break,
 			Inline,
 			EmbedBlot$1,
@@ -97311,7 +97301,7 @@ element.querySelector(thumbSelector);
 				const lines = value.split("\n");
 				const text = lines.pop();
 				const blocks = lines.map((line) => {
-					const block = this.scroll.create(Block.blotName);
+					const block = this.scroll.create(Block$1.blotName);
 					block.insertAt(0, line);
 					return block;
 				});
@@ -97805,7 +97795,7 @@ element.querySelector(thumbSelector);
 		}
 		return parent.contains(descendant);
 	}
-	var debug$4, Range, Selection;
+	var debug$4, Range, Selection$1;
 	var init_selection = __esmMin((() => {
 		init_parchment();
 		init_emitter();
@@ -97818,7 +97808,7 @@ element.querySelector(thumbSelector);
 				this.length = length;
 			}
 		};
-		Selection = class {
+		Selection$1 = class {
 			constructor(scroll, emitter) {
 				this.emitter = emitter;
 				this.scroll = scroll;
@@ -98235,7 +98225,7 @@ element.querySelector(thumbSelector);
 							this.scroll.insertAt(index, text);
 							const [line, offset] = this.scroll.line(index);
 							let formats = merge$1({}, bubbleFormats(line));
-							if (line instanceof Block) {
+							if (line instanceof Block$1) {
 								const [leaf] = line.descendant(LeafBlot$1, offset);
 								if (leaf) formats = merge$1(formats, bubbleFormats(leaf));
 							}
@@ -98329,7 +98319,7 @@ element.querySelector(thumbSelector);
 				let leaves = [];
 				if (length === 0) this.scroll.path(index).forEach((path) => {
 					const [blot] = path;
-					if (blot instanceof Block) lines.push(blot);
+					if (blot instanceof Block$1) lines.push(blot);
 					else if (blot instanceof LeafBlot$1) leaves.push(blot);
 				});
 				else {
@@ -98387,7 +98377,7 @@ element.querySelector(thumbSelector);
 				if (this.scroll.children.length === 0) return true;
 				if (this.scroll.children.length > 1) return false;
 				const blot = this.scroll.children.head;
-				if (blot?.statics.blotName !== Block.blotName) return false;
+				if (blot?.statics.blotName !== Block$1.blotName) return false;
 				const block = blot;
 				if (block.children.length > 1) return false;
 				return block.children.head instanceof Break;
@@ -98898,7 +98888,7 @@ element.querySelector(thumbSelector);
 				if (!ScrollBlot || !("blotName" in ScrollBlot)) throw new Error(`Cannot initialize Quill without "${scrollBlotName}" blot`);
 				this.scroll = new ScrollBlot(this.options.registry, this.root, { emitter: this.emitter });
 				this.editor = new Editor$1(this.scroll);
-				this.selection = new Selection(this.scroll, this.emitter);
+				this.selection = new Selection$1(this.scroll, this.emitter);
 				this.composition = new Composition(this.scroll, this.emitter);
 				this.theme = new this.options.theme(this, this.options);
 				this.keyboard = this.theme.addModule("keyboard");
@@ -99181,7 +99171,7 @@ element.querySelector(thumbSelector);
 	//#endregion
 	//#region node_modules/.pnpm/quill@2.0.3/node_modules/quill/blots/scroll.js
 	function isLine$1(blot) {
-		return blot instanceof Block || blot instanceof BlockEmbed;
+		return blot instanceof Block$1 || blot instanceof BlockEmbed;
 	}
 	function isUpdatable(blot) {
 		return typeof blot.updateContent === "function";
@@ -99226,9 +99216,9 @@ element.querySelector(thumbSelector);
 			static blotName = "scroll";
 			static className = "ql-editor";
 			static tagName = "DIV";
-			static defaultChild = Block;
+			static defaultChild = Block$1;
 			static allowedChildren = [
-				Block,
+				Block$1,
 				BlockEmbed,
 				Container$1
 			];
@@ -99540,7 +99530,7 @@ element.querySelector(thumbSelector);
 				return `<pre>\n${escapeText(this.code(index, length))}\n</pre>`;
 			}
 		};
-		CodeBlock = class extends Block {
+		CodeBlock = class extends Block$1 {
 			static TAB = "  ";
 			static register() {
 				Quill.register(CodeBlockContainer);
@@ -101047,7 +101037,7 @@ element.querySelector(thumbSelector);
 		init_uiNode();
 		init_module();
 		Quill.register({
-			"blots/block": Block,
+			"blots/block": Block$1,
 			"blots/block/embed": BlockEmbed,
 			"blots/break": Break,
 			"blots/container": Container$1,
@@ -101109,7 +101099,7 @@ element.querySelector(thumbSelector);
 	var Blockquote;
 	var init_blockquote = __esmMin((() => {
 		init_block();
-		Blockquote = class extends Block {
+		Blockquote = class extends Block$1 {
 			static blotName = "blockquote";
 			static tagName = "blockquote";
 		};
@@ -101119,7 +101109,7 @@ element.querySelector(thumbSelector);
 	var Header;
 	var init_header = __esmMin((() => {
 		init_block();
-		Header = class extends Block {
+		Header = class extends Block$1 {
 			static blotName = "header";
 			static tagName = [
 				"H1",
@@ -101144,7 +101134,7 @@ element.querySelector(thumbSelector);
 		ListContainer = class extends Container$1 {};
 		ListContainer.blotName = "list-container";
 		ListContainer.tagName = "OL";
-		ListItem = class extends Block {
+		ListItem = class extends Block$1 {
 			static create(value) {
 				const node = super.create();
 				node.setAttribute("data-list", value);
@@ -101698,7 +101688,7 @@ element.querySelector(thumbSelector);
 	var init_table$1 = __esmMin((() => {
 		init_block();
 		init_container();
-		TableCell = class TableCell extends Block {
+		TableCell = class TableCell extends Block$1 {
 			static blotName = "table";
 			static tagName = "TD";
 			static create(value) {
@@ -108547,7 +108537,7 @@ ${p}
 		}
 	});
 	/** @jsxImportSource vue */
-	var COMPONENT_NAME$136 = "vc-alert";
+	var COMPONENT_NAME$137 = "vc-alert";
 	var THEME_MAP = {
 		info: [
 			"#456CF6",
@@ -108571,7 +108561,7 @@ ${p}
 		]
 	};
 	var Alert = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: COMPONENT_NAME$136,
+		name: COMPONENT_NAME$137,
 		props: props$93,
 		setup(props, { slots, emit }) {
 			const isActive = (0, vue.ref)(false);
@@ -110729,7 +110719,7 @@ ${p}
 			return this.target.finally(callback);
 		}
 	};
-	var COMPONENT_NAME$120 = "vc-portal";
+	var COMPONENT_NAME$121 = "vc-portal";
 	var Portal = class Portal {
 		/**
 		* 清理Portals类型组件
@@ -110776,7 +110766,7 @@ ${p}
 			this.wrapper = wrapper;
 			this.globalOptions = {
 				...options,
-				name: options?.name || wrapper.name || getUid(COMPONENT_NAME$120)
+				name: options?.name || wrapper.name || getUid(COMPONENT_NAME$121)
 			};
 		}
 		popup(propsData, options) {
@@ -110835,7 +110825,7 @@ ${p}
 		render(options, target, onFulfilled, onRejected) {
 			const { el, tag, alive, aliveRegExp, aliveVisibleKey, aliveUpdateKey, name: name$, leaveDelay, autoDestroy, multiple, fragment, onDestroyed, onBeforeCreate, insertion, globalProperties, install, components, uses, slots, parent, propsData, ...rest } = options;
 			let useAllNodes = fragment;
-			const name = multiple ? `${name$}__${getUid(COMPONENT_NAME$120)}` : name$;
+			const name = multiple ? `${name$}__${getUid(COMPONENT_NAME$121)}` : name$;
 			const container = document.createElement(tag);
 			const root = typeof el === "object" ? el : document.querySelector(el || "body");
 			!alive && Portal.leafs.get(name)?.destroy();
@@ -110867,7 +110857,7 @@ ${p}
 			} else {
 				const wrapper = this.wrapper;
 				const app = (0, vue.createApp)({
-					name: COMPONENT_NAME$120,
+					name: COMPONENT_NAME$121,
 					parent,
 					setup() {
 						if (alive) {
@@ -114579,7 +114569,7 @@ ${p}
 		}
 	});
 	/** @jsxImportSource vue */
-	var COMPONENT_NAME$95 = "vc-quarter-table";
+	var COMPONENT_NAME$96 = "vc-quarter-table";
 	/**
 	* 获取季度对应的月份范围
 	* @param panelDate ~
@@ -114606,7 +114596,7 @@ ${p}
 		}
 	};
 	var QuarterTable = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: COMPONENT_NAME$95,
+		name: COMPONENT_NAME$96,
 		props: {
 			value: Array,
 			panelDate: Date,
@@ -116061,14 +116051,14 @@ ${p}
 		}
 	});
 	/** @jsxImportSource vue */
-	var COMPONENT_NAME$85 = "vc-date-picker";
+	var COMPONENT_NAME$86 = "vc-date-picker";
 	var getPanel$1 = (type) => {
 		if (["daterange", "datetimerange"].includes(type)) return DateRangePanel;
 		else if (type === "quarterrange") return QuarterRangePanel;
 		else if (type === "monthrange") return MonthRangePanel;
 		return DatePanel;
 	};
-	var DatePicker = createPicker(COMPONENT_NAME$85, props$60, () => {
+	var DatePicker = createPicker(COMPONENT_NAME$86, props$60, () => {
 		const props = (0, vue.getCurrentInstance)().props;
 		const icon = (0, vue.ref)("date");
 		const panel = (0, vue.shallowRef)({});
@@ -116381,7 +116371,7 @@ ${p}
 		])
 	};
 	/** @jsxImportSource vue */
-	var COMPONENT_NAME$82 = "vc-scroller-track";
+	var COMPONENT_NAME$83 = "vc-scroller-track";
 	var BAR_MAP = {
 		vertical: {
 			scroll: "scrollTop",
@@ -116401,7 +116391,7 @@ ${p}
 		}
 	};
 	var Track = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: COMPONENT_NAME$82,
+		name: COMPONENT_NAME$83,
 		props: props$55,
 		emits: ["change"],
 		inheritAttrs: false,
@@ -118399,7 +118389,7 @@ ${p}
 		}
 	});
 	/** @jsxImportSource vue */
-	var COMPONENT_NAME$70 = "vc-editor-view";
+	var COMPONENT_NAME$71 = "vc-editor-view";
 	var setImages = (v) => {
 		if (!v) return;
 		const IMG_REGX = /<img.*?(?:>|\/>)/gi;
@@ -118415,7 +118405,7 @@ ${p}
 		}
 	};
 	var EditorView = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: COMPONENT_NAME$70,
+		name: COMPONENT_NAME$71,
 		props: {
 			value: {
 				type: String,
@@ -119199,7 +119189,7 @@ ${p}
 	};
 	var store_default = new IMGStore();
 	/** @jsxImportSource vue */
-	var COMPONENT_NAME$63 = "vc-image";
+	var COMPONENT_NAME$64 = "vc-image";
 	var isSupportObjectFit = false;
 	window.addEventListener("DOMContentLoaded", () => {
 		isSupportObjectFit = !IS_SERVER$3 && document.documentElement.style.objectFit !== void 0;
@@ -119212,7 +119202,7 @@ ${p}
 		SCALE_DOWN: "scale-down"
 	};
 	var Image$1 = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: COMPONENT_NAME$63,
+		name: COMPONENT_NAME$64,
 		inheritAttrs: false,
 		props: props$42,
 		setup(props, { slots, emit }) {
@@ -119632,10 +119622,10 @@ ${p}
 		alone: Boolean
 	};
 	/** @jsxImportSource vue */
-	var COMPONENT_NAME$56 = "vcm-list-item";
+	var COMPONENT_NAME$57 = "vcm-list-item";
 	var HTTP_REGEX = /[a-zA-z]+:\/\/[^\s]*/;
 	var MListItem = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: COMPONENT_NAME$56,
+		name: COMPONENT_NAME$57,
 		props: props$38,
 		emits: ["click"],
 		setup(props, { slots, emit }) {
@@ -119705,11 +119695,11 @@ ${p}
 		}
 	};
 	/** @jsxImportSource vue */
-	var COMPONENT_NAME$55 = "vc-marquee";
+	var COMPONENT_NAME$56 = "vc-marquee";
 	var ANIMATION = prefixStyle("animation").camel;
 	var TRANSFORM_KEBAB = prefixStyle("transform").kebab;
 	var Marquee = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: COMPONENT_NAME$55,
+		name: COMPONENT_NAME$56,
 		props: props$37,
 		setup(props, { slots }) {
 			const instance = (0, vue.getCurrentInstance)();
@@ -119913,10 +119903,10 @@ ${p}
 		onCancel: { type: Function }
 	};
 	/** @jsxImportSource vue */
-	var COMPONENT_NAME$53 = "vc-modal";
+	var COMPONENT_NAME$54 = "vc-modal";
 	var zIndexNumber = 1002;
 	var ModalView = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: COMPONENT_NAME$53,
+		name: COMPONENT_NAME$54,
 		emits: [
 			"update:modelValue",
 			"close",
@@ -122399,10 +122389,10 @@ ${p}
 		return keys;
 	};
 	/** @jsxImportSource vue */
-	var COMPONENT_NAME$29 = "vc-recycle-list-container";
+	var COMPONENT_NAME$30 = "vc-recycle-list-container";
 	var transformKey = prefixStyle("transform").camel;
 	var Container = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: COMPONENT_NAME$29,
+		name: COMPONENT_NAME$30,
 		props: props$18,
 		emits: ["refresh"],
 		setup(props, { slots }) {
@@ -123330,15 +123320,28 @@ ${p}
 		let v1;
 		if (typeof v !== "undefined") {
 			v1 = parseWidth(v);
-			if (isNaN(v1)) v = 80;
+			if (isNaN(v1)) v1 = 80;
 		}
 		return v1;
 	};
 	/**
+	* 由叶子列生成 CSS Grid 的 grid-template-columns 值。
+	* 最后一列 minmax 兜底，容器更宽时由其撑满。
+	* @param columns 叶子列
+	* @returns 模板值
+	*/
+	var computeGridTemplateColumns = (columns = []) => {
+		return columns.map((column, index) => {
+			const { states } = column;
+			const width = states.realWidth || states.width || 80;
+			return index === columns.length - 1 ? `minmax(${width}px, 1fr)` : `${width}px`;
+		}).join(" ");
+	};
+	/**
 	* 行 -> 唯一key
-	* @param row ~
-	* @param primaryKey ~
-	* @returns ~
+	* @param row 表格行数据
+	* @param primaryKey 行主键字段名或取值函数
+	* @returns 行的唯一标识值
 	*/
 	var getRowValue = (row, primaryKey) => {
 		if (row.__KEY__) return row.__KEY__;
@@ -123368,81 +123371,18 @@ ${p}
 		return arrayMap;
 	};
 	/**
-	* ~
-	* @param columns ~
-	* @param columnId ~
-	* @returns ~
-	*/
-	var getColumnById = (columns, columnId) => {
-		let column = null;
-		columns.forEach((item) => {
-			if (item.id === columnId) column = item;
-		});
-		return column;
-	};
-	/**
-	* ~
-	* @param columns ~
-	* @param cell ~
-	* @returns ~
+	* 展开列树为叶子列节点数组
+	* @param nodes 列树
+	* @returns 叶子列节点
 	*/
-	var getColumnByCell = (columns, cell) => {
-		const matches = (cell.className || "").match(/vc-table_[^\s]+/gm);
-		if (matches) return getColumnById(columns, matches[0]);
-		return null;
-	};
-	/**
-	* ~
-	* @param e ~
-	* @returns ~
-	*/
-	var getCell = (e) => {
-		let cell = e.target;
-		while (cell && cell.tagName.toUpperCase() !== "HTML") {
-			if (cell.classList.contains("vc-table__td")) return cell;
-			cell = cell.parentNode;
-		}
-		return null;
-	};
-	var getAllColumns = (columns) => {
+	var flattenColumnNodes = (nodes) => {
 		const result = [];
-		columns.forEach((column) => {
-			if (column.children) {
-				result.push(column);
-				result.push(...getAllColumns(column.children));
-			} else result.push(column);
+		nodes.forEach((node) => {
+			if (node.childNodes.length) result.push(...flattenColumnNodes(node.childNodes));
+			else result.push(node);
 		});
 		return result;
 	};
-	var columnsToRowsEffect = (v) => {
-		let maxLevel = 1;
-		const traverse = (column, parent) => {
-			if (parent) {
-				column.level = parent.level + 1;
-				if (maxLevel < column.level) maxLevel = column.level;
-			}
-			if (column.children) {
-				let colspan = 0;
-				column.children.forEach((subColumn) => {
-					traverse(subColumn, column);
-					colspan += subColumn.colspan;
-				});
-				column.colspan = colspan;
-			} else column.colspan = 1;
-		};
-		v.forEach((column) => {
-			column.level = 1;
-			traverse(column);
-		});
-		const rows = [];
-		for (let i = 0; i < maxLevel; i++) rows.push([]);
-		getAllColumns(v).forEach((column) => {
-			if (!column.children) column.rowspan = maxLevel - column.level + 1;
-			else column.rowspan = 1;
-			rows[column.level - 1].push(column);
-		});
-		return rows;
-	};
 	var flattenData = (data, opts = {}) => {
 		const result = [];
 		data.forEach((item) => {
@@ -123488,6 +123428,34 @@ ${p}
 			if (!isNil(children)) _walker(item, children, baseLevel);
 		});
 	};
+	/**
+	* 存在副作用
+	* 对 statusArr 做添加和删除的操作
+	* @param statusArr 状态数组（如 selection / expandRows）
+	* @param row 目标行数据
+	* @param newVal 指定展开/选中与否；省略时切换
+	* @param batch 为 true 时，使用 delete（批处理使用 splice 性能差，使用 delete 后统一再处理）
+	* @returns 是否发生变更
+	*/
+	var toggleRowStatus = (statusArr, row, newVal, batch = false) => {
+		let changed = false;
+		const index = statusArr.indexOf(row);
+		const included = index !== -1;
+		const addRow = () => {
+			statusArr.push(row);
+			changed = true;
+		};
+		const removeRow = () => {
+			if (!batch) statusArr.splice(index, 1);
+			else delete statusArr[index];
+			changed = true;
+		};
+		if (typeof newVal === "boolean") {
+			if (newVal && !included) addRow();
+			else if (!newVal && included) removeRow();
+		} else included ? removeRow() : addRow();
+		return changed;
+	};
 	var BaseWatcher = class {
 		states = (0, vue.reactive)({
 			_data: [],
@@ -123516,16 +123484,400 @@ ${p}
 			treeLazyColumnIdentifier: "hasChildren",
 			treeChildrenColumnName: "children",
 			isComplex: (0, vue.computed)(() => this.states.leftFixedColumns.length > 0 || this.states.rightFixedColumns.length > 0),
+			hasMergeCells: (0, vue.computed)(() => this.states.list.some((item) => !!item.cells)),
 			isGroup: (0, vue.computed)(() => this.states.columns.length > this.states.originColumns.length),
-			columns: (0, vue.computed)(() => concat(this.states.leftFixedLeafColumns, this.states.leafColumns, this.states.rightFixedLeafColumns)),
-			leafColumns: (0, vue.computed)(() => flattenData(this.states.notFixedColumns)),
-			leftFixedLeafColumns: (0, vue.computed)(() => flattenData(this.states.leftFixedColumns)),
-			rightFixedLeafColumns: (0, vue.computed)(() => flattenData(this.states.rightFixedColumns)),
+			columns: (0, vue.computed)(() => {
+				return concat(this.states.leftFixedLeafColumns, this.states.leafColumns, this.states.rightFixedLeafColumns);
+			}),
+			leafColumns: (0, vue.computed)(() => flattenColumnNodes(this.states.notFixedColumns)),
+			leftFixedLeafColumns: (0, vue.computed)(() => flattenColumnNodes(this.states.leftFixedColumns)),
+			rightFixedLeafColumns: (0, vue.computed)(() => flattenColumnNodes(this.states.rightFixedColumns)),
 			leafColumnsLength: (0, vue.computed)(() => this.states.leafColumns.length),
 			leftFixedLeafColumnsLength: (0, vue.computed)(() => this.states.leftFixedLeafColumns.length),
 			rightFixedLeafColumnsLength: (0, vue.computed)(() => this.states.rightFixedLeafColumns.length)
 		});
 	};
+	/**
+	* 归一化 getSpan 的返回值：[rowspan, colspan] | { rowspan, colspan } -> { rowspan, colspan }
+	* @param v getSpan 返回值
+	* @returns 归一化后的 rowspan / colspan
+	*/
+	var normalizeSpan = (v) => {
+		if (Array.isArray(v)) return {
+			rowspan: v[0] ?? 1,
+			colspan: v[1] ?? 1
+		};
+		if (v && typeof v === "object") return {
+			rowspan: v.rowspan ?? 1,
+			colspan: v.colspan ?? 1
+		};
+		return {
+			rowspan: 1,
+			colspan: 1
+		};
+	};
+	/**
+	* 基于 getSpan 预求值合并信息，产出"合并计划"：
+	* 	- 以"行方向连续合并块"为最小单位切块（与虚拟化语义保持一致，块即 RecycleList 的最小渲染单位）；
+	* 	- 含合并的块附带 cells[]（坐标 + span 的一维数组，被覆盖的格子已剔除），交给 TableGrid 渲染；
+	* 	- 不含合并的块 cells 为空，渲染层按行合成 1×1 cells；
+	* 	- covers: rowIndex -> 覆盖该行的合并 anchor 坐标（rowspan > 1，不含 anchor 本行），供 hover 关联高亮。
+	* @param data 当前数据（外部已完成排序/过滤）
+	* @param columns 叶子列
+	* @param getSpan ({ row, column, rowIndex, columnIndex }) => [rowspan, colspan] | { rowspan, colspan }
+	* @returns 合并计划，形如 { blocks: [{ start, end, cells? }], covers }
+	*/
+	var computeMergePlan = (data, columns, getSpan) => {
+		const rowCount = data.length;
+		const columnCount = columns.length;
+		let spans = null;
+		let skip = null;
+		let reach = null;
+		for (let r = 0; r < rowCount; r++) for (let c = 0; c < columnCount; c++) {
+			const key = r * columnCount + c;
+			if (skip && skip.has(key)) continue;
+			const v = normalizeSpan(getSpan({
+				row: data[r],
+				column: columns[c].states,
+				rowIndex: r,
+				columnIndex: c
+			}));
+			if (v.rowspan === 1 && v.colspan === 1) continue;
+			if (!spans) {
+				spans = /* @__PURE__ */ new Map();
+				skip = /* @__PURE__ */ new Set();
+				reach = Array.from({ length: rowCount }, (_, i) => i);
+			}
+			if (v.rowspan < 1 || v.colspan < 1) {
+				skip.add(key);
+				continue;
+			}
+			const rowspan = Math.min(v.rowspan, rowCount - r);
+			const colspan = Math.min(v.colspan, columnCount - c);
+			if (rowspan === 1 && colspan === 1) continue;
+			spans.set(key, {
+				rowspan,
+				colspan
+			});
+			for (let i = r; i < r + rowspan; i++) for (let j = c; j < c + colspan; j++) {
+				if (i === r && j === c) continue;
+				skip.add(i * columnCount + j);
+			}
+			reach[r] = Math.max(reach[r], r + rowspan - 1);
+		}
+		if (!spans) {
+			const blocks = new Array(rowCount);
+			for (let r = 0; r < rowCount; r++) blocks[r] = {
+				start: r,
+				end: r
+			};
+			return {
+				blocks,
+				covers: null
+			};
+		}
+		const blocks = [];
+		let start = 0;
+		let end = 0;
+		for (let r = 0; r < rowCount; r++) {
+			end = Math.max(end, reach[r]);
+			if (r === end) {
+				blocks.push({
+					start,
+					end
+				});
+				start = r + 1;
+				end = r + 1;
+			}
+		}
+		blocks.forEach((block) => {
+			let hasMerge = block.end > block.start;
+			const cells = [];
+			for (let r = block.start; r <= block.end; r++) for (let c = 0; c < columnCount; c++) {
+				const key = r * columnCount + c;
+				if (skip.has(key)) {
+					hasMerge = true;
+					continue;
+				}
+				const span = spans.get(key);
+				if (span) hasMerge = true;
+				cells.push({
+					rowIndex: r,
+					columnIndex: c,
+					rowspan: span?.rowspan || 1,
+					colspan: span?.colspan || 1
+				});
+			}
+			if (hasMerge) block.cells = cells;
+		});
+		const covers = /* @__PURE__ */ new Map();
+		spans.forEach((span, key) => {
+			if (span.rowspan <= 1) return;
+			const r = Math.floor(key / columnCount);
+			const c = key % columnCount;
+			for (let i = r + 1; i < r + span.rowspan; i++) {
+				let anchors = covers.get(i);
+				if (!anchors) covers.set(i, anchors = []);
+				anchors.push({
+					rowIndex: r,
+					columnIndex: c
+				});
+			}
+		});
+		return {
+			blocks,
+			covers: covers.size ? covers : null
+		};
+	};
+	/**
+	* 虚拟化块编排：list 构建、getSpan 合并计划缓存与 list 重组。
+	*/
+	var Block = class {
+		store;
+		_cache = {
+			data: null,
+			length: 0,
+			columnsKey: "",
+			getSpan: null,
+			plan: null
+		};
+		constructor(store) {
+			this.store = store;
+		}
+		buildInitialList(data) {
+			const { primaryKey } = this.store.table.props;
+			return data.map((row, index) => {
+				const id = primaryKey ? getRowValue(row, primaryKey) : index;
+				return {
+					id: typeof id === "undefined" ? index : id,
+					rows: [{
+						index,
+						data: row
+					}],
+					rowStart: index,
+					expand: false
+				};
+			});
+		}
+		/**
+		* 按 getSpan 合并计划重组 states.list：为合并块生成 cells，并写入 rowStart。
+		* 只有存在合并时，才全量构建cells, 主要目的是一个block内含多少个row数据；（性能后续再优化）
+		*/
+		rebuildMergeList() {
+			const { getSpan, primaryKey } = this.store.table.props;
+			const { data, columns, list } = this.store.states;
+			if (typeof getSpan !== "function" || !data.length || !columns.length) return;
+			const columnsKey = columns.map((column) => column.states.id).join(",");
+			const cache = this._cache;
+			let plan = cache.plan;
+			if (!plan || cache.data !== data || cache.length !== data.length || cache.columnsKey !== columnsKey || cache.getSpan !== getSpan) {
+				plan = computeMergePlan(data, columns, getSpan);
+				this._cache = {
+					data,
+					length: data.length,
+					columnsKey,
+					getSpan,
+					plan
+				};
+			}
+			const flatRows = list.reduce((pre, block) => (pre.push(...block.rows), pre), []);
+			if (flatRows.length !== data.length) return;
+			this.store.states.list = plan.blocks.map((block) => {
+				const rows = flatRows.slice(block.start, block.end + 1);
+				const id = primaryKey ? rows.map((row) => getRowValue(row.data, primaryKey)).join(",") : block.start;
+				return {
+					id: typeof id === "undefined" ? block.start : id,
+					rows,
+					expand: false,
+					cells: block.cells,
+					rowStart: block.start
+				};
+			});
+		}
+		getCoverAnchors(rowIndex) {
+			return this._cache.plan?.covers?.get(rowIndex) || [];
+		}
+	};
+	var getAllColumns = (columns) => {
+		const result = [];
+		columns.forEach((column) => {
+			if (column.childNodes.length) {
+				result.push(column);
+				result.push(...getAllColumns(column.childNodes));
+			} else result.push(column);
+		});
+		return result;
+	};
+	var columnsToRowsEffect = (v) => {
+		let maxLevel = 1;
+		const traverse = (column, parent) => {
+			if (parent) {
+				column.states.level = parent.states.level + 1;
+				if (maxLevel < column.states.level) maxLevel = column.states.level;
+			}
+			if (column.childNodes.length) {
+				let colspan = 0;
+				column.childNodes.forEach((subColumn) => {
+					traverse(subColumn, column);
+					colspan += subColumn.states.colspan;
+				});
+				column.states.colspan = colspan;
+			} else column.states.colspan = 1;
+		};
+		v.forEach((column) => {
+			column.states.level = 1;
+			traverse(column);
+		});
+		const rows = [];
+		for (let i = 0; i < maxLevel; i++) rows.push([]);
+		getAllColumns(v).forEach((column) => {
+			if (!column.childNodes.length) column.states.rowspan = maxLevel - column.states.level + 1;
+			else column.states.rowspan = 1;
+			rows[column.states.level - 1].push(column);
+		});
+		return rows;
+	};
+	var COLUMN_SYNC_KEYS = [
+		"id",
+		"hidden",
+		"label",
+		"prop",
+		"type"
+	];
+	var Column = class {
+		store;
+		_sync = {
+			snapshot: [],
+			suppressWatch: false
+		};
+		constructor(store) {
+			this.store = store;
+		}
+		insert(column, index, parent) {
+			const array = parent ? parent.childNodes : this.store.states._columns;
+			if (typeof index !== "undefined") array.splice(index, 0, column);
+			else array.push(column);
+			if (column.states.type === "selection") {
+				this.store.states.selectable = column.states.selectable;
+				this.store.states.reserveSelection = !!column.states.reserveSelection;
+			}
+			if (this.store.table.exposed.isReady.value) {
+				this.store.updateColumns();
+				this.store.scheduleLayout();
+			}
+		}
+		remove(column, parent) {
+			const array = parent ? parent.childNodes : this.store.states._columns;
+			const index = array.indexOf(column);
+			if (index > -1) array.splice(index, 1);
+			if (this.store.table.exposed.isReady.value) {
+				this.store.updateColumns();
+				this.store.scheduleLayout();
+			}
+		}
+		/**
+		* 更新列派生状态（leftFixed/rightFixed/originColumns/headerRows）。
+		* 不调用 Block、不 emit。
+		*/
+		update() {
+			const { states } = this.store;
+			const _columns = states._columns || [];
+			if (_columns[0] && _columns[0].states.type === "selection" && !_columns[0].states.fixed) {
+				if (_columns.some((column) => column.states.fixed === true || column.states.fixed === "left")) _columns[0].states.fixed = true;
+			}
+			const visibleColumns = this.cloneVisibleTree(_columns);
+			const leftFixedColumns = visibleColumns.filter((column) => column.states.fixed === true || column.states.fixed === "left");
+			const rightFixedColumns = visibleColumns.filter((column) => column.states.fixed === "right");
+			const notFixedColumns = visibleColumns.filter((column) => !column.states.fixed);
+			const originColumns = concat(leftFixedColumns, notFixedColumns, rightFixedColumns);
+			const headerRows = columnsToRowsEffect(originColumns);
+			states.leftFixedColumns = leftFixedColumns;
+			states.notFixedColumns = notFixedColumns;
+			states.rightFixedColumns = rightFixedColumns;
+			states.originColumns = originColumns;
+			states.headerRows = headerRows;
+		}
+		/**
+		* 基于 _columns 生成"可见树"：剔除 hidden 列。
+		* 仅克隆含子列的分组节点（避免 columnsToRowsEffect 把 colspan/level/rowspan
+		* 写回原列节点造成残留）；leaf 列保持原引用，以便 Layout 写回 realWidth/stickyStyle/stickyClass。
+		* @param arr 列节点集合
+		* @returns 可见列节点集合
+		*/
+		cloneVisibleTree(arr) {
+			const walk = (list) => {
+				const out = [];
+				for (const column of list) {
+					if (column.states.hidden) continue;
+					if (column.childNodes.length) {
+						const children = walk(column.childNodes);
+						if (children.length === 0) continue;
+						out.push(column.cloneNode(children));
+					} else out.push(column);
+				}
+				return out;
+			};
+			return walk(arr);
+		}
+		/**
+		* 向外部 emit update:columns。
+		* 暴露全部收集到的 leaf 列（含被隐藏的，带 hidden 标记），不做可见性过滤。
+		*/
+		syncToParent() {
+			const columns = flattenColumnNodes(this.store.states._columns).map((column) => pick(column.states, COLUMN_SYNC_KEYS));
+			if (isEqualWith(columns.map((i) => pick(i, COLUMN_SYNC_KEYS)), this._sync.snapshot.map((i) => pick(i, COLUMN_SYNC_KEYS)))) return;
+			this._sync.snapshot = columns;
+			this._sync.suppressWatch = true;
+			this.store.table.emit("update:columns", columns);
+		}
+		/**
+		* 处理外部对 v-model:columns 的写回：
+		* 	1) 按 id 把 hidden 回写到内部列节点（递归含 childNodes，覆盖多级表头）；
+		* 	2) 按 id 对齐顺序重排顶层 _columns（缺失项按原相对顺序补在末尾，避免误丢列）。
+		* @param v 外部写回的列数组
+		*/
+		applyExternal(v) {
+			if (this._sync.suppressWatch) {
+				this._sync.suppressWatch = false;
+				return;
+			}
+			const _columns = this.store.states._columns;
+			if (!Array.isArray(v) || !v.length) return;
+			const hiddenById = v.reduce((pre, e) => (e && e.id != null && pre.set(e.id, !!e.hidden), pre), /* @__PURE__ */ new Map());
+			let hiddenChanged = false;
+			const applyHidden = (list) => {
+				for (const column of list) {
+					if (hiddenById.has(column.states.id)) {
+						const v1 = hiddenById.get(column.states.id);
+						if (!!column.states.hidden !== v1) {
+							column.states.hidden = v1;
+							hiddenChanged = true;
+						}
+					}
+					if (column.childNodes.length) applyHidden(column.childNodes);
+				}
+			};
+			applyHidden(_columns);
+			const order = v.map((e) => e?.id).filter(Boolean);
+			const idToCol = _columns.reduce((pre, column) => (pre.set(column.states.id, column), pre), /* @__PURE__ */ new Map());
+			const used = /* @__PURE__ */ new Set();
+			const reordered = [];
+			for (const id of order) {
+				const column = idToCol.get(id);
+				if (column && !used.has(column)) {
+					reordered.push(column);
+					used.add(column);
+				}
+			}
+			for (const column of _columns) if (!used.has(column)) reordered.push(column);
+			const orderChanged = !(reordered.length === _columns.length && reordered.every((column, i) => column === _columns[i]));
+			orderChanged && (this.store.states._columns = reordered);
+			if (orderChanged || hiddenChanged) {
+				this.store.updateColumns();
+				this.store.scheduleLayout();
+			}
+		}
+	};
 	var Expand$1 = class {
 		store;
 		constructor(store) {
@@ -123547,7 +123899,7 @@ ${p}
 		toggle(row, expanded) {
 			const store = this.store;
 			const { expandRows } = store.states;
-			if (store.toggleRowStatus(expandRows, row, expanded)) {
+			if (toggleRowStatus(expandRows, row, expanded)) {
 				store.table.emit("expand-change", row, expandRows.slice());
 				store.scheduleLayout();
 			}
@@ -123571,12 +123923,165 @@ ${p}
 			return expandRows.indexOf(row) !== -1;
 		}
 	};
-	var Current = class {
+	var Layout = class {
+		table;
+		store;
+		states = (0, vue.reactive)({
+			height: null,
+			scrollX: false,
+			scrollY: false,
+			bodyWidth: null,
+			tableHeight: null,
+			headerHeight: 44,
+			appendHeight: 0,
+			footerHeight: 44,
+			bodyHeight: null
+		});
+		/**
+		* grid-template-columns 唯一真源：经表根 `--vc-table-columns` CSS 变量下发，
+		* header / body 的所有 TableGrid 消费 var()，列宽变化只写表根一个节点。
+		*/
+		templateColumns = (0, vue.computed)(() => computeGridTemplateColumns(this.store.states.columns));
+		constructor(store) {
+			this.store = store;
+			this.table = store.table;
+			if (!this.table) throw new VcError("table", "Table Layout 必须包含table实例");
+			if (!this.store) throw new VcError("table", "Table Layout 必须包含store实例");
+		}
+		updateScrollY() {
+			const { height, bodyHeight } = this.states;
+			if (height === null || bodyHeight === null) return;
+			const bodyYWrapper = this.table.exposed.bodyYWrapper.value;
+			if (this.table.vnode.el && bodyYWrapper) this.states.scrollY = bodyYWrapper.offsetHeight > bodyHeight;
+		}
+		setHeight(value, prop = "height") {
+			if (IS_SERVER$3) return;
+			const el = this.table.vnode.el;
+			value = parseHeight(value);
+			this.states.height = value;
+			if (!el && (value || value === 0)) return (0, vue.nextTick)(() => this.setHeight(value, prop));
+			if (value) {
+				el.style[prop] = `${value}px`;
+				this.updateElsHeight();
+			}
+		}
+		setMaxHeight(value) {
+			this.setHeight(value, "max-height");
+		}
+		updateElsHeight() {
+			if (!this.table.exposed.isReady.value) return (0, vue.nextTick)(() => this.updateElsHeight());
+			const table = this.table.exposed;
+			const headerWrapper = table.headerWrapper.value;
+			const appendWrapper = table.appendWrapper.value;
+			const footerWrapper = table.footerWrapper.value;
+			const { showHeader } = this.table.props;
+			this.states.appendHeight = appendWrapper ? appendWrapper.offsetHeight : 0;
+			if (showHeader && !headerWrapper) return;
+			const headerHeight = !showHeader ? 0 : headerWrapper.offsetHeight;
+			this.states.headerHeight = headerHeight;
+			if (showHeader && headerWrapper.offsetWidth > 0 && (this.store.states.columns || []).length > 0 && headerHeight < 2) return (0, vue.nextTick)(() => this.updateElsHeight());
+			const tableHeight = this.table.vnode.el.clientHeight;
+			this.states.tableHeight = tableHeight;
+			const footerHeight = footerWrapper ? footerWrapper.offsetHeight : 0;
+			this.states.footerHeight = footerHeight;
+			if (this.states.height !== null) this.states.bodyHeight = tableHeight - headerHeight - footerHeight + (footerWrapper ? 1 : 0);
+			this.updateScrollY();
+		}
+		updateColumnsWidth() {
+			if (IS_SERVER$3) return;
+			const bodyWidth = this.table.vnode.el.clientWidth;
+			let bodyMinWidth = 0;
+			const flattenColumns = this.store.states.columns;
+			const flexColumns = flattenColumns.filter((column) => typeof column.states.width !== "number");
+			const { fit } = this.table.props;
+			if (flexColumns.length > 0 && fit) {
+				flattenColumns.forEach((column) => {
+					bodyMinWidth += column.states.width || column.states.minWidth || 80;
+				});
+				if (bodyMinWidth <= bodyWidth) {
+					this.states.scrollX = false;
+					const totalFlexWidth = bodyWidth - bodyMinWidth;
+					if (flexColumns.length === 1) flexColumns[0].states.realWidth = (flexColumns[0].states.minWidth || 80) + totalFlexWidth;
+					else {
+						const flexWidthPerPixel = totalFlexWidth / flexColumns.reduce((prev, column) => prev + (column.states.minWidth || 80), 0);
+						let noneFirstWidth = 0;
+						flexColumns.forEach((column, index) => {
+							if (index === 0) return;
+							const flexWidth = Math.floor((column.states.minWidth || 80) * flexWidthPerPixel);
+							noneFirstWidth += flexWidth;
+							column.states.realWidth = (column.states.minWidth || 80) + flexWidth;
+						});
+						flexColumns[0].states.realWidth = (flexColumns[0].states.minWidth || 80) + totalFlexWidth - noneFirstWidth;
+					}
+				} else {
+					this.states.scrollX = true;
+					flexColumns.forEach((column) => {
+						column.states.realWidth = column.states.width || column.states.minWidth;
+					});
+				}
+				this.states.bodyWidth = Math.max(bodyMinWidth, bodyWidth);
+				this.table.exposed.resizeState.value.width = this.states.bodyWidth;
+			} else {
+				flattenColumns.forEach((column) => {
+					if (!column.states.width && !column.states.minWidth) column.states.realWidth = 80;
+					else column.states.realWidth = column.states.width || column.states.minWidth;
+					bodyMinWidth += column.states.realWidth;
+				});
+				this.states.scrollX = bodyMinWidth > bodyWidth;
+				this.states.bodyWidth = bodyMinWidth;
+			}
+			this.syncStickyOffsets();
+		}
+		/**
+		* 提前计算固定列的 sticky 偏移并写到列节点 states 上（包含分组列），渲染层（header /
+		* body-row / footer）从 column.stickyStyle / column.stickyClass 直接消费即可。
+		* 非固定列上的 sticky 信息一并清除，避免列从 fixed 切换为非 fixed 时残留。
+		*/
+		syncStickyOffsets() {
+			const { leftFixedColumns = [], rightFixedColumns = [], notFixedColumns = [] } = this.store.states;
+			leftFixedColumns.reduce((offset, column, index) => {
+				column.states.stickyOffset = offset;
+				column.states.stickyStyle = {
+					position: "sticky",
+					left: `${offset}px`
+				};
+				column.states.stickyClass = "is-fixed-left";
+				if (index === leftFixedColumns.length - 1) column.states.stickyClass += " is-fixed-left-tail";
+				offset += column.states.realWidth || column.states.width || 0;
+				return offset;
+			}, 0);
+			rightFixedColumns.reduceRight((offset, column, index) => {
+				column.states.stickyOffset = offset;
+				column.states.stickyStyle = {
+					position: "sticky",
+					right: `${offset}px`
+				};
+				column.states.stickyClass = "is-fixed-right";
+				if (index === rightFixedColumns.length - 1) column.states.stickyClass += " is-fixed-right-head";
+				offset += column.states.realWidth || column.states.width || 0;
+				return offset;
+			}, 0);
+			notFixedColumns.forEach((column) => {
+				column.states.stickyOffset = void 0;
+				column.states.stickyStyle = void 0;
+				column.states.stickyClass = void 0;
+			});
+		}
+	};
+	var Row = class {
 		store;
 		constructor(store) {
 			this.store = store;
 		}
-		reset(id) {
+		setHoverIndex(index) {
+			this.store.states.hoverRowIndex = index;
+		}
+		set(row) {
+			const old = this.store.states.currentRow;
+			this.store.states.currentRow = row;
+			if (old !== row) this.store.table.emit("current-change", row, old);
+		}
+		setById(id) {
 			const store = this.store;
 			const { primaryKey } = store.table.props;
 			store.checkPrimaryKey();
@@ -123599,6 +124104,102 @@ ${p}
 			}
 		}
 	};
+	var Selection = class {
+		store;
+		constructor(store) {
+			this.store = store;
+		}
+		isSelected(row) {
+			const { selection = [] } = this.store.states;
+			return selection.includes(row);
+		}
+		clear() {
+			this.store.states.isAllSelected = false;
+			const oldSelection = this.store.states.selection;
+			if (this.store.states.selection.length) this.store.states.selection = [];
+			if (oldSelection.length > 0) this.store.table.emit("selection-change", []);
+		}
+		clean() {
+			const { primaryKey } = this.store.table.props;
+			const { selection = [], data } = this.store.states;
+			let deleted;
+			if (primaryKey) {
+				deleted = [];
+				const selectedMap = getValuesMap(selection, primaryKey);
+				const dataMap = getValuesMap(data, primaryKey);
+				for (const key in selectedMap) if (hasOwn$1(selectedMap, key) && !dataMap[key]) deleted.push(selectedMap[key].row);
+			} else deleted = selection.filter((item) => {
+				return !this.store.flatData.value.includes(item);
+			});
+			deleted.forEach((deletedItem) => {
+				selection.splice(selection.indexOf(deletedItem), 1);
+			});
+			if (deleted.length) {
+				const newSelection = selection.filter((item) => !deleted.includes(item));
+				this.store.states.selection = newSelection;
+				this.store.table.emit("selection-change", newSelection.slice());
+			}
+		}
+		toggle(row, selected, emitChange = true) {
+			const { selection } = this.store.states;
+			if (toggleRowStatus(selection, row, selected)) {
+				const newSelection = (this.store.states.selection || []).slice();
+				if (emitChange) this.store.table.emit("select", newSelection, row);
+				this.store.table.emit("selection-change", newSelection);
+			}
+		}
+		toggleAll = debounce(() => {
+			const { indeterminate } = this.store.table.props;
+			const { selection, isAllSelected, selectable } = this.store.states;
+			const value = indeterminate ? !isAllSelected : !(isAllSelected || selection.length);
+			this.store.states.isAllSelected = value;
+			let selectionChanged = false;
+			this.store.flatData.value.forEach((row, index) => {
+				if (selectable) {
+					if (selectable.call(null, row, index) && toggleRowStatus(selection, row, value, true)) selectionChanged = true;
+				} else if (toggleRowStatus(selection, row, value, true)) selectionChanged = true;
+			});
+			this.store.states.selection = [...selection].filter((i) => typeof i !== "undefined");
+			const selection$ = this.store.states.selection.slice();
+			if (selectionChanged) this.store.table.emit("selection-change", selection$);
+			this.store.table.emit("select-all", selection$);
+		}, 10);
+		updateByRowKey() {
+			const { primaryKey } = this.store.table.props;
+			const { selection } = this.store.states;
+			const selectedMap = getValuesMap(selection, primaryKey);
+			this.store.states.selection = this.store.flatData.value.reduce((prev, row) => {
+				if (selectedMap[getRowValue(row, primaryKey)]) prev.push(row);
+				return prev;
+			}, []);
+		}
+		updateAllSelected() {
+			const { selectable, data = [] } = this.store.states;
+			if (data.length === 0) {
+				this.store.states.isAllSelected = false;
+				return;
+			}
+			let isAllSelected = true;
+			let selectedCount = 0;
+			const temp = this.store.flatData.value;
+			for (let i = 0, j = temp.length; i < j; i++) {
+				const row = temp[i];
+				const isRowSelectable = selectable && selectable.call(null, row, i);
+				if (!this.isSelected(row)) {
+					if (!selectable || isRowSelectable) {
+						isAllSelected = false;
+						break;
+					}
+				} else selectedCount++;
+			}
+			if (selectedCount === 0) isAllSelected = false;
+			this.store.states.isAllSelected = isAllSelected;
+		}
+		rowChanged(row) {
+			this.toggle(row);
+			this.updateAllSelected();
+		}
+	};
 	var Tree$1 = class {
 		store;
 		/**
@@ -123665,7 +124266,7 @@ ${p}
 			return max$2(data.map((item) => {
 				const traverse = (source) => {
 					if (!source) return 0;
-					if (source.expanded && source.children.length > 0) return max$2([source.level, ...source.children.map((key) => traverse(treeData[key]))]);
+					if (source.expand && source.children.length > 0) return max$2([source.level, ...source.children.map((key) => traverse(treeData[key]))]);
 					else return source.level;
 				};
 				return traverse(treeData[getRowValue(item, primaryKey)]);
@@ -123680,14 +124281,14 @@ ${p}
 				const { defaultExpandAll } = this.store.table.props;
 				const { treeData: oldTreeData, treeExpandRowValue, treeLazy } = this.store.states;
 				const rootLazyRowValue = [];
-				const getExpanded = (oldValue, key) => {
+				const getExpand = (oldValue, key) => {
 					const included = defaultExpandAll || treeExpandRowValue && treeExpandRowValue.indexOf(key) !== -1;
-					return !!(oldValue && oldValue.expanded || included);
+					return !!(oldValue && oldValue.expand || included);
 				};
 				keys.forEach((key) => {
 					const oldValue = oldTreeData[key];
 					const newValue = { ...nested[key] };
-					newValue.expanded = getExpanded(oldValue, key);
+					newValue.expand = getExpand(oldValue, key);
 					if (newValue.lazy) {
 						const { loaded = false, loading = false } = oldValue || {};
 						newValue.loaded = !!loaded;
@@ -123709,7 +124310,7 @@ ${p}
 							lazy: true,
 							loaded: !!loaded,
 							loading: !!loading,
-							expanded: getExpanded(oldValue, key),
+							expand: getExpand(oldValue, key),
 							children: lazyNodeChildren,
 							level: ""
 						});
@@ -123729,11 +124330,11 @@ ${p}
 			const { treeData } = this.store.states;
 			const id = getRowValue(row, primaryKey);
 			const data = id && treeData[id];
-			if (id && data && "expanded" in data) {
-				const oldExpanded = data.expanded;
-				expanded = typeof expanded === "undefined" ? !data.expanded : expanded;
-				this.store.states.treeData[id].expanded = expanded;
-				if (oldExpanded !== expanded) this.store.table.emit("expand-change", row, expanded, this.getMaxLevel());
+			if (id && data && "expand" in data) {
+				const oldExpand = data.expand;
+				expanded = typeof expanded === "undefined" ? !data.expand : expanded;
+				this.store.states.treeData[id].expand = expanded;
+				if (oldExpand !== expanded) this.store.table.emit("expand-change", row, expanded, this.getMaxLevel());
 				this.store.updateTableScrollY();
 			}
 		}
@@ -123758,7 +124359,7 @@ ${p}
 					if (!Array.isArray(data)) throw new VcError("table", "data必须是数组");
 					this.store.states.treeData[key].loading = false;
 					this.store.states.treeData[key].loaded = true;
-					this.store.states.treeData[key].expanded = true;
+					this.store.states.treeData[key].expand = true;
 					/**
 					* 处理tree中和返回的数据与首次相同的情况，
 					*/
@@ -123779,10 +124380,10 @@ ${p}
 							return pre.concat(treelazyNodeMap[cur]);
 						}, []);
 					}
-					if (this.store.isSelected(row)) data.forEach((i) => {
-						this.store.toggleRowSelection(i);
+					if (this.store.selection.isSelected(row)) data.forEach((i) => {
+						this.store.selection.toggle(i);
 					});
-					this.store.updateAllSelected();
+					this.store.selection.updateAllSelected();
 					/**
 					* 计算最大的level, 有必要添加$nextTick
 					* TODO: 去除$nextTick, 期间会触发一次update
@@ -123798,156 +124399,15 @@ ${p}
 			}
 		}
 	};
-	var Layout = class {
-		table;
-		store;
-		states = (0, vue.reactive)({
-			height: null,
-			scrollX: false,
-			scrollY: false,
-			bodyWidth: null,
-			tableHeight: null,
-			headerHeight: 44,
-			appendHeight: 0,
-			footerHeight: 44,
-			bodyHeight: null
-		});
-		constructor(store) {
-			this.store = store;
-			this.table = store.table;
-			if (!this.table) throw new VcError("table", "Table Layout 必须包含table实例");
-			if (!this.store) throw new VcError("table", "Table Layout 必须包含store实例");
-		}
-		updateScrollY() {
-			const { height, bodyHeight } = this.states;
-			if (height === null || bodyHeight === null) return;
-			const bodyYWrapper = this.table.exposed.bodyYWrapper.value;
-			if (this.table.vnode.el && bodyYWrapper) this.states.scrollY = bodyYWrapper.offsetHeight > bodyHeight;
-		}
-		setHeight(value, prop = "height") {
-			if (IS_SERVER$3) return;
-			const el = this.table.vnode.el;
-			value = parseHeight(value);
-			this.states.height = value;
-			if (!el && (value || value === 0)) return (0, vue.nextTick)(() => this.setHeight(value, prop));
-			if (value) {
-				el.style[prop] = `${value}px`;
-				this.updateElsHeight();
-			}
-		}
-		setMaxHeight(value) {
-			this.setHeight(value, "max-height");
-		}
-		updateElsHeight() {
-			if (!this.table.exposed.isReady.value) return (0, vue.nextTick)(() => this.updateElsHeight());
-			const table = this.table.exposed;
-			const headerWrapper = table.headerWrapper.value;
-			const appendWrapper = table.appendWrapper.value;
-			const footerWrapper = table.footerWrapper.value;
-			const { showHeader } = this.table.props;
-			this.states.appendHeight = appendWrapper ? appendWrapper.offsetHeight : 0;
-			if (showHeader && !headerWrapper) return;
-			const headerHeight = !showHeader ? 0 : headerWrapper.offsetHeight;
-			this.states.headerHeight = headerHeight;
-			if (showHeader && headerWrapper.offsetWidth > 0 && (this.store.states.columns || []).length > 0 && headerHeight < 2) return (0, vue.nextTick)(() => this.updateElsHeight());
-			const tableHeight = this.table.vnode.el.clientHeight;
-			this.states.tableHeight = tableHeight;
-			const footerHeight = footerWrapper ? footerWrapper.offsetHeight : 0;
-			this.states.footerHeight = footerHeight;
-			if (this.states.height !== null) this.states.bodyHeight = tableHeight - headerHeight - footerHeight + (footerWrapper ? 1 : 0);
-			this.updateScrollY();
-		}
-		updateColumnsWidth() {
-			if (IS_SERVER$3) return;
-			const bodyWidth = this.table.vnode.el.clientWidth;
-			let bodyMinWidth = 0;
-			const flattenColumns = this.store.states.columns;
-			const flexColumns = flattenColumns.filter((column) => typeof column.width !== "number");
-			const { fit } = this.table.props;
-			if (flexColumns.length > 0 && fit) {
-				flattenColumns.forEach((column) => {
-					bodyMinWidth += column.width || column.minWidth || 80;
-				});
-				if (bodyMinWidth <= bodyWidth) {
-					this.states.scrollX = false;
-					const totalFlexWidth = bodyWidth - bodyMinWidth;
-					if (flexColumns.length === 1) flexColumns[0].realWidth = (flexColumns[0].minWidth || 80) + totalFlexWidth;
-					else {
-						const flexWidthPerPixel = totalFlexWidth / flexColumns.reduce((prev, column) => prev + (column.minWidth || 80), 0);
-						let noneFirstWidth = 0;
-						flexColumns.forEach((column, index) => {
-							if (index === 0) return;
-							const flexWidth = Math.floor((column.minWidth || 80) * flexWidthPerPixel);
-							noneFirstWidth += flexWidth;
-							column.realWidth = (column.minWidth || 80) + flexWidth;
-						});
-						flexColumns[0].realWidth = (flexColumns[0].minWidth || 80) + totalFlexWidth - noneFirstWidth;
-					}
-				} else {
-					this.states.scrollX = true;
-					flexColumns.forEach((column) => {
-						column.realWidth = column.width || column.minWidth;
-					});
-				}
-				this.states.bodyWidth = Math.max(bodyMinWidth, bodyWidth);
-				this.table.exposed.resizeState.value.width = this.states.bodyWidth;
-			} else {
-				flattenColumns.forEach((column) => {
-					if (!column.width && !column.minWidth) column.realWidth = 80;
-					else column.realWidth = column.width || column.minWidth;
-					bodyMinWidth += column.realWidth;
-				});
-				this.states.scrollX = bodyMinWidth > bodyWidth;
-				this.states.bodyWidth = bodyMinWidth;
-			}
-			this.syncStickyOffsets();
-		}
-		/**
-		* 提前计算固定列的 sticky 偏移并写到列对象上（包含分组列），渲染层（header /
-		* body-row / footer）从 column.stickyLeft / column.stickyRight 直接消费即可。
-		* 非固定列上的 sticky 信息一并清除，避免列从 fixed 切换为非 fixed 时残留。
-		*/
-		syncStickyOffsets() {
-			const { leftFixedColumns = [], rightFixedColumns = [], notFixedColumns = [] } = this.store.states;
-			leftFixedColumns.reduce((offset, column, index) => {
-				column.stickyOffset = offset;
-				column.stickyStyle = {
-					position: "sticky",
-					left: `${offset}px`
-				};
-				column.stickyClass = "is-fixed-left";
-				if (index === leftFixedColumns.length - 1) column.stickyClass += " is-fixed-left-tail";
-				offset += column.realWidth || column.width || 0;
-				return offset;
-			}, 0);
-			rightFixedColumns.reduceRight((offset, column, index) => {
-				column.stickyOffset = offset;
-				column.stickyStyle = {
-					position: "sticky",
-					right: `${offset}px`
-				};
-				column.stickyClass = "is-fixed-right";
-				if (index === rightFixedColumns.length - 1) column.stickyClass += " is-fixed-right-head";
-				offset += column.realWidth || column.width || 0;
-				return offset;
-			}, 0);
-			notFixedColumns.forEach((column) => {
-				delete column.stickyOffset;
-				delete column.stickyStyle;
-				delete column.stickyClass;
-			});
-		}
-	};
 	var Store$1 = class extends BaseWatcher {
 		table;
-		current;
+		row;
 		expand;
 		tree;
+		block;
+		column;
 		layout;
-		_columnsSync = {
-			snapshot: [],
-			suppressWatch: false
-		};
+		selection;
 		flatData = (0, vue.computed)(() => {
 			if (this.table.props.expandSelectable) return concat(flattenData(this.states.data, {
 				parent: true,
@@ -123959,10 +124419,13 @@ ${p}
 			super();
 			if (!options.table) throw new VcError("table", "table必传");
 			this.table = options.table;
-			this.current = new Current(this);
+			this.row = new Row(this);
 			this.expand = new Expand$1(this);
 			this.tree = new Tree$1(this);
+			this.block = new Block(this);
+			this.column = new Column(this);
 			this.layout = new Layout(this);
+			this.selection = new Selection(this);
 			const { props } = options.table;
 			merge$1(this.states, {
 				expandSelectable: props.expandSelectable,
@@ -123972,58 +124435,36 @@ ${p}
 			});
 		}
 		setData(data) {
-			const { primaryKey } = this.table.props;
 			const dataInstanceChanged = this.states._data !== data;
 			this.states._data = data;
 			this.states.data = data;
-			const caches = /* @__PURE__ */ new Map();
-			this.states.list.forEach((item) => {
-				item.rows.forEach((row) => {
-					caches.set(row.data, row);
-				});
-			});
-			this.states.list = data.reduce((pre, row, index) => {
-				const rows = [{
-					index,
-					data: row,
-					height: (caches.get(row) || {}).height || ""
-				}];
-				const id = primaryKey ? rows.map((rowData) => getRowValue(rowData.data, primaryKey)).join(",") : index;
-				pre.push({
-					id: typeof id === "undefined" ? index : id,
-					rows,
-					expand: false
-				});
-				return pre;
-			}, []);
-			caches.clear();
+			this.states.list = this.block.buildInitialList(data);
+			this.block.rebuildMergeList();
 			/**
 			* 数据变化，更新部分数据。
 			* 没有使用 computed，而是手动更新部分数据
 			* https://github.com/vuejs/vue/issues/6660#issuecomment-331417140
 			*/
-			this.current.update();
+			this.row.update();
 			this.expand.update();
-			if (!this.states.reserveSelection) if (dataInstanceChanged) this.clearSelection();
-			else this.cleanSelection();
+			if (!this.states.reserveSelection) if (dataInstanceChanged) this.selection.clear();
+			else this.selection.clean();
 			else {
 				this.checkPrimaryKey();
-				this.updateSelectionByRowKey();
+				this.selection.updateByRowKey();
 			}
-			this.updateAllSelected();
+			this.selection.updateAllSelected();
 			this.updateTableScrollY();
 		}
-		rowSelectedChanged(row) {
-			this.toggleRowSelection(row);
-			this.updateAllSelected();
-		}
-		setHoverRow(index) {
-			this.states.hoverRowIndex = index;
+		updateColumns() {
+			this.column.update();
+			this.block.rebuildMergeList();
+			this.column.syncToParent();
 		}
-		setCurrentRow(row) {
-			const oldCurrentRow = this.states.currentRow;
-			this.states.currentRow = row;
-			if (oldCurrentRow !== row) this.table.emit("current-change", row, oldCurrentRow);
+		toggleRowExpansionAdapter(row, expanded) {
+			const { columns } = this.states;
+			if (columns.some((node) => node.states.type === "expand")) this.expand.toggle(row, expanded);
+			else this.tree.toggle(row, expanded);
 		}
 		/**
 		* 检查 primaryKey 是否存在
@@ -124032,297 +124473,10 @@ ${p}
 			const { primaryKey } = this.table.props;
 			if (!primaryKey) {}
 		}
-		/**
-		* states
-		* 	-> _columns
-		* 	-> selectable
-		* 	-> reserveSelection
-		* @param column ~
-		* @param index ~
-		* @param parent ~
-		*/
-		insertColumn(column, index, parent) {
-			let array = this.states._columns;
-			if (parent) {
-				array = parent.children;
-				if (!array) {
-					array = [];
-					parent.children = array;
-				}
-			}
-			if (typeof index !== "undefined") array.splice(index, 0, column);
-			else array.push(column);
-			if (column.type === "selection") {
-				this.states.selectable = column.selectable;
-				this.states.reserveSelection = column.reserveSelection;
-			}
-			if (this.table.exposed.isReady.value) {
-				this.updateColumns();
-				this.scheduleLayout();
-			}
-		}
-		removeColumn(column, parent) {
-			let array = this.states._columns;
-			if (parent) array = parent.children || [];
-			if (array) array.splice(array.indexOf(column), 1);
-			if (this.table.exposed.isReady.value) {
-				this.updateColumns();
-				this.scheduleLayout();
-			}
-		}
-		/**
-		* 更新列
-		* leftFixedColumns: 左fixed
-		* rightFixedColumns: 右fixed
-		* originColumns: 中（包括左右）
-		* columns: 展开以上
-		* leafColumnsLength
-		* leftFixedLeafColumnsLength
-		* rightFixedLeafColumnsLength
-		* isComplex: 是否包含固定列
-		*/
-		updateColumns() {
-			const { states } = this;
-			const _columns = states._columns || [];
-			if (_columns[0] && _columns[0].type === "selection" && !_columns[0].fixed) {
-				if (_columns.some((column) => column.fixed === true || column.fixed === "left")) _columns[0].fixed = true;
-			}
-			const visibleColumns = this.cloneVisibleTree(_columns);
-			const leftFixedColumns = visibleColumns.filter((column) => column.fixed === true || column.fixed === "left");
-			const rightFixedColumns = visibleColumns.filter((column) => column.fixed === "right");
-			const notFixedColumns = visibleColumns.filter((column) => !column.fixed);
-			const originColumns = concat(leftFixedColumns, notFixedColumns, rightFixedColumns);
-			const headerRows = columnsToRowsEffect(originColumns);
-			states.leftFixedColumns = leftFixedColumns;
-			states.notFixedColumns = notFixedColumns;
-			states.rightFixedColumns = rightFixedColumns;
-			states.originColumns = originColumns;
-			states.headerRows = headerRows;
-			this.syncColumnsToParent();
-		}
-		/**
-		* 基于 _columns 生成"可见树"：剔除 hidden 列。
-		* 仅克隆含 children 的父节点（避免 columnsToRowsEffect 把 colspan/level/rowspan
-		* 写回原列对象造成残留）；leaf 列保持原引用，以便 Layout 写回 realWidth/stickyStyle/stickyClass。
-		* @param arr 列集合
-		* @returns 可见列集合
-		*/
-		cloneVisibleTree(arr) {
-			const walk = (list) => {
-				const out = [];
-				for (const column of list) {
-					if (column.hidden) continue;
-					if (column.children && column.children.length) {
-						const children = walk(column.children);
-						if (children.length === 0) continue;
-						out.push({
-							...column,
-							children
-						});
-					} else out.push(column);
-				}
-				return out;
-			};
-			return walk(arr);
-		}
-		/**
-		* 向外部 emit update:columns。
-		* 暴露全部收集到的 leaf 列（含被隐藏的，带 hidden 标记），不做可见性过滤。
-		* 指纹同时纳入 id 顺序与各列 hidden 状态：
-		* 	- 外部写回（顺序/hidden）后内部应用，指纹不变 -> 不重复 emit，避免回环；
-		* 	- 内部列增删导致变化 -> 指纹变化 -> emit 通知外部。
-		*/
-		syncColumnsToParent() {
-			const keys = [
-				"id",
-				"hidden",
-				"label",
-				"prop",
-				"type"
-			];
-			const columns = flattenData(this.states._columns).map((column) => pick(column, keys));
-			if (isEqualWith(columns.map((i) => pick(i, keys)), this._columnsSync.snapshot.map((i) => pick(i, keys)))) return;
-			this._columnsSync.snapshot = columns;
-			this._columnsSync.suppressWatch = true;
-			this.table.emit("update:columns", columns);
-		}
-		/**
-		* 处理外部对 v-model:columns 的写回：
-		* 	1) 按 id 把 hidden 回写到内部列对象（递归含 children，覆盖多级表头）；
-		* 	2) 按 id 对齐顺序重排顶层 _columns（缺失项按原相对顺序补在末尾，避免误丢列）。
-		* @param v 外部写回的列数组
-		*/
-		applyExternalColumns(v) {
-			if (this._columnsSync.suppressWatch) {
-				this._columnsSync.suppressWatch = false;
-				return;
-			}
-			const _columns = this.states._columns;
-			if (!Array.isArray(v) || !v.length) return;
-			const hiddenById = v.reduce((pre, e) => (e && e.id != null && pre.set(e.id, !!e.hidden), pre), /* @__PURE__ */ new Map());
-			let hiddenChanged = false;
-			const applyHidden = (list) => {
-				for (const column of list) {
-					if (hiddenById.has(column.id)) {
-						const v1 = hiddenById.get(column.id);
-						if (!!column.hidden !== v1) {
-							column.hidden = v1;
-							hiddenChanged = true;
-						}
-					}
-					if (column.children && column.children.length) applyHidden(column.children);
-				}
-			};
-			applyHidden(_columns);
-			const order = v.map((e) => e?.id).filter(Boolean);
-			const idToCol = _columns.reduce((pre, column) => (pre.set(column.id, column), pre), /* @__PURE__ */ new Map());
-			const used = /* @__PURE__ */ new Set();
-			const reordered = [];
-			for (const id of order) {
-				const column = idToCol.get(id);
-				if (column && !used.has(column)) {
-					reordered.push(column);
-					used.add(column);
-				}
-			}
-			for (const column of _columns) if (!used.has(column)) reordered.push(column);
-			const orderChanged = !(reordered.length === _columns.length && reordered.every((column, i) => column === _columns[i]));
-			orderChanged && (this.states._columns = reordered);
-			if (orderChanged || hiddenChanged) {
-				this.updateColumns();
-				this.scheduleLayout();
-			}
-		}
-		isSelected(row) {
-			const { selection = [] } = this.states;
-			return selection.includes(row);
-		}
-		/**
-		* 清除选择
-		*/
-		clearSelection() {
-			this.states.isAllSelected = false;
-			const oldSelection = this.states.selection;
-			if (this.states.selection.length) this.states.selection = [];
-			if (oldSelection.length > 0) this.table.emit("selection-change", []);
-		}
-		/**
-		* 清理选择
-		*/
-		cleanSelection() {
-			const { primaryKey } = this.table.props;
-			const { selection = [], data } = this.states;
-			let deleted;
-			if (primaryKey) {
-				deleted = [];
-				const selectedMap = getValuesMap(selection, primaryKey);
-				const dataMap = getValuesMap(data, primaryKey);
-				for (const key in selectedMap) if (hasOwn$1(selectedMap, key) && !dataMap[key]) deleted.push(selectedMap[key].row);
-			} else deleted = selection.filter((item) => {
-				return !this.flatData.value.includes(item);
-			});
-			deleted.forEach((deletedItem) => {
-				selection.splice(selection.indexOf(deletedItem), 1);
-			});
-			if (deleted.length) {
-				const newSelection = selection.filter((item) => !deleted.includes(item));
-				this.states.selection = newSelection;
-				this.table.emit("selection-change", newSelection.slice());
-			}
-		}
-		/**
-		* 存在副作用
-		* 对statusArr做添加和删除的操作
-		* 如 this.states.selection
-		* @param statusArr ~
-		* @param row ~
-		* @param newVal ~
-		* @param batch 为true时，使用delete (批处理使用splice性能差，使用delete后统一再处理)
-		* @returns ~
-		*/
-		toggleRowStatus(statusArr, row, newVal, batch = false) {
-			let changed = false;
-			const index = statusArr.indexOf(row);
-			const included = index !== -1;
-			const addRow = () => {
-				statusArr.push(row);
-				changed = true;
-			};
-			const removeRow = () => {
-				if (!batch) statusArr.splice(index, 1);
-				else delete statusArr[index];
-				changed = true;
-			};
-			if (typeof newVal === "boolean") {
-				if (newVal && !included) addRow();
-				else if (!newVal && included) removeRow();
-			} else included ? removeRow() : addRow();
-			return changed;
-		}
-		toggleRowSelection(row, selected, emitChange = true) {
-			const { selection } = this.states;
-			if (this.toggleRowStatus(selection, row, selected)) {
-				const newSelection = (this.states.selection || []).slice();
-				if (emitChange) this.table.emit("select", newSelection, row);
-				this.table.emit("selection-change", newSelection);
-			}
-		}
-		toggleAllSelection = debounce(() => {
-			const { indeterminate } = this.table.props;
-			const { selection, isAllSelected, selectable } = this.states;
-			const value = indeterminate ? !isAllSelected : !(isAllSelected || selection.length);
-			this.states.isAllSelected = value;
-			let selectionChanged = false;
-			this.flatData.value.forEach((row, index) => {
-				if (selectable) {
-					if (selectable.call(null, row, index) && this.toggleRowStatus(selection, row, value, true)) selectionChanged = true;
-				} else if (this.toggleRowStatus(selection, row, value, true)) selectionChanged = true;
-			});
-			this.states.selection = [...selection].filter((i) => typeof i !== "undefined");
-			const selection$ = this.states.selection.slice();
-			if (selectionChanged) this.table.emit("selection-change", selection$);
-			this.table.emit("select-all", selection$);
-		}, 10);
-		toggleRowExpansionAdapter(row, expanded) {
-			const { columns } = this.states;
-			if (columns.some(({ type }) => type === "expand")) this.expand.toggle(row, expanded);
-			else this.tree.toggle(row, expanded);
-		}
 		setExpandRowValueAdapter(val) {
 			this.expand.reset(val);
 			this.tree.expand(val);
 		}
-		updateSelectionByRowKey() {
-			const { primaryKey } = this.table.props;
-			const { selection } = this.states;
-			const selectedMap = getValuesMap(selection, primaryKey);
-			this.states.selection = this.flatData.value.reduce((prev, row) => {
-				if (selectedMap[getRowValue(row, primaryKey)]) prev.push(row);
-				return prev;
-			}, []);
-		}
-		updateAllSelected() {
-			const { selectable, data = [] } = this.states;
-			if (data.length === 0) {
-				this.states.isAllSelected = false;
-				return;
-			}
-			let isAllSelected = true;
-			let selectedCount = 0;
-			const temp = this.flatData.value;
-			for (let i = 0, j = temp.length; i < j; i++) {
-				const row = temp[i];
-				const isRowSelectable = selectable && selectable.call(null, row, i);
-				if (!this.isSelected(row)) {
-					if (!selectable || isRowSelectable) {
-						isAllSelected = false;
-						break;
-					}
-				} else selectedCount++;
-			}
-			if (selectedCount === 0) isAllSelected = false;
-			this.states.isAllSelected = isAllSelected;
-		}
 		updateTableScrollY() {
 			(0, vue.nextTick)(() => this.table.exposed.updateScrollY());
 		}
@@ -124332,8 +124486,8 @@ ${p}
 		}
 	};
 	var useStates = (mapper, $store) => {
-		const store = $store || (0, vue.inject)("vc-table")?.store;
-		const states = (0, vue.reactive)({});
+		const store = $store || (0, vue.inject)("vc-table").store;
+		const states = {};
 		Object.keys(mapper).forEach((key) => {
 			const value = mapper[key];
 			if (typeof value === "string") states[key] = (0, vue.computed)(() => {
@@ -124344,44 +124498,126 @@ ${p}
 			});
 			else console.error("invalid value type");
 		});
-		return states;
+		return (0, vue.reactive)(states);
 	};
+	/**
+	* 非虚拟化路径：直接渲染块内容。
+	* grid 下行高由内容撑开、同一 grid 行内 cell 高度天然同步，无需测高回写。
+	*/
 	var NormalList = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "vc-table-normal-list",
 		props: { data: {
 			type: Array,
 			default: () => []
 		} },
-		emits: ["row-resize"],
-		setup(props, { emit, slots }) {
-			let resizeChanges = [];
-			const emitChanges = () => {
-				if (resizeChanges.length > 0) {
-					emit("row-resize", resizeChanges);
-					resizeChanges = [];
-				}
-			};
-			const handleResize = (e, index) => {
-				resizeChanges.push({
-					index,
-					size: e.height
-				});
-				(0, vue.nextTick)(emitChanges);
-			};
+		setup(props, { slots }) {
 			return () => {
-				return props.data.map((mergeData, index) => {
-					return (0, vue.createVNode)(Resizer, {
-						"key": mergeData.id,
-						"fill": false,
-						"onResize": (e) => handleResize(e, index)
-					}, { default: () => [slots.default?.({
-						row: mergeData,
+				return props.data.map((block, index) => {
+					return (0, vue.createVNode)(vue.Fragment, { "key": block.id }, [slots.default?.({
+						row: block,
 						index
-					})] });
+					})]);
 				});
 			};
 		}
 	});
+	/**
+	* 基于 CSS Grid 的公共布局层，header（多级表头）与 body（getSpan 合并块）共用。
+	* - 列宽模板单源：表格内消费表根的 `--vc-table-columns` CSS 变量（layout 统一产出，
+	*   列宽变化只写表根一个节点）；独立使用时回退为按 columns 本地计算；
+	* - cell 定位使用 grid-row/column-start + span，anchor cell 上输出 aria-rowspan/aria-colspan；
+	* - rowStart 为虚拟化扩展点：cells 的 rowIndex 为绝对行号，按 rowStart 平移映射 grid 行号，
+	*   未来若 RecycleList 支持跨窗口 anchor，可直接以窗口起始行号作为 rowStart 渲染窗口内 cells。
+	*/
+	var TableGrid = /* @__PURE__ */ (0, vue.defineComponent)({
+		name: "vc-table-grid",
+		props: {
+			columns: {
+				type: Array,
+				default: () => []
+			},
+			cells: {
+				type: Array,
+				default: () => []
+			},
+			rowStart: {
+				type: Number,
+				default: 0
+			},
+			rowHeight: [Number, String],
+			role: {
+				type: String,
+				default: "rowgroup"
+			},
+			cellRole: {
+				type: String,
+				default: "cell"
+			}
+		},
+		setup(props) {
+			const table = (0, vue.inject)("vc-table", null);
+			const localTemplateColumns = (0, vue.computed)(() => computeGridTemplateColumns(props.columns));
+			const gridTemplateColumns = (0, vue.computed)(() => table ? "var(--vc-table-columns)" : localTemplateColumns.value);
+			const rowHeight = (0, vue.computed)(() => parseHeight(props.rowHeight));
+			return () => {
+				const columnCount = props.columns.length;
+				return (0, vue.createVNode)("div", {
+					"class": "vc-table__grid",
+					"role": props.role,
+					"style": {
+						gridTemplateColumns: gridTemplateColumns.value,
+						gridAutoRows: rowHeight.value ? `${rowHeight.value}px` : void 0
+					}
+				}, [props.cells.map((cell) => {
+					const rowspan = cell.rowspan || 1;
+					const colspan = cell.colspan || 1;
+					return (0, vue.createVNode)("div", (0, vue.mergeProps)(cell.attrs || {}, {
+						"key": cell.key ?? `${cell.rowIndex}:${cell.columnIndex}`,
+						"role": props.cellRole,
+						"aria-rowspan": rowspan > 1 ? rowspan : void 0,
+						"aria-colspan": colspan > 1 ? colspan : void 0,
+						"class": [cell.class, {
+							"is-grid-first": cell.columnIndex === 0,
+							"is-grid-last": cell.columnIndex + colspan >= columnCount
+						}],
+						"style": [cell.style, {
+							gridRow: `${cell.rowIndex - props.rowStart + 1} / span ${rowspan}`,
+							gridColumn: `${cell.columnIndex + 1} / span ${colspan}`
+						}]
+					}), [cell.render?.(cell)]);
+				})]);
+			};
+		}
+	});
+	/** @jsxImportSource vue */
+	/**
+	* 展开行内容：作为块内 `<TableGrid />` 的兄弟节点渲染，
+	* 每个展开行输出一条全宽内容行（`vc-table__tr is-expanded` + 全宽 cell）。
+	* 高度变化由块级 Resize 观察自然回馈到虚拟化布局。
+	*/
+	var TableExpand = /* @__PURE__ */ (0, vue.defineComponent)({
+		name: "vc-table-expand",
+		props: { rows: {
+			type: Array,
+			default: () => []
+		} },
+		setup(props) {
+			const table = (0, vue.inject)("vc-table");
+			return () => {
+				const renderExpand = table.renderExpand.value;
+				if (!renderExpand) return null;
+				return props.rows.map((row) => (0, vue.createVNode)("div", {
+					"key": `expand-${row.index}`,
+					"class": "vc-table__tr is-expanded",
+					"data-row": row.index
+				}, [(0, vue.createVNode)("div", { "class": "vc-table__td vc-table__expanded-cell" }, [renderExpand({
+					row: row.data,
+					rowIndex: row.index,
+					store: table.store
+				})])]));
+			};
+		}
+	});
 	var HIDDEN_TEXT_STYLE = `
 	position: absolute!important;
 	word-break: break-all!important;
@@ -124454,19 +124690,21 @@ ${p}
 		}
 		return endIndex;
 	};
-	var TableBodyRow = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: "vc-table-body-row",
-		props: {
-			data: {
-				type: Object,
-				required: true
-			},
-			index: {
-				type: Number,
-				required: true
-			},
-			height: { type: [Number, String] }
-		},
+	/** @jsxImportSource vue */
+	/**
+	* 块渲染（虚拟化最小单位）：
+	* 	- 单行块（无合并，绝大多数场景）：容器即 `vc-table__tr`（行语义 + grid 容器 + cells 直接父级）；
+	* 	- 多行合并块：容器为 `vc-table__tr-group`；用户 row-class/row-style 无效；
+	* 	- stripe / highlight / expand 等内部行态统一挂 cell；用户 row-class/row-style 仍仅挂单行块 `vc-table__tr`；
+	* 	- cell 事件走容器级委托（cells 只带 data-row / data-column，无 per-cell 闭包）；
+	* 	- 展开行以 `<TableGrid /> + <TableExpand />` 兄弟结构渲染在块内。
+	*/
+	var TableBodyBlock = /* @__PURE__ */ (0, vue.defineComponent)({
+		name: "vc-table-body-block",
+		props: { store: {
+			type: Object,
+			required: true
+		} },
 		setup(props) {
 			const table = (0, vue.inject)("vc-table");
 			const states = useStates({
@@ -124474,20 +124712,10 @@ ${p}
 				currentRow: "currentRow",
 				expandRows: "expandRows"
 			});
-			const selected = (0, vue.computed)(() => table.store.isSelected(props.data));
-			const maxColumnIndex = (0, vue.computed)(() => states.columns.length - 1);
-			const getRowClass = (row, rowIndex) => {
-				const classes = ["vc-table__row"];
-				if (table.props.highlight && row === states.currentRow) classes.push("current-row");
-				if (table.props.stripe && rowIndex % 2 === 1) classes.push("vc-table__row--striped");
-				const rowClass = table.props.rowClass;
-				if (typeof rowClass === "string") classes.push(rowClass);
-				else if (typeof rowClass === "function") classes.push(rowClass.call(null, {
-					row,
-					rowIndex
-				}));
-				if (states.expandRows.indexOf(row) > -1) classes.push("expanded");
-				return classes;
+			const getValueOfRow = (row, index) => {
+				const { primaryKey } = table.props;
+				if (primaryKey) return getRowValue(row, primaryKey);
+				return index;
 			};
 			const getCellStyle = (rowIndex, columnIndex, row, column) => {
 				const { cellStyle } = table.props;
@@ -124518,7 +124746,23 @@ ${p}
 				}));
 				return classes.join(" ");
 			};
-			const getRowStyle = (row, rowIndex) => {
+			const getInternalCellClass = (row, rowIndex) => {
+				const classes = [];
+				if (table.props.highlight && row === states.currentRow) classes.push("current-row");
+				if (table.props.stripe && rowIndex % 2 === 1) classes.push("vc-table__row--striped", "is-striped");
+				if (states.expandRows.indexOf(row) > -1) classes.push("expanded");
+				return classes;
+			};
+			const getUserRowClass = (row, rowIndex) => {
+				const { rowClass } = table.props;
+				if (typeof rowClass === "string") return rowClass;
+				if (typeof rowClass === "function") return rowClass.call(null, {
+					row,
+					rowIndex
+				});
+				return "";
+			};
+			const getUserRowStyle = (row, rowIndex) => {
 				const { rowStyle } = table.props;
 				if (typeof rowStyle === "function") return rowStyle.call(null, {
 					row,
@@ -124526,19 +124770,35 @@ ${p}
 				});
 				return rowStyle || null;
 			};
-			let poper;
-			const handleCellMouseEnter = (e, row, column) => {
-				const cell = getCell(e);
-				const hoverState = {
-					cell,
-					column,
-					row
-				};
-				if (cell) {
-					table.hoverState.value = hoverState;
-					table.emit("cell-mouse-enter", hoverState.row, hoverState.column, hoverState.cell, e);
+			const resolveCellEl = (e) => {
+				const root = e.currentTarget;
+				let node = e.target;
+				while (node && node !== root) {
+					if (node.parentElement === root) return node.classList?.contains?.("vc-table__td") ? node : null;
+					node = node.parentElement;
 				}
-				const el = e.target.querySelector(".vc-table__text-line");
+				return null;
+			};
+			const resolveCell = (e) => {
+				const cellEl = resolveCellEl(e);
+				if (!cellEl) return null;
+				const rowIndex = Number(cellEl.dataset.row);
+				const columnIndex = Number(cellEl.dataset.column);
+				const rowStart = props.store.rowStart ?? (props.store.rows[0]?.index || 0);
+				const row = props.store.rows[rowIndex - rowStart];
+				const columnNode = states.columns[columnIndex];
+				if (!row || !columnNode) return null;
+				return {
+					cellEl,
+					row: row.data,
+					rowIndex,
+					column: columnNode.states,
+					columnIndex
+				};
+			};
+			let poper;
+			const showTextLineTooltip = (cellEl, row, column) => {
+				const el = cellEl.querySelector(".vc-table__text-line");
 				const line = typeof column.line !== "undefined" ? column.line : VcInstance.options.TableColumn?.line;
 				if (!el || !line) return;
 				const value = `${row[column.prop]}`;
@@ -124561,101 +124821,132 @@ ${p}
 					});
 				}
 			};
-			const handleCellMouseLeave = (e, row, column) => {
-				const cell = getCell(e);
-				if (!cell) return;
-				table.emit("cell-mouse-leave", row, column, cell, e);
-			};
-			const handleMouseEnter = debounce((index) => {
-				table.store.setHoverRow(index);
+			const handleHoverEnter = debounce((index) => {
+				table.store.row.setHoverIndex(index);
 			}, 30);
-			const handleMouseLeave = debounce(() => {
-				table.store.setHoverRow(null);
+			const handleHoverLeave = debounce(() => {
+				table.store.row.setHoverIndex(null);
 			}, 30);
-			const handleEvent = (e, row, name) => {
-				const cell = getCell(e);
-				let column;
-				if (cell) {
-					column = getColumnByCell(states.columns, cell);
-					if (column) table.emit(`cell-${name}`, row, column, cell, e);
-				}
-				table.emit(`row-${name}`, row, column, e);
+			const enterCell = (e, cell) => {
+				handleHoverEnter(cell.rowIndex);
+				table.hoverState.value = {
+					cell: cell.cellEl,
+					column: cell.column,
+					row: cell.row
+				};
+				table.emit("cell-mouse-enter", cell.row, cell.column, cell.cellEl, e);
+				showTextLineTooltip(cell.cellEl, cell.row, cell.column);
 			};
-			const handleContextMenu = (e, row) => {
-				handleEvent(e, row, "contextmenu");
+			const leaveCell = (e, cell) => {
+				table.emit("cell-mouse-leave", cell.row, cell.column, cell.cellEl, e);
 			};
-			const handleDoubleClick = (e, row) => {
-				handleEvent(e, row, "dblclick");
+			let activeCell = null;
+			const handleMouseOver = (e) => {
+				const cell = resolveCell(e);
+				if (activeCell && cell && activeCell.cellEl === cell.cellEl) return;
+				if (activeCell) leaveCell(e, activeCell);
+				activeCell = cell;
+				if (cell) enterCell(e, cell);
 			};
-			const handleClick = (e, row) => {
-				table.store.setCurrentRow(row);
-				handleEvent(e, row, "click");
+			const handleMouseLeave = (e) => {
+				if (activeCell) {
+					leaveCell(e, activeCell);
+					activeCell = null;
+				}
+				handleHoverLeave();
+			};
+			const handleEvent = (e, name) => {
+				const cell = resolveCell(e);
+				if (!cell) return;
+				table.emit(`cell-${name}`, cell.row, cell.column, cell.cellEl, e);
+				table.emit(`row-${name}`, cell.row, cell.column, e);
+				return cell;
+			};
+			const handleClick = (e) => {
+				const cell = resolveCell(e);
+				if (!cell) return;
+				table.store.row.set(cell.row);
+				table.emit("cell-click", cell.row, cell.column, cell.cellEl, e);
+				table.emit("row-click", cell.row, cell.column, e);
 			};
 			(0, vue.onBeforeUnmount)(() => {
 				poper && poper.destroy();
+				handleHoverEnter.cancel();
+				handleHoverLeave.cancel();
 			});
 			return () => {
-				return (0, vue.createVNode)("div", {
-					"class": [getRowClass(props.data, props.index), "vc-table__tr"],
-					"style": getRowStyle(props.data, props.index),
-					"data-row": props.index,
-					"onDblclick": (e) => handleDoubleClick(e, props.data),
-					"onClick": (e) => handleClick(e, props.data),
-					"onContextmenu": (e) => handleContextMenu(e, props.data),
-					"onMouseenter": () => handleMouseEnter(props.index),
-					"onMouseleave": () => handleMouseLeave()
-				}, [states.columns.map((column, columnIndex) => {
-					const { realWidth, renderCell } = column;
-					const sizeStyle = {
-						width: `${realWidth}px`,
-						height: `${props.height ? `${props.height}px` : "auto"}`
-					};
-					return (0, vue.createVNode)("div", {
-						"key": column.id,
-						"style": [
-							getCellStyle(props.index, columnIndex, props.data, column),
-							sizeStyle,
-							column.stickyStyle
+				const block = props.store;
+				const columns = states.columns;
+				const rows = block.rows;
+				const isSingleRow = rows.length === 1;
+				const maxColumnIndex = columns.length - 1;
+				const rowStart = block.rowStart ?? (rows[0]?.index || 0);
+				let layoutCells = block.cells;
+				if (!layoutCells) {
+					layoutCells = [];
+					for (let i = 0; i < rows.length; i++) for (let c = 0; c < columns.length; c++) layoutCells.push({
+						rowIndex: rows[i].index,
+						columnIndex: c,
+						rowspan: 1,
+						colspan: 1
+					});
+				}
+				const rowSelected = rows.map((row) => table.store.selection.isSelected(row.data));
+				const singleRow = isSingleRow ? rows[0] : null;
+				const cells = layoutCells.reduce((pre, cell) => {
+					const rowOffset = cell.rowIndex - rowStart;
+					const row = rows[rowOffset];
+					const columnNode = columns[cell.columnIndex];
+					if (!row || !columnNode) return pre;
+					const column = columnNode.states;
+					pre.push({
+						key: `${getValueOfRow(row.data, row.index)}-${column.id}`,
+						rowIndex: cell.rowIndex,
+						columnIndex: cell.columnIndex,
+						rowspan: cell.rowspan,
+						colspan: cell.colspan,
+						class: [
+							getInternalCellClass(row.data, cell.rowIndex),
+							getCellClass(cell.rowIndex, cell.columnIndex, row.data, column),
+							"vc-table__td"
 						],
-						"class": [getCellClass(props.index, columnIndex, props.data, column), "vc-table__td"],
-						"onMouseenter": (e) => handleCellMouseEnter(e, props.data, column),
-						"onMouseleave": (e) => handleCellMouseLeave(e, props.data, column)
-					}, [renderCell({
-						row: props.data,
-						rowIndex: props.index,
-						column,
-						columnIndex,
-						selected: selected.value,
-						store: table.store,
-						isHead: columnIndex === 0,
-						isTail: columnIndex === maxColumnIndex.value
-					})]);
-				})]);
-			};
-		}
-	});
-	var TableBodyMergeRow = /* @__PURE__ */ (0, vue.defineComponent)({
-		name: "vc-table-body-merge-row",
-		props: { store: {
-			type: Object,
-			required: true
-		} },
-		setup(props) {
-			const table = (0, vue.inject)("vc-table");
-			const getValueOfRow = (row, index) => {
-				const { primaryKey } = table.props;
-				if (primaryKey) return getRowValue(row, primaryKey);
-				return index;
-			};
-			return () => {
-				return (0, vue.createVNode)("div", { "class": "vc-table__merge-row" }, [props.store.rows.map((row) => {
-					return (0, vue.createVNode)(TableBodyRow, {
-						"key": getValueOfRow(row, row.index),
-						"data": row.data,
-						"index": row.index,
-						"height": table.props.rowHeight || row.height
-					}, null);
-				})]);
+						style: [getCellStyle(cell.rowIndex, cell.columnIndex, row.data, column), column.stickyStyle],
+						attrs: {
+							"data-row": cell.rowIndex,
+							"data-column": cell.columnIndex
+						},
+						render: () => column.renderCell({
+							row: row.data,
+							rowIndex: cell.rowIndex,
+							column,
+							columnIndex: cell.columnIndex,
+							selected: rowSelected[rowOffset],
+							store: table.store,
+							isHead: cell.columnIndex === 0,
+							isTail: cell.columnIndex + (cell.colspan || 1) - 1 === maxColumnIndex
+						})
+					});
+					return pre;
+				}, []);
+				const grid = (0, vue.createVNode)(TableGrid, (0, vue.mergeProps)({
+					"class": [isSingleRow ? "vc-table__tr" : "vc-table__tr-group", isSingleRow && getUserRowClass(singleRow.data, singleRow.index)],
+					"style": isSingleRow ? getUserRowStyle(singleRow.data, singleRow.index) : null,
+					"data-row": isSingleRow ? rowStart : void 0,
+					"role": isSingleRow ? "row" : "rowgroup",
+					"columns": columns,
+					"rowStart": rowStart,
+					"rowHeight": table.props.rowHeight,
+					"cells": cells
+				}, {
+					onClick: handleClick,
+					onDblclick: (e) => handleEvent(e, "dblclick"),
+					onContextmenu: (e) => handleEvent(e, "contextmenu"),
+					onMouseover: handleMouseOver,
+					onMouseleave: handleMouseLeave
+				}), null);
+				const expandedRows = isSingleRow && table.renderExpand.value ? rows.filter((row) => states.expandRows.indexOf(row.data) > -1) : [];
+				if (!expandedRows.length) return grid;
+				return (0, vue.createVNode)(vue.Fragment, null, [grid, (0, vue.createVNode)(TableExpand, { "rows": expandedRows }, null)]);
 			};
 		}
 	});
@@ -124681,23 +124972,25 @@ ${p}
 			});
 			const target = (0, vue.ref)();
 			(0, vue.watch)(() => table.store.states.hoverRowIndex, (v, oldV) => {
-				if (!table.store.states.isComplex || IS_SERVER$3) return;
+				if (IS_SERVER$3) return;
 				raf(() => {
-					const oldRow = instance.vnode.el.querySelector(`.vc-table__row[data-row="${oldV}"]`);
-					const newRow = instance.vnode.el.querySelector(`.vc-table__row[data-row="${v}"]`);
-					oldRow && removeClass(oldRow, "hover-row");
-					newRow && addClass(newRow, "hover-row");
-				});
-			});
-			const handleMergeRowResize = (changes) => {
-				if (table.props.rowHeight) return;
-				changes.forEach((v) => {
-					states.list[v.index].rows.forEach((row) => {
-						if (row.height === v.size) return;
-						row.height = v.size || "";
-					});
+					const el = instance.vnode.el;
+					if (!el) return;
+					const selectRow = (index) => el.querySelectorAll(`.vc-table__td[data-row="${index}"]`);
+					const selectAnchors = (index) => {
+						if (index == null) return [];
+						return table.store.block.getCoverAnchors(index).reduce((pre, anchor) => {
+							const dom = el.querySelector(`.vc-table__td[data-row="${anchor.rowIndex}"][data-column="${anchor.columnIndex}"]`);
+							dom && pre.push(dom);
+							return pre;
+						}, []);
+					};
+					selectRow(oldV).forEach((dom) => removeClass(dom, "hover-row"));
+					selectAnchors(oldV).forEach((dom) => removeClass(dom, "hover-related"));
+					selectRow(v).forEach((dom) => addClass(dom, "hover-row"));
+					selectAnchors(v).forEach((dom) => addClass(dom, "hover-related"));
 				});
-			};
+			});
 			expose({ target });
 			const layout = table.layout;
 			const scrollerOptions = (0, vue.computed)(() => ({
@@ -124715,7 +125008,7 @@ ${p}
 					0
 				]
 			}));
-			const renderers = { default: ({ row }) => (0, vue.createVNode)(TableBodyMergeRow, { "store": row }, null) };
+			const renderers = { default: ({ row }) => (0, vue.createVNode)(TableBodyBlock, { "store": row }, null) };
 			let timer;
 			(0, vue.onBeforeMount)(() => {
 				if (table.props.delay) timer = setTimeout(() => allowRender.value = true, table.props.delay);
@@ -124734,7 +125027,6 @@ ${p}
 					"scrollerOptions": scrollerOptions.value,
 					"pageSize": table.props.rows,
 					"onScroll": (e) => emit("scroll", e),
-					"onRowResize": handleMergeRowResize,
 					"style": props.heightStyle
 				}, _isSlot(renderers) ? renderers : { default: () => [renderers] }), slots.default?.()]);
 				return (0, vue.createVNode)(ScrollerWheel, (0, vue.mergeProps)({
@@ -124743,10 +125035,7 @@ ${p}
 				}, scrollerOptions.value, {
 					"style": props.heightStyle,
 					"onScroll": (e) => emit("scroll", e)
-				}), { default: () => [(0, vue.createVNode)(NormalList, {
-					"data": states.list,
-					"onRowResize": handleMergeRowResize
-				}, _isSlot(renderers) ? renderers : { default: () => [renderers] }), slots.default?.()] });
+				}), { default: () => [(0, vue.createVNode)(NormalList, { "data": states.list }, _isSlot(renderers) ? renderers : { default: () => [renderers] }), slots.default?.()] });
 			};
 		}
 	});
@@ -124802,17 +125091,16 @@ ${p}
 				isGroup: "isGroup",
 				headerRows: "headerRows"
 			});
-			const getHeaderRowStyle = (rowIndex) => {
+			const getHeaderRowStyle = () => {
 				const { headerRowStyle } = table.props;
-				if (typeof headerRowStyle === "function") return headerRowStyle.call(null, { rowIndex });
+				if (typeof headerRowStyle === "function") return headerRowStyle.call(null);
 				return headerRowStyle;
 			};
-			const getHeaderRowClass = (rowIndex) => {
-				const classes = [];
+			const getHeaderRowClass = () => {
 				const { headerRowClass } = table.props;
-				if (typeof headerRowClass === "string") classes.push(headerRowClass);
-				else if (typeof headerRowClass === "function") classes.push(headerRowClass.call(null, { rowIndex }));
-				return classes.join(" ");
+				if (typeof headerRowClass === "string") return headerRowClass;
+				if (typeof headerRowClass === "function") return headerRowClass.call(null);
+				return "";
 			};
 			const getHeaderCellStyle = (rowIndex, columnIndex, row, column) => {
 				const { headerCellStyle } = table.props;
@@ -124820,47 +125108,48 @@ ${p}
 					rowIndex,
 					columnIndex,
 					row,
-					column
+					column: column.states
 				});
 				return {
 					...headerCellStyle,
-					...column.style
+					...column.states.style
 				};
 			};
 			const getHeaderCellClass = (rowIndex, columnIndex, row, column) => {
+				const { states: columnStates } = column;
 				const classes = [
-					column.id,
-					column.order,
-					column.realHeaderAlign,
-					column.class,
-					column.labelClass
+					columnStates.id,
+					columnStates.order,
+					columnStates.realHeaderAlign,
+					columnStates.class,
+					columnStates.labelClass
 				];
-				if (!column.children) classes.push("is-leaf");
+				if (!column.childNodes.length) classes.push("is-leaf");
 				const { headerCellClass } = table.props;
 				if (typeof headerCellClass === "string") classes.push(headerCellClass);
 				else if (typeof headerCellClass === "function") classes.push(headerCellClass.call(null, {
 					rowIndex,
 					columnIndex,
 					row,
-					column
+					column: columnStates
 				}));
 				return classes.join(" ");
 			};
 			const handleHeaderClick = (e, column) => {
-				table.emit("header-click", column, e);
+				table.emit("header-click", column.states, e);
 			};
 			const handleHeaderContextMenu = (e, column) => {
-				table.emit("header-contextmenu", column, e);
+				table.emit("header-contextmenu", column.states, e);
 			};
 			const handleMouseDown = (e, column) => {
 				if (IS_SERVER$3) return;
-				if (column.children && column.children.length > 0) return;
+				if (column.childNodes.length > 0) return;
 				/* istanbul ignore if */
 				if (draggingColumn.value && allowDrag.value) {
 					dragging.value = true;
 					table.resizeProxyVisible.value = true;
 					const tableLeft = table.tableWrapper.value.getBoundingClientRect().left;
-					const columnEl = instance.vnode.el.querySelector(`.vc-table__th.${column.id}`);
+					const columnEl = instance.vnode.el.querySelector(`.vc-table__th.${column.states.id}`);
 					const columnRect = columnEl.getBoundingClientRect();
 					const minLeft = columnRect.left - tableLeft + 30;
 					addClass(columnEl, "noclick");
@@ -124874,16 +125163,17 @@ ${p}
 					resizeProxy.style.left = dragState.value.startLeft + "px";
 					document.onselectstart = () => false;
 					document.ondragstart = () => false;
-					const handleMouseMove = ($e) => {
+					const handleDocumentMouseMove = ($e) => {
 						const deltaLeft = $e.clientX - dragState.value.startMouseLeft;
 						const proxyLeft = dragState.value.startLeft + deltaLeft;
 						resizeProxy.style.left = Math.max(minLeft, proxyLeft) + "px";
 					};
-					const handleMouseUp = () => {
+					const handleDocumentMouseUp = () => {
 						if (dragging.value) {
 							const { startColumnLeft, startLeft } = dragState.value;
-							column.width = column.minWidth = column.realWidth = parseInt(resizeProxy.style.left, 10) - startColumnLeft;
-							table.emit("header-dragend", column.width, startLeft - startColumnLeft, column);
+							const columnWidth = parseInt(resizeProxy.style.left, 10) - startColumnLeft;
+							column.states.width = column.states.minWidth = column.states.realWidth = columnWidth;
+							table.emit("header-dragend", column.states.width, startLeft - startColumnLeft, column.states);
 							table.store.scheduleLayout();
 							document.body.style.cursor = "";
 							dragging.value = false;
@@ -124891,23 +125181,23 @@ ${p}
 							dragState.value = {};
 							table.resizeProxyVisible.value = false;
 						}
-						document.removeEventListener("mousemove", handleMouseMove);
-						document.removeEventListener("mouseup", handleMouseUp);
+						document.removeEventListener("mousemove", handleDocumentMouseMove);
+						document.removeEventListener("mouseup", handleDocumentMouseUp);
 						document.onselectstart = null;
 						document.ondragstart = null;
 						setTimeout(function() {
 							removeClass(columnEl, "noclick");
 						}, 0);
 					};
-					document.addEventListener("mousemove", handleMouseMove);
-					document.addEventListener("mouseup", handleMouseUp);
+					document.addEventListener("mousemove", handleDocumentMouseMove);
+					document.addEventListener("mouseup", handleDocumentMouseUp);
 				}
 			};
 			const handleMouseMove = (event, column) => {
-				if (column.children && column.children.length > 0) return;
+				if (column.childNodes.length > 0) return;
 				let target = event.target;
 				while (target && !target.classList?.contains?.("vc-table__th")) target = target.parentNode;
-				if (!column || !column.resizable) return;
+				if (!column || !column.states.resizable || !target) return;
 				if (!dragging.value && allowDrag.value) {
 					const rect = target.getBoundingClientRect();
 					const bodyStyle = document.body.style;
@@ -124950,54 +125240,87 @@ ${p}
 					alone: true
 				});
 			};
+			const renderCellContent = (column, columnIndex) => {
+				const { states: columnStates } = column;
+				return (0, vue.createVNode)("div", { "class": ["vc-table__cell", columnStates.labelClass] }, [
+					columnStates.renderHeader ? columnStates.renderHeader({
+						column: columnStates,
+						columnIndex,
+						store: table.store
+					}) : columnStates.label,
+					columnStates.tooltip ? (0, vue.createVNode)(Icon, {
+						"type": "o-info",
+						"class": "vc-table__tooltip",
+						"onMouseenter": (e) => handleCellMouseEnter(e, columnStates)
+					}, null) : null,
+					columnStates.sortable ? (0, vue.createVNode)(TableSort, {
+						"order": columnStates.prop === props.sort.prop ? props.sort.order : "",
+						"onClick": (order) => handleSort(columnStates.prop, order)
+					}, null) : null,
+					columnStates.filters ? (0, vue.createVNode)(TableFilter, {
+						"data": columnStates.filters,
+						"value": columnStates.filteredValue,
+						"icon": columnStates.filterIcon,
+						"portalClass": columnStates.filterPopupClass,
+						"multiple": columnStates.filterMultiple,
+						"onChange": (v) => handleFilter(columnStates, v)
+					}, null) : null
+				]);
+			};
+			/**
+			* 把 states.headerRows（二维，多级表头）推导为 TableGrid 的 cells[]：
+			* 多级表头本质就是 rowspan/colspan（columnsToRowsEffect 已写在 column.states 上），
+			* 这里只需按占位推导每个 cell 的起始叶子列号（grid 列坐标）。
+			* 注意：headerRowStyle/Class 挂在 thead 内唯一 vc-table__tr 上，不再合并到 th。
+			* @returns 表头 cells
+			*/
+			const buildHeaderCells = () => {
+				const rows = states.headerRows;
+				const cells = [];
+				const taken = rows.map(() => []);
+				rows.forEach((columns, rowIndex) => {
+					let gridColumnIndex = 0;
+					columns.forEach((column, columnIndex) => {
+						while (taken[rowIndex][gridColumnIndex]) gridColumnIndex++;
+						const rowspan = column.states.rowspan || 1;
+						const colspan = column.states.colspan || 1;
+						for (let i = rowIndex; i < rowIndex + rowspan && i < rows.length; i++) for (let j = gridColumnIndex; j < gridColumnIndex + colspan; j++) taken[i][j] = true;
+						cells.push({
+							key: column.states.id,
+							rowIndex,
+							columnIndex: gridColumnIndex,
+							rowspan,
+							colspan,
+							class: [
+								getHeaderCellClass(rowIndex, columnIndex, columns, column),
+								column.states.resizable && dragLineClass.value,
+								column.states.stickyClass,
+								"vc-table__th"
+							],
+							style: [getHeaderCellStyle(rowIndex, columnIndex, columns, column), column.states.stickyStyle],
+							attrs: {
+								onMousemove: (e) => handleMouseMove(e, column),
+								onMouseout: handleMouseOut,
+								onMousedown: (e) => handleMouseDown(e, column),
+								onClick: (e) => handleHeaderClick(e, column),
+								onContextmenu: (e) => handleHeaderContextMenu(e, column)
+							},
+							render: () => renderCellContent(column, columnIndex)
+						});
+						gridColumnIndex += colspan;
+					});
+				});
+				return cells;
+			};
 			return () => {
-				return (0, vue.createVNode)("div", { "class": "vc-table__header" }, [(0, vue.createVNode)("div", { "class": [{ "is-group": states.isGroup }, "vc-table__thead"] }, [states.headerRows.map((columns, rowIndex) => (0, vue.createVNode)("div", {
-					"style": getHeaderRowStyle(rowIndex),
-					"class": [getHeaderRowClass(rowIndex), "vc-table__tr"]
-				}, [columns.map((column, columnIndex) => {
-					return (0, vue.createVNode)("div", {
-						"onMousemove": (e) => handleMouseMove(e, column),
-						"onMouseout": handleMouseOut,
-						"onMousedown": (e) => handleMouseDown(e, column),
-						"onClick": (e) => handleHeaderClick(e, column),
-						"onContextmenu": (e) => handleHeaderContextMenu(e, column),
-						"style": [
-							getHeaderCellStyle(rowIndex, columnIndex, columns, column),
-							{ width: `${column.realWidth}px` },
-							column.stickyStyle
-						],
-						"class": [
-							getHeaderCellClass(rowIndex, columnIndex, columns, column),
-							column.resizable && dragLineClass.value,
-							column.stickyClass,
-							"vc-table__th"
-						],
-						"key": column.id
-					}, [(0, vue.createVNode)("div", { "class": ["vc-table__cell", column.labelClass] }, [
-						column.renderHeader ? column.renderHeader({
-							column,
-							columnIndex,
-							store: table.store
-						}) : column.label,
-						column.tooltip ? (0, vue.createVNode)(Icon, {
-							"type": "o-info",
-							"class": "vc-table__tooltip",
-							"onMouseenter": (e) => handleCellMouseEnter(e, column)
-						}, null) : null,
-						column.sortable ? (0, vue.createVNode)(TableSort, {
-							"order": column.prop === props.sort.prop ? props.sort.order : "",
-							"onClick": (order) => handleSort(column.prop, order)
-						}, null) : null,
-						column.filters ? (0, vue.createVNode)(TableFilter, {
-							"data": column.filters,
-							"value": column.filteredValue,
-							"icon": column.filterIcon,
-							"portalClass": column.filterPopupClass,
-							"multiple": column.filterMultiple,
-							"onChange": (v) => handleFilter(column, v)
-						}, null) : null
-					])]);
-				})]))])]);
+				return (0, vue.createVNode)("div", { "class": [{ "is-group": states.isGroup }, "vc-table__thead"] }, [(0, vue.createVNode)(TableGrid, {
+					"class": [getHeaderRowClass(), "vc-table__tr"],
+					"style": getHeaderRowStyle(),
+					"role": "row",
+					"columns": states.columns,
+					"cells": buildHeaderCells(),
+					"cellRole": "columnheader"
+				}, null)]);
 			};
 		}
 	});
@@ -125016,19 +125339,19 @@ ${p}
 			});
 			const getRowClasses = (column) => {
 				const classes = [column.realAlign, column.labelClass];
-				if (column.className) classes.push(column.className);
 				if (column.fixed === true || column.fixed === "left") classes.push("is-fixed-left");
 				else if (column.fixed === "right") classes.push("is-fixed-right");
-				if (!column.children) classes.push("is-leaf");
+				classes.push("is-leaf");
 				return classes;
 			};
 			const sums = (0, vue.computed)(() => {
 				let v = [];
+				const columnStates = states.columns.map((node) => node.states);
 				if (props.getSummary) v = props.getSummary({
-					columns: states.columns,
+					columns: columnStates,
 					data: states.data
 				});
-				else states.columns.forEach((column, index) => {
+				else columnStates.forEach((column, index) => {
 					if (index === 0) {
 						v[index] = props.sumText;
 						return;
@@ -125059,7 +125382,8 @@ ${p}
 					"cellspacing": "0",
 					"cellpadding": "0",
 					"border": "0"
-				}, [(0, vue.createVNode)("div", { "class": "vc-table__tbody" }, [(0, vue.createVNode)("div", { "class": "vc-table__tr" }, [states.columns.map((column, columnIndex) => {
+				}, [(0, vue.createVNode)("div", { "class": "vc-table__tbody" }, [(0, vue.createVNode)("div", { "class": "vc-table__tr" }, [states.columns.map((node, columnIndex) => {
+					const column = node.states;
 					return (0, vue.createVNode)("div", {
 						"key": columnIndex,
 						"class": [getRowClasses(column), "vc-table__td"],
@@ -125192,6 +125516,7 @@ ${p}
 			"cell-mouse-leave",
 			"cell-click",
 			"cell-dblclick",
+			"cell-contextmenu",
 			"row-click",
 			"row-contextmenu",
 			"row-dblclick",
@@ -125208,7 +125533,7 @@ ${p}
 			const instance = (0, vue.getCurrentInstance)();
 			const store = new Store$1({ table: instance });
 			const { layout } = store;
-			const renderExpanded = (0, vue.ref)(null);
+			const renderExpand = (0, vue.ref)(null);
 			const resizeProxyVisible = (0, vue.ref)(false);
 			const resizeState = (0, vue.ref)({
 				width: null,
@@ -125309,20 +125634,20 @@ ${p}
 				refreshAffix();
 			};
 			const toggleAllSelection = () => {
-				store.toggleAllSelection();
+				store.selection.toggleAll();
 			};
 			const setCurrentRow = (row) => {
-				store.setCurrentRow(row);
+				store.row.set(row);
 			};
 			const toggleRowSelection = (row, selected, emitChange) => {
-				store.toggleRowSelection(row, selected, emitChange);
-				store.updateAllSelected();
+				store.selection.toggle(row, selected, emitChange);
+				store.selection.updateAllSelected();
 			};
 			const toggleRowExpansion = (row, expanded) => {
 				store.toggleRowExpansionAdapter(row, expanded);
 			};
 			const clearSelection = () => {
-				store.clearSelection();
+				store.selection.clear();
 			};
 			const handleScrollX = () => {
 				if (!bodyXWrapper.value) return;
@@ -125351,7 +125676,7 @@ ${p}
 				}
 			};
 			const handleMouseLeave = () => {
-				store.setHoverRow(null);
+				store.row.setHoverIndex(null);
 				if (hoverState.value) hoverState.value = null;
 			};
 			const handleMousewheel = (deltaX, deltaY) => {
@@ -125401,7 +125726,7 @@ ${p}
 			}, { immediate: true });
 			(0, vue.watch)(() => props.currentRowValue, (v) => {
 				if (!props.primaryKey) return;
-				store.current.reset(v);
+				store.row.setById(v);
 			}, { immediate: true });
 			(0, vue.watch)(() => [props.data, props.data.length], () => {
 				store.setData(props.data);
@@ -125412,7 +125737,7 @@ ${p}
 			}, { immediate: true });
 			(0, vue.watch)(() => props.columns, (v) => {
 				if (!Array.isArray(v) || v.length === 0) return;
-				store.applyExternalColumns(v);
+				store.column.applyExternal(v);
 			}, {
 				deep: true,
 				flush: "post"
@@ -125470,7 +125795,7 @@ ${p}
 				debouncedUpdateLayout,
 				isReady,
 				hoverState,
-				renderExpanded,
+				renderExpand,
 				hiddenColumns,
 				props,
 				emit,
@@ -125487,6 +125812,8 @@ ${p}
 						tableId,
 						"vc-table"
 					],
+					"style": { "--vc-table-columns": layout.templateColumns.value },
+					"role": "table",
 					"onMouseleave": handleMouseLeave
 				}, [
 					(0, vue.createVNode)("div", {
@@ -125531,6 +125858,41 @@ ${p}
 			};
 		}
 	});
+	var tableColumnProps = {
+		type: {
+			type: String,
+			default: "default"
+		},
+		line: Number,
+		label: String,
+		labelClass: String,
+		prop: String,
+		width: Number,
+		minWidth: Number,
+		renderHeader: Function,
+		resizable: {
+			type: Boolean,
+			default: true
+		},
+		align: String,
+		headerAlign: String,
+		fixed: [Boolean, String],
+		formatter: Function,
+		selectable: Function,
+		reserveSelection: Boolean,
+		index: [Number, Function],
+		sortable: Boolean,
+		filters: Array,
+		filterMultiple: {
+			type: Boolean,
+			default: true
+		},
+		filterIcon: String,
+		filteredValue: Array,
+		filterPopupClass: String,
+		filter: Function,
+		tooltip: [String, Function]
+	};
 	/** @jsxImportSource vue */
 	var cellStarts = {
 		default: { order: "" },
@@ -125559,7 +125921,7 @@ ${p}
 					"indeterminate": store.states.selection.length > 0 && !store.states.isAllSelected,
 					"onClick": (e) => {
 						e.stopPropagation();
-						store.toggleAllSelection();
+						store.selection.toggleAll();
 					}
 				}, null);
 			},
@@ -125567,7 +125929,7 @@ ${p}
 				return (0, vue.withDirectives)((0, vue.createVNode)(Checkbox, {
 					"modelValue": selected,
 					"disabled": column.selectable ? !column.selectable.call(null, row, rowIndex) : false,
-					"onChange": () => store.rowSelectedChanged(row),
+					"onChange": () => store.selection.rowChanged(row),
 					"onClick": (e) => e.stopPropagation()
 				}, null), [[vue.vShow, store.states.expandSelectable || level === 0]]);
 			},
@@ -125609,12 +125971,12 @@ ${p}
 			class: "vc-table__expand-column"
 		}
 	};
-	var defaultRenderCell = (rowData = {}) => {
+	var defaultRenderCell = (rowData) => {
 		const column = rowData.column;
 		const { prop, formatter } = column;
 		let value;
 		if (prop) value = getPropByPath(rowData.row, prop).v;
-		if (formatter) return column.formatter(rowData);
+		if (formatter) return formatter(rowData);
 		const line = typeof column.line !== "undefined" ? column.line : VcInstance.options.TableColumn?.line;
 		if (line && value) return (0, vue.createVNode)("div", {
 			"class": "vc-table__text-line",
@@ -125633,10 +125995,10 @@ ${p}
 			"class": "vc-table__indent",
 			"style": { "padding-left": treeNode.indent + "px" }
 		}, null));
-		if (typeof treeNode.expanded === "boolean" && !treeNode.noLazyChildren) {
+		if (typeof treeNode.expand === "boolean" && !treeNode.noLazyChildren) {
 			const expandClasses = {
 				"vc-table__expand-icon": true,
-				"is-expand": treeNode.expanded
+				"is-expand": treeNode.expand
 			};
 			ele.push((0, vue.createVNode)("span", {
 				"class": expandClasses,
@@ -125645,191 +126007,229 @@ ${p}
 		} else ele.push((0, vue.createVNode)("span", { "class": "vc-table__placeholder" }, null));
 		return ele;
 	};
+	/** @jsxImportSource vue */
+	/**
+	* 列 states 完整形状：构造期仅初始化核心字段，props 镜像与 render 函数由 `init()` 写入。
+	*/
+	/**
+	* renderCell / renderHeader / formatter 等渲染回调的入参。
+	*/
+	var DERIVED_KEYS = ["realAlign", "realHeaderAlign"];
+	var assignStates = (target, source) => {
+		for (const key in source) {
+			if (!hasOwn$1(source, key) || DERIVED_KEYS.includes(key)) continue;
+			target[key] = source[key];
+		}
+	};
+	var TableColumnNode = class TableColumnNode {
+		/**
+		* 列的全部响应式数据（唯一列对象）：
+		* 	- 内部（store / layout / header / body）读写 `node.states.*`；
+		* 	- 对外（slot / emit / renderCell / 用户回调）直接传该对象。
+		*/
+		states = (() => {
+			const v = (0, vue.reactive)({
+				id: "",
+				type: "default",
+				colspan: 1,
+				rowspan: 1,
+				align: "",
+				headerAlign: "",
+				minWidth: 80,
+				resizable: true,
+				filterMultiple: true,
+				hidden: false,
+				fixed: false,
+				realAlign: (0, vue.computed)(() => {
+					return v.align ? "is-" + v.align : null;
+				}),
+				realHeaderAlign: (0, vue.computed)(() => {
+					return v.headerAlign ? "is-" + v.headerAlign : v.realAlign;
+				})
+			});
+			return v;
+		})();
+		childNodes = (0, vue.reactive)([]);
+		parentNode = null;
+		constructor(options) {
+			(0, vue.markRaw)(this);
+			this.table = options.table;
+			this.parentNode = options.parentNode ?? null;
+			options.instance && (this.instance = options.instance);
+			options.states && assignStates(this.states, options.states);
+		}
+		/**
+		* 兼容按 children 遍历列树的场景（如 flattenData）。
+		* leaf 返回 undefined，保持与原扁平对象一致的 truthy 判断。
+		* @returns 子节点集合（leaf 为 undefined）
+		*/
+		get children() {
+			return this.childNodes.length ? this.childNodes : void 0;
+		}
+		/**
+		* 由组件 props 初始化 states，并绑定 props 监听
+		* 	1) defaults + cellStarts + props 合并（merge 跳过 undefined，保留 cellStarts 的宽度等预设）
+		* 	2) 特定类型的强制属性（cellForced）
+		* 	3) 宽度归一化（width/minWidth/realWidth）
+		* 	4) renderHeader / renderCell 包装
+		* @param props ~
+		* @param slots ~
+		* @param attrs ~
+		*/
+		init(props, slots, attrs) {
+			let column = merge$1({
+				colspan: 1,
+				rowspan: 1,
+				class: attrs.class,
+				style: attrs.style,
+				...cellStarts[props.type],
+				id: this.states.id
+			}, Object.keys(props).reduce((pre, key) => {
+				pre[key] = props[key];
+				return pre;
+			}, {}));
+			column = this.applyForcedProps(column);
+			column = this.applyWidth(column, props);
+			column = this.applyRenders(column, props, slots);
+			assignStates(this.states, column);
+			this.registerWatchers(props);
+		}
+		/**
+		* 监听 props 同步 states，并在布局相关字段变化时重排。
+		* @param props ~
+		*/
+		registerWatchers(props) {
+			Object.keys(props).forEach((key) => {
+				(0, vue.watch)(() => props[key], (v) => {
+					this.states[key] = v;
+				});
+			});
+			(0, vue.watch)(() => props.fixed, () => {
+				this.table.store.scheduleLayout(true);
+			});
+			(0, vue.watch)(() => parseWidth(props.width), (v) => {
+				this.states.width = v ?? void 0;
+				this.states.realWidth = v ?? void 0;
+				this.table.store.scheduleLayout(false);
+			});
+			(0, vue.watch)(() => parseMinWidth(props.minWidth), () => {
+				this.table.store.scheduleLayout(false);
+			});
+		}
+		/**
+		* 对于特定类型的 column，某些属性不允许被覆盖
+		* 如 type: selection | index | expand
+		* @param column ~
+		* @returns ~
+		*/
+		applyForcedProps(column) {
+			const source = cellForced[column.type] || {};
+			Object.keys(source).forEach((prop) => {
+				const value = source[prop];
+				if (value !== void 0) column[prop] = prop === "class" ? `${column.class ? `${column.class} ` : ""}${value}` : value;
+			});
+			return column;
+		}
+		/**
+		* width / minWidth / realWidth 归一化
+		* @param column ~
+		* @param props ~
+		* @returns ~
+		*/
+		applyWidth(column, props) {
+			column.width = parseWidth(props.width) || column.width;
+			column.minWidth = parseMinWidth(props.minWidth) || column.minWidth || 80;
+			column.realWidth = typeof column.width === "undefined" ? column.minWidth : column.width;
+			return column;
+		}
+		/**
+		* column
+		*   -> renderHeader: 渲染头部
+		*   -> renderCell: 渲染单元格
+		* owner
+		* 	 -> renderExpand: 展开
+		* @param column ~
+		* @param props ~
+		* @param slots ~
+		* @returns ~
+		*/
+		applyRenders(column, props, slots) {
+			const specialTypes = Object.keys(cellForced);
+			if (props.renderHeader) column.renderHeader = props.renderHeader;
+			else if (specialTypes.indexOf(column.type) === -1) column.renderHeader = (data) => {
+				const renderHeader = slots.header;
+				return renderHeader ? renderHeader(data) : data?.column?.label;
+			};
+			let originRenderCell = column.renderCell;
+			if (column.type === "expand") {
+				column.renderCell = (data) => (0, vue.createVNode)("div", { "class": "vc-table__cell" }, [originRenderCell(data)]);
+				this.table.renderExpand.value = (data) => {
+					return slots.default ? slots.default(data) : slots.default;
+				};
+			} else {
+				originRenderCell = originRenderCell || defaultRenderCell;
+				column.renderCell = (data) => {
+					const children = slots.default ? slots?.default?.(data) : originRenderCell(data);
+					let prefix = treeCellPrefix(data);
+					if (!isEmpty(this.table.store.states.treeData) && !prefix && data.isExpandColumn) prefix = (0, vue.createVNode)("span", { "class": "vc-table__unexpand__indent" }, null);
+					const { placeholder } = this.table.props;
+					const contentPlaceholder = typeof placeholder === "function" ? placeholder() : placeholder;
+					return (0, vue.createVNode)("div", { "class": "vc-table__cell" }, [prefix, children === void 0 || children === "" || children === null ? contentPlaceholder : children]);
+				};
+			}
+			return column;
+		}
+		/**
+		* 浅克隆当前节点（类似 Element.prototype.cloneNode）：
+		* states 复制为独立 reactive 副本，避免 columnsToRowsEffect 写入 level/colspan/rowspan 污染原节点；
+		* 子节点默认空，由调用方传入（如 cloneVisibleTree 过滤后的可见子树）。
+		* leaf 列通常不调用，在调用方保持原引用。
+		* @param childNodes 挂载到克隆节点上的子节点
+		* @returns 克隆节点
+		*/
+		cloneNode(childNodes = []) {
+			const source = { ...this.states };
+			for (const key of DERIVED_KEYS) delete source[key];
+			const cloned = new TableColumnNode({
+				table: this.table,
+				parentNode: this.parentNode,
+				instance: this.instance,
+				states: source
+			});
+			cloned.childNodes.push(...childNodes);
+			return cloned;
+		}
+	};
 	var TableColumn = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "vc-table-column",
 		inheritAttrs: false,
-		props: {
-			type: {
-				type: String,
-				default: "default"
-			},
-			line: Number,
-			label: String,
-			labelClass: String,
-			prop: String,
-			width: Number,
-			minWidth: Number,
-			renderHeader: Function,
-			resizable: {
-				type: Boolean,
-				default: true
-			},
-			columnKey: String,
-			align: String,
-			headerAlign: String,
-			fixed: [Boolean, String],
-			formatter: Function,
-			selectable: Function,
-			reserveSelection: Boolean,
-			index: [Number, Function],
-			sortable: Boolean,
-			filters: Array,
-			filterMultiple: {
-				type: Boolean,
-				default: true
-			},
-			filterIcon: String,
-			filteredValue: Array,
-			filterPopupClass: String,
-			filter: Function,
-			tooltip: [String, Function]
-		},
+		props: tableColumnProps,
 		setup(props, { slots, attrs }) {
 			const instance = (0, vue.getCurrentInstance)();
 			const table = (0, vue.inject)("vc-table");
 			const parent = (0, vue.inject)("vc-table-column", table);
 			const isSubColumn = table !== parent;
-			const columnId = (0, vue.ref)((parent.tableId || parent.columnId) + getUid("column"));
-			const realWidth = (0, vue.computed)(() => {
-				return parseWidth(props.width);
-			});
-			const realMinWidth = (0, vue.computed)(() => {
-				return parseMinWidth(props.minWidth);
-			});
-			const realAlign = (0, vue.computed)(() => {
-				return props.align ? "is-" + props.align : null;
-			});
-			const realHeaderAlign = (0, vue.computed)(() => {
-				return props.headerAlign ? "is-" + props.headerAlign : realAlign.value;
+			const parentNode = "columnNode" in parent ? parent.columnNode : void 0;
+			const columnNode = new TableColumnNode({
+				table,
+				parentNode,
+				instance,
+				states: { id: ("columnId" in parent ? parent.columnId.value : parent.tableId) + getUid("column") }
 			});
-			const columnConfig = (0, vue.reactive)({});
-			/**
-			* 获取当前值情况，this[key]
-			* @param args ~
-			* @returns ~
-			*/
-			const getPropsData = (...args) => {
-				return args.reduce((prev, cur) => {
-					if (Array.isArray(cur)) cur.forEach((key) => {
-						prev[key] = props[key];
-					});
-					return prev;
-				}, {});
-			};
-			/**
-			* compose 1
-			* 对于特定类型的 column，某些属性不允许设置
-			* 如 type: selection | index | expand
-			* @param column ~
-			* @returns ~
-			*/
-			const setColumnForcedProps = (column) => {
-				const source = cellForced[column.type] || {};
-				Object.keys(source).forEach((prop) => {
-					const value = source[prop];
-					if (value !== void 0) column[prop] = prop === "class" ? `${column[prop] ? `${column[prop]} ` : ""}${value}` : value;
-				});
-				return column;
-			};
-			/**
-			* compose 2
-			* column
-			* 	 -> width
-			* 	 -> minWidth
-			* @param column ~
-			* @returns ~
-			*/
-			const setColumnWidth = (column) => {
-				column.width = realWidth.value || column.width;
-				column.minWidth = realMinWidth.value || column.minWidth || 80;
-				column.realWidth = typeof column.width === "undefined" ? column.minWidth : column.width;
-				return column;
-			};
-			/**
-			* compose 3
-			* column
-			*   -> renderHeader: 渲染头部
-			*   -> renderCell: 渲染单元格
-			* owner
-			* 	 -> renderExpanded: 展开
-			* @param column ~
-			* @returns ~
-			*/
-			const setColumnRenders = (column) => {
-				const specialTypes = Object.keys(cellForced);
-				if (props.renderHeader) column.renderHeader = props.renderHeader;
-				else if (specialTypes.indexOf(column.type) === -1) column.renderHeader = (data) => {
-					const renderHeader = slots.header;
-					return renderHeader ? renderHeader(data) : data?.column?.label;
-				};
-				let originRenderCell = column.renderCell;
-				if (column.type === "expand") {
-					column.renderCell = (data) => (0, vue.createVNode)("div", { "class": "vc-table__cell" }, [originRenderCell(data)]);
-					table.renderExpanded.value = (data) => {
-						return slots.default ? slots.default(data) : slots.default;
-					};
-				} else {
-					originRenderCell = originRenderCell || defaultRenderCell;
-					column.renderCell = (data) => {
-						let children = null;
-						if (slots.default) children = slots?.default?.(data);
-						else children = originRenderCell(data);
-						let prefix = treeCellPrefix(data);
-						const $props = {
-							class: "vc-table__cell",
-							style: {}
-						};
-						if (!isEmpty(table.store.states.treeData) && !prefix && data.isExpandColumn) prefix = (0, vue.createVNode)("span", { "class": "vc-table__unexpand__indent" }, null);
-						const { placeholder } = table.props;
-						const contentPlaceholder = typeof placeholder === "function" ? placeholder() : placeholder;
-						return (0, vue.createVNode)("div", $props, [prefix, children === void 0 || children === "" || children === null ? contentPlaceholder : children]);
-					};
-				}
-				return column;
-			};
-			const registerColumn = () => {
-				let column = merge$1({
-					colspan: 1,
-					rowspan: 1,
-					class: attrs.class,
-					style: attrs.style,
-					...cellStarts[props.type],
-					id: columnId.value,
-					realAlign,
-					realHeaderAlign
-				}, getPropsData(Object.keys(props)));
-				column = compose(setColumnRenders, setColumnWidth, setColumnForcedProps)(column);
-				for (const key in column) if (hasOwn$1(column, key)) columnConfig[key] = column[key];
-			};
-			const registerWatchers = () => {
-				Object.keys(props).forEach((k) => (0, vue.watch)(() => props[k], (v) => columnConfig[k] = v));
-				(0, vue.watch)(() => props.fixed, () => {
-					table.store.scheduleLayout(true);
-				});
-				(0, vue.watch)(() => realWidth.value, (v) => {
-					columnConfig["width"] = v;
-					columnConfig["realWidth"] = v;
-					table.store.scheduleLayout(false);
-				});
-				(0, vue.watch)(() => realMinWidth.value, () => {
-					table.store.scheduleLayout(false);
-				});
-			};
 			(0, vue.onBeforeMount)(() => {
-				registerColumn();
-				registerWatchers();
+				columnNode.init(props, slots, attrs);
 			});
 			(0, vue.onMounted)(() => {
-				const columnIndex = [...isSubColumn ? parent.vnode.el.children : parent.hiddenColumns.value.children].indexOf(instance.vnode.el);
-				table.store.insertColumn(columnConfig, columnIndex, isSubColumn && parent.columnConfig);
+				const columnIndex = [...isSubColumn ? parentNode.instance.vnode.el.children : table.hiddenColumns.value.children].indexOf(instance.vnode.el);
+				table.store.column.insert(columnNode, columnIndex, parentNode);
 			});
 			(0, vue.onUnmounted)(() => {
 				if (!instance.parent) return;
-				table.store.removeColumn(columnConfig, isSubColumn && parent.columnConfig);
+				table.store.column.remove(columnNode, parentNode);
 			});
 			(0, vue.provide)("vc-table-column", {
-				columnId,
-				columnConfig
+				columnId: (0, vue.computed)(() => columnNode.states.id),
+				columnNode
 			});
 			/**
 			* 可以计算 columnIndex(外层需要标签元素), 即h('div')
@@ -125846,7 +126246,7 @@ ${p}
 						rowIndex: -1
 					});
 					if (renderDefault instanceof Array) {
-						for (const childNode of renderDefault) if (/^vcm?-table-column$/.test(childNode.type?.name)) children.push(childNode);
+						for (const childNode of renderDefault) if (/^vcm?-table-column$/.test(childNode.type?.name || "")) children.push(childNode);
 						else if (childNode.type === vue.Fragment && childNode.children instanceof Array) renderDefault.push(...childNode.children);
 					}
 				} catch {