@tmagic/editor 1.8.0-beta.8 → 1.8.0-manmanyu.8

package/dist/tmagic-editor.umd.cjs

@@ -5167,69 +5167,173 @@
 			type: "event-select"
 		}]
 	};
+	var getReportTypeConfig = ({ reportType }) => {
+		return {
+			name: reportType,
+			style: {
+				backgroundColor: "#fff",
+				borderRadius: "4px",
+				padding: "16px",
+				marginBottom: "10px"
+			},
+			items: [
+				{
+					text: {
+						click: "点击",
+						expose: "曝光"
+					}[reportType],
+					static: true,
+					labelPosition: "left",
+					labelWidth: "200px",
+					className: "m-fields-title-container"
+				},
+				{
+					name: "f_module",
+					type: "data-source-field-select",
+					fieldConfig: { type: "text" },
+					checkStrictly: false,
+					dataSourceFieldType: ["string"],
+					disabled: (_vm, { formValue }) => !formValue?.report?.custom,
+					text: "f_module",
+					labelPosition: "left"
+				},
+				{
+					name: "f_resource",
+					type: "data-source-field-select",
+					fieldConfig: { type: "text" },
+					checkStrictly: false,
+					dataSourceFieldType: ["string"],
+					disabled: (_vm, { formValue }) => !formValue?.report?.custom,
+					text: "f_resource",
+					labelPosition: "left"
+				},
+				{
+					name: "f_type",
+					type: "data-source-field-select",
+					fieldConfig: { type: "text" },
+					checkStrictly: false,
+					dataSourceFieldType: ["string", "number"],
+					disabled: (_vm, { formValue }) => !formValue?.report?.custom,
+					text: "f_type",
+					labelPosition: "left"
+				}
+			]
+		};
+	};
 	var advancedTabConfig = {
 		title: "高级",
 		lazy: true,
 		items: [
+			{
+				type: "link",
+				displayText: "点击查看配置指南",
+				href: "https://iwiki.woa.com/pages/viewpage.action?pageId=827749220",
+				css: "color: #F56C6C;font-weight: bold"
+			},
 			{
 				name: _tmagic_core.NODE_DISABLE_CODE_BLOCK_KEY,
 				text: "禁用代码块",
 				type: "switch",
+				labelPosition: "left",
 				defaultValue: false,
-				extra: "开启后，配置的代码块将不会被执行"
+				extra: "开启后，配置的代码块将不会被执行",
+				style: { padding: "0 22px" }
 			},
 			{
 				name: _tmagic_core.NODE_DISABLE_DATA_SOURCE_KEY,
 				text: "禁用数据源",
 				type: "switch",
+				labelPosition: "left",
 				defaultValue: false,
-				extra: "开启后，组件内配置的数据源相关配置将不会被编译，显隐条件将失效"
+				extra: "开启后，组件内配置的数据源相关配置将不会被编译，显隐条件将失效",
+				style: { padding: "0 22px" }
 			},
 			{
 				name: "created",
-				text: "created",
+				text: "Created",
+				flat: true,
 				labelPosition: "top",
 				type: "code-select",
-				extra: "组件初始化时执行"
+				titleExtra: "组件初始化时执行",
+				style: { padding: "0 22px" }
 			},
 			{
 				name: "mounted",
-				text: "mounted",
+				text: "Mounted",
 				labelPosition: "top",
+				flat: true,
 				type: "code-select",
-				extra: "组件挂载到dom时执行"
+				titleExtra: "组件挂载到dom时执行",
+				style: { padding: "0 22px" }
 			},
 			{
 				name: "display",
-				text: "display",
-				extra: "控制组件是否渲染，关系的代码块返回值为false时不渲染",
+				text: "Display",
+				flat: true,
+				titleExtra: "控制组件是否渲染，关系的代码块返回值为false时不渲染",
 				labelPosition: "top",
-				type: "code-select"
+				type: "code-select",
+				style: { padding: "0 22px" }
+			},
+			{
+				type: "fieldset",
+				legend: "上报",
+				labelWidth: "80px",
+				name: "report",
+				className: "no-border-fieldset",
+				style: { paddingTop: "10px" },
+				items: [
+					{
+						type: "row",
+						items: [{
+							type: "switch",
+							name: "custom",
+							labelPosition: "left",
+							defaultValue: false,
+							labelWidth: "120px",
+							text: "开启自定义",
+							extra: "开启自定义后可以手动修改上报内容，关闭后会自动生成上报内容"
+						}]
+					},
+					getReportTypeConfig({ reportType: "click" }),
+					getReportTypeConfig({ reportType: "expose" })
+				]
 			}
 		]
 	};
 	var displayTabConfig = {
 		title: "显示条件",
 		display: (_state, { model }) => model.type !== "page",
-		items: [{
-			name: _tmagic_core.NODE_CONDS_RESULT_KEY,
-			type: "select",
-			text: "条件成立时",
-			defaultValue: false,
-			options: [{
-				text: "显示",
-				value: false
-			}, {
-				text: "隐藏",
-				value: true
-			}],
-			extra: (_state, { model }) => `条件成立时${model[_tmagic_core.NODE_CONDS_RESULT_KEY] ? "隐藏" : "显示"}，不成立时${model[_tmagic_core.NODE_CONDS_RESULT_KEY] ? "显示" : "隐藏"}；<br />同一条件组内的所有条件配置同时成立时表示该条件组成立，任意一个条件组成立时表示条件成立(条件组内为且的关系，条件组间为或的关系)；<br />条件为空时表示成立；`
-		}, {
-			type: "display-conds",
-			name: _tmagic_core.NODE_CONDS_KEY,
-			titlePrefix: "条件组",
-			defaultValue: []
-		}]
+		items: [
+			{
+				name: _tmagic_core.NODE_CONDS_RESULT_KEY,
+				type: "select",
+				text: "条件成立时",
+				defaultValue: false,
+				options: [{
+					text: "显示",
+					value: false
+				}, {
+					text: "隐藏",
+					value: true
+				}],
+				extra: (_state, { model }) => `条件成立时${model[_tmagic_core.NODE_CONDS_RESULT_KEY] ? "隐藏" : "显示"}，不成立时${model[_tmagic_core.NODE_CONDS_RESULT_KEY] ? "显示" : "隐藏"}；<br />同一条件组内的所有条件配置同时成立时表示该条件组成立，任意一个条件组成立时表示条件成立(条件组内为且的关系，条件组间为或的关系)；<br />条件为空时表示成立；`
+			},
+			{
+				text: "条件组配置",
+				static: true,
+				className: "display-conds-title"
+			},
+			{
+				type: "display-conds",
+				name: _tmagic_core.NODE_CONDS_KEY,
+				titlePrefix: "条件组",
+				flat: true,
+				fixed: "right",
+				operateColWidth: 112,
+				defaultValue: []
+			}
+		]
 	};
 	/**
 	* 统一为组件属性表单加上事件、高级、样式配置
@@ -5247,10 +5351,11 @@
 			name: "id",
 			text: "ID",
 			type: "text",
-			disabled: true,
+			static: true,
 			append: {
-				type: "button",
-				text: "复制",
+				type: "icon",
+				text: "https://vip.image.video.qpic.cn/vupload/20260615/36cf7e1781493669935.svg",
+				extra: "复制",
 				handler: (vm, { model }) => {
 					navigator.clipboard.writeText(`${model.id}`).then(() => {
 						_tmagic_design.tMagicMessage.success("已复制");
@@ -5269,6 +5374,7 @@
 		const tabConfig = {
 			type: "tab",
 			labelWidth,
+			className: "magic-right-panel-tabs-top",
 			items: [
 				{
 					title: "属性",
@@ -5674,7 +5780,7 @@
 	*
 	* - `add`：oldValue = null；`remove`：newValue = null；`update`：两者都有，可带 changeRecords 做局部更新。
 	* - 内容会做 cloneDeep 防止后续被外部引用篡改；opType 依据 old/new 是否为 null 推断。
-	* - 仅负责构造 step 并返回，入栈与事件 emit 由统一的 history.push(stepType, step, id) 处理。
+	* - 仅负责构造 step 并返回，入栈与事件 emit 由各公共方法（pushCodeBlock / pushDataSource）自行处理。
 	* - 不直接驱动业务 service，调用方负责实际写回。
 	*/
 	var createStackStep = (id, payload) => {
@@ -5683,14 +5789,9 @@
 		const newSchema = payload.newValue ? cloneDeep$1(payload.newValue) : null;
 		const changeRecords = payload.changeRecords?.length ? cloneDeep$1(payload.changeRecords) : void 0;
 		const opType = detectStackOpType(payload.oldValue, payload.newValue);
-		const schema = payload.newValue ?? payload.oldValue;
-		const name = payload.name ?? schema?.name ?? schema?.title ?? "";
 		return {
 			uuid: (0, _tmagic_utils.guid)(),
-			data: {
-				name,
-				id
-			},
+			id,
 			opType,
 			diff: [{
 				...newSchema !== null ? { newSchema } : {},
@@ -5699,10 +5800,7 @@
 			}],
 			historyDescription: payload.historyDescription,
 			source: payload.source,
-			operator: payload.operator,
-			rootStep: payload.rootStep,
-			timestamp: Date.now(),
-			extra: payload.extra
+			timestamp: Date.now()
 		};
 	};
 	var markStackSaved = (undoRedo) => {
@@ -5715,22 +5813,46 @@
 		});
 	};
 	/**
-	* 把单个历史栈（页面 / 代码块 / 数据源 / 扩展类型）的步骤列表按"目标"做相邻合并：
-	* - 单实体的 'update' 按 targetId 与相邻同 targetId 的 update 合并到一个 group，组内可展开查看每步；
-	* - 'add' / 'remove' 始终独立成组（语义上是结构变更，不应被收纳进单实体修改组）；
-	* - 多实体 'update'（如页面批量改属性）也独立成组（无明确单一目标，避免误合并）。
+	* 把单个「按 id 分栈」的历史栈（代码块 / 数据源）拆成若干 group：
+	* 每条操作记录独立成组，不做相邻 update 合并（与页面历史的合并策略不同）。
 	*
-	* 各类型行为完全一致，仅 `kind` 与 step 快照类型不同，统一由本方法处理。
+	* 代码块与数据源除 `kind` 外结构完全一致，统一由本方法处理；`kind` 决定返回的具体分组类型。
+	*/
+	var mergeStackSteps = (kind, id, list, cursor) => {
+		const currentIndex = cursor - 1;
+		return list.map((step, index) => {
+			const applied = index < cursor;
+			const isCurrent = index === currentIndex;
+			return {
+				kind,
+				id,
+				opType: step.opType,
+				steps: [{
+					step,
+					index,
+					applied,
+					isCurrent
+				}],
+				applied,
+				isCurrent
+			};
+		});
+	};
+	/**
+	* 把页面栈拆成若干 group：
+	* - 单节点的 'update' 按 targetId 与相邻同 targetId 的 update 合并到一个 group；
+	* - 'add' / 'remove' 始终独立成组（语义上是结构变更，不应被收纳进单节点修改组）；
+	* - 多节点 'update'（如批量改属性）也独立成组（无明确单一目标，避免误合并）。
 	*/
-	var mergeSteps = (kind, id, list, cursor) => {
+	var mergePageSteps = (pageId, list, cursor) => {
 		const groups = [];
 		let current = null;
 		const currentIndex = cursor - 1;
 		list.forEach((step, index) => {
 			const applied = index < cursor;
 			const isCurrent = index === currentIndex;
-			const targetId = detectTargetId(step);
-			const targetName = detectTargetName(step);
+			const targetId = detectPageTargetId(step);
+			const targetName = detectPageTargetName(step);
 			const entry = {
 				step,
 				index,
@@ -5745,8 +5867,8 @@
 				if (targetName) current.targetName = targetName;
 			} else {
 				current = {
-					kind,
-					id,
+					kind: "page",
+					pageId,
 					opType: step.opType,
 					targetId: mergeable ? targetId : void 0,
 					targetName,
@@ -5760,21 +5882,18 @@
 		return groups;
 	};
 	/**
-	* 解析 step 中的"目标 id"用于合并：
-	* - 单实体 update：取唯一一项 diff 的快照 id；快照无 id 时（如 CodeBlockContent）回退到 `step.data.id`
-	*   （即资源 id），使代码块 / 数据源同样能按资源合并相邻 update；
-	* - 其它情形（多实体 update / add / remove）：返回 undefined，表示不参与合并。
+	* 解析 StepValue 中的"目标节点 id"用于合并：
+	* - 单节点 update：取唯一一项 updatedItems 的节点 id；
+	* - 其它情形（多节点 update / add / remove）：返回 undefined，表示不参与合并。
 	*/
-	var detectTargetId = (step) => {
+	var detectPageTargetId = (step) => {
 		if (step.opType !== "update") return void 0;
 		const items = step.diff;
 		if (items?.length !== 1) return void 0;
-		const newSchema = items[0].newSchema;
-		const oldSchema = items[0].oldSchema;
-		return newSchema?.id ?? oldSchema?.id ?? step.data?.id;
+		return items[0].newSchema?.id ?? items[0].oldSchema?.id;
 	};
-	/** 解析 step 中的目标可读名（用于 UI 展示）。 */
-	var detectTargetName = (step) => {
+	/** 解析 StepValue 中的目标节点可读名（用于 UI 展示）。 */
+	var detectPageTargetName = (step) => {
 		const items = step.diff;
 		if (step.opType === "update") {
 			if (items?.length === 1) {
@@ -5848,9 +5967,8 @@
 		return stacks[id];
 	};
 	/**
-	* 撤销下限：当栈 index 0 是 `opType: 'initial'` 的基线 step 时为 1（基线不可被撤销），否则为 0。
-	* 适用于所有历史类型（page / codeBlock / dataSource / 扩展），把 cursor 钉在基线之上，
-	* 保证 undo / canUndo / goto 都不会越过初始基线。
+	* 撤销下限：当页面栈 index 0 是 `opType: 'initial'` 的基线 step 时为 1（基线不可被撤销），否则为 0。
+	* 用于把 cursor 钉在基线之上，保证 undo / canUndo / goto 都不会越过初始基线。
 	*/
 	var undoFloor = (undoRedo) => {
 		return undoRedo.getElementList()[0]?.opType === "initial" ? 1 : 0;
@@ -5946,92 +6064,78 @@
 	//#region packages/editor/src/services/history.ts
 	var canUsePluginMethods$7 = { sync: [
 		"push",
+		"pushCodeBlock",
+		"pushDataSource",
+		"undoCodeBlock",
+		"redoCodeBlock",
+		"undoDataSource",
+		"redoDataSource",
 		"undo",
 		"redo"
 	] };
-	/** 各内置历史类型的默认展示名称（用于历史面板 tab / 分组标题等）。扩展类型可通过 registerStepType / setStepName 登记。 */
-	var DEFAULT_STEP_NAMES = {
-		page: "页面",
-		codeBlock: "代码块",
-		dataSource: "数据源"
-	};
-	/** 各历史类型对应的分组 `kind`（展示用）：page→page，codeBlock→code-block，dataSource→data-source。扩展类型缺省回退到 stepType 本身。 */
-	var STEP_TYPE_KIND = {
-		page: "page",
-		codeBlock: "code-block",
-		dataSource: "data-source"
-	};
 	/** 历史记录持久化快照的默认存储位置与结构版本。 */
 	var DEFAULT_DB_NAME = "tmagic-editor";
 	var DEFAULT_STORE_NAME = "history";
 	var DEFAULT_KEY = "default";
-	var PERSIST_VERSION = 3;
+	var PERSIST_VERSION = 2;
 	var History = class extends BaseService {
 		state = (0, vue.reactive)({
-			steps: {
-				page: {},
-				codeBlock: {},
-				dataSource: {}
-			},
-			stepNames: { ...DEFAULT_STEP_NAMES }
+			pageSteps: {},
+			pageId: void 0,
+			canRedo: false,
+			canUndo: false,
+			codeBlockState: {},
+			dataSourceState: {}
 		});
 		constructor() {
 			super([...canUsePluginMethods$7.sync.map((methodName) => ({
 				name: methodName,
 				isAsync: false
 			}))]);
-		}
-		/**
-		* 注册一个扩展历史类型，使其可与内置 `page` / `codeBlock` / `dataSource` 一样走统一的
-		* {@link push} / {@link undo} / {@link redo}（按 id 分栈、独立 undo/redo）。
-		*
-		* @param stepType 自定义历史类型标识（勿与内置类型重名）
-		* @param options.event push/undo/redo 后派发的事件名，缺省为 `${stepType}-history-change`
-		* @param options.name 历史面板中的展示名称（tab / 分组标题等），缺省回退到 stepType 本身
-		*/
-		registerStepType(stepType, options = {}) {
-			this.getStepBucket(stepType);
-			if (options.name !== void 0) this.state.stepNames[stepType] = options.name;
-		}
-		/**
-		* 读取指定历史类型的展示名称（用于历史面板 tab / 分组标题等）。
-		* 未登记名称时回退到 stepType 本身。
-		*/
-		getStepName(stepType) {
-			return this.state.stepNames[stepType] ?? `${stepType}`;
-		}
-		/**
-		* 设置指定历史类型的展示名称（用于历史面板 tab / 分组标题等）。
-		* 内置 `page` / `codeBlock` / `dataSource` 也可在此覆盖默认中文名。
-		*/
-		setStepName(stepType, name) {
-			this.state.stepNames[stepType] = name;
+			this.on("change", this.setCanUndoRedo);
 		}
 		reset() {
-			this.clearAllSteps();
+			this.state.pageSteps = {};
+			this.state.codeBlockState = {};
+			this.state.dataSourceState = {};
+			this.resetPage();
+		}
+		resetPage() {
+			this.state.pageId = void 0;
+			this.state.canRedo = false;
+			this.state.canUndo = false;
+		}
+		changePage(page) {
+			if (!page) return;
+			this.state.pageId = page.id;
+			if (!this.state.pageSteps[this.state.pageId]) this.state.pageSteps[this.state.pageId] = new UndoRedo();
+			this.setCanUndoRedo();
+			this.emit("page-change", this.state.pageSteps[this.state.pageId]);
 		}
 		resetState() {
-			this.clearAllSteps();
+			this.state.pageId = void 0;
+			this.state.pageSteps = {};
+			this.state.canRedo = false;
+			this.state.canUndo = false;
+			this.state.codeBlockState = {};
+			this.state.dataSourceState = {};
 		}
 		/**
-		* 为指定历史栈（默认 `page`，也适用于 codeBlock / dataSource / 扩展类型）种入一条「初始基线」记录。
+		* 为指定页面 / 页面片种入一条「初始基线」记录（如加载 DSL 时的「初始 / 加载」基线）。
 		*
-		* 该记录是一条 `opType: 'initial'` 的 step，作为对应栈 **index 0 的固定底线**：
+		* 该记录是一条 `opType: 'initial'` 的 {@link StepValue}，作为页面历史栈 **index 0 的固定底线**：
 		* - 它是一条真实入栈的 step（随栈一起持久化），但被钉为撤销/回滚的下限——cursor 永不低于它，
-		*   因此不会被 undo / goto / revert 触达（详见 {@link undo} / {@link undoFloor}）；
-		* - 历史面板把它过滤出分组列表（见 {@link getHistoryGroups}），改由底部「初始」行展示。
-		*
-		* 仅当目标栈为空时种入（保证 initial 一定位于 index 0）；已存在 initial 底线时不重复种入。
+		*   因此不会被 undo / goto / revert 触达（详见 {@link undo} / {@link setCanUndoRedo}）；
+		* - 历史面板把它过滤出分组列表（见 {@link getPageHistoryGroups}），改由底部「初始」行展示。
 		*
-		* @param stepType 历史类型
-		* @param id       目标栈 id（page 为 pageId，其余类型为对应资源 id）
-		* @param options  基线展示信息（名称 / 描述 / 来源）
+		* 仅当目标页面栈为空时种入（保证 initial 一定位于 index 0）；已存在 initial 底线时默认不重复种入，
+		* 传 `force=true` 且栈为空时按新基线种入。
 		*/
-		setMarker(stepType, id, options = {}) {
-			if (!this.isValidStackId(id)) return null;
-			const existing = this.getMarker(stepType, id);
+		setPageMarker(pageId, options = {}) {
+			if (pageId === void 0 || pageId === null || `${pageId}` === "") return null;
+			const existing = this.getPageMarker(pageId);
 			if (existing) return existing;
-			const stack = getOrCreateStack(this.getStepBucket(stepType), id);
+			const stack = getOrCreateStack(this.state.pageSteps, pageId);
 			if (stack.getLength() > 0) return null;
 			const marker = {
 				uuid: (0, _tmagic_utils.guid)(),
@@ -6039,95 +6143,164 @@
 				diff: [],
 				data: {
 					name: options.name || "",
-					id
-				},
-				extra: {
-					...options.extra || {},
-					...stepType === "page" ? {
-						selectedBefore: [],
-						selectedAfter: [],
-						modifiedNodeIds: /* @__PURE__ */ new Map()
-					} : {}
+					id: pageId
 				},
+				selectedBefore: [],
+				selectedAfter: [],
+				modifiedNodeIds: /* @__PURE__ */ new Map(),
 				historyDescription: options.description || "未修改的初始状态",
 				timestamp: Date.now(),
 				...options.source ? { source: options.source } : {}
 			};
 			stack.pushElement(marker);
-			this.emit("marker-change", {
-				id,
-				marker,
-				stepType
-			});
+			if (`${pageId}` === `${this.state.pageId}`) this.setCanUndoRedo();
+			this.emit("page-marker-change", marker);
 			return marker;
 		}
 		/**
-		* 读取指定历史栈的初始基线 step（栈 index 0 且 `opType: 'initial'`）；
-		* 不存在或 id 缺省时返回 undefined。
+		* 读取指定页面（缺省当前活动页）的初始基线 step（页面栈 index 0 且 `opType: 'initial'`）；
+		* 不存在时返回 undefined。
 		*/
-		getMarker(stepType, id) {
-			if (!this.isValidStackId(id)) return void 0;
-			const first = this.state.steps[stepType]?.[id]?.getElementList()[0];
+		getPageMarker(pageId) {
+			const targetPageId = pageId ?? this.state.pageId;
+			if (!targetPageId) return void 0;
+			const first = this.state.pageSteps[targetPageId]?.getElementList()[0];
 			return first?.opType === "initial" ? first : void 0;
 		}
-		push(stepType, step, id) {
-			if (!this.isValidStackId(id)) return null;
-			this.fillStepMeta(step);
-			getOrCreateStack(this.getStepBucket(stepType), id).pushElement(step);
-			this.emit("change", step, stepType, id);
+		/**
+		* 把一条步骤推入指定页面的栈；不指定 pageId 时落到当前活动页。
+		*
+		* 跨页操作（例如 `moveToContainer` 把节点搬到其它页）必须显式传入 `pageId`，
+		* 否则会把记录错误地落到操作发起页 / 当前激活页，破坏目标页 / 源页的撤销栈语义。
+		*/
+		push(state, pageId) {
+			const undoRedo = this.getUndoRedo(pageId);
+			if (!undoRedo) return null;
+			if (state.uuid === void 0) state.uuid = (0, _tmagic_utils.guid)();
+			if (state.timestamp === void 0) state.timestamp = Date.now();
+			undoRedo.pushElement(state);
+			if (pageId === void 0 || `${pageId}` === `${this.state.pageId}`) this.emit("change", state);
+			return state;
+		}
+		/** 读取指定页面（缺省当前活动页）历史栈当前游标所在的 step（cursor - 1）；无则返回 null。 */
+		getCurrentPageStep(pageId) {
+			const targetPageId = pageId ?? this.state.pageId;
+			if (!targetPageId) return null;
+			return this.state.pageSteps[targetPageId]?.getCurrentElement() ?? null;
+		}
+		/**
+		* 用 `state` 替换指定页面栈当前游标所在的 step（并丢弃其后的重做尾部），游标不变。
+		* 用于「连续 set root 记录合并」等就地替换最新一条的场景；替换成功后按需刷新 / 通知。
+		*/
+		replaceCurrentPageStep(state, pageId) {
+			const undoRedo = this.getUndoRedo(pageId);
+			if (!undoRedo) return null;
+			if (state.uuid === void 0) state.uuid = (0, _tmagic_utils.guid)();
+			if (state.timestamp === void 0) state.timestamp = Date.now();
+			if (!undoRedo.replaceCurrentElement(state)) return null;
+			this.emit("change", state);
+			return state;
+		}
+		/**
+		* 推入一条代码块变更记录（与页面/节点完全无关），按 `codeBlockId` 维度独立一份 UndoRedo 栈。
+		*
+		* - 新增：oldContent = null，newContent = 新内容
+		* - 更新：oldContent / newContent 都为对应内容
+		* - 删除：newContent = null，oldContent = 删除前内容
+		* - `changeRecords` 来自 form 端，撤销/重做时若有则按 propPath 局部覆盖；缺省才退化为整内容替换。
+		* - 不直接驱动 codeBlockService，调用方负责实际写回。
+		*/
+		pushCodeBlock(codeBlockId, payload) {
+			const step = createStackStep(codeBlockId, {
+				oldValue: payload.oldContent,
+				newValue: payload.newContent,
+				changeRecords: payload.changeRecords,
+				historyDescription: payload.historyDescription,
+				source: payload.source
+			});
+			if (!step) return null;
+			getOrCreateStack(this.state.codeBlockState, codeBlockId).pushElement(step);
+			this.emit("code-block-history-change", codeBlockId, step);
+			return step;
+		}
+		/**
+		* 推入一条数据源变更记录（与页面/节点完全无关），按 `dataSourceId` 维度独立一份 UndoRedo 栈。
+		* 行为同 pushCodeBlock（新增 oldSchema=null；删除 newSchema=null）。
+		*/
+		pushDataSource(dataSourceId, payload) {
+			const step = createStackStep(dataSourceId, {
+				oldValue: payload.oldSchema,
+				newValue: payload.newSchema,
+				changeRecords: payload.changeRecords,
+				historyDescription: payload.historyDescription,
+				source: payload.source
+			});
+			if (!step) return null;
+			getOrCreateStack(this.state.dataSourceState, dataSourceId).pushElement(step);
+			this.emit("data-source-history-change", dataSourceId, step);
 			return step;
 		}
-		undo(stepType, id) {
-			if (!this.isValidStackId(id)) return null;
-			const undoRedo = this.state.steps[stepType]?.[id];
+		/** 撤销指定代码块的最近一次变更。 */
+		undoCodeBlock(codeBlockId) {
+			const undoRedo = this.state.codeBlockState[codeBlockId];
 			if (!undoRedo) return null;
-			if (undoRedo.getCursor() <= undoFloor(undoRedo)) return null;
 			const step = undoRedo.undo();
-			if (step) this.emit("change", step, stepType, id);
+			if (step) this.emit("code-block-history-change", codeBlockId, step);
 			return step;
 		}
-		redo(stepType, id) {
-			if (!this.isValidStackId(id)) return null;
-			const undoRedo = this.state.steps[stepType]?.[id];
+		/** 重做指定代码块的下一次变更。 */
+		redoCodeBlock(codeBlockId) {
+			const undoRedo = this.state.codeBlockState[codeBlockId];
 			if (!undoRedo) return null;
 			const step = undoRedo.redo();
-			if (step) this.emit("change", step, stepType, id);
+			if (step) this.emit("code-block-history-change", codeBlockId, step);
 			return step;
 		}
-		/**
-		* 是否可对指定历史栈撤销（cursor 高于 initial 基线底线）。
-		* @param stepType 历史类型
-		* @param id       目标栈 id；缺省 / 无效时返回 false
-		*/
-		canUndo(stepType, id) {
-			if (!this.isValidStackId(id)) return false;
-			const undoRedo = this.state.steps[stepType]?.[id];
-			return undoRedo ? undoRedo.getCursor() > undoFloor(undoRedo) : false;
+		/** 是否可对指定代码块撤销。 */
+		canUndoCodeBlock(codeBlockId) {
+			return this.state.codeBlockState[codeBlockId]?.canUndo() ?? false;
 		}
-		/**
-		* 是否可对指定历史栈重做。
-		* @param stepType 历史类型
-		* @param id       目标栈 id；缺省 / 无效时返回 false
-		*/
-		canRedo(stepType, id) {
-			if (!this.isValidStackId(id)) return false;
-			return this.state.steps[stepType]?.[id]?.canRedo() ?? false;
+		/** 是否可对指定代码块重做。 */
+		canRedoCodeBlock(codeBlockId) {
+			return this.state.codeBlockState[codeBlockId]?.canRedo() ?? false;
 		}
-		/** 读取指定页面历史栈当前游标所在的 step（cursor - 1）；无则返回 null。 */
-		getCurrentPageStep(pageId) {
-			if (!this.isValidStackId(pageId)) return null;
-			return this.state.steps.page[pageId]?.getCurrentElement() ?? null;
+		/** 撤销指定数据源的最近一次变更。 */
+		undoDataSource(dataSourceId) {
+			const undoRedo = this.state.dataSourceState[dataSourceId];
+			if (!undoRedo) return null;
+			const step = undoRedo.undo();
+			if (step) this.emit("data-source-history-change", dataSourceId, step);
+			return step;
 		}
-		/**
-		* 用 `state` 替换指定页面栈当前游标所在的 step（并丢弃其后的重做尾部），游标不变。
-		* 用于「连续 set root 记录合并」等就地替换最新一条的场景；替换成功后派发 `change`。
-		*/
-		replaceCurrentStep(stepType, state, id) {
-			if (!this.isValidStackId(id)) return null;
-			const undoRedo = getOrCreateStack(this.getStepBucket(stepType), id);
-			this.fillStepMeta(state);
-			if (!undoRedo.replaceCurrentElement(state)) return null;
-			this.emit("change", state, stepType, id);
+		/** 重做指定数据源的下一次变更。 */
+		redoDataSource(dataSourceId) {
+			const undoRedo = this.state.dataSourceState[dataSourceId];
+			if (!undoRedo) return null;
+			const step = undoRedo.redo();
+			if (step) this.emit("data-source-history-change", dataSourceId, step);
+			return step;
+		}
+		/** 是否可对指定数据源撤销。 */
+		canUndoDataSource(dataSourceId) {
+			return this.state.dataSourceState[dataSourceId]?.canUndo() ?? false;
+		}
+		/** 是否可对指定数据源重做。 */
+		canRedoDataSource(dataSourceId) {
+			return this.state.dataSourceState[dataSourceId]?.canRedo() ?? false;
+		}
+		undo() {
+			const undoRedo = this.getUndoRedo();
+			if (!undoRedo) return null;
+			if (undoRedo.getCursor() <= undoFloor(undoRedo)) return null;
+			const state = undoRedo.undo();
+			this.emit("change", state);
+			return state;
+		}
+		redo() {
+			const undoRedo = this.getUndoRedo();
+			if (!undoRedo) return null;
+			const state = undoRedo.redo();
+			this.emit("change", state);
 			return state;
 		}
 		destroy() {
@@ -6136,52 +6309,84 @@
 			this.removeAllPlugins();
 		}
 		/**
-		* 清空历史记录栈。统一入口，所有类型（page / codeBlock / dataSource / 扩展）行为一致：
-		* - 传入 `id`：仅清空 `stepType` 下该 id 对应的栈；
-		* - 缺省 `id`：清空 `stepType` 下的全部栈。
-		*
-		* 仅删除撤销/重做记录，不会改动 DSL / 代码块 / 数据源本身。清空时会**保留各栈原有的
-		* initial 基线**（文案 / 来源），无基线时清空成空栈。清空后派发 `clear`（签名 `(id, stepType)`）。
-		*
-		* @param stepType 历史类型
-		* @param id       目标栈 id；缺省表示清空该类型下全部栈
+		* 清空指定页面（缺省当前活动页）的历史记录栈。
+		* 仅删除撤销/重做记录，不会改动当前 DSL；清空后该页将无法再撤销/重做之前的操作。
 		*/
-		clear(stepType, id) {
-			const bucket = this.state.steps[stepType];
-			if (!bucket) return;
-			if (this.isValidStackId(id)) this.clearStack(stepType, id);
-			else if (id === void 0) Object.keys(bucket).forEach((stackId) => this.clearStack(stepType, stackId));
-			else return;
-			this.emit("clear", {
-				id,
-				stepType
+		clearPage(pageId) {
+			const targetPageId = pageId ?? this.state.pageId;
+			if (!targetPageId) return;
+			const marker = this.getPageMarker(targetPageId);
+			this.state.pageSteps[targetPageId] = new UndoRedo();
+			if (marker) this.setPageMarker(targetPageId, {
+				name: marker.data?.name,
+				description: marker.historyDescription,
+				source: marker.source
 			});
+			if (`${targetPageId}` === `${this.state.pageId}`) {
+				this.setCanUndoRedo();
+				this.emit("clear-page", null);
+			}
 		}
 		/**
-		* 标记历史记录为「已保存」（把对应栈当前游标所在的记录标为 `saved`）。统一入口：
-		* - 缺省 `id`：标记**全部类型、全部栈**（整份 DSL 落库场景），派发 `mark-saved` 且 `kind: 'all'`；
-		* - 传入 `id`：仅标记 `stepType` 下该 id 对应的栈，派发 `mark-saved` 且 `kind` 为 `stepType`。
-		*
-		* 同一栈内任意时刻最多只有一条记录为 `saved`；从 IndexedDB 恢复时游标会被定位到最近一条已保存记录之后。
-		*
-		* @param stepType 历史类型
-		* @param id       目标栈 id；缺省表示标记全部类型 / 全部栈
+		* 清空数据源历史记录栈：传入 `dataSourceId` 仅清空该数据源，缺省清空全部数据源。
+		* 仅删除撤销/重做记录，不会改动数据源本身。
 		*/
-		markSaved(stepType, id) {
-			if (id === void 0) {
-				Object.values(this.state.steps).forEach((bucket) => Object.values(bucket).forEach(markStackSaved));
-				this.emit("mark-saved", { kind: "all" });
-				return;
-			}
-			if (!this.isValidStackId(id)) return;
-			markStackSaved(this.state.steps[stepType]?.[id]);
+		clearDataSource(dataSourceId) {
+			if (dataSourceId !== void 0) delete this.state.dataSourceState[dataSourceId];
+			else this.state.dataSourceState = {};
+		}
+		/**
+		* 清空代码块历史记录栈：传入 `codeBlockId` 仅清空该代码块，缺省清空全部代码块。
+		* 仅删除撤销/重做记录，不会改动代码块本身。
+		*/
+		clearCodeBlock(codeBlockId) {
+			if (codeBlockId !== void 0) delete this.state.codeBlockState[codeBlockId];
+			else this.state.codeBlockState = {};
+		}
+		/**
+		* 标记「整份 DSL 已保存」：把页面 / 代码块 / 数据源所有栈当前游标所在的记录都标为 `saved`。
+		* 适用于「整体落库」场景；若只保存了其中一类，请改用更细粒度的
+		* {@link markPageSaved} / {@link markCodeBlockSaved} / {@link markDataSourceSaved}。
+		*/
+		markSaved() {
+			Object.values(this.state.pageSteps).forEach(markStackSaved);
+			Object.values(this.state.codeBlockState).forEach(markStackSaved);
+			Object.values(this.state.dataSourceState).forEach(markStackSaved);
+			this.emit("mark-saved", { kind: "all" });
+		}
+		/**
+		* 标记指定页面（缺省为当前活动页）的历史栈当前记录为已保存。
+		* 仅影响该页面自己的栈，不波及代码块 / 数据源 / 其它页面。
+		*/
+		markPageSaved(pageId) {
+			const targetPageId = pageId ?? this.state.pageId;
+			if (!targetPageId) return;
+			markStackSaved(this.state.pageSteps[targetPageId]);
+			this.emit("mark-saved", {
+				kind: "page",
+				id: targetPageId
+			});
+		}
+		/** 标记指定代码块的历史栈当前记录为已保存，仅影响该代码块自己的栈。 */
+		markCodeBlockSaved(codeBlockId) {
+			if (!codeBlockId) return;
+			markStackSaved(this.state.codeBlockState[codeBlockId]);
+			this.emit("mark-saved", {
+				kind: "code-block",
+				id: codeBlockId
+			});
+		}
+		/** 标记指定数据源的历史栈当前记录为已保存，仅影响该数据源自己的栈。 */
+		markDataSourceSaved(dataSourceId) {
+			if (!dataSourceId) return;
+			markStackSaved(this.state.dataSourceState[dataSourceId]);
 			this.emit("mark-saved", {
-				kind: stepType,
-				id
+				kind: "data-source",
+				id: dataSourceId
 			});
 		}
 		/**
-		* 把当前内存中的全部历史栈（页面 / 代码块 / 数据源 / 扩展类型）序列化后写入本地 IndexedDB。
+		* 把当前内存中的全部历史栈（页面 / 代码块 / 数据源）序列化后写入本地 IndexedDB。
 		*
 		* - 每个 UndoRedo 栈连同其游标、容量一并保存，恢复后可继续 undo/redo；
 		* - `key` 用于区分不同活动页 / 项目（同一 store 下可保存多份快照），缺省为 `default`；
@@ -6190,17 +6395,12 @@
 		*/
 		async saveToIndexedDB(options = {}) {
 			const { dbName = DEFAULT_DB_NAME, storeName = DEFAULT_STORE_NAME, key = DEFAULT_KEY, appId } = options;
-			const steps = {
-				page: {},
-				codeBlock: {},
-				dataSource: {}
-			};
-			Object.entries(this.state.steps).forEach(([stepType, bucket]) => {
-				steps[stepType] = serializeStacks(bucket);
-			});
 			const snapshot = {
 				version: PERSIST_VERSION,
-				steps,
+				pageId: this.state.pageId,
+				pageSteps: serializeStacks(this.state.pageSteps),
+				codeBlockState: serializeStacks(this.state.codeBlockState),
+				dataSourceState: serializeStacks(this.state.dataSourceState),
 				savedAt: Date.now()
 			};
 			await idbSet(this.resolveDbName(dbName, appId), storeName, key, snapshot);
@@ -6211,7 +6411,7 @@
 		* 从本地 IndexedDB 读取此前保存的历史快照并重建全部撤销/重做栈。
 		*
 		* - 读取到的每个栈都会经 {@link UndoRedo.fromSerialized} 还原（含游标），随后可直接 undo/redo；
-		* - 会整体覆盖当前内存中的历史状态（活动页由 editorService 维护，不在此恢复）；
+		* - 会整体覆盖当前内存中的历史状态，并把活动页恢复为快照中的 pageId；
 		* - 找不到对应记录时返回 null，且不改动当前状态；
 		* - 不支持 IndexedDB 的环境（如 SSR）会 reject。
 		*/
@@ -6220,21 +6420,23 @@
 			const snapshot = await idbGet(this.resolveDbName(dbName, appId), storeName, key);
 			if (!snapshot) return null;
 			const parseDSL = getEditorConfig("parseDSL");
-			const steps = {
-				page: {},
-				codeBlock: {},
-				dataSource: {}
-			};
-			Object.entries(snapshot.steps).forEach(([stepType, bucket]) => {
-				steps[stepType] = deserializeStacks(bucket, parseDSL);
-			});
-			this.state.steps = steps;
+			this.state.pageSteps = deserializeStacks(snapshot.pageSteps, parseDSL);
+			this.state.codeBlockState = deserializeStacks(snapshot.codeBlockState, parseDSL);
+			this.state.dataSourceState = deserializeStacks(snapshot.dataSourceState, parseDSL);
+			this.state.pageId = snapshot.pageId;
+			this.setCanUndoRedo();
 			this.emit("restore-from-indexed-db", snapshot);
 			return snapshot;
 		}
-		getStepList(stepType, id) {
-			if (!this.isValidStackId(id)) return [];
-			const undoRedo = this.state.steps[stepType]?.[id];
+		/**
+		* 取出当前活动页的历史步骤平铺列表（包含已应用 + 已撤销）。
+		* 列表按时间正序，最早一步在最前面。
+		* 通常 UI 应使用 `getPageHistoryGroups` 取已合并分组的版本；本方法仅为兼容/调试保留。
+		*/
+		getPageStepList(pageId) {
+			const targetPageId = pageId ?? this.state.pageId;
+			if (!targetPageId) return [];
+			const undoRedo = this.state.pageSteps[targetPageId];
 			if (!undoRedo) return [];
 			const list = undoRedo.getElementList();
 			const cursor = undoRedo.getCursor();
@@ -6244,103 +6446,147 @@
 				applied: index < cursor
 			}));
 		}
-		getHistoryGroups(stepType, id) {
-			const bucket = this.state.steps[stepType];
-			if (!bucket) return [];
-			const kind = STEP_TYPE_KIND[stepType] ?? stepType;
-			const collect = (stackId) => {
-				const undoRedo = bucket[stackId];
-				if (!undoRedo) return [];
+		/**
+		* 取出当前活动页的历史栈，按"目标节点"做相邻合并：
+		* - 连续修改同一节点（单节点 update）的多步合并为一个 group，组内可展开查看每步；
+		* - add / remove / 多节点 update 始终独立成组。
+		* 用于历史面板的"页面"tab 展示。
+		*/
+		getPageHistoryGroups(pageId) {
+			const targetPageId = pageId ?? this.state.pageId;
+			if (!targetPageId) return [];
+			const undoRedo = this.state.pageSteps[targetPageId];
+			if (!undoRedo) return [];
+			const list = undoRedo.getElementList();
+			if (!list.length) return [];
+			return mergePageSteps(targetPageId, list, undoRedo.getCursor()).filter((group) => group.opType !== "initial");
+		}
+		/**
+		* 取出全部代码块的历史栈，按 codeBlockId 分桶展示。
+		* 同一栈内每条操作记录独立成组，不做相邻 update 合并。
+		*/
+		getCodeBlockHistoryGroups() {
+			const groups = [];
+			Object.entries(this.state.codeBlockState).forEach(([id, undoRedo]) => {
+				if (!undoRedo) return;
 				const list = undoRedo.getElementList();
-				if (!list.length) return [];
-				return mergeSteps(kind, stackId, list, undoRedo.getCursor()).filter((group) => group.opType !== "initial");
-			};
-			if (this.isValidStackId(id)) return collect(id);
-			return Object.keys(bucket).flatMap((stackId) => collect(stackId));
+				if (!list.length) return;
+				const cursor = undoRedo.getCursor();
+				groups.push(...mergeStackSteps("code-block", id, list, cursor));
+			});
+			return groups;
 		}
 		/**
-		* 读取指定历史栈的当前游标（已应用步骤数量）。统一入口，替代旧的
-		* `getPageCursor` / `getCodeBlockCursor` / `getDataSourceCursor`。
-		* - `id` 缺省或非法、或对应栈不存在时返回 0；
-		* - `stepType` 支持 `page` / `codeBlock` / `dataSource` / 扩展类型。
+		* 读取指定页面历史栈的当前游标（已应用步骤数量）。不传则取当前活动页。
+		* 没有对应栈时返回 0。
 		*/
-		getCursor(stepType, id) {
-			if (!this.isValidStackId(id)) return 0;
-			return this.state.steps[stepType]?.[id]?.getCursor() ?? 0;
+		getPageCursor(pageId) {
+			const targetPageId = pageId ?? this.state.pageId;
+			if (!targetPageId) return 0;
+			return this.state.pageSteps[targetPageId]?.getCursor() ?? 0;
+		}
+		/** 读取指定代码块历史栈的当前游标。 */
+		getCodeBlockCursor(codeBlockId) {
+			return this.state.codeBlockState[codeBlockId]?.getCursor() ?? 0;
+		}
+		/** 读取指定数据源历史栈的当前游标。 */
+		getDataSourceCursor(dataSourceId) {
+			return this.state.dataSourceState[dataSourceId]?.getCursor() ?? 0;
 		}
 		/**
-		* 按历史记录 uuid 在指定历史类型的栈中查找其所属 id 与索引，统一入口，替代旧的
-		* `getPageStepIndexByUuid` / `findCodeBlockStepLocationByUuid` / `findDataSourceStepLocationByUuid`。
-		*
-		* - 传入 `id`：仅在该 id 对应的单个栈中查找（如页面历史按活动页查看，传入 pageId）；
-		* - 缺省 `id`：遍历该类型下全部栈查找（代码块 / 数据源等按全部资源分桶的场景）。
-		*
-		* 找不到时返回 null。供「按 uuid 回滚」等需要把 uuid 映射回 (id, index) 的场景使用。
-		*
-		* @param stepType 历史类型
-		* @param uuid     目标历史记录的 uuid
-		* @param id       目标栈 id；缺省表示遍历该类型下全部栈
+		* 取出指定代码块历史栈的平铺步骤列表（含 applied 标记）。供 revert 等按 index 索引步骤使用。
+		*/
+		getCodeBlockStepList(codeBlockId) {
+			const undoRedo = this.state.codeBlockState[codeBlockId];
+			if (!undoRedo) return [];
+			const list = undoRedo.getElementList();
+			const cursor = undoRedo.getCursor();
+			return list.map((step, index) => ({
+				step,
+				index,
+				applied: index < cursor
+			}));
+		}
+		/**
+		* 取出指定数据源历史栈的平铺步骤列表（含 applied 标记）。供 revert 等按 index 索引步骤使用。
+		*/
+		getDataSourceStepList(dataSourceId) {
+			const undoRedo = this.state.dataSourceState[dataSourceId];
+			if (!undoRedo) return [];
+			const list = undoRedo.getElementList();
+			const cursor = undoRedo.getCursor();
+			return list.map((step, index) => ({
+				step,
+				index,
+				applied: index < cursor
+			}));
+		}
+		/**
+		* 按历史记录 uuid 在指定页面（默认当前活动页）的栈中查找其索引。
+		* 找不到时返回 -1。供「按 uuid 回滚」等需要把 uuid 映射回 index 的场景使用。
+		*/
+		getPageStepIndexByUuid(uuid, pageId) {
+			if (!uuid) return -1;
+			return this.getPageStepList(pageId).findIndex((entry) => entry.step.uuid === uuid);
+		}
+		/**
+		* 按历史记录 uuid 在全部代码块栈中查找其所属 codeBlockId 与索引。
+		* 找不到时返回 null。
 		*/
-		findStepLocationByUuid(stepType, uuid, id) {
+		findCodeBlockStepLocationByUuid(uuid) {
 			if (!uuid) return null;
-			const bucket = this.state.steps[stepType];
-			if (!bucket) return null;
-			if (this.isValidStackId(id)) {
-				const index = this.getStepList(stepType, id).findIndex((entry) => entry.step.uuid === uuid);
-				return index >= 0 ? {
-					id,
-					index
-				} : null;
-			}
-			for (const stackId of Object.keys(bucket)) {
-				const index = this.getStepList(stepType, stackId).findIndex((entry) => entry.step.uuid === uuid);
+			for (const id of Object.keys(this.state.codeBlockState)) {
+				const index = this.getCodeBlockStepList(id).findIndex((entry) => entry.step.uuid === uuid);
 				if (index >= 0) return {
-					id: stackId,
+					id,
 					index
 				};
 			}
 			return null;
 		}
-		usePlugin(options) {
-			super.usePlugin(options);
-		}
-		emit(eventName, ...args) {
-			return super.emit(eventName, ...args);
-		}
 		/**
-		* 取出指定历史类型的栈桶（`Record<id, UndoRedo>`）；不存在时按需创建空桶，
-		* 从而支持通过 {@link registerStepType} 或首次 push 动态扩展历史类型。
+		* 按历史记录 uuid 在全部数据源栈中查找其所属 dataSourceId 与索引。
+		* 找不到时返回 null。
 		*/
-		getStepBucket(stepType) {
-			if (!this.state.steps[stepType]) this.state.steps[stepType] = {};
-			return this.state.steps[stepType];
+		findDataSourceStepLocationByUuid(uuid) {
+			if (!uuid) return null;
+			for (const id of Object.keys(this.state.dataSourceState)) {
+				const index = this.getDataSourceStepList(id).findIndex((entry) => entry.step.uuid === uuid);
+				if (index >= 0) return {
+					id,
+					index
+				};
+			}
+			return null;
 		}
 		/**
-		* 清空单个历史栈并按需重建其 initial 基线（保留原基线的文案 / 来源）。
+		* 取出全部数据源的历史栈，按 dataSourceId 分桶展示。同上，每条操作独立成组。
 		*/
-		clearStack(stepType, id) {
-			const marker = this.getMarker(stepType, id);
-			this.getStepBucket(stepType)[id] = new UndoRedo();
-			if (marker) this.setMarker(stepType, id, {
-				name: marker.data?.name,
-				description: marker.historyDescription,
-				source: marker.source
+		getDataSourceHistoryGroups() {
+			const groups = [];
+			Object.entries(this.state.dataSourceState).forEach(([id, undoRedo]) => {
+				if (!undoRedo) return;
+				const list = undoRedo.getElementList();
+				if (!list.length) return;
+				const cursor = undoRedo.getCursor();
+				groups.push(...mergeStackSteps("data-source", id, list, cursor));
 			});
+			return groups;
 		}
-		/** 入栈前补全 step 的 uuid / timestamp（调用方未指定时）。 */
-		fillStepMeta(step) {
-			if (step.uuid === void 0) step.uuid = (0, _tmagic_utils.guid)();
-			if (step.timestamp === void 0) step.timestamp = Date.now();
-		}
-		/** 校验「按 id 分栈」类型（codeBlock / dataSource / 扩展）的 id 是否有效。 */
-		isValidStackId(id) {
-			return id !== void 0 && id !== null && `${id}` !== "";
+		usePlugin(options) {
+			super.usePlugin(options);
 		}
-		/** 清空全部历史栈内容（保留已注册的类型键，使扩展类型在 reset 后仍可用）。 */
-		clearAllSteps() {
-			Object.keys(this.state.steps).forEach((stepType) => {
-				this.state.steps[stepType] = {};
-			});
+		/**
+		* 取出指定页面的栈；不传 pageId 时按当前活动页取。
+		*
+		* 跨页 push 时如果目标页的栈尚不存在（用户从未进入过该页），会按需创建一条空栈，
+		* 这样切到目标页时 Ctrl+Z 也能撤回该步骤。
+		*/
+		getUndoRedo(pageId) {
+			const targetPageId = pageId ?? this.state.pageId;
+			if (!targetPageId) return null;
+			if (!this.state.pageSteps[targetPageId]) this.state.pageSteps[targetPageId] = new UndoRedo();
+			return this.state.pageSteps[targetPageId];
 		}
 		/**
 		* 把基础 dbName 与当前 DSL（root app）的 id 拼成最终库名，实现不同应用历史隔离。
@@ -6350,6 +6596,11 @@
 			const resolvedAppId = appId ?? editor_default.get("root")?.id;
 			return resolvedAppId ? `${dbName}-${resolvedAppId}` : dbName;
 		}
+		setCanUndoRedo() {
+			const undoRedo = this.getUndoRedo();
+			this.state.canRedo = undoRedo?.canRedo() || false;
+			this.state.canUndo = undoRedo ? undoRedo.getCursor() > undoFloor(undoRedo) : false;
+		}
 	};
 	var history_default = new History();
 	//#endregion
@@ -7000,7 +7251,7 @@
 					this.state.stageLoading = this.state.pageLength !== 0;
 					if (preValue && !isEmpty(preValue)) this.pushRootDiffHistory(preValue, app, options.historySource);
 					else app.items?.forEach((pageNode) => {
-						if (pageNode?.id !== void 0 && !history_default.getMarker("page", pageNode.id)) history_default.setMarker("page", pageNode.id, {
+						if (pageNode?.id !== void 0 && !history_default.getPageMarker(pageNode.id)) history_default.setPageMarker(pageNode.id, {
 							name: pageNode.name,
 							source: options.historySource
 						});
@@ -7102,6 +7353,8 @@
 			this.set("nodes", node ? [node] : []);
 			this.set("page", page);
 			this.set("parent", parent);
+			if (page) history_default.changePage((0, vue.toRaw)(page));
+			else history_default.resetState();
 			if (node?.id) this.get("stage")?.renderer?.runtime?.getApp?.()?.page?.emit("editor:select", {
 				node,
 				page,
@@ -7292,7 +7545,10 @@
 				if (pages[0]) {
 					await this.select(pages[0]);
 					stage?.select(pages[0].id);
-				} else this.selectRoot();
+				} else {
+					this.selectRoot();
+					history_default.resetPage();
+				}
 			};
 			const rootItems = root.items || [];
 			if ((0, _tmagic_utils.isPage)(node)) {
@@ -7796,9 +8052,7 @@
 		* @returns 被撤销的操作
 		*/
 		async undo() {
-			const pageId = this.get("page")?.id;
-			if (pageId === void 0) return null;
-			const value = history_default.undo("page", pageId);
+			const value = history_default.undo();
 			if (value) await this.applyHistoryOp(value, true);
 			return value;
 		}
@@ -7807,9 +8061,7 @@
 		* @returns 被恢复的操作
 		*/
 		async redo() {
-			const pageId = this.get("page")?.id;
-			if (pageId === void 0) return null;
-			const value = history_default.redo("page", pageId);
+			const value = history_default.redo();
 			if (value) await this.applyHistoryOp(value, false);
 			return value;
 		}
@@ -7830,7 +8082,7 @@
 		* @returns 反向后产生的新 step；目标不存在 / 未应用 / 反向失败时返回 null
 		*/
 		async revertPageStep(index) {
-			const entry = history_default.getStepList("page", this.get("page")?.id)[index];
+			const entry = history_default.getPageStepList()[index];
 			if (!entry?.applied) return null;
 			const { step } = entry;
 			if (step.opType === "initial") return null;
@@ -7840,7 +8092,7 @@
 				if (!items.length || !items.every((item) => item.changeRecords?.length)) return null;
 			}
 			let revertedStep = null;
-			const captureRevert = (_pageId, s) => {
+			const captureRevert = (s) => {
 				revertedStep = s;
 			};
 			history_default.once("change", captureRevert);
@@ -7910,10 +8162,9 @@
 		*/
 		async revertPageStepById(uuids) {
 			const results = [];
-			const pageId = this.get("page")?.id;
 			for (const uuid of uuids) {
-				const location = history_default.findStepLocationByUuid("page", uuid, pageId);
-				results.push(!location ? null : await this.revertPageStep(location.index));
+				const index = history_default.getPageStepIndexByUuid(uuid);
+				results.push(index < 0 ? null : await this.revertPageStep(index));
 			}
 			return results;
 		}
@@ -7927,9 +8178,8 @@
 		* @returns 实际移动到的最终游标位置
 		*/
 		async gotoPageStep(targetCursor) {
-			const pageId = this.get("page")?.id;
-			let cursor = history_default.getCursor("page", pageId);
-			const { length } = history_default.getStepList("page", pageId);
+			let cursor = history_default.getPageCursor();
+			const { length } = history_default.getPageStepList();
 			const target = Math.max(0, Math.min(targetCursor, length));
 			while (cursor > target) {
 				if (!await this.undo()) break;
@@ -8044,34 +8294,30 @@
 					id: page.id
 				},
 				opType,
-				extra: {
-					selectedBefore: [],
-					selectedAfter: [],
-					modifiedNodeIds: /* @__PURE__ */ new Map()
-				},
+				selectedBefore: [],
+				selectedAfter: [],
+				modifiedNodeIds: /* @__PURE__ */ new Map(),
 				diff: [diffItem],
 				rootStep: true
 			};
 			if (source) step.source = source;
 			const top = history_default.getCurrentPageStep(page.id);
-			if (top?.rootStep && top.source === source) history_default.replaceCurrentStep("page", step, page.id);
-			else history_default.push("page", step, page.id);
+			if (top?.rootStep && top.source === source) history_default.replaceCurrentPageStep(step, page.id);
+			else history_default.push(step, page.id);
 		}
 		pushOpHistory(opType, { diff, pageData, historyDescription, source }) {
 			const step = {
 				uuid: (0, _tmagic_utils.guid)(),
 				data: pageData,
 				opType,
-				extra: {
-					selectedBefore: this.selectionBeforeOp ?? [],
-					selectedAfter: this.get("nodes").map((n) => n.id),
-					modifiedNodeIds: new Map(this.get("modifiedNodeIds"))
-				},
+				selectedBefore: this.selectionBeforeOp ?? [],
+				selectedAfter: this.get("nodes").map((n) => n.id),
+				modifiedNodeIds: new Map(this.get("modifiedNodeIds")),
 				diff
 			};
 			if (historyDescription) step.historyDescription = historyDescription;
 			if (source) step.source = source;
-			const historyId = history_default.push("page", step, pageData.id) ? step.uuid : null;
+			const historyId = history_default.push(step, pageData.id) ? step.uuid : null;
 			this.lastPushedHistoryId = historyId;
 			this.selectionBeforeOp = null;
 			return historyId;
@@ -8172,10 +8418,10 @@
 					break;
 				}
 			}
-			this.set("modifiedNodeIds", step.extra?.modifiedNodeIds ?? /* @__PURE__ */ new Map());
+			this.set("modifiedNodeIds", step.modifiedNodeIds);
 			const page = (0, vue.toRaw)(this.get("page"));
 			if (page) {
-				const selectIds = (reverse ? step.extra?.selectedBefore : step.extra?.selectedAfter) ?? [];
+				const selectIds = reverse ? step.selectedBefore : step.selectedAfter;
 				setTimeout(() => {
 					if (!selectIds.length) return;
 					if (selectIds.length > 1) {
@@ -8200,7 +8446,7 @@
 	var PROPS_PANEL_WIDTH_STORAGE_KEY = "$MagicEditorPropsPanelWidthData";
 	var DEFAULT_LEFT_COLUMN_WIDTH = 310;
 	var DEFAULT_RIGHT_COLUMN_WIDTH = 480;
-	var MIN_LEFT_COLUMN_WIDTH = 200;
+	var MIN_LEFT_COLUMN_WIDTH = 238;
 	var MIN_CENTER_COLUMN_WIDTH = 400;
 	var MIN_RIGHT_COLUMN_WIDTH = 300;
 	var H_GUIDE_LINE_STORAGE_KEY = "$MagicStageHorizontalGuidelinesData";
@@ -9459,9 +9705,9 @@
 	var SplitView_default = SplitView_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/components/Icon.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$71, Icon_vue_vue_type_script_setup_true_lang_default;
+	var _hoisted_1$75, Icon_vue_vue_type_script_setup_true_lang_default;
 	var init_Icon_vue_vue_type_script_setup_true_lang = __esmMin((() => {
-		_hoisted_1$71 = ["src"];
+		_hoisted_1$75 = ["src"];
 		Icon_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 			name: "MEditorIcon",
 			__name: "Icon",
@@ -9479,7 +9725,7 @@
 						key: 1,
 						class: "magic-editor-icon"
 					}, {
-						default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("img", { src: __props.icon }, null, 8, _hoisted_1$71)]),
+						default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("img", { src: __props.icon }, null, 8, _hoisted_1$75)]),
 						_: 1
 					})) : typeof __props.icon === "string" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("i", {
 						key: 2,
@@ -9507,7 +9753,7 @@
 	//#region packages/editor/src/components/ToolButton.vue?vue&type=script&setup=true&lang.ts
 	init_use_services();
 	init_Icon();
-	var _hoisted_1$70 = {
+	var _hoisted_1$74 = {
 		key: 1,
 		class: "menu-item-text"
 	};
@@ -9570,7 +9816,7 @@
 				}, [__props.data.type === "divider" ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicDivider), {
 					key: 0,
 					direction: __props.data.direction || "vertical"
-				}, null, 8, ["direction"])) : __props.data.type === "text" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$70, (0, vue.toDisplayString)(__props.data.text), 1)) : __props.data.type === "button" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, [__props.data.tooltip ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicTooltip), {
+				}, null, 8, ["direction"])) : __props.data.type === "text" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$74, (0, vue.toDisplayString)(__props.data.text), 1)) : __props.data.type === "button" ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, [__props.data.tooltip ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicTooltip), {
 					key: 0,
 					effect: "dark",
 					placement: "bottom-start",
@@ -9642,7 +9888,7 @@
 	init_Icon();
 	init_use_services();
 	init_editor();
-	var _hoisted_1$69 = {
+	var _hoisted_1$73 = {
 		key: 0,
 		id: "m-editor-page-bar-add-icon",
 		class: "m-editor-page-bar-item m-editor-page-bar-item-icon"
@@ -9668,7 +9914,7 @@
 				editorService.add(pageConfig);
 			};
 			return (_ctx, _cache) => {
-				return showAddPageButton.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$69, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicPopover), { "popper-class": "data-source-list-panel-add-menu" }, {
+				return showAddPageButton.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$73, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicPopover), { "popper-class": "data-source-list-panel-add-menu" }, {
 					reference: (0, vue.withCtx)(() => [(0, vue.createVNode)(Icon_default, { icon: (0, vue.unref)(_element_plus_icons_vue.Plus) }, null, 8, ["icon"])]),
 					default: (0, vue.withCtx)(() => [(0, vue.createVNode)(ToolButton_default, { data: {
 						type: "button",
@@ -9695,7 +9941,7 @@
 	//#region packages/editor/src/layouts/page-bar/PageBarScrollContainer.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
 	init_use_services();
-	var _hoisted_1$68 = {
+	var _hoisted_1$72 = {
 		class: "m-editor-page-bar",
 		ref: "pageBar"
 	};
@@ -9789,7 +10035,7 @@
 				}
 			});
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$68, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$72, [
 					(0, vue.renderSlot)(_ctx.$slots, "prepend"),
 					__props.length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_2$28, [(0, vue.renderSlot)(_ctx.$slots, "default")], 512)) : (0, vue.createCommentVNode)("v-if", true),
 					canScroll.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
@@ -9812,13 +10058,13 @@
 	//#endregion
 	//#region packages/editor/src/layouts/page-bar/PageList.vue?vue&type=script&setup=true&lang.ts
 	init_use_services();
-	var _hoisted_1$67 = {
+	var _hoisted_1$71 = {
 		key: 0,
 		id: "m-editor-page-bar-list-icon",
 		class: "m-editor-page-bar-item m-editor-page-bar-item-icon"
 	};
 	var _hoisted_2$27 = { class: "page-bar-popover-wrapper" };
-	var _hoisted_3$13 = { class: "page-bar-popover-inner" };
+	var _hoisted_3$14 = { class: "page-bar-popover-inner" };
 	var PageList_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorPageList",
 		__name: "PageList",
@@ -9831,7 +10077,7 @@
 				await editorService.select(id);
 			};
 			return (_ctx, _cache) => {
-				return showPageListButton.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$67, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicPopover), {
+				return showPageListButton.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$71, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicPopover), {
 					"popper-class": "page-bar-popover",
 					placement: "top",
 					trigger: "hover",
@@ -9842,7 +10088,7 @@
 						default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_element_plus_icons_vue.Files))]),
 						_: 1
 					})]),
-					default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_2$27, [(0, vue.createElementVNode)("div", _hoisted_3$13, [(0, vue.renderSlot)(_ctx.$slots, "page-list-popover", { list: __props.list }, () => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.list, (item, index) => {
+					default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_2$27, [(0, vue.createElementVNode)("div", _hoisted_3$14, [(0, vue.renderSlot)(_ctx.$slots, "page-list-popover", { list: __props.list }, () => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.list, (item, index) => {
 						return (0, vue.openBlock)(), (0, vue.createBlock)(ToolButton_default, {
 							data: {
 								type: "button",
@@ -9864,7 +10110,7 @@
 	//#endregion
 	//#region packages/editor/src/layouts/page-bar/Search.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
-	var _hoisted_1$66 = { class: "m-editor-page-bar-item m-editor-page-bar-item-icon m-editor-page-bar-search" };
+	var _hoisted_1$70 = { class: "m-editor-page-bar-item m-editor-page-bar-item-icon m-editor-page-bar-search" };
 	var Search_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		__name: "Search",
 		props: {
@@ -9897,7 +10143,7 @@
 				emit("search", values);
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$66, [(0, vue.createVNode)(Icon_default, {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$70, [(0, vue.createVNode)(Icon_default, {
 					icon: (0, vue.unref)(_element_plus_icons_vue.Search),
 					onClick: _cache[0] || (_cache[0] = ($event) => visible.value = !visible.value),
 					class: (0, vue.normalizeClass)({ "icon-active": visible.value })
@@ -9922,10 +10168,10 @@
 	//#endregion
 	//#region packages/editor/src/layouts/page-bar/PageBar.vue?vue&type=script&setup=true&lang.ts
 	init_use_services();
-	var _hoisted_1$65 = { class: "m-editor-page-bar-tabs" };
+	var _hoisted_1$69 = { class: "m-editor-page-bar-tabs" };
 	var _hoisted_2$26 = ["data-page-id", "onClick"];
-	var _hoisted_3$12 = { class: "m-editor-page-bar-title" };
-	var _hoisted_4$9 = ["title"];
+	var _hoisted_3$13 = { class: "m-editor-page-bar-title" };
+	var _hoisted_4$10 = ["title"];
 	var PageBar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorPageBar",
 		__name: "PageBar",
@@ -9991,7 +10237,7 @@
 				}
 			});
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$65, [(0, vue.createVNode)(PageBarScrollContainer_default, {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$69, [(0, vue.createVNode)(PageBarScrollContainer_default, {
 					ref: "pageBarScrollContainer",
 					"page-bar-sort-options": __props.pageBarSortOptions,
 					length: list.value.length
@@ -10015,7 +10261,7 @@
 							key: item.id,
 							"data-page-id": item.id,
 							onClick: ($event) => switchPage(item.id)
-						}, [(0, vue.createElementVNode)("div", _hoisted_3$12, [(0, vue.renderSlot)(_ctx.$slots, "page-bar-title", { page: item }, () => [(0, vue.createElementVNode)("span", { title: item.name }, (0, vue.toDisplayString)(item.name || item.id), 9, _hoisted_4$9)])]), (0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicPopover), {
+						}, [(0, vue.createElementVNode)("div", _hoisted_3$13, [(0, vue.renderSlot)(_ctx.$slots, "page-bar-title", { page: item }, () => [(0, vue.createElementVNode)("span", { title: item.name }, (0, vue.toDisplayString)(item.name || item.id), 9, _hoisted_4$10)])]), (0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicPopover), {
 							"popper-class": "page-bar-popover",
 							placement: "top",
 							trigger: "hover",
@@ -10053,7 +10299,7 @@
 	//#region packages/editor/src/layouts/AddPageBox.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
 	init_use_services();
-	var _hoisted_1$64 = { class: "m-editor-empty-panel" };
+	var _hoisted_1$68 = { class: "m-editor-empty-panel" };
 	var _hoisted_2$25 = { class: "m-editor-empty-content" };
 	var AddPageBox_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorAddPageBox",
@@ -10071,7 +10317,7 @@
 				});
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$64, [(0, vue.createElementVNode)("div", _hoisted_2$25, [(0, vue.createElementVNode)("div", {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$68, [(0, vue.createElementVNode)("div", _hoisted_2$25, [(0, vue.createElementVNode)("div", {
 					class: "m-editor-empty-button",
 					onClick: _cache[0] || (_cache[0] = ($event) => clickHandler((0, vue.unref)(_tmagic_core.NodeType).PAGE))
 				}, [(0, vue.createElementVNode)("div", null, [(0, vue.createVNode)(Icon_default, { icon: (0, vue.unref)(_element_plus_icons_vue.Plus) }, null, 8, ["icon"])]), _cache[2] || (_cache[2] = (0, vue.createElementVNode)("p", null, "新增页面", -1))]), !__props.disabledPageFragment ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
@@ -10087,14 +10333,14 @@
 	var AddPageBox_default = AddPageBox_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/layouts/CodeEditor.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$63, _hoisted_2$24, CodeEditor_vue_vue_type_script_setup_true_lang_default;
+	var _hoisted_1$67, _hoisted_2$24, CodeEditor_vue_vue_type_script_setup_true_lang_default;
 	var init_CodeEditor_vue_vue_type_script_setup_true_lang = __esmMin((() => {
 		init_lodash();
 		init_Icon();
 		init_config();
 		init_editor();
 		init_monaco_editor();
-		_hoisted_1$63 = { class: "magic-code-editor" };
+		_hoisted_1$67 = { class: "magic-code-editor" };
 		_hoisted_2$24 = {
 			ref: "codeEditor",
 			class: "magic-code-editor-content"
@@ -10332,7 +10578,7 @@
 					}
 				});
 				return (_ctx, _cache) => {
-					return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$63, [((0, vue.openBlock)(), (0, vue.createBlock)(vue.Teleport, {
+					return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$67, [((0, vue.openBlock)(), (0, vue.createBlock)(vue.Teleport, {
 						to: "body",
 						disabled: !fullScreen.value
 					}, [(0, vue.createElementVNode)("div", {
@@ -10368,11 +10614,6 @@
 	init_use_services();
 	init_config();
 	init_CodeEditor();
-	var _hoisted_1$62 = {
-		class: "m-editor",
-		ref: "content",
-		style: { "min-width": "900px" }
-	};
 	var Framework_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorFramework",
 		__name: "Framework",
@@ -10380,7 +10621,8 @@
 			disabledPageFragment: { type: Boolean },
 			pageBarSortOptions: {},
 			pageFilterFunction: { type: Function },
-			hideSidebar: { type: Boolean }
+			hideSidebar: { type: Boolean },
+			theme: {}
 		},
 		setup(__props) {
 			const props = __props;
@@ -10432,7 +10674,15 @@
 				}
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$62, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
+					ref: "content",
+					class: (0, vue.normalizeClass)([
+						"m-editor",
+						__props.theme ? `m-editor--${__props.theme}` : "",
+						__props.theme ? `m-theme--${__props.theme}` : ""
+					]),
+					style: { "min-width": "900px" }
+				}, [
 					(0, vue.renderSlot)(_ctx.$slots, "header"),
 					(0, vue.renderSlot)(_ctx.$slots, "nav"),
 					(0, vue.renderSlot)(_ctx.$slots, "content-before"),
@@ -10451,7 +10701,7 @@
 						"right-class": "m-editor-framework-right",
 						left: __props.hideSidebar ? void 0 : columnWidth.value.left,
 						right: columnWidth.value.right,
-						"min-left": __props.hideSidebar ? 0 : (0, vue.unref)(200),
+						"min-left": __props.hideSidebar ? 0 : (0, vue.unref)(238),
 						"min-right": (0, vue.unref)(300),
 						"min-center": (0, vue.unref)(400),
 						width: frameworkRect.value.width,
@@ -10491,7 +10741,7 @@
 					]), [[vue.vShow, !showSrc.value]]),
 					(0, vue.renderSlot)(_ctx.$slots, "content-after"),
 					(0, vue.renderSlot)(_ctx.$slots, "footer")
-				], 512);
+				], 2);
 			};
 		}
 	});
@@ -10681,15 +10931,15 @@
 	};
 	//#endregion
 	//#region packages/editor/src/layouts/history-list/GroupRow.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$61 = ["title"];
+	var _hoisted_1$66 = ["title"];
 	var _hoisted_2$23 = ["title"];
-	var _hoisted_3$11 = { class: "m-editor-history-list-item-desc" };
-	var _hoisted_4$8 = {
+	var _hoisted_3$12 = { class: "m-editor-history-list-item-desc" };
+	var _hoisted_4$9 = {
 		key: 0,
 		class: "m-editor-history-list-item-saved",
 		title: "该记录为最近一次保存的状态"
 	};
-	var _hoisted_5$4 = {
+	var _hoisted_5$5 = {
 		key: 1,
 		class: "m-editor-history-list-item-actions"
 	};
@@ -10849,9 +11099,9 @@
 						title: headIndexTitle.value
 					}, (0, vue.toDisplayString)(headIndexLabel.value), 9, _hoisted_2$23),
 					(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(["m-editor-history-list-item-op", `op-${__props.group.opType}`]) }, (0, vue.toDisplayString)((0, vue.unref)(opLabel)(__props.group.opType)), 3),
-					(0, vue.createElementVNode)("span", _hoisted_3$11, (0, vue.toDisplayString)(__props.group.desc), 1),
-					headSaved.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_4$8, "已保存")) : (0, vue.createCommentVNode)("v-if", true),
-					!merged.value && (headRevertable.value || headDiffable.value || canHeadGoto.value) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_5$4, [
+					(0, vue.createElementVNode)("span", _hoisted_3$12, (0, vue.toDisplayString)(__props.group.desc), 1),
+					headSaved.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_4$9, "已保存")) : (0, vue.createCommentVNode)("v-if", true),
+					!merged.value && (headRevertable.value || headDiffable.value || canHeadGoto.value) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_5$5, [
 						headRevertable.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", {
 							key: 0,
 							class: "m-editor-history-list-item-revert",
@@ -10891,7 +11141,7 @@
 						key: 6,
 						class: (0, vue.normalizeClass)(["m-editor-history-list-group-toggle", { "is-expanded": __props.expanded }])
 					}, "▾", 2)) : (0, vue.createCommentVNode)("v-if", true)
-				], 10, _hoisted_1$61), merged.value && __props.expanded ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("ul", _hoisted_10, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(subStepsDisplay.value, (s) => {
+				], 10, _hoisted_1$66), merged.value && __props.expanded ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("ul", _hoisted_10, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(subStepsDisplay.value, (s) => {
 					return (0, vue.openBlock)(), (0, vue.createElementBlock)("li", {
 						key: s.index,
 						class: (0, vue.normalizeClass)({
@@ -10950,18 +11200,18 @@
 	var GroupRow_default = GroupRow_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/layouts/history-list/InitialRow.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$60 = ["title"];
+	var _hoisted_1$65 = ["title"];
 	var _hoisted_2$22 = { class: "m-editor-history-list-item-desc" };
-	var _hoisted_3$10 = {
+	var _hoisted_3$11 = {
 		key: 0,
 		class: "m-editor-history-list-item-saved",
 		title: "该记录为最近一次保存的状态"
 	};
-	var _hoisted_4$7 = {
+	var _hoisted_4$8 = {
 		key: 1,
 		class: "m-editor-history-list-item-actions"
 	};
-	var _hoisted_5$3 = ["title"];
+	var _hoisted_5$4 = ["title"];
 	var InitialRow_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorHistoryListInitialRow",
 		__name: "InitialRow",
@@ -11013,8 +11263,8 @@
 					}, "#0", -1)),
 					_cache[1] || (_cache[1] = (0, vue.createElementVNode)("span", { class: "m-editor-history-list-item-op op-initial" }, "初始", -1)),
 					(0, vue.createElementVNode)("span", _hoisted_2$22, (0, vue.toDisplayString)(desc.value), 1),
-					saved.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_3$10, "已保存")) : (0, vue.createCommentVNode)("v-if", true),
-					__props.gotoEnabled && !__props.isCurrent ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_4$7, [(0, vue.createElementVNode)("span", {
+					saved.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_3$11, "已保存")) : (0, vue.createCommentVNode)("v-if", true),
+					__props.gotoEnabled && !__props.isCurrent ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_4$8, [(0, vue.createElementVNode)("span", {
 						class: "m-editor-history-list-item-goto",
 						title: "回到该记录",
 						onClick: (0, vue.withModifiers)(onClick, ["stop"])
@@ -11023,8 +11273,8 @@
 						key: 2,
 						class: "m-editor-history-list-item-time",
 						title: timeTitle.value
-					}, (0, vue.toDisplayString)(time.value), 9, _hoisted_5$3)) : (0, vue.createCommentVNode)("v-if", true)
-				], 10, _hoisted_1$60);
+					}, (0, vue.toDisplayString)(time.value), 9, _hoisted_5$4)) : (0, vue.createCommentVNode)("v-if", true)
+				], 10, _hoisted_1$65);
 			};
 		}
 	});
@@ -11033,10 +11283,10 @@
 	var InitialRow_default = InitialRow_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/layouts/history-list/Bucket.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$59 = { class: "m-editor-history-list-bucket" };
+	var _hoisted_1$64 = { class: "m-editor-history-list-bucket" };
 	var _hoisted_2$21 = { class: "m-editor-history-list-bucket-title" };
-	var _hoisted_3$9 = { class: "m-editor-history-list-bucket-count" };
-	var _hoisted_4$6 = { class: "m-editor-history-list-ul" };
+	var _hoisted_3$10 = { class: "m-editor-history-list-bucket-count" };
+	var _hoisted_4$7 = { class: "m-editor-history-list-ul" };
 	var Bucket_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorHistoryListBucket",
 		__name: "Bucket",
@@ -11065,11 +11315,11 @@
 			/** 该 bucket 是否处于初始状态（栈 cursor=0），等价于全部 group 都未 applied。 */
 			const isInitial = (0, vue.computed)(() => props.groups.length > 0 && props.groups.every((g) => !g.applied));
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$59, [(0, vue.createElementVNode)("div", _hoisted_2$21, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$64, [(0, vue.createElementVNode)("div", _hoisted_2$21, [
 					(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(__props.config.title), 1),
 					(0, vue.createElementVNode)("code", null, (0, vue.toDisplayString)(String(__props.bucketId)), 1),
-					(0, vue.createElementVNode)("span", _hoisted_3$9, (0, vue.toDisplayString)(__props.groups.length) + " 组", 1)
-				]), (0, vue.createElementVNode)("ul", _hoisted_4$6, [
+					(0, vue.createElementVNode)("span", _hoisted_3$10, (0, vue.toDisplayString)(__props.groups.length) + " 组", 1)
+				]), (0, vue.createElementVNode)("ul", _hoisted_4$7, [
 					((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.groups, (group) => {
 						return (0, vue.openBlock)(), (0, vue.createBlock)(GroupRow_default, {
 							key: rowKey(group),
@@ -11102,12 +11352,12 @@
 	var Bucket_default = Bucket_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/layouts/history-list/BucketTab.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$58 = {
+	var _hoisted_1$63 = {
 		key: 0,
 		class: "m-editor-history-list-empty"
 	};
 	var _hoisted_2$20 = { class: "m-editor-history-list-toolbar" };
-	var _hoisted_3$8 = ["title"];
+	var _hoisted_3$9 = ["title"];
 	var BucketTab_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorHistoryListBucketTab",
 		__name: "BucketTab",
@@ -11126,11 +11376,11 @@
 		],
 		setup(__props) {
 			return (_ctx, _cache) => {
-				return !__props.buckets.length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$58, "暂无操作记录")) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [(0, vue.createElementVNode)("div", _hoisted_2$20, [(0, vue.createElementVNode)("span", {
+				return !__props.buckets.length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$63, "暂无操作记录")) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [(0, vue.createElementVNode)("div", _hoisted_2$20, [(0, vue.createElementVNode)("span", {
 					class: "m-editor-history-list-clear",
 					title: `清空${__props.config.title}的历史记录`,
 					onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("clear"))
-				}, "清空", 8, _hoisted_3$8)]), (0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicScrollbar), { "max-height": "360px" }, {
+				}, "清空", 8, _hoisted_3$9)]), (0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicScrollbar), { "max-height": "360px" }, {
 					default: (0, vue.withCtx)(() => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.buckets, (bucket) => {
 						return (0, vue.openBlock)(), (0, vue.createBlock)(Bucket_default, {
 							key: `${__props.config.prefix}-${bucket.id}`,
@@ -11160,7 +11410,7 @@
 	var BucketTab_default = BucketTab_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/layouts/history-list/PageTab.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$57 = {
+	var _hoisted_1$62 = {
 		key: 0,
 		class: "m-editor-history-list-empty"
 	};
@@ -11168,7 +11418,7 @@
 		key: 0,
 		class: "m-editor-history-list-toolbar"
 	};
-	var _hoisted_3$7 = { class: "m-editor-history-list-ul" };
+	var _hoisted_3$8 = { class: "m-editor-history-list-ul" };
 	var PageTab_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorHistoryListPageTab",
 		__name: "PageTab",
@@ -11216,12 +11466,12 @@
 			*/
 			const isInitial = (0, vue.computed)(() => props.list.every((g) => !g.applied));
 			return (_ctx, _cache) => {
-				return !__props.list.length && !__props.marker ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$57, "暂无操作记录")) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [__props.list.length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_2$19, [(0, vue.createElementVNode)("span", {
+				return !__props.list.length && !__props.marker ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$62, "暂无操作记录")) : ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [__props.list.length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_2$19, [(0, vue.createElementVNode)("span", {
 					class: "m-editor-history-list-clear",
 					title: "清空当前页面的历史记录",
 					onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("clear"))
 				}, "清空")])) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicScrollbar), { "max-height": "360px" }, {
-					default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("ul", _hoisted_3$7, [
+					default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("ul", _hoisted_3$8, [
 						((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.list, (group) => {
 							return (0, vue.openBlock)(), (0, vue.createBlock)(GroupRow_default, {
 								key: rowKey(group),
@@ -11262,7 +11512,7 @@
 	* 所有数据基于 historyService 的 reactive state 派生，自动跟随历史变化刷新。
 	*/
 	var useHistoryList = () => {
-		const { editorService, historyService } = useServices();
+		const { historyService } = useServices();
 		/**
 		* 折叠状态：key 形如 `pg-${组内首步 index}` / `ds-${id}-${组内首步 index}` / `cb-${id}-${组内首步 index}`。
 		* 用组内首步的稳定 index（而非展示位置）作为 key，确保历史数据更新后已展开的分组状态保持不变。
@@ -11272,9 +11522,9 @@
 		const toggleGroup = (key) => {
 			expanded[key] = expanded[key] === false;
 		};
-		const pageGroups = (0, vue.computed)(() => historyService.getHistoryGroups("page", editorService.get("page")?.id));
-		const dataSourceGroups = (0, vue.computed)(() => historyService.getHistoryGroups("dataSource"));
-		const codeBlockGroups = (0, vue.computed)(() => historyService.getHistoryGroups("codeBlock"));
+		const pageGroups = (0, vue.computed)(() => historyService.getPageHistoryGroups());
+		const dataSourceGroups = (0, vue.computed)(() => historyService.getDataSourceHistoryGroups());
+		const codeBlockGroups = (0, vue.computed)(() => historyService.getCodeBlockHistoryGroups());
 		/** 页面 tab 倒序展示（最新一组在最上面）。 */
 		const pageGroupsDisplay = (0, vue.computed)(() => pageGroups.value.slice().reverse());
 		/**
@@ -11408,10 +11658,7 @@
 						case "node":
 							if (!props.type) return [];
 							return removeStyleDisplayConfig(await propsService.getPropsConfig(props.type, { node: props.value }));
-						case "data-source": return dataSourceService.getFormConfig(props.type || "base").map((item) => "type" in item && item.type === "tab" ? {
-							...item,
-							active: "fields"
-						} : item);
+						case "data-source": return dataSourceService.getFormConfig(props.type || "base");
 						case "code-block": return getCodeBlockFormConfig({
 							paramColConfig: codeBlockService.getParamsColConfig(),
 							isDataSource: () => Boolean(props.dataSourceType),
@@ -11501,13 +11748,13 @@
 	}));
 	//#endregion
 	//#region packages/editor/src/layouts/history-list/HistoryDiffDialog.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$56, _hoisted_2$18, _hoisted_3$6, _hoisted_4$5, _hoisted_5$2, _hoisted_6$2, _hoisted_7, HistoryDiffDialog_vue_vue_type_script_setup_true_lang_default;
+	var _hoisted_1$61, _hoisted_2$18, _hoisted_3$7, _hoisted_4$6, _hoisted_5$3, _hoisted_6$2, _hoisted_7, HistoryDiffDialog_vue_vue_type_script_setup_true_lang_default;
 	var init_HistoryDiffDialog_vue_vue_type_script_setup_true_lang = __esmMin((() => {
 		init_lodash();
 		init_CompareForm();
 		init_use_services();
 		init_CodeEditor();
-		_hoisted_1$56 = {
+		_hoisted_1$61 = {
 			key: 0,
 			class: "m-editor-history-diff-dialog-body"
 		};
@@ -11515,9 +11762,9 @@
 			key: 0,
 			class: "m-editor-history-diff-dialog-notice"
 		};
-		_hoisted_3$6 = { class: "m-editor-history-diff-dialog-header" };
-		_hoisted_4$5 = { class: "m-editor-history-diff-dialog-target" };
-		_hoisted_5$2 = { class: "m-editor-history-diff-dialog-controls" };
+		_hoisted_3$7 = { class: "m-editor-history-diff-dialog-header" };
+		_hoisted_4$6 = { class: "m-editor-history-diff-dialog-target" };
+		_hoisted_5$3 = { class: "m-editor-history-diff-dialog-controls" };
 		_hoisted_6$2 = { class: "m-editor-history-diff-dialog-legend" };
 		_hoisted_7 = {
 			key: 0,
@@ -11679,9 +11926,9 @@
 							default: (0, vue.withCtx)(() => [..._cache[12] || (_cache[12] = [(0, vue.createTextVNode)("关闭", -1)])]),
 							_: 1
 						}))]),
-						default: (0, vue.withCtx)(() => [payload.value && visible.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$56, [
+						default: (0, vue.withCtx)(() => [payload.value && visible.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$61, [
 							__props.onConfirm ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_2$18, "仅回滚有差异的字段")) : (0, vue.createCommentVNode)("v-if", true),
-							(0, vue.createElementVNode)("div", _hoisted_3$6, [(0, vue.createElementVNode)("span", _hoisted_4$5, (0, vue.toDisplayString)(targetText.value), 1), (0, vue.createElementVNode)("div", _hoisted_5$2, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicRadioGroup), {
+							(0, vue.createElementVNode)("div", _hoisted_3$7, [(0, vue.createElementVNode)("span", _hoisted_4$6, (0, vue.toDisplayString)(targetText.value), 1), (0, vue.createElementVNode)("div", _hoisted_5$3, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicRadioGroup), {
 								modelValue: viewMode.value,
 								"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => viewMode.value = $event),
 								size: "small",
@@ -11934,21 +12181,21 @@
 		};
 		const buildPageDiffPayload = (index) => buildDiffPayload({
 			category: "node",
-			groups: () => historyService.getHistoryGroups("page", editorService.get("page")?.id),
+			groups: () => historyService.getPageHistoryGroups(),
 			getCurrent: (id) => editorService.getNodeById(id),
 			resolveType: (n, o) => n.type || o.type || "",
 			resolveLabel: (n, o) => n.name || o.name || n.type || o.type || ""
 		}, index);
 		const buildDataSourceDiffPayload = (id, index) => buildDiffPayload({
 			category: "data-source",
-			groups: () => historyService.getHistoryGroups("dataSource"),
+			groups: () => historyService.getDataSourceHistoryGroups(),
 			getCurrent: (id) => dataSourceService.getDataSourceById(`${id}`),
 			resolveType: (n, o) => n.type || o.type || "base",
 			resolveLabel: (n, o, id) => n.title || o.title || `${id}`
 		}, index, id);
 		const buildCodeBlockDiffPayload = (id, index) => buildDiffPayload({
 			category: "code-block",
-			groups: () => historyService.getHistoryGroups("codeBlock"),
+			groups: () => historyService.getCodeBlockHistoryGroups(),
 			getCurrent: (id) => codeBlockService.getCodeContentById(id),
 			resolveLabel: (n, o, id) => n.name || o.name || `${id}`
 		}, index, id);
@@ -11959,7 +12206,7 @@
 		* add（回滚即删除）即使目标已不在，也已达成「删除」目的，不视为失败。
 		*/
 		const isPageRevertTargetMissing = (index) => {
-			const step = historyService.getStepList("page", editorService.get("page")?.id)[index]?.step;
+			const step = historyService.getPageStepList()[index]?.step;
 			if (!step) return false;
 			if (step.opType === "update") return (step.diff ?? []).some((item) => {
 				const id = item.newSchema?.id ?? item.oldSchema?.id;
@@ -11970,12 +12217,12 @@
 		};
 		/** 数据源 update 步骤回滚时，对应数据源必须仍存在（已删除则无处写回旧值）。 */
 		const isDataSourceRevertTargetMissing = (id, index) => {
-			const step = historyService.getStepList("dataSource", id)[index]?.step;
+			const step = historyService.getDataSourceStepList(id)[index]?.step;
 			return Boolean(step?.opType === "update" && !dataSourceService.getDataSourceById(`${id}`));
 		};
 		/** 代码块 update 步骤回滚时，对应代码块必须仍存在（已删除则无处写回旧值）。 */
 		const isCodeBlockRevertTargetMissing = (id, index) => {
-			const step = historyService.getStepList("codeBlock", id)[index]?.step;
+			const step = historyService.getCodeBlockStepList(id)[index]?.step;
 			return Boolean(step?.opType === "update" && !codeBlockService.getCodeContentById(id));
 		};
 		const onPageRevert = (index) => {
@@ -12087,7 +12334,7 @@
 	//#region packages/editor/src/layouts/history-list/HistoryListPanel.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
 	init_use_services();
-	var _hoisted_1$55 = { class: "m-editor-history-list" };
+	var _hoisted_1$60 = { class: "m-editor-history-list" };
 	var HistoryListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorHistoryListPanel",
 		__name: "HistoryListPanel",
@@ -12151,35 +12398,27 @@
 			* 当前活动页的「加载/初始」标记记录（设置 root 时生成），透传给 PageTab 的底部初始行展示。
 			* 基于 historyService 的 reactive state 派生，活动页切换或标记写入后自动刷新。
 			*/
-			const pageMarker = (0, vue.computed)(() => historyService.getMarker("page", editorService.get("page")?.id));
-			/**
-			* 各历史类型的展示名称（页面 / 数据源 / 代码块），由 historyService.state.stepNames 配置，
-			* 业务方可通过 historyService.setStepName / registerStepType 覆盖。基于 reactive state 派生，配置变更后自动刷新。
-			*/
-			const pageName = (0, vue.computed)(() => historyService.getStepName("page"));
-			const dataSourceName = (0, vue.computed)(() => historyService.getStepName("dataSource"));
-			const codeBlockName = (0, vue.computed)(() => historyService.getStepName("codeBlock"));
+			const pageMarker = (0, vue.computed)(() => historyService.getPageMarker());
 			/** 代码块 step 仅 update（前后 content 都存在）时可查看差异。 */
 			const isStepDiffable = (step) => Boolean(step.diff?.[0]?.oldSchema && step.diff?.[0]?.newSchema);
 			/**
 			* 数据源 / 代码块两类 bucket 历史的整体渲染配置：把 title / prefix 与各自的描述、
 			* 可差异、可回滚判定收敛为单一对象整体注入 BucketTab，组件内部按需读取。
-			* title / 描述回退名取自可配置的展示名称，故用 computed 使其随 stepNames 变更刷新。
 			*/
-			const dataSourceConfig = (0, vue.computed)(() => ({
-				title: dataSourceName.value,
+			const dataSourceConfig = {
+				title: "数据源",
 				prefix: "ds",
-				describeStep: (step) => describeStep(step, (schema) => schema?.title, dataSourceName.value),
+				describeStep: (step) => describeStep(step, (schema) => schema?.title, "数据源"),
 				isStepDiffable,
 				isStepRevertable: isSingleDiffStepRevertable
-			}));
-			const codeBlockConfig = (0, vue.computed)(() => ({
-				title: codeBlockName.value,
+			};
+			const codeBlockConfig = {
+				title: "代码块",
 				prefix: "cb",
-				describeStep: (step) => describeStep(step, (content) => content?.name, codeBlockName.value),
+				describeStep: (step) => describeStep(step, (content) => content?.name, "代码块"),
 				isStepDiffable,
 				isStepRevertable: isSingleDiffStepRevertable
-			}));
+			};
 			/** 把"目标 step 索引"翻译成"目标 cursor"（已应用步骤数量）。 */
 			const indexToCursor = (index) => index + 1;
 			const onPageGoto = (index) => {
@@ -12192,7 +12431,7 @@
 			* - 该 step 涉及的节点都已不存在（如删除记录、被撤销的新增）时给出提示，不做选中。
 			*/
 			const onPageSelect = async (index) => {
-				const step = historyService.getStepList("page", editorService.get("page")?.id)[index]?.step;
+				const step = historyService.getPageStepList()[index]?.step;
 				if (!step) return;
 				const targetId = (step.diff ?? []).map((item) => item.newSchema?.id ?? item.oldSchema?.id).find((id) => id !== void 0 && id !== null && editorService.getNodeById(id, false));
 				if (targetId === void 0 || targetId === null) {
@@ -12242,19 +12481,19 @@
 			};
 			const onPageClear = async () => {
 				if (await confirmHistoryAction("确定清空当前页面的历史记录吗？清空后将无法撤销/重做之前的操作，本地保存的记录也会一并删除。")) {
-					historyService.clear("page", editorService.get("page")?.id);
+					historyService.clearPage();
 					await syncIndexedDB();
 				}
 			};
 			const onDataSourceClear = async () => {
 				if (await confirmHistoryAction("确定清空数据源的历史记录吗？清空后将无法撤销/重做之前的操作，本地保存的记录也会一并删除。")) {
-					historyService.clear("dataSource");
+					historyService.clearDataSource();
 					await syncIndexedDB();
 				}
 			};
 			const onCodeBlockClear = async () => {
 				if (await confirmHistoryAction("确定清空代码块的历史记录吗？清空后将无法撤销/重做之前的操作，本地保存的记录也会一并删除。")) {
-					historyService.clear("codeBlock");
+					historyService.clearCodeBlock();
 					await syncIndexedDB();
 				}
 			};
@@ -12282,7 +12521,7 @@
 						})]),
 						_: 1
 					})]),
-					default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_1$55, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicTooltip), {
+					default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_1$60, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicTooltip), {
 						effect: "dark",
 						placement: "top",
 						content: "关闭"
@@ -12305,7 +12544,7 @@
 						default: (0, vue.withCtx)(() => [
 							((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tabPaneComponent)?.component || "el-tab-pane"), (0, vue.normalizeProps)((0, vue.guardReactiveProps)((0, vue.unref)(tabPaneComponent)?.props({
 								name: "page",
-								label: `${pageName.value} (${(0, vue.unref)(pageGroups).length})`
+								label: `页面 (${(0, vue.unref)(pageGroups).length})`
 							}) || {})), {
 								default: (0, vue.withCtx)(() => [(0, vue.createVNode)(PageTab_default, {
 									list: (0, vue.unref)(pageGroupsDisplay),
@@ -12330,10 +12569,10 @@
 							}, 16)),
 							!disabledDataSource.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tabPaneComponent)?.component || "el-tab-pane"), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 0 }, (0, vue.unref)(tabPaneComponent)?.props({
 								name: "data-source",
-								label: `${dataSourceName.value} (${(0, vue.unref)(dataSourceGroups).length})`
+								label: `数据源 (${(0, vue.unref)(dataSourceGroups).length})`
 							}) || {})), {
 								default: (0, vue.withCtx)(() => [(0, vue.createVNode)(BucketTab_default, {
-									config: dataSourceConfig.value,
+									config: dataSourceConfig,
 									buckets: (0, vue.unref)(dataSourceGroupsByTarget),
 									expanded: (0, vue.unref)(expanded),
 									onToggle: (0, vue.unref)(toggleGroup),
@@ -12343,7 +12582,6 @@
 									onRevertStep: (0, vue.unref)(onDataSourceRevert),
 									onClear: onDataSourceClear
 								}, null, 8, [
-									"config",
 									"buckets",
 									"expanded",
 									"onToggle",
@@ -12354,10 +12592,10 @@
 							}, 16)) : (0, vue.createCommentVNode)("v-if", true),
 							!disabledCodeBlock.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(tabPaneComponent)?.component || "el-tab-pane"), (0, vue.normalizeProps)((0, vue.mergeProps)({ key: 1 }, (0, vue.unref)(tabPaneComponent)?.props({
 								name: "code-block",
-								label: `${codeBlockName.value} (${(0, vue.unref)(codeBlockGroups).length})`
+								label: `代码块 (${(0, vue.unref)(codeBlockGroups).length})`
 							}) || {})), {
 								default: (0, vue.withCtx)(() => [(0, vue.createVNode)(BucketTab_default, {
-									config: codeBlockConfig.value,
+									config: codeBlockConfig,
 									buckets: (0, vue.unref)(codeBlockGroupsByTarget),
 									expanded: (0, vue.unref)(expanded),
 									onToggle: (0, vue.unref)(toggleGroup),
@@ -12367,7 +12605,6 @@
 									onRevertStep: (0, vue.unref)(onCodeBlockRevert),
 									onClear: onCodeBlockClear
 								}, null, 8, [
-									"config",
 									"buckets",
 									"expanded",
 									"onToggle",
@@ -12398,7 +12635,7 @@
 	var HistoryListPanel_default = HistoryListPanel_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/layouts/NavMenuColumn.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$54 = { class: "m-editor-nav-menu-overflow-list" };
+	var _hoisted_1$59 = { class: "m-editor-nav-menu-overflow-list" };
 	var NavMenuColumn_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorNavMenuColumn",
 		__name: "NavMenuColumn",
@@ -12581,7 +12818,7 @@
 						"bg",
 						"type"
 					])], 512)]),
-					default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_1$54, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(overflowItems.value, (item, index) => {
+					default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_1$59, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(overflowItems.value, (item, index) => {
 						return (0, vue.openBlock)(), (0, vue.createBlock)(ToolButton_default, {
 							data: item,
 							key: `o-${index}`
@@ -12648,7 +12885,7 @@
 							className: "undo",
 							icon: (0, vue.markRaw)(_element_plus_icons_vue.Back),
 							tooltip: `后退(${ctrl}+z)`,
-							disabled: () => !historyService.canUndo("page", editorService.get("page")?.id),
+							disabled: () => !historyService.state.canUndo,
 							handler: () => editorService.undo()
 						});
 						break;
@@ -12658,7 +12895,7 @@
 							className: "redo",
 							icon: (0, vue.markRaw)(_element_plus_icons_vue.Right),
 							tooltip: `前进(${ctrl}+Shift+z)`,
-							disabled: () => !historyService.canRedo("page", editorService.get("page")?.id),
+							disabled: () => !historyService.state.canRedo,
 							handler: () => editorService.redo()
 						});
 						break;
@@ -12788,7 +13025,7 @@
 	init_Icon();
 	init_use_services();
 	init_CodeEditor();
-	var _hoisted_1$53 = { class: "m-editor-props-form-panel" };
+	var _hoisted_1$58 = { class: "m-editor-props-form-panel" };
 	var FormPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorFormPanel",
 		__name: "FormPanel",
@@ -12850,7 +13087,7 @@
 				submit
 			});
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$53, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$58, [
 					(0, vue.renderSlot)(_ctx.$slots, "props-form-panel-header"),
 					(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicScrollbar), null, {
 						default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_tmagic_form.MForm), {
@@ -12949,7 +13186,7 @@
 	//#region packages/editor/src/layouts/props-panel/PropsPanel.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
 	init_use_services();
-	var _hoisted_1$52 = {
+	var _hoisted_1$57 = {
 		ref: "propsPanel",
 		class: "m-editor-props-panel"
 	};
@@ -13052,7 +13289,7 @@
 				submit
 			});
 			return (_ctx, _cache) => {
-				return (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$52, [
+				return (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$57, [
 					(0, vue.renderSlot)(_ctx.$slots, "props-panel-header"),
 					(0, vue.createVNode)(FormPanel_default, {
 						ref: "propertyFormPanel",
@@ -13124,7 +13361,7 @@
 	//#region packages/editor/src/components/FloatingBox.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
 	init_use_services();
-	var _hoisted_1$51 = {
+	var _hoisted_1$56 = {
 		ref: "title",
 		class: "m-editor-float-box-title"
 	};
@@ -13160,6 +13397,11 @@
 			const props = __props;
 			const targetEl = (0, vue.useTemplateRef)("target");
 			const titleEl = (0, vue.useTemplateRef)("title");
+			/**
+			* 主题修饰类（来自最近的 `<MEditor>` / `<MForm>` 祖先 provide）。
+			* 挂在 `Teleport` 出去的浮动面板根节点上，让主题级 CSS 变量在 portal 节点上也能命中。
+			*/
+			const themeClass = (0, _tmagic_design.useThemeClass)();
 			const zIndex = (0, _tmagic_design.useZIndex)();
 			const curZIndex = (0, vue.ref)(0);
 			const titleHeight = (0, vue.ref)(0);
@@ -13256,13 +13498,13 @@
 					to: "body"
 				}, [(0, vue.createElementVNode)("div", {
 					ref: "target",
-					class: "m-editor-float-box",
+					class: (0, vue.normalizeClass)(["m-editor-float-box", (0, vue.unref)(themeClass)]),
 					style: (0, vue.normalizeStyle)({
 						...style.value,
 						zIndex: curZIndex.value
 					}),
 					onMousedown: nextZIndex
-				}, [(0, vue.createElementVNode)("div", _hoisted_1$51, [(0, vue.renderSlot)(_ctx.$slots, "title", {}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(__props.title), 1)]), (0, vue.createElementVNode)("div", null, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
+				}, [(0, vue.createElementVNode)("div", _hoisted_1$56, [(0, vue.renderSlot)(_ctx.$slots, "title", {}, () => [(0, vue.createElementVNode)("span", null, (0, vue.toDisplayString)(__props.title), 1)]), (0, vue.createElementVNode)("div", null, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
 					link: "",
 					size: "small",
 					onClick: closeHandler
@@ -13272,7 +13514,7 @@
 				})])], 512), (0, vue.createElementVNode)("div", {
 					class: "m-editor-float-box-body",
 					style: (0, vue.normalizeStyle)({ height: `${bodyHeight.value}px` })
-				}, [(0, vue.renderSlot)(_ctx.$slots, "body")], 4)], 36)])) : (0, vue.createCommentVNode)("v-if", true);
+				}, [(0, vue.renderSlot)(_ctx.$slots, "body")], 4)], 38)])) : (0, vue.createCommentVNode)("v-if", true);
 			};
 		}
 	});
@@ -13285,13 +13527,13 @@
 	init_CodeEditor();
 	init_code_block();
 	init_config();
-	var _hoisted_1$50 = { style: {
+	var _hoisted_1$55 = { style: {
 		"display": "flex",
 		"margin-bottom": "10px"
 	} };
 	var _hoisted_2$16 = { style: { "flex": "1" } };
-	var _hoisted_3$5 = { style: { "flex": "1" } };
-	var _hoisted_4$4 = { class: "dialog-footer" };
+	var _hoisted_3$6 = { style: { "flex": "1" } };
+	var _hoisted_4$5 = { class: "dialog-footer" };
 	var CodeBlockEditor_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorCodeBlockEditor",
 		__name: "CodeBlockEditor",
@@ -13471,7 +13713,7 @@
 						fullscreen: "",
 						"destroy-on-close": ""
 					}, {
-						footer: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", _hoisted_4$4, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
+						footer: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("span", _hoisted_4$5, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
 							size: "small",
 							onClick: _cache[4] || (_cache[4] = ($event) => difVisible.value = false)
 						}, {
@@ -13485,13 +13727,13 @@
 							default: (0, vue.withCtx)(() => [..._cache[10] || (_cache[10] = [(0, vue.createTextVNode)("确定", -1)])]),
 							_: 1
 						})])]),
-						default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_1$50, [(0, vue.createElementVNode)("div", _hoisted_2$16, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicTag), {
+						default: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_1$55, [(0, vue.createElementVNode)("div", _hoisted_2$16, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicTag), {
 							size: "small",
 							type: "danger"
 						}, {
 							default: (0, vue.withCtx)(() => [..._cache[7] || (_cache[7] = [(0, vue.createTextVNode)("修改前", -1)])]),
 							_: 1
-						})]), (0, vue.createElementVNode)("div", _hoisted_3$5, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicTag), {
+						})]), (0, vue.createElementVNode)("div", _hoisted_3$6, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicTag), {
 							size: "small",
 							type: "success"
 						}, {
@@ -13548,6 +13790,13 @@
 			const buttonRefs = (0, vue.useTemplateRef)("buttons");
 			const subMenuRef = (0, vue.useTemplateRef)("subMenu");
 			const visible = (0, vue.ref)(false);
+			/**
+			* 主题修饰类（来自最近的 `<MEditor>` / `<MForm>` 祖先 provide）。
+			* - 顶层 `ContentMenu` 渲染在编辑器子树中，加上去是冗余但无害；
+			* - 子菜单（递归 `<content-menu :is-sub-menu="true">` 被 `<teleport to="body">` 送到 body）
+			*   不在编辑器子树中，必须显式挂上主题类，主题级 CSS 变量才能命中。
+			*/
+			const themeClass = (0, _tmagic_design.useThemeClass)();
 			const subMenuData = (0, vue.ref)([]);
 			const zIndex = (0, _tmagic_design.useZIndex)();
 			const curZIndex = (0, vue.ref)(0);
@@ -13637,8 +13886,8 @@
 					persisted: ""
 				}, {
 					default: (0, vue.withCtx)(() => [(0, vue.withDirectives)((0, vue.createElementVNode)("div", {
-						class: "magic-editor-content-menu",
 						ref: "menu",
+						class: (0, vue.normalizeClass)(["magic-editor-content-menu", (0, vue.unref)(themeClass)]),
 						style: (0, vue.normalizeStyle)(menuStyle.value),
 						onMouseenter: _cache[0] || (_cache[0] = ($event) => mouseenterHandler()),
 						onContextmenu: _cache[1] || (_cache[1] = (0, vue.withModifiers)(() => {}, ["prevent"]))
@@ -13669,7 +13918,7 @@
 							"is-sub-menu": true,
 							onHide: hide
 						}, null, 8, ["active", "menu-data"])) : (0, vue.createCommentVNode)("v-if", true)]))
-					], 36), [[vue.vShow, visible.value]])]),
+					], 38), [[vue.vShow, visible.value]])]),
 					_: 3
 				});
 			};
@@ -13720,7 +13969,7 @@
 	//#endregion
 	//#region packages/editor/src/components/TreeNode.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
-	var _hoisted_1$49 = [
+	var _hoisted_1$54 = [
 		"draggable",
 		"data-node-id",
 		"data-parent-id",
@@ -13728,8 +13977,8 @@
 		"data-is-container"
 	];
 	var _hoisted_2$15 = { class: "tree-node-label" };
-	var _hoisted_3$4 = { class: "tree-node-tool" };
-	var _hoisted_4$3 = {
+	var _hoisted_3$5 = { class: "tree-node-tool" };
+	var _hoisted_4$4 = {
 		key: 0,
 		class: "m-editor-tree-node-children"
 	};
@@ -13823,7 +14072,7 @@
 					class: "tree-node-content",
 					onClick: nodeClickHandler,
 					onDblclick: nodeDblclickHandler
-				}, [(0, vue.renderSlot)(_ctx.$slots, "tree-node-content", { data: __props.data }, () => [(0, vue.createElementVNode)("div", _hoisted_2$15, [(0, vue.renderSlot)(_ctx.$slots, "tree-node-label", { data: __props.data }, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(`${__props.data.name} (${__props.data.id})`), 1)])]), (0, vue.createElementVNode)("div", _hoisted_3$4, [(0, vue.renderSlot)(_ctx.$slots, "tree-node-tool", { data: __props.data })])])], 32)], 38), __props.isExpandable(__props.data, __props.nodeStatusMap) && expanded.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_4$3, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.data.items, (item) => {
+				}, [(0, vue.renderSlot)(_ctx.$slots, "tree-node-content", { data: __props.data }, () => [(0, vue.createElementVNode)("div", _hoisted_2$15, [(0, vue.renderSlot)(_ctx.$slots, "tree-node-label", { data: __props.data }, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(`${__props.data.name} (${__props.data.id})`), 1)])]), (0, vue.createElementVNode)("div", _hoisted_3$5, [(0, vue.renderSlot)(_ctx.$slots, "tree-node-tool", { data: __props.data })])])], 32)], 38), __props.isExpandable(__props.data, __props.nodeStatusMap) && expanded.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_4$4, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.data.items, (item) => {
 					return (0, vue.openBlock)(), (0, vue.createBlock)(_component_TreeNode, {
 						key: item.id,
 						data: item,
@@ -13845,7 +14094,7 @@
 						"indent",
 						"is-expandable"
 					]);
-				}), 128))])) : (0, vue.createCommentVNode)("v-if", true)], 40, _hoisted_1$49)), [[vue.vShow, visible.value]]);
+				}), 128))])) : (0, vue.createCommentVNode)("v-if", true)], 40, _hoisted_1$54)), [[vue.vShow, visible.value]]);
 			};
 		}
 	});
@@ -13854,7 +14103,7 @@
 	var TreeNode_default = TreeNode_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/components/Tree.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$48 = {
+	var _hoisted_1$53 = {
 		key: 1,
 		class: "m-editor-tree-empty"
 	};
@@ -13909,7 +14158,7 @@
 						"node-status-map",
 						"is-expandable"
 					]);
-				}), 128)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$48, [(0, vue.createElementVNode)("p", null, (0, vue.toDisplayString)(__props.emptyText), 1)]))], 32);
+				}), 128)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$53, [(0, vue.createElementVNode)("p", null, (0, vue.toDisplayString)(__props.emptyText), 1)]))], 32);
 			};
 		}
 	});
@@ -14132,7 +14381,7 @@
 	//#endregion
 	//#region packages/editor/src/layouts/sidebar/code-block/CodeBlockListPanel.vue?vue&type=script&setup=true&lang.ts
 	init_use_services();
-	var _hoisted_1$47 = { class: "search-wrapper" };
+	var _hoisted_1$52 = { class: "search-wrapper" };
 	var CodeBlockListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorCodeBlockListPanel",
 		__name: "CodeBlockListPanel",
@@ -14169,7 +14418,7 @@
 				return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [
 					(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicScrollbar), { class: "m-editor-code-block-list m-editor-layer-panel" }, {
 						default: (0, vue.withCtx)(() => [
-							(0, vue.renderSlot)(_ctx.$slots, "code-block-panel-header", {}, () => [(0, vue.createElementVNode)("div", _hoisted_1$47, [
+							(0, vue.renderSlot)(_ctx.$slots, "code-block-panel-header", {}, () => [(0, vue.createElementVNode)("div", _hoisted_1$52, [
 								(0, vue.createVNode)(SearchInput_default, { onSearch: filterTextChangeHandler }),
 								editable.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
 									key: 0,
@@ -14638,7 +14887,7 @@
 	//#region packages/editor/src/layouts/sidebar/data-source/DataSourceListPanel.vue?vue&type=script&setup=true&lang.ts
 	init_lodash();
 	init_use_services();
-	var _hoisted_1$46 = { class: "search-wrapper" };
+	var _hoisted_1$51 = { class: "search-wrapper" };
 	var DataSourceListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorDataSourceListPanel",
 		__name: "DataSourceListPanel",
@@ -14719,7 +14968,7 @@
 				return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [
 					(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicScrollbar), { class: "data-source-list-panel m-editor-layer-panel" }, {
 						default: (0, vue.withCtx)(() => [
-							(0, vue.createElementVNode)("div", _hoisted_1$46, [
+							(0, vue.createElementVNode)("div", _hoisted_1$51, [
 								(0, vue.createVNode)(SearchInput_default, { onSearch: filterTextChangeHandler }),
 								(0, vue.unref)(editable) ? ((0, vue.openBlock)(), (0, vue.createBlock)(DataSourceAddButton_default, {
 									key: 0,
@@ -14784,7 +15033,7 @@
 	var DataSourceListPanel_default = DataSourceListPanel_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/icons/FolderMinusIcon.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$45 = {
+	var _hoisted_1$50 = {
 		width: "1em",
 		height: "1em",
 		viewBox: "0 0 16 16",
@@ -14797,7 +15046,7 @@
 		__name: "FolderMinusIcon",
 		setup(__props) {
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$45, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$50, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", {
 					"fill-rule": "evenodd",
 					d: "M9.828 4H2.19a1 1 0 0 0-.996 1.09l.637 7a1 1 0 0 0 .995.91H9v1H2.826a2 2 0 0 1-1.991-1.819l-.637-7a1.99 1.99 0 0 1 .342-1.31L.5 3a2 2 0 0 1 2-2h3.672a2 2 0 0 1 1.414.586l.828.828A2 2 0 0 0 9.828 3h3.982a2 2 0 0 1 1.992 2.181L15.546 8H14.54l.265-2.91A1 1 0 0 0 13.81 4H9.828zm-2.95-1.707L7.587 3H2.19c-.24 0-.47.042-.684.12L1.5 2.98a1 1 0 0 1 1-.98h3.672a1 1 0 0 1 .707.293z"
 				}, null, -1), (0, vue.createElementVNode)("path", {
@@ -15581,7 +15830,7 @@
 	init_Icon();
 	init_use_services();
 	init_type();
-	var _hoisted_1$44 = ["onClick", "onDragstart"];
+	var _hoisted_1$49 = ["onClick", "onDragstart"];
 	var _hoisted_2$14 = ["title"];
 	var ComponentListPanel_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorComponentListPanel",
@@ -15677,7 +15926,7 @@
 										}, {
 											default: (0, vue.withCtx)(() => [(0, vue.createVNode)(Icon_default, { icon: item.icon }, null, 8, ["icon"])]),
 											_: 2
-										}, 1032, ["disabled", "content"]), (0, vue.createElementVNode)("span", { title: item.text }, (0, vue.toDisplayString)(item.text), 9, _hoisted_2$14)])], 40, _hoisted_1$44);
+										}, 1032, ["disabled", "content"]), (0, vue.createElementVNode)("span", { title: item.text }, (0, vue.toDisplayString)(item.text), 9, _hoisted_2$14)])], 40, _hoisted_1$49);
 									}), 128))]),
 									_: 2
 								}, 1032, ["name"])) : (0, vue.createCommentVNode)("v-if", true)], 64);
@@ -15698,21 +15947,21 @@
 	init_Icon();
 	init_use_services();
 	init_type();
-	var _hoisted_1$43 = {
+	var _hoisted_1$48 = {
 		key: 0,
 		class: "m-editor-sidebar"
 	};
 	var _hoisted_2$13 = { class: "m-editor-sidebar-header" };
-	var _hoisted_3$3 = [
+	var _hoisted_3$4 = [
 		"draggable",
 		"onClick",
 		"onDragend"
 	];
-	var _hoisted_4$2 = {
+	var _hoisted_4$3 = {
 		key: 1,
 		class: "magic-editor-tab-panel-title"
 	};
-	var _hoisted_5$1 = {
+	var _hoisted_5$2 = {
 		key: 0,
 		class: "m-editor-sidebar-tips"
 	};
@@ -15851,7 +16100,7 @@
 			};
 			__expose({ activeTabName });
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [__props.data.type === "tabs" && __props.data.items.length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$43, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [__props.data.type === "tabs" && __props.data.items.length ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$48, [
 					(0, vue.createElementVNode)("div", _hoisted_2$13, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(sideBarItems.value, (config, index) => {
 						return (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
 							class: (0, vue.normalizeClass)(["m-editor-sidebar-header-item", { "is-active": activeTabName.value === config.text }]),
@@ -15864,7 +16113,7 @@
 						}, [config.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)(Icon_default, {
 							key: 0,
 							icon: config.icon
-						}, null, 8, ["icon"])) : (0, vue.createCommentVNode)("v-if", true), config.text ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_4$2, (0, vue.toDisplayString)(config.text), 1)) : (0, vue.createCommentVNode)("v-if", true)], 46, _hoisted_3$3)), [[vue.vShow, !(0, vue.unref)(floatBoxStates)[config.$key]?.status]]);
+						}, null, 8, ["icon"])) : (0, vue.createCommentVNode)("v-if", true), config.text ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_4$3, (0, vue.toDisplayString)(config.text), 1)) : (0, vue.createCommentVNode)("v-if", true)], 46, _hoisted_3$4)), [[vue.vShow, !(0, vue.unref)(floatBoxStates)[config.$key]?.status]]);
 					}), 128))]),
 					((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(sideBarItems.value, (config, index) => {
 						return (0, vue.withDirectives)(((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
@@ -15974,7 +16223,7 @@
 							`${index}`
 						].includes(activeTabName.value)]]);
 					}), 128)),
-					tipsBarVisible.value && collecting.value && taskLength.value > 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_5$1, [(0, vue.createElementVNode)("span", null, "依赖收集中(剩余任务：" + (0, vue.toDisplayString)(taskLength.value) + ")", 1), (0, vue.createVNode)(Icon_default, {
+					tipsBarVisible.value && collecting.value && taskLength.value > 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_5$2, [(0, vue.createElementVNode)("span", null, "依赖收集中(剩余任务：" + (0, vue.toDisplayString)(taskLength.value) + ")", 1), (0, vue.createVNode)(Icon_default, {
 						icon: (0, vue.unref)(_element_plus_icons_vue.Close),
 						class: "close-icon",
 						onClick: _cache[1] || (_cache[1] = (0, vue.withModifiers)(($event) => tipsBarVisible.value = false, ["stop"]))
@@ -16087,7 +16336,7 @@
 	var ScrollBar_default = ScrollBar_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/components/ScrollViewer.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$42 = {
+	var _hoisted_1$47 = {
 		class: "m-editor-scroll-viewer-container",
 		ref: "container"
 	};
@@ -16151,7 +16400,7 @@
 			};
 			__expose({ container: containerEl });
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$42, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$47, [
 					(0, vue.createElementVNode)("div", {
 						ref: "target",
 						style: (0, vue.normalizeStyle)(style.value)
@@ -16273,7 +16522,7 @@
 	//#endregion
 	//#region packages/editor/src/layouts/workspace/viewer/StageOverlay.vue?vue&type=script&setup=true&lang.ts
 	init_use_services();
-	var _hoisted_1$41 = {
+	var _hoisted_1$46 = {
 		key: 0,
 		class: "m-editor-stage-overlay"
 	};
@@ -16319,7 +16568,7 @@
 				stageOverlayService.closeOverlay();
 			};
 			return (_ctx, _cache) => {
-				return stageOverlayVisible.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$41, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicIcon), {
+				return stageOverlayVisible.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$46, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicIcon), {
 					class: "m-editor-stage-overlay-close",
 					size: "30",
 					onClick: closeOverlayHandler
@@ -16355,7 +16604,7 @@
 	var StageOverlay_default = StageOverlay_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/icons/CenterIcon.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$40 = {
+	var _hoisted_1$45 = {
 		viewBox: "0 0 24 24",
 		fill: "none",
 		xmlns: "http://www.w3.org/2000/svg"
@@ -16365,7 +16614,7 @@
 		__name: "CenterIcon",
 		setup(__props) {
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$40, [..._cache[0] || (_cache[0] = [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$45, [..._cache[0] || (_cache[0] = [
 					(0, vue.createElementVNode)("path", {
 						"fill-rule": "evenodd",
 						"clip-rule": "evenodd",
@@ -16797,7 +17046,7 @@
 	//#endregion
 	//#region packages/editor/src/layouts/workspace/Breadcrumb.vue?vue&type=script&setup=true&lang.ts
 	init_use_services();
-	var _hoisted_1$39 = {
+	var _hoisted_1$44 = {
 		key: 0,
 		class: "m-editor-breadcrumb-ellipsis"
 	};
@@ -16883,7 +17132,7 @@
 					ref: containerRef,
 					class: "m-editor-breadcrumb"
 				}, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(displayPath.value, (item, index) => {
-					return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: item.isEllipsis ? `ellipsis-${index}` : item.id }, [item.isEllipsis ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_1$39, "...")) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicTooltip), {
+					return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: item.isEllipsis ? `ellipsis-${index}` : item.id }, [item.isEllipsis ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_1$44, "...")) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicTooltip), {
 						key: 1,
 						content: item.name,
 						placement: "top",
@@ -16910,7 +17159,7 @@
 	//#endregion
 	//#region packages/editor/src/layouts/workspace/Workspace.vue?vue&type=script&setup=true&lang.ts
 	init_use_services();
-	var _hoisted_1$38 = { class: "m-editor-workspace" };
+	var _hoisted_1$43 = { class: "m-editor-workspace" };
 	var Workspace_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MEditorWorkspace",
 		__name: "Workspace",
@@ -16927,7 +17176,7 @@
 			const { editorService } = useServices();
 			const page = (0, vue.computed)(() => editorService.get("page"));
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$38, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$43, [
 					(0, vue.createVNode)(Breadcrumb_default),
 					(0, vue.renderSlot)(_ctx.$slots, "stage", {}, () => [page.value && ((0, vue.unref)(stageOptions)?.render || (0, vue.unref)(stageOptions)?.runtimeUrl) ? ((0, vue.openBlock)(), (0, vue.createBlock)(Stage_default, {
 						key: 0,
@@ -17068,16 +17317,13 @@
 				...codeConfigProcessed
 			};
 			const newContent = cloneDeep$1(codeDsl[id]);
-			if (!doNotPushHistory) {
-				const step = createStackStep(id, {
-					oldValue: oldContent,
-					newValue: newContent,
-					changeRecords,
-					historyDescription,
-					source: historySource
-				});
-				this.lastPushedHistoryId = (step ? history_default.push("codeBlock", step, id) : null)?.uuid ?? null;
-			}
+			if (!doNotPushHistory) this.lastPushedHistoryId = history_default.pushCodeBlock(id, {
+				oldContent,
+				newContent,
+				changeRecords,
+				historyDescription,
+				source: historySource
+			})?.uuid ?? null;
 			this.emit("addOrUpdate", id, codeDsl[id]);
 		}
 		/**
@@ -17162,16 +17408,15 @@
 			if (!currentDsl) return;
 			this.lastDeletedHistoryIds = [];
 			codeIds.forEach((id) => {
-				const oldValue = currentDsl[id] ? cloneDeep$1(currentDsl[id]) : null;
+				const oldContent = currentDsl[id] ? cloneDeep$1(currentDsl[id]) : null;
 				delete currentDsl[id];
-				if (oldValue && !doNotPushHistory) {
-					const step = createStackStep(id, {
-						oldValue,
-						newValue: null,
+				if (oldContent && !doNotPushHistory) {
+					const uuid = history_default.pushCodeBlock(id, {
+						oldContent,
+						newContent: null,
 						historyDescription,
 						source: historySource
-					});
-					const uuid = step ? history_default.push("codeBlock", step, id)?.uuid : void 0;
+					})?.uuid;
 					if (uuid) this.lastDeletedHistoryIds.push(uuid);
 				}
 				this.emit("remove", id);
@@ -17232,7 +17477,7 @@
 		* @returns 撤销的 step；栈不存在或已无可撤销时返回 null
 		*/
 		async undo(id) {
-			const step = history_default.undo("codeBlock", id);
+			const step = history_default.undoCodeBlock(id);
 			if (!step) return null;
 			await this.applyHistoryStep(step, true);
 			return step;
@@ -17243,18 +17488,18 @@
 		* @returns 重做的 step；栈不存在或已无可重做时返回 null
 		*/
 		async redo(id) {
-			const step = history_default.redo("codeBlock", id);
+			const step = history_default.redoCodeBlock(id);
 			if (!step) return null;
 			await this.applyHistoryStep(step, false);
 			return step;
 		}
 		/** 是否可对指定代码块撤销。 */
 		canUndo(id) {
-			return history_default.canUndo("codeBlock", id);
+			return history_default.canUndoCodeBlock(id);
 		}
 		/** 是否可对指定代码块重做。 */
 		canRedo(id) {
-			return history_default.canRedo("codeBlock", id);
+			return history_default.canRedoCodeBlock(id);
 		}
 		/**
 		* 跳转指定代码块的历史栈到目标游标。语义同 editor.gotoPageStep。
@@ -17264,7 +17509,7 @@
 		* @returns 实际移动到的最终游标位置
 		*/
 		async goto(id, targetCursor) {
-			let cursor = history_default.getCursor("codeBlock", id);
+			let cursor = history_default.getCodeBlockCursor(id);
 			const target = Math.max(0, targetCursor);
 			while (cursor > target) {
 				if (!await this.undo(id)) break;
@@ -17287,11 +17532,11 @@
 		* @returns 反向后产生的新 step；目标不存在 / 未应用时返回 null
 		*/
 		async revert(id, index) {
-			const entry = history_default.getStepList("codeBlock", id)[index];
+			const entry = history_default.getCodeBlockStepList(id)[index];
 			if (!entry?.applied) return null;
 			const { oldSchema, newSchema, changeRecords } = entry.step.diff?.[0] ?? {};
 			if (oldSchema && newSchema && !changeRecords?.length) return null;
-			const description = `回滚 #${index + 1}: ${describeRevertStep(entry.step.data.id, entry.step.diff?.[0], (s) => s.name)}`;
+			const description = `回滚 #${index + 1}: ${describeRevertStep(entry.step.id, entry.step.diff?.[0], (s) => s.name)}`;
 			return await this.applyRevertStep(entry.step, description);
 		}
 		/**
@@ -17304,7 +17549,7 @@
 		async revertById(uuids) {
 			const results = [];
 			for (const uuid of uuids) {
-				const location = history_default.findStepLocationByUuid("codeBlock", uuid);
+				const location = history_default.findCodeBlockStepLocationByUuid(uuid);
 				results.push(location ? await this.revert(location.id, location.index) : null);
 			}
 			return results;
@@ -17374,21 +17619,21 @@
 		* 差异仅在于通过公开的 setCodeDslByIdSync / deleteCodeDslByIds 触发 push。
 		*/
 		async applyRevertStep(step, historyDescription) {
-			const { id } = step.data;
+			const { id } = step;
 			const { oldSchema, newSchema, changeRecords } = step.diff?.[0] ?? {};
 			if (!oldSchema && newSchema) {
 				await this.deleteCodeDslByIds([id], {
 					historyDescription,
 					historySource: "rollback"
 				});
-				return history_default.getStepList("codeBlock", id).slice(-1)[0]?.step ?? null;
+				return history_default.getCodeBlockStepList(id).slice(-1)[0]?.step ?? null;
 			}
 			if (oldSchema && !newSchema) {
 				this.setCodeDslByIdSync(id, cloneDeep$1(oldSchema), true, {
 					historyDescription,
 					historySource: "rollback"
 				});
-				return history_default.getStepList("codeBlock", id).slice(-1)[0]?.step ?? null;
+				return history_default.getCodeBlockStepList(id).slice(-1)[0]?.step ?? null;
 			}
 			if (!oldSchema || !newSchema) return null;
 			if (changeRecords?.length) {
@@ -17409,13 +17654,13 @@
 					historyDescription,
 					historySource: "rollback"
 				});
-				return history_default.getStepList("codeBlock", id).slice(-1)[0]?.step ?? null;
+				return history_default.getCodeBlockStepList(id).slice(-1)[0]?.step ?? null;
 			}
 			this.setCodeDslByIdSync(id, cloneDeep$1(oldSchema), true, {
 				historyDescription,
 				historySource: "rollback"
 			});
-			return history_default.getStepList("codeBlock", id).slice(-1)[0]?.step ?? null;
+			return history_default.getCodeBlockStepList(id).slice(-1)[0]?.step ?? null;
 		}
 		/**
 		* 把一条历史 step 应用到当前代码块服务上。
@@ -17432,7 +17677,7 @@
 		* @param reverse true=撤销，false=重做
 		*/
 		async applyHistoryStep(step, reverse) {
-			const { id } = step.data;
+			const { id } = step;
 			const { oldSchema, newSchema, changeRecords } = step.diff?.[0] ?? {};
 			if (!oldSchema && newSchema) {
 				if (reverse) await this.deleteCodeDslByIds([id], { doNotPushHistory: true });
@@ -17581,15 +17826,12 @@
 				id: config.id && !this.getDataSourceById(config.id) ? config.id : this.createId()
 			};
 			this.get("dataSources").push(newConfig);
-			if (!doNotPushHistory) {
-				const step = createStackStep(newConfig.id, {
-					oldValue: null,
-					newValue: newConfig,
-					historyDescription,
-					source: historySource
-				});
-				this.lastPushedHistoryId = (step ? history_default.push("dataSource", step, newConfig.id) : null)?.uuid ?? null;
-			}
+			if (!doNotPushHistory) this.lastPushedHistoryId = history_default.pushDataSource(newConfig.id, {
+				oldSchema: null,
+				newSchema: newConfig,
+				historyDescription,
+				source: historySource
+			})?.uuid ?? null;
 			this.emit("add", newConfig);
 			return newConfig;
 		}
@@ -17607,16 +17849,13 @@
 			const oldConfig = dataSources[index];
 			const newConfig = cloneDeep$1(config);
 			dataSources[index] = newConfig;
-			if (!doNotPushHistory) {
-				const step = createStackStep(newConfig.id, {
-					oldValue: oldConfig ? cloneDeep$1(oldConfig) : null,
-					newValue: newConfig,
-					changeRecords,
-					historyDescription,
-					source: historySource
-				});
-				this.lastPushedHistoryId = (step ? history_default.push("dataSource", step, newConfig.id) : null)?.uuid ?? null;
-			}
+			if (!doNotPushHistory) this.lastPushedHistoryId = history_default.pushDataSource(newConfig.id, {
+				oldSchema: oldConfig ? cloneDeep$1(oldConfig) : null,
+				newSchema: newConfig,
+				changeRecords,
+				historyDescription,
+				source: historySource
+			})?.uuid ?? null;
 			this.emit("update", newConfig, {
 				oldConfig,
 				changeRecords
@@ -17635,15 +17874,12 @@
 			const index = dataSources.findIndex((ds) => ds.id === id);
 			const oldConfig = index !== -1 ? dataSources[index] : null;
 			dataSources.splice(index, 1);
-			if (oldConfig && !doNotPushHistory) {
-				const step = createStackStep(id, {
-					oldValue: cloneDeep$1(oldConfig),
-					newValue: null,
-					historyDescription,
-					source: historySource
-				});
-				this.lastPushedHistoryId = (step ? history_default.push("dataSource", step, id) : null)?.uuid ?? null;
-			}
+			if (oldConfig && !doNotPushHistory) this.lastPushedHistoryId = history_default.pushDataSource(id, {
+				oldSchema: cloneDeep$1(oldConfig),
+				newSchema: null,
+				historyDescription,
+				source: historySource
+			})?.uuid ?? null;
 			this.emit("remove", id);
 		}
 		/**
@@ -17689,7 +17925,7 @@
 		* @returns 撤销的 step；栈不存在或已无可撤销时返回 null
 		*/
 		undo(id) {
-			const step = history_default.undo("dataSource", id);
+			const step = history_default.undoDataSource(id);
 			if (!step) return null;
 			this.applyHistoryStep(step, true);
 			return step;
@@ -17700,18 +17936,18 @@
 		* @returns 重做的 step；栈不存在或已无可重做时返回 null
 		*/
 		redo(id) {
-			const step = history_default.redo("dataSource", id);
+			const step = history_default.redoDataSource(id);
 			if (!step) return null;
 			this.applyHistoryStep(step, false);
 			return step;
 		}
 		/** 是否可对指定数据源撤销。 */
 		canUndo(id) {
-			return history_default.canUndo("dataSource", id);
+			return history_default.canUndoDataSource(id);
 		}
 		/** 是否可对指定数据源重做。 */
 		canRedo(id) {
-			return history_default.canRedo("dataSource", id);
+			return history_default.canRedoDataSource(id);
 		}
 		/**
 		* 跳转指定数据源的历史栈到目标游标。语义同 editor.gotoPageStep。
@@ -17721,7 +17957,7 @@
 		* @returns 实际移动到的最终游标位置
 		*/
 		goto(id, targetCursor) {
-			let cursor = history_default.getCursor("dataSource", id);
+			let cursor = history_default.getDataSourceCursor(id);
 			const target = Math.max(0, targetCursor);
 			while (cursor > target) {
 				if (!this.undo(id)) break;
@@ -17744,11 +17980,11 @@
 		* @returns 反向后产生的新 step；目标不存在 / 未应用时返回 null
 		*/
 		revert(id, index) {
-			const entry = history_default.getStepList("dataSource", id)[index];
+			const entry = history_default.getDataSourceStepList(id)[index];
 			if (!entry?.applied) return null;
 			const { oldSchema, newSchema, changeRecords } = entry.step.diff?.[0] ?? {};
 			if (oldSchema && newSchema && !changeRecords?.length) return null;
-			const description = `回滚 #${index + 1}: ${describeRevertStep(entry.step.data.id, entry.step.diff?.[0], (s) => s.title)}`;
+			const description = `回滚 #${index + 1}: ${describeRevertStep(entry.step.id, entry.step.diff?.[0], (s) => s.title)}`;
 			return this.applyRevertStep(entry.step, description);
 		}
 		/**
@@ -17760,7 +17996,7 @@
 		*/
 		revertById(uuids) {
 			return uuids.map((uuid) => {
-				const location = history_default.findStepLocationByUuid("dataSource", uuid);
+				const location = history_default.findDataSourceStepLocationByUuid(uuid);
 				if (!location) return null;
 				return this.revert(location.id, location.index);
 			});
@@ -17823,21 +18059,21 @@
 		* 同构，差异仅在于走对应的公共 add / update / remove 而不是带 doNotPushHistory 的版本。
 		*/
 		applyRevertStep(step, historyDescription) {
-			const { id } = step.data;
+			const { id } = step;
 			const { oldSchema, newSchema, changeRecords } = step.diff?.[0] ?? {};
 			if (!oldSchema && newSchema) {
 				this.remove(`${id}`, {
 					historyDescription,
 					historySource: "rollback"
 				});
-				return history_default.getStepList("dataSource", id).slice(-1)[0]?.step ?? null;
+				return history_default.getDataSourceStepList(id).slice(-1)[0]?.step ?? null;
 			}
 			if (oldSchema && !newSchema) {
 				this.add(cloneDeep$1(oldSchema), {
 					historyDescription,
 					historySource: "rollback"
 				});
-				return history_default.getStepList("dataSource", id).slice(-1)[0]?.step ?? null;
+				return history_default.getDataSourceStepList(id).slice(-1)[0]?.step ?? null;
 			}
 			if (!oldSchema || !newSchema) return null;
 			if (changeRecords?.length) {
@@ -17858,13 +18094,13 @@
 					historyDescription,
 					historySource: "rollback"
 				});
-				return history_default.getStepList("dataSource", id).slice(-1)[0]?.step ?? null;
+				return history_default.getDataSourceStepList(id).slice(-1)[0]?.step ?? null;
 			}
 			this.update(cloneDeep$1(oldSchema), {
 				historyDescription,
 				historySource: "rollback"
 			});
-			return history_default.getStepList("dataSource", id).slice(-1)[0]?.step ?? null;
+			return history_default.getDataSourceStepList(id).slice(-1)[0]?.step ?? null;
 		}
 		/**
 		* 把一条历史 step 应用到当前数据源服务上。
@@ -17881,7 +18117,7 @@
 		* @param reverse true=撤销，false=重做
 		*/
 		applyHistoryStep(step, reverse) {
-			const { id } = step.data;
+			const { id } = step;
 			const { oldSchema, newSchema, changeRecords } = step.diff?.[0] ?? {};
 			if (!oldSchema && newSchema) {
 				if (reverse) this.remove(`${id}`, { doNotPushHistory: true });
@@ -18935,6 +19171,7 @@
 		name: "MEditor",
 		__name: "Editor",
 		props: /* @__PURE__ */ (0, vue.mergeDefaults)({
+			theme: {},
 			modelValue: {},
 			componentGroupList: {},
 			datasourceList: {},
@@ -19051,6 +19288,12 @@
 			*/
 			(0, vue.provide)("historyListExtraTabs", props.historyListExtraTabs);
 			(0, vue.provide)("eventBus", new events.EventEmitter());
+			/**
+			* 把当前主题以响应式 ref 形式 provide 给后代，供包含 `Teleport` 的组件
+			* （如 `TMagicPopover` / `FloatingBox` / `ContentMenu`）在传送目标上挂 `m-theme--<theme>`
+			* 类，让主题级 CSS 变量在 portal 节点上也能命中。详见 `@tmagic/design/theme.ts`。
+			*/
+			(0, vue.provide)(_tmagic_design.M_THEME_KEY, (0, vue.computed)(() => props.theme ?? ""));
 			const propsPanelMountedHandler = (e) => {
 				emit("props-panel-mounted", e);
 			};
@@ -19072,7 +19315,8 @@
 					"disabled-page-fragment": __props.disabledPageFragment,
 					"page-bar-sort-options": __props.pageBarSortOptions,
 					"page-filter-function": __props.pageFilterFunction,
-					"hide-sidebar": __props.hideSidebar
+					"hide-sidebar": __props.hideSidebar,
+					theme: __props.theme
 				}, {
 					header: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "header")]),
 					nav: (0, vue.withCtx)(() => [(0, vue.renderSlot)(_ctx.$slots, "nav", { editorService: (0, vue.unref)(editor_default) }, () => [(0, vue.createVNode)(NavMenu_default, { data: __props.menu }, null, 8, ["data"])])]),
@@ -19153,7 +19397,8 @@
 					"disabled-page-fragment",
 					"page-bar-sort-options",
 					"page-filter-function",
-					"hide-sidebar"
+					"hide-sidebar",
+					"theme"
 				]);
 			};
 		}
@@ -19178,7 +19423,10 @@
 			disabled: { type: Boolean },
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -19199,11 +19447,21 @@
 			* 仅当存在历史值时才启用对比，避免 lastValues 缺失时退化为「全部新增」的空对比。
 			*/
 			const isCompareMode = (0, vue.computed)(() => Boolean(props.isCompare && props.lastValues));
+			const newHandler = () => {
+				const defaultCode = {
+					codeType: _tmagic_core.HookCodeType.CODE,
+					codeId: ""
+				};
+				const name = props.config.name || "";
+				emit("change", defaultCode, { modifyKey: `hookData.${(props.model[name]?.hookData || []).length}` });
+			};
 			const codeConfig = (0, vue.computed)(() => ({
 				type: "group-list",
 				name: "hookData",
 				enableToggleMode: false,
 				expandAll: true,
+				flat: true,
+				addable: () => false,
 				title: (mForm, { model, index }) => {
 					if (model.codeType === _tmagic_core.HookCodeType.DATA_SOURCE_METHOD) {
 						if (Array.isArray(model.codeId)) {
@@ -19216,45 +19474,42 @@
 					if (codeContent) return codeContent.name;
 					return model.codeId || index;
 				},
-				items: [{
-					type: "row",
-					items: [
-						{
-							type: "select",
-							name: "codeType",
-							span: 6,
-							options: [{
-								value: _tmagic_core.HookCodeType.CODE,
-								text: "代码块"
-							}, {
-								value: _tmagic_core.HookCodeType.DATA_SOURCE_METHOD,
-								text: "数据源方法"
-							}],
-							defaultValue: "code",
-							onChange: (_mForm, v, { setModel }) => {
-								if (v === _tmagic_core.HookCodeType.DATA_SOURCE_METHOD) setModel("codeId", []);
-								else setModel("codeId", "");
-								return v;
-							}
-						},
-						{
-							type: "code-select-col",
-							name: "codeId",
-							span: 18,
-							labelWidth: 0,
-							display: (_mForm, { model }) => model.codeType !== _tmagic_core.HookCodeType.DATA_SOURCE_METHOD,
-							notEditable: () => !codeBlockService.getEditStatus()
-						},
-						{
-							type: "data-source-method-select",
-							name: "codeId",
-							span: 18,
-							labelWidth: 0,
-							display: (_mForm, { model }) => model.codeType === _tmagic_core.HookCodeType.DATA_SOURCE_METHOD,
-							notEditable: () => !dataSourceService.get("editable")
+				titlePrefix: props.config.name === void 0 ? void 0 : String(props.config.name),
+				items: [
+					{
+						text: "代码类型",
+						type: "select",
+						name: "codeType",
+						labelPosition: "right",
+						options: [{
+							value: _tmagic_core.HookCodeType.CODE,
+							text: "代码块"
+						}, {
+							value: _tmagic_core.HookCodeType.DATA_SOURCE_METHOD,
+							text: "数据源方法"
+						}],
+						defaultValue: "code",
+						onChange: (_mForm, v, { setModel }) => {
+							if (v === _tmagic_core.HookCodeType.DATA_SOURCE_METHOD) setModel("codeId", []);
+							else setModel("codeId", "");
+							return v;
 						}
-					]
-				}]
+					},
+					{
+						type: "code-select-col",
+						name: "codeId",
+						text: "代码块",
+						display: (_mForm, { model }) => model.codeType !== _tmagic_core.HookCodeType.DATA_SOURCE_METHOD,
+						notEditable: () => !codeBlockService.getEditStatus()
+					},
+					{
+						type: "data-source-method-select",
+						name: "codeId",
+						text: "数据源字段",
+						display: (_mForm, { model }) => model.codeType === _tmagic_core.HookCodeType.DATA_SOURCE_METHOD,
+						notEditable: () => !dataSourceService.get("editable")
+					}
+				]
 			}));
 			(0, vue.watch)(() => props.model[props.name], (value) => {
 				if (isEmpty(value)) props.model[props.name] = {
@@ -19264,10 +19519,11 @@
 			}, { immediate: true });
 			const changeHandler = (v, eventData) => emit("change", v, eventData);
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)(["m-fields-code-select", __props.config.className]) }, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicCard), null, {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)(["m-fields-code-select", __props.config.className]) }, [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicCard), { flat: __props.config.flat }, {
 					default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_tmagic_form.MContainer), {
 						config: codeConfig.value,
 						size: __props.size,
+						class: "code-select-content",
 						prop: __props.prop,
 						disabled: __props.disabled,
 						"is-compare": isCompareMode.value,
@@ -19282,9 +19538,22 @@
 						"is-compare",
 						"last-values",
 						"model"
+					]), (0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
+						class: "create-button fullWidth",
+						icon: (0, vue.unref)(_element_plus_icons_vue.Plus),
+						size: __props.size,
+						disabled: __props.disabled,
+						onClick: _cache[0] || (_cache[0] = ($event) => newHandler())
+					}, {
+						default: (0, vue.withCtx)(() => [(0, vue.createTextVNode)("添加" + (0, vue.toDisplayString)(__props.config.text), 1)]),
+						_: 1
+					}, 8, [
+						"icon",
+						"size",
+						"disabled"
 					])]),
 					_: 1
-				})], 2);
+				}, 8, ["flat"])], 2);
 			};
 		}
 	});
@@ -19375,7 +19644,7 @@
 	init_Icon();
 	init_use_services();
 	init_type();
-	var _hoisted_1$37 = { class: "m-fields-code-select-col" };
+	var _hoisted_1$42 = { class: "m-fields-code-select-col" };
 	var _hoisted_2$11 = { class: "code-select-container" };
 	var CodeSelectCol_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MFieldsCodeSelectCol",
@@ -19393,7 +19662,10 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -19439,6 +19711,7 @@
 				type: "select",
 				name: props.name,
 				disabled: props.disabled,
+				text: props.config.text,
 				options: () => {
 					if (codeDsl.value) return map(codeDsl.value, (value, key) => ({
 						text: `${value.name}（${key}）`,
@@ -19475,7 +19748,7 @@
 				eventBus?.emit("edit-code", id);
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$37, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$42, [
 					(0, vue.createElementVNode)("div", _hoisted_2$11, [
 						(0, vue.createCommentVNode)(" 代码块下拉框 "),
 						(0, vue.createCommentVNode)(" 对比模式下交由 MFormContainer 展示下拉框的前后差异（codeId 变化时高亮新旧代码块名），\n           普通模式仍直接渲染 MSelect 以保留选择 / 写值逻辑 "),
@@ -19548,7 +19821,7 @@
 	//#endregion
 	//#region packages/editor/src/fields/DataSourceFields.vue?vue&type=script&setup=true&lang.ts
 	init_use_services();
-	var _hoisted_1$36 = { class: "m-editor-data-source-fields" };
+	var _hoisted_1$41 = { class: "m-editor-data-source-fields" };
 	var _hoisted_2$10 = {
 		key: 0,
 		class: "m-editor-data-source-fields-footer"
@@ -19569,7 +19842,10 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		}, {
 			"width": { default: 670 },
 			"widthModifiers": {},
@@ -19867,7 +20143,7 @@
 				editField(fields[index], index);
 			});
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$36, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$41, [
 					(0, vue.createVNode)((0, vue.unref)(_tmagic_table.MagicTable), {
 						data: __props.model[__props.name],
 						columns: displayColumns.value,
@@ -19957,7 +20233,7 @@
 	//#region packages/editor/src/fields/DataSourceMocks.vue?vue&type=script&setup=true&lang.ts
 	init_use_services();
 	init_CodeEditor();
-	var _hoisted_1$35 = { class: "m-editor-data-source-fields" };
+	var _hoisted_1$40 = { class: "m-editor-data-source-fields" };
 	var _hoisted_2$9 = {
 		key: 0,
 		class: "m-editor-data-source-fields-footer"
@@ -19978,7 +20254,10 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		}, {
 			"width": { default: 670 },
 			"widthModifiers": {},
@@ -20162,7 +20441,7 @@
 			const { height: editorHeight } = useEditorContentHeight();
 			const { boxPosition, calcBoxPosition } = useNextFloatBoxPosition(uiService, (0, vue.inject)("parentFloating", (0, vue.ref)(null)));
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$35, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$40, [
 					(0, vue.createVNode)((0, vue.unref)(_tmagic_table.MagicTable), {
 						data: __props.model[__props.name],
 						columns: displayColumns.value
@@ -20217,7 +20496,7 @@
 	//#endregion
 	//#region packages/editor/src/fields/DataSourceMethods.vue?vue&type=script&setup=true&lang.ts
 	init_lodash();
-	var _hoisted_1$34 = { class: "m-editor-data-source-methods" };
+	var _hoisted_1$39 = { class: "m-editor-data-source-methods" };
 	var _hoisted_2$8 = {
 		key: 0,
 		class: "m-editor-data-source-methods-footer"
@@ -20238,7 +20517,10 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -20346,7 +20628,7 @@
 				editMethod(methods[index], index);
 			});
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$34, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$39, [
 					(0, vue.createVNode)((0, vue.unref)(_tmagic_table.MagicTable), {
 						data: __props.model[__props.name],
 						columns: displayColumns.value,
@@ -20386,7 +20668,7 @@
 	//#region packages/editor/src/fields/DataSourceInput.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
 	init_use_services();
-	var _hoisted_1$33 = { style: {
+	var _hoisted_1$38 = { style: {
 		"display": "flex",
 		"flex-direction": "column",
 		"line-height": "1.2em"
@@ -20411,7 +20693,10 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -20607,7 +20892,7 @@
 					onSelect: selectHandler
 				}), {
 					suffix: (0, vue.withCtx)(() => [(0, vue.createVNode)(Icon_default, { icon: (0, vue.unref)(_element_plus_icons_vue.Coin) }, null, 8, ["icon"])]),
-					default: (0, vue.withCtx)(({ item }) => [(0, vue.createElementVNode)("div", _hoisted_1$33, [(0, vue.createElementVNode)("div", null, (0, vue.toDisplayString)(item.text), 1), (0, vue.createElementVNode)("span", _hoisted_2$7, (0, vue.toDisplayString)(item.value), 1)])]),
+					default: (0, vue.withCtx)(({ item }) => [(0, vue.createElementVNode)("div", _hoisted_1$38, [(0, vue.createElementVNode)("div", null, (0, vue.toDisplayString)(item.text), 1), (0, vue.createElementVNode)("span", _hoisted_2$7, (0, vue.toDisplayString)(item.value), 1)])]),
 					_: 1
 				}, 16, ["modelValue"])) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
 					key: 2,
@@ -20652,7 +20937,7 @@
 	init_Icon();
 	init_use_services();
 	init_type();
-	var _hoisted_1$32 = { class: "m-fields-data-source-select" };
+	var _hoisted_1$37 = { class: "m-fields-data-source-select" };
 	var DataSourceSelect_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MFieldsDataSourceSelect",
 		__name: "DataSourceSelect",
@@ -20669,7 +20954,10 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -20711,7 +20999,7 @@
 				eventBus?.emit("edit-data-source", id);
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$32, [(0, vue.createVNode)((0, vue.unref)(_tmagic_form.MSelect), {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$37, [(0, vue.createVNode)((0, vue.unref)(_tmagic_form.MSelect), {
 					model: __props.model,
 					name: __props.name,
 					size: __props.size,
@@ -20753,7 +21041,7 @@
 	init_Icon();
 	init_use_services();
 	init_type();
-	var _hoisted_1$31 = { class: "m-fields-data-source-method-select" };
+	var _hoisted_1$36 = { class: "m-fields-data-source-method-select" };
 	var _hoisted_2$6 = { class: "data-source-method-select-container" };
 	var DataSourceMethodSelect_vue_vue_type_script_setup_true_name_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MFieldsDataSourceMethodSelect",
@@ -20771,7 +21059,10 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -20875,7 +21166,7 @@
 				eventBus?.emit("edit-data-source-method", id, methodName);
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$31, [(0, vue.createElementVNode)("div", _hoisted_2$6, [(0, vue.createVNode)((0, vue.unref)(_tmagic_form.MCascader), {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$36, [(0, vue.createElementVNode)("div", _hoisted_2$6, [(0, vue.createVNode)((0, vue.unref)(_tmagic_form.MCascader), {
 					class: "select",
 					config: cascaderConfig.value,
 					model: __props.model,
@@ -20925,11 +21216,32 @@
 	//#region packages/editor/src/fields/DataSourceMethodSelect.vue
 	var DataSourceMethodSelect_default = DataSourceMethodSelect_vue_vue_type_script_setup_true_name_true_lang_default;
 	//#endregion
+	//#region \0plugin-vue:export-helper
+	var _plugin_vue_export_helper_default = (sfc, props) => {
+		const target = sfc.__vccOpts || sfc;
+		for (const [key, val] of props) target[key] = val;
+		return target;
+	};
+	//#endregion
+	//#region packages/editor/src/icons/DatasourceIcon.vue
+	var _sfc_main$26 = {};
+	var _hoisted_1$35 = {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
+	};
+	function _sfc_render$26(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$35, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M6.25 9.723C4.392 9.6095 2.804 9.137 1.875 8.4775V9.7495C1.875 10.6165 3.7665 11.3365 6.25 11.4745V12.348C4.392 12.2345 2.804 11.763 1.875 11.102V12.3745H1V4.0625C1 2.371 3.742 1 7.125 1C10.507 1 13.249 2.371 13.249 4.0625V6.8255H12.374V5.6405C11.3025 6.5295 9.352 7.1245 7.1245 7.1245C4.897 7.1245 2.947 6.5295 1.8745 5.6405V7.1245C1.8745 7.9915 3.7665 8.712 6.2495 8.85L6.25 9.723ZM7.125 14.999C3.742 14.999 1 13.8245 1 12.3745H1.875C1.875 13.3415 4.225 14.124 7.125 14.124V14.999ZM7.125 6.2495C10.024 6.2495 12.3745 5.2695 12.3745 4.0625C12.3745 2.855 10.0245 1.875 7.1245 1.875C4.225 1.875 1.8745 2.855 1.8745 4.0625C1.8745 5.2695 4.2255 6.2495 7.125 6.2495ZM14.7385 11.9895L14.1295 11.6345C14.1635 11.4485 14.1855 11.2585 14.1855 11.062C14.1843 10.8697 14.1655 10.6779 14.1295 10.489L14.7385 10.134C14.988 9.987 15.073 9.667 14.929 9.416L14.409 8.507C14.3752 8.44726 14.3299 8.39483 14.2757 8.35275C14.2215 8.31066 14.1595 8.27977 14.0933 8.26186C14.027 8.24395 13.9579 8.23938 13.8898 8.24842C13.8218 8.25745 13.7563 8.27992 13.697 8.3145L13.081 8.6735C12.7931 8.42269 12.4616 8.22694 12.103 8.096V7.6495C12.103 7.36 11.8705 7.1245 11.5825 7.1245H10.5415C10.4728 7.12476 10.4049 7.13855 10.3415 7.16507C10.2782 7.1916 10.2206 7.23034 10.1723 7.2791C10.1239 7.32785 10.0856 7.38565 10.0595 7.4492C10.0335 7.51276 10.0202 7.58082 10.0205 7.6495V8.096C9.66186 8.22694 9.33035 8.42269 9.0425 8.6735L8.4265 8.3145C8.36725 8.27999 8.30174 8.2576 8.23377 8.2486C8.1658 8.23961 8.09672 8.24419 8.03053 8.2621C7.96435 8.28001 7.90238 8.31088 7.84821 8.35292C7.79405 8.39495 7.74877 8.44733 7.715 8.507L7.195 9.417C7.12576 9.53751 7.10688 9.68047 7.14246 9.81482C7.17804 9.94917 7.2652 10.0641 7.385 10.1345L7.9945 10.489C7.9585 10.6775 7.9395 10.8695 7.9385 11.062C7.9385 11.2585 7.96 11.4485 7.9945 11.635L7.3855 11.99C7.1355 12.1365 7.0505 12.4565 7.1945 12.7075L7.715 13.6165C7.74877 13.6762 7.79405 13.7285 7.84821 13.7706C7.90238 13.8126 7.96435 13.8435 8.03053 13.8614C8.09672 13.8793 8.1658 13.8839 8.23377 13.8749C8.30174 13.8659 8.36725 13.8435 8.4265 13.809L9.0425 13.4505C9.33023 13.7015 9.66178 13.8972 10.0205 14.028V14.474C10.0205 14.764 10.2535 14.999 10.5415 14.999H11.5825C11.7211 14.9983 11.8538 14.9427 11.9514 14.8442C12.049 14.7458 12.1035 14.6126 12.103 14.474V14.028C12.4616 13.8971 12.7931 13.7013 13.081 13.4505L13.697 13.809C13.7563 13.8434 13.8218 13.8657 13.8897 13.8746C13.9577 13.8835 14.0267 13.8789 14.0929 13.861C14.159 13.8431 14.221 13.8123 14.2751 13.7703C14.3293 13.7283 14.3746 13.6761 14.4085 13.6165L14.929 12.7065C14.998 12.586 15.0168 12.4431 14.9811 12.3089C14.9454 12.1746 14.8583 12.0599 14.7385 11.9895ZM14.092 12.5065L13.852 12.915C13.8193 12.9693 13.7667 13.0086 13.7054 13.0246C13.6441 13.0406 13.579 13.0319 13.524 13.0005L12.8575 12.623C12.5109 13.0069 12.0497 13.2688 11.5425 13.37V13.889C11.5425 14.0185 11.4345 14.124 11.3015 14.124H10.822C10.7907 14.1243 10.7597 14.1184 10.7308 14.1067C10.7018 14.0949 10.6754 14.0776 10.6531 14.0557C10.6308 14.0338 10.6131 14.0077 10.6009 13.9789C10.5887 13.9502 10.5823 13.9193 10.582 13.888V13.37C10.0746 13.2689 9.61328 13.007 9.2665 12.623L8.6 13C8.54495 13.0316 8.47971 13.0403 8.4183 13.0243C8.35688 13.0083 8.30418 12.9689 8.2715 12.9145L8.0315 12.506C8.01582 12.4792 8.00564 12.4496 8.00158 12.4189C7.99752 12.3881 7.99965 12.3569 8.00785 12.327C8.01605 12.297 8.03016 12.2691 8.04933 12.2447C8.0685 12.2203 8.09236 12.2 8.1195 12.185L8.789 11.805C8.70604 11.5658 8.66313 11.3146 8.662 11.0615C8.662 10.8005 8.709 10.552 8.7895 10.3175L8.1195 9.9375C8.09247 9.92244 8.06872 9.90213 8.04964 9.87777C8.03056 9.85341 8.01654 9.82549 8.00839 9.79564C8.00024 9.76579 7.99813 9.73461 8.00218 9.70394C8.00624 9.67326 8.01637 9.64371 8.032 9.617L8.272 9.208C8.30467 9.15373 8.35729 9.1144 8.41858 9.09843C8.47988 9.08245 8.54499 9.09109 8.6 9.1225L9.2665 9.5005C9.61315 9.11663 10.0743 8.85468 10.5815 8.7535V8.235C10.5815 8.105 10.689 8 10.822 8H11.302C11.4345 8 11.542 8.105 11.542 8.236V8.754C12.0492 8.85518 12.5104 9.11713 12.857 9.501L13.524 9.123C13.579 9.09159 13.6441 9.08295 13.7054 9.09893C13.7667 9.1149 13.8193 9.15423 13.852 9.2085L14.092 9.6175C14.1077 9.64423 14.1179 9.67383 14.122 9.70455C14.1261 9.73528 14.124 9.76652 14.1159 9.79643C14.1077 9.82634 14.0937 9.85431 14.0745 9.87871C14.0554 9.90311 14.0316 9.92344 14.0045 9.9385L13.335 10.3185C13.4135 10.5525 13.462 10.801 13.462 11.062C13.462 11.3225 13.4145 11.571 13.335 11.8055L14.0045 12.1855C14.0316 12.2006 14.0554 12.2209 14.0745 12.2453C14.0937 12.2697 14.1077 12.2977 14.1159 12.3276C14.124 12.3575 14.1261 12.3887 14.122 12.4194C14.1179 12.4502 14.1077 12.4798 14.092 12.5065ZM11.062 9.7495C10.7139 9.7495 10.3801 9.88778 10.1339 10.1339C9.88778 10.3801 9.7495 10.7139 9.7495 11.062C9.7495 11.4101 9.88778 11.7439 10.1339 11.9901C10.3801 12.2362 10.7139 12.3745 11.062 12.3745C11.4101 12.3745 11.7439 12.2362 11.9901 11.9901C12.2362 11.7439 12.3745 11.4101 12.3745 11.062C12.3745 10.7139 12.2362 10.3801 11.9901 10.1339C11.7439 9.88778 11.4101 9.7495 11.062 9.7495ZM11.062 11.4995C10.946 11.4995 10.8347 11.4534 10.7526 11.3714C10.6706 11.2893 10.6245 11.178 10.6245 11.062C10.6245 10.946 10.6706 10.8347 10.7526 10.7526C10.8347 10.6706 10.946 10.6245 11.062 10.6245C11.178 10.6245 11.2893 10.6706 11.3714 10.7526C11.4534 10.8347 11.4995 10.946 11.4995 11.062C11.4995 11.178 11.4534 11.2893 11.3714 11.3714C11.2893 11.4534 11.178 11.4995 11.062 11.4995Z" }, null, -1)])]);
+	}
+	var DatasourceIcon_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$26, [["render", _sfc_render$26]]);
+	//#endregion
 	//#region packages/editor/src/fields/DataSourceFieldSelect/FieldSelect.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
 	init_use_services();
 	init_type();
-	var _hoisted_1$30 = { class: "m-editor-data-source-field-select" };
+	var _hoisted_1$34 = { class: "m-editor-data-source-field-select" };
 	var FieldSelect_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		__name: "FieldSelect",
 		props: /* @__PURE__ */ (0, vue.mergeModels)({
@@ -21021,7 +21333,7 @@
 				else eventBus?.emit("edit-data-source", dataSourceId);
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$30, [__props.dataSourceId ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicCascader), {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$34, [__props.dataSourceId ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicCascader), {
 					key: 0,
 					"model-value": selectFieldsId.value,
 					clearable: "",
@@ -21119,7 +21431,6 @@
 	//#region packages/editor/src/fields/DataSourceFieldSelect/Index.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
 	init_use_services();
-	var _hoisted_1$29 = { class: "m-fields-data-source-field-select" };
 	var Index_vue_vue_type_script_setup_true_lang_default$1 = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MFieldsDataSourceFieldSelect",
 		__name: "Index",
@@ -21136,13 +21447,17 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
 			const emit = __emit;
 			const props = __props;
 			const showDataSourceFieldSelect = (0, vue.ref)(false);
+			const isSelectValid = (0, vue.computed)(() => !disabledDataSource.value && (showDataSourceFieldSelect.value || !props.config.fieldConfig));
 			(0, vue.watch)(() => props.model[props.name], (value) => {
 				if (Array.isArray(value) && typeof value[0] === "string" && value[0].startsWith(_tmagic_utils.DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX)) showDataSourceFieldSelect.value = true;
 				else showDataSourceFieldSelect.value = false;
@@ -21212,7 +21527,7 @@
 				showDataSourceFieldSelect.value = !showDataSourceFieldSelect.value;
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$29, [!disabledDataSource.value && (showDataSourceFieldSelect.value || !__props.config.fieldConfig) ? ((0, vue.openBlock)(), (0, vue.createBlock)(FieldSelect_default, {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)(["m-fields-data-source-field-select", { [`data-source-field-${type.value}`]: !isSelectValid.value }]) }, [isSelectValid.value ? ((0, vue.openBlock)(), (0, vue.createBlock)(FieldSelect_default, {
 					key: 0,
 					"model-value": __props.model[__props.name],
 					disabled: __props.disabled,
@@ -21263,7 +21578,7 @@
 						disabled: __props.disabled,
 						onClick: onToggleDataSourceFieldSelectHandler
 					}, {
-						default: (0, vue.withCtx)(() => [(0, vue.createVNode)(Icon_default, { icon: (0, vue.unref)(_element_plus_icons_vue.Coin) }, null, 8, ["icon"])]),
+						default: (0, vue.withCtx)(() => [(0, vue.createVNode)(Icon_default, { icon: DatasourceIcon_default })]),
 						_: 1
 					}, 8, [
 						"type",
@@ -21271,7 +21586,7 @@
 						"disabled"
 					])]),
 					_: 1
-				}, 8, ["disabled"])) : (0, vue.createCommentVNode)("v-if", true)]);
+				}, 8, ["disabled"])) : (0, vue.createCommentVNode)("v-if", true)], 2);
 			};
 		}
 	});
@@ -21282,11 +21597,14 @@
 	//#region packages/editor/src/fields/EventSelect.vue?vue&type=script&setup=true&lang.ts
 	init_lodash();
 	init_use_services();
-	var _hoisted_1$28 = { class: "m-fields-event-select" };
+	var _hoisted_1$33 = { class: "m-fields-event-select" };
 	var _hoisted_2$5 = {
 		key: 1,
-		class: "fullWidth"
+		class: "fullWidth event-select-container"
 	};
+	var _hoisted_3$3 = { class: "event-select-header" };
+	var _hoisted_4$2 = { class: "event-item-header" };
+	var _hoisted_5$1 = { class: "event-item-title" };
 	var EventSelect_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MFieldsEventSelect",
 		__name: "EventSelect",
@@ -21300,7 +21618,10 @@
 			disabled: { type: Boolean },
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -21310,12 +21631,12 @@
 			const eventNameConfig = (0, vue.computed)(() => {
 				return {
 					name: "name",
-					text: "事件",
+					text: "事件类型",
 					type: (mForm, { formValue }) => {
 						if (props.config.src !== "component" || formValue.type === "page-fragment-container" && formValue.pageFragmentId) return "cascader";
 						return "select";
 					},
-					labelWidth: "40px",
+					labelWidth: "70px",
 					checkStrictly: () => props.config.src !== "component",
 					valueSeparator: ".",
 					options: (mForm, { formValue }) => {
@@ -21367,6 +21688,7 @@
 					name: "actionType",
 					text: "联动类型",
 					type: "select",
+					labelPosition: "left",
 					defaultValue: _tmagic_core.ActionType.COMP,
 					options: () => {
 						const o = [{
@@ -21395,6 +21717,7 @@
 					name: "to",
 					text: "联动组件",
 					type: "ui-select",
+					labelPosition: "left",
 					display: (_mForm, { model }) => model.actionType === _tmagic_core.ActionType.COMP,
 					onChange: (_MForm, _v, { setModel }) => {
 						setModel("method", "");
@@ -21406,6 +21729,7 @@
 				return {
 					name: "method",
 					text: "动作",
+					labelPosition: "left",
 					type: (mForm, { model }) => {
 						const to = editorService.getNodeById(model.to);
 						if (to && to.type === "page-fragment-container" && to.pageFragmentId) return "cascader";
@@ -21498,12 +21822,16 @@
 			}));
 			const actionsConfig = (0, vue.computed)(() => (0, _tmagic_form.defineFormItem)({
 				type: "panel",
+				labelPosition: "left",
+				flat: true,
 				items: [{
 					type: "group-list",
 					name: "actions",
 					expandAll: true,
 					enableToggleMode: false,
 					titlePrefix: "动作",
+					labelPosition: "left",
+					flat: true,
 					items: [
 						actionTypeConfig.value,
 						targetCompConfig.value,
@@ -21568,7 +21896,7 @@
 			};
 			const onChangeHandler = (v, eventData) => emit("change", props.model[props.name], eventData);
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$28, [isOldVersion.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_form.MTable), {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$33, [isOldVersion.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_form.MTable), {
 					key: 0,
 					name: "events",
 					size: __props.size,
@@ -21585,73 +21913,97 @@
 					"last-values",
 					"is-compare",
 					"config"
-				])) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_2$5, [!isCompareMode.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
-					key: 0,
-					class: "create-button",
-					type: "primary",
-					size: __props.size,
-					disabled: __props.disabled,
-					onClick: _cache[0] || (_cache[0] = ($event) => addEvent())
-				}, {
-					default: (0, vue.withCtx)(() => [..._cache[1] || (_cache[1] = [(0, vue.createTextVNode)("添加事件", -1)])]),
-					_: 1
-				}, 8, ["size", "disabled"])) : (0, vue.createCommentVNode)("v-if", true), ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(displayList.value, (entry) => {
-					return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_form.MPanel), {
-						key: entry.index,
-						disabled: __props.disabled,
+				])) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_2$5, [
+					(0, vue.createElementVNode)("div", _hoisted_3$3, [_cache[3] || (_cache[3] = (0, vue.createElementVNode)("div", { class: "event-select-title" }, "事件配置", -1)), !isCompareMode.value && displayList.value.length > 0 ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
+						key: 0,
+						class: "create-button",
+						text: "",
+						type: "primary",
+						icon: (0, vue.unref)(_element_plus_icons_vue.Plus),
 						size: __props.size,
-						prop: `${__props.prop}.${entry.index}`,
-						config: actionsConfig.value,
-						model: entry.cardItem,
-						"last-values": entry.lastCardItem,
-						"is-compare": isCompareMode.value,
-						"label-width": __props.config.labelWidth || "100px",
-						onChange: onChangeHandler
+						disabled: __props.disabled,
+						onClick: _cache[0] || (_cache[0] = ($event) => addEvent())
 					}, {
-						header: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_tmagic_form.MContainer), {
-							class: "fullWidth",
-							config: eventNameConfig.value,
-							model: entry.cardItem,
-							"last-values": entry.lastCardItem,
-							"is-compare": isCompareMode.value,
+						default: (0, vue.withCtx)(() => [..._cache[2] || (_cache[2] = [(0, vue.createTextVNode)("添加事件", -1)])]),
+						_: 1
+					}, 8, [
+						"icon",
+						"size",
+						"disabled"
+					])) : (0, vue.createCommentVNode)("v-if", true)]),
+					((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(displayList.value, (entry) => {
+						return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_form.MPanel), {
+							key: entry.index,
 							disabled: __props.disabled,
 							size: __props.size,
 							prop: `${__props.prop}.${entry.index}`,
-							onChange: eventNameChangeHandler
-						}, null, 8, [
+							config: actionsConfig.value,
+							model: entry.cardItem,
+							"last-values": entry.lastCardItem,
+							"is-compare": isCompareMode.value,
+							"hide-expand": true,
+							"label-width": __props.config.labelWidth || "100px",
+							onChange: onChangeHandler
+						}, {
+							header: (0, vue.withCtx)(() => [(0, vue.createElementVNode)("div", _hoisted_4$2, [
+								(0, vue.createElementVNode)("div", _hoisted_5$1, "事件" + (0, vue.toDisplayString)(Number(entry.index) + 1), 1),
+								(0, vue.createVNode)((0, vue.unref)(_tmagic_form.MContainer), {
+									class: "fullWidth",
+									config: eventNameConfig.value,
+									model: entry.cardItem,
+									"last-values": entry.lastCardItem,
+									"is-compare": isCompareMode.value,
+									disabled: __props.disabled,
+									size: __props.size,
+									prop: `${__props.prop}.${entry.index}`,
+									onChange: eventNameChangeHandler
+								}, null, 8, [
+									"config",
+									"model",
+									"last-values",
+									"is-compare",
+									"disabled",
+									"size",
+									"prop"
+								]),
+								!isCompareMode.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
+									key: 0,
+									class: "event-item-delete-button",
+									link: "",
+									icon: (0, vue.unref)(_element_plus_icons_vue.Delete),
+									disabled: __props.disabled,
+									size: __props.size,
+									onClick: ($event) => removeEvent(Number(entry.index))
+								}, null, 8, [
+									"icon",
+									"disabled",
+									"size",
+									"onClick"
+								])) : (0, vue.createCommentVNode)("v-if", true)
+							])]),
+							_: 2
+						}, 1032, [
+							"disabled",
+							"size",
+							"prop",
 							"config",
 							"model",
 							"last-values",
 							"is-compare",
-							"disabled",
-							"size",
-							"prop"
-						]), !isCompareMode.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
-							key: 0,
-							style: { "color": "#f56c6c" },
-							link: "",
-							icon: (0, vue.unref)(_element_plus_icons_vue.Delete),
-							disabled: __props.disabled,
-							size: __props.size,
-							onClick: ($event) => removeEvent(Number(entry.index))
-						}, null, 8, [
-							"icon",
-							"disabled",
-							"size",
-							"onClick"
-						])) : (0, vue.createCommentVNode)("v-if", true)]),
-						_: 2
-					}, 1032, [
-						"disabled",
-						"size",
-						"prop",
-						"config",
-						"model",
-						"last-values",
-						"is-compare",
-						"label-width"
-					]);
-				}), 128))]))]);
+							"label-width"
+						]);
+					}), 128)),
+					!isCompareMode.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
+						key: 0,
+						class: "create-button fullWidth",
+						icon: (0, vue.unref)(_element_plus_icons_vue.Plus),
+						disabled: __props.disabled,
+						onClick: _cache[1] || (_cache[1] = ($event) => addEvent())
+					}, {
+						default: (0, vue.withCtx)(() => [..._cache[4] || (_cache[4] = [(0, vue.createTextVNode)("添加事件", -1)])]),
+						_: 1
+					}, 8, ["icon", "disabled"])) : (0, vue.createCommentVNode)("v-if", true)
+				]))]);
 			};
 		}
 	});
@@ -21660,7 +22012,7 @@
 	var EventSelect_default = EventSelect_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/icons/CodeIcon.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$27 = {
+	var _hoisted_1$32 = {
 		viewBox: "0 0 32 32",
 		version: "1.1",
 		xmlns: "http://www.w3.org/2000/svg",
@@ -21671,7 +22023,7 @@
 		__name: "CodeIcon",
 		setup(__props) {
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$27, [..._cache[0] || (_cache[0] = [(0, vue.createStaticVNode)("<defs><rect id=\"path-1\" x=\"0\" y=\"0\" width=\"32\" height=\"32\"></rect></defs><g id=\"组件规范\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\"><g id=\"03图标\" transform=\"translate(-561.000000, -2356.000000)\"><g id=\"icon/line/Universal/code\" transform=\"translate(561.000000, 2356.000000)\"><g id=\"路径\"><mask id=\"mask-2\" fill=\"white\"><use xlink:href=\"#path-1\"></use></mask><use id=\"蒙版\" fill=\"#D8D8D8\" opacity=\"0\" xlink:href=\"#path-1\"></use><path d=\"M21.9284587,7.9482233 L29.8079004,15.827665 C29.9055315,15.9252961 29.9055315,16.0835874 29.8079004,16.1812184 L21.9284587,24.0606602 C21.8308276,24.1582912 21.6725364,24.1582912 21.5749053,24.0606602 L20.3374684,22.8232233 C20.2419143,22.7276698 20.2398813,22.5740096 20.331369,22.4759832 L20.3374687,22.4696702 L26.8027181,16.0044417 L20.3374687,9.53921328 C20.2398372,9.44158265 20.2398369,9.2832914 20.3374679,9.18566017 L21.5749053,7.9482233 C21.6725364,7.85059223 21.8308276,7.85059223 21.9284587,7.9482233 Z M10.3999684,7.9482233 L11.6374053,9.18566017 C11.7329594,9.28121371 11.7349925,9.43487387 11.6435048,9.53290029 L11.637405,9.53921328 L5.17215562,16.0044417 L11.637405,22.4696702 C11.7329593,22.5652236 11.7349926,22.7188837 11.643505,22.8169103 L11.6374053,22.8232233 L10.3999684,24.0606602 C10.3023374,24.1582912 10.1440461,24.1582912 10.046415,24.0606602 L2.1669733,16.1812184 C2.06934223,16.0835874 2.06934223,15.9252961 2.1669733,15.827665 L10.046415,7.9482233 C10.1440461,7.85059223 10.3023374,7.85059223 10.3999684,7.9482233 Z M17.2612532,9.29310422 L18.9262468,9.83189578 C19.0576112,9.87440526 19.1296423,10.0153579 19.0871328,10.1467222 L15.0848232,22.514807 C15.0423138,22.6461714 14.9013612,22.7182025 14.7699968,22.675693 L13.1050032,22.1369014 C12.9736388,22.0943919 12.9016077,21.9534393 12.9441172,21.822075 L16.9464268,9.45399022 C16.9889362,9.32262585 17.1298888,9.25059474 17.2612532,9.29310422 Z\" id=\"形状\" fill=\"#1D1F24\" mask=\"url(#mask-2)\"></path></g></g><g id=\"icon切图\" transform=\"translate(226.000000, 1782.000000)\"></g></g></g>", 2)])]);
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$32, [..._cache[0] || (_cache[0] = [(0, vue.createStaticVNode)("<defs><rect id=\"path-1\" x=\"0\" y=\"0\" width=\"32\" height=\"32\"></rect></defs><g id=\"组件规范\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\"><g id=\"03图标\" transform=\"translate(-561.000000, -2356.000000)\"><g id=\"icon/line/Universal/code\" transform=\"translate(561.000000, 2356.000000)\"><g id=\"路径\"><mask id=\"mask-2\" fill=\"white\"><use xlink:href=\"#path-1\"></use></mask><use id=\"蒙版\" fill=\"#D8D8D8\" opacity=\"0\" xlink:href=\"#path-1\"></use><path d=\"M21.9284587,7.9482233 L29.8079004,15.827665 C29.9055315,15.9252961 29.9055315,16.0835874 29.8079004,16.1812184 L21.9284587,24.0606602 C21.8308276,24.1582912 21.6725364,24.1582912 21.5749053,24.0606602 L20.3374684,22.8232233 C20.2419143,22.7276698 20.2398813,22.5740096 20.331369,22.4759832 L20.3374687,22.4696702 L26.8027181,16.0044417 L20.3374687,9.53921328 C20.2398372,9.44158265 20.2398369,9.2832914 20.3374679,9.18566017 L21.5749053,7.9482233 C21.6725364,7.85059223 21.8308276,7.85059223 21.9284587,7.9482233 Z M10.3999684,7.9482233 L11.6374053,9.18566017 C11.7329594,9.28121371 11.7349925,9.43487387 11.6435048,9.53290029 L11.637405,9.53921328 L5.17215562,16.0044417 L11.637405,22.4696702 C11.7329593,22.5652236 11.7349926,22.7188837 11.643505,22.8169103 L11.6374053,22.8232233 L10.3999684,24.0606602 C10.3023374,24.1582912 10.1440461,24.1582912 10.046415,24.0606602 L2.1669733,16.1812184 C2.06934223,16.0835874 2.06934223,15.9252961 2.1669733,15.827665 L10.046415,7.9482233 C10.1440461,7.85059223 10.3023374,7.85059223 10.3999684,7.9482233 Z M17.2612532,9.29310422 L18.9262468,9.83189578 C19.0576112,9.87440526 19.1296423,10.0153579 19.0871328,10.1467222 L15.0848232,22.514807 C15.0423138,22.6461714 14.9013612,22.7182025 14.7699968,22.675693 L13.1050032,22.1369014 C12.9736388,22.0943919 12.9016077,21.9534393 12.9441172,21.822075 L16.9464268,9.45399022 C16.9889362,9.32262585 17.1298888,9.25059474 17.2612532,9.29310422 Z\" id=\"形状\" fill=\"#1D1F24\" mask=\"url(#mask-2)\"></path></g></g><g id=\"icon切图\" transform=\"translate(226.000000, 1782.000000)\"></g></g></g>", 2)])]);
 			};
 		}
 	});
@@ -21681,7 +22033,7 @@
 	//#endregion
 	//#region packages/editor/src/fields/KeyValue.vue?vue&type=script&setup=true&lang.ts
 	init_CodeEditor();
-	var _hoisted_1$26 = { class: "m-fields-key-value" };
+	var _hoisted_1$31 = { class: "m-fields-key-value" };
 	var _hoisted_2$4 = { key: 0 };
 	var KeyValue_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MFieldsKeyValue",
@@ -21699,7 +22051,10 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -21745,7 +22100,7 @@
 				emit("change", v);
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$26, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$31, [
 					!showCode.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_2$4, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(records.value, (item, index) => {
 						return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
 							class: "m-fields-key-value-item",
@@ -21844,7 +22199,7 @@
 	init_HistoryDiffDialog();
 	init_Icon();
 	init_use_services();
-	var _hoisted_1$25 = { class: "m-fields-page-fragment-select" };
+	var _hoisted_1$30 = { class: "m-fields-page-fragment-select" };
 	var _hoisted_2$3 = { class: "page-fragment-select-container" };
 	var PageFragmentSelect_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MFieldsPageFragmentSelect",
@@ -21862,7 +22217,10 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -21887,7 +22245,7 @@
 				editorService.select(id);
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$25, [(0, vue.createElementVNode)("div", _hoisted_2$3, [
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$30, [(0, vue.createElementVNode)("div", _hoisted_2$3, [
 					(0, vue.createCommentVNode)(" 页面片下拉框 "),
 					(0, vue.createVNode)((0, vue.unref)(_tmagic_form.MSelect), {
 						class: "select",
@@ -21938,7 +22296,10 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -21962,11 +22323,14 @@
 				titlePrefix: props.config.titlePrefix,
 				expandAll: true,
 				enableToggleMode: false,
+				flat: props.config.flat,
 				items: [{
 					type: "table",
 					name: "cond",
-					operateColWidth: 80,
+					operateColWidth: props.config.operateColWidth,
 					enableToggleMode: false,
+					fixed: props.config.fixed,
+					flat: props.config.flat,
 					items: [
 						parentFields.value.length ? {
 							type: "cascader",
@@ -22091,7 +22455,10 @@
 			disabled: { type: Boolean },
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -22156,7 +22523,7 @@
 	var CondOpSelect_default = CondOpSelect_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/components/BackgroundPosition.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$24 = { class: "background-position-container" };
+	var _hoisted_1$29 = { class: "background-position-container" };
 	var _hoisted_2$2 = { class: "presets-value-list" };
 	var _hoisted_3$2 = { class: "custom-value" };
 	var BackgroundPosition_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
@@ -22171,7 +22538,10 @@
 			disabled: { type: Boolean },
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -22212,7 +22582,7 @@
 				emit("change", v);
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$24, [(0, vue.createElementVNode)("div", _hoisted_2$2, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(list), (item, index) => {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$29, [(0, vue.createElementVNode)("div", _hoisted_2$2, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)((0, vue.unref)(list), (item, index) => {
 					return (0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
 						key: index,
 						link: "",
@@ -22251,65 +22621,110 @@
 	//#region packages/editor/src/fields/StyleSetter/components/BackgroundPosition.vue
 	var BackgroundPosition_default = BackgroundPosition_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
-	//#region \0plugin-vue:export-helper
-	var _plugin_vue_export_helper_default = (sfc, props) => {
-		const target = sfc.__vccOpts || sfc;
-		for (const [key, val] of props) target[key] = val;
-		return target;
-	};
-	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/icons/background-repeat/Repeat.vue
-	var _sfc_main$20 = {};
-	var _hoisted_1$23 = {
+	var _sfc_main$25 = {};
+	var _hoisted_1$28 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
-	function _sfc_render$20(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$23, [..._cache[0] || (_cache[0] = [(0, vue.createStaticVNode)("<path d=\"M884.736 102.4l-147.456 0c-20.48 0-36.864 16.384-36.864 36.864l0 147.456C696.32 311.296 712.704 327.68 733.184 327.68l147.456 0c20.48 0 36.864-16.384 36.864-36.864L917.504 139.264C921.6 118.784 905.216 102.4 884.736 102.4zM884.736 290.816l-147.456 0L737.28 139.264l147.456 0L884.736 290.816z\"></path><path d=\"M884.736 696.32l-147.456 0c-20.48 0-36.864 16.384-36.864 36.864l0 147.456c0 20.48 16.384 36.864 36.864 36.864l147.456 0c20.48 0 36.864-16.384 36.864-36.864l0-147.456C921.6 712.704 905.216 696.32 884.736 696.32zM884.736 884.736l-147.456 0 0-147.456 147.456 0L884.736 884.736z\"></path><path d=\"M884.736 401.408l-147.456 0c-20.48 0-36.864 16.384-36.864 36.864l0 147.456c0 20.48 16.384 36.864 36.864 36.864l147.456 0c20.48 0 36.864-16.384 36.864-36.864l0-147.456C921.6 417.792 905.216 401.408 884.736 401.408zM884.736 585.728l-147.456 0 0-147.456 147.456 0L884.736 585.728z\"></path><path d=\"M585.728 401.408l-147.456 0c-20.48 0-36.864 16.384-36.864 36.864l0 147.456c0 20.48 16.384 36.864 36.864 36.864l147.456 0c20.48 0 36.864-16.384 36.864-36.864l0-147.456C622.592 417.792 606.208 401.408 585.728 401.408zM585.728 585.728l-147.456 0 0-147.456 147.456 0L585.728 585.728z\"></path><path d=\"M585.728 102.4l-147.456 0c-20.48 0-36.864 16.384-36.864 36.864l0 147.456c0 20.48 16.384 36.864 36.864 36.864l147.456 0c20.48 0 36.864-16.384 36.864-36.864L622.592 139.264C622.592 118.784 606.208 102.4 585.728 102.4zM585.728 290.816l-147.456 0L438.272 139.264l147.456 0L585.728 290.816z\"></path><path d=\"M585.728 696.32l-147.456 0c-20.48 0-36.864 16.384-36.864 36.864l0 147.456c0 20.48 16.384 36.864 36.864 36.864l147.456 0c20.48 0 36.864-16.384 36.864-36.864l0-147.456C622.592 712.704 606.208 696.32 585.728 696.32zM585.728 884.736l-147.456 0 0-147.456 147.456 0L585.728 884.736z\"></path><path d=\"M290.816 696.32 139.264 696.32c-20.48 0-36.864 16.384-36.864 36.864l0 147.456c0 20.48 16.384 36.864 36.864 36.864l147.456 0c20.48 0 36.864-16.384 36.864-36.864l0-147.456C327.68 712.704 311.296 696.32 290.816 696.32zM290.816 884.736 139.264 884.736l0-147.456 147.456 0L286.72 884.736z\"></path><path d=\"M290.816 401.408 139.264 401.408c-20.48 0-36.864 16.384-36.864 36.864l0 147.456c0 20.48 16.384 36.864 36.864 36.864l147.456 0c20.48 0 36.864-16.384 36.864-36.864l0-147.456C327.68 417.792 311.296 401.408 290.816 401.408zM290.816 585.728 139.264 585.728l0-147.456 147.456 0L286.72 585.728z\"></path><path d=\"M290.816 102.4 139.264 102.4c-20.48 0-36.864 16.384-36.864 36.864l0 147.456C102.4 311.296 118.784 327.68 139.264 327.68l147.456 0C311.296 327.68 327.68 311.296 327.68 290.816L327.68 139.264C327.68 118.784 311.296 102.4 290.816 102.4zM290.816 290.816 139.264 290.816 139.264 139.264l147.456 0L286.72 290.816z\"></path>", 9)])]);
+	function _sfc_render$25(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$28, [..._cache[0] || (_cache[0] = [(0, vue.createStaticVNode)("<rect x=\"13\" y=\"3\" width=\"2\" height=\"2\" rx=\"0.5\" transform=\"rotate(90 13 3)\" fill-opacity=\"0.3\"></rect><rect x=\"13\" y=\"7\" width=\"2\" height=\"2\" rx=\"0.5\" transform=\"rotate(90 13 7)\" fill-opacity=\"0.3\"></rect><rect x=\"13\" y=\"11\" width=\"2\" height=\"2\" rx=\"0.5\" transform=\"rotate(90 13 11)\" fill-opacity=\"0.3\"></rect><rect x=\"9\" y=\"3\" width=\"2\" height=\"2\" rx=\"0.5\" transform=\"rotate(90 9 3)\"></rect><rect x=\"9\" y=\"7\" width=\"2\" height=\"2\" rx=\"0.5\" transform=\"rotate(90 9 7)\"></rect><rect x=\"9\" y=\"11\" width=\"2\" height=\"2\" rx=\"0.5\" transform=\"rotate(90 9 11)\" fill-opacity=\"0.3\"></rect><rect x=\"5\" y=\"3\" width=\"2\" height=\"2\" rx=\"0.5\" transform=\"rotate(90 5 3)\"></rect><rect x=\"5\" y=\"7\" width=\"2\" height=\"2\" rx=\"0.5\" transform=\"rotate(90 5 7)\"></rect><rect x=\"5\" y=\"11\" width=\"2\" height=\"2\" rx=\"0.5\" transform=\"rotate(90 5 11)\" fill-opacity=\"0.3\"></rect>", 9)])]);
 	}
-	var Repeat_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$20, [["render", _sfc_render$20]]);
+	var Repeat_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$25, [["render", _sfc_render$25]]);
 	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/icons/background-repeat/RepeatX.vue
-	var _sfc_main$19 = {};
-	var _hoisted_1$22 = {
+	var _sfc_main$24 = {};
+	var _hoisted_1$27 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
-	function _sfc_render$19(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$22, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", {
-			d: "M796.444444 170.666667h-227.555555v682.666666h227.555555V170.666667z m-56.888888 625.777777h-113.777778V227.555556h113.777778v568.888888zM455.111111 170.666667H227.555556v682.666666h227.555555V170.666667zM398.222222 796.444444H284.444444V227.555556h113.777778v568.888888zM910.222222 56.888889h56.888889v910.222222h-56.888889zM56.888889 56.888889h56.888889v910.222222H56.888889z",
-			fill: "#333333"
-		}, null, -1)])]);
+	function _sfc_render$24(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$27, [..._cache[0] || (_cache[0] = [
+			(0, vue.createElementVNode)("rect", {
+				x: "3",
+				y: "3",
+				width: "2",
+				height: "10",
+				rx: "1"
+			}, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "7",
+				y: "3",
+				width: "2",
+				height: "10",
+				rx: "1"
+			}, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "11",
+				y: "3",
+				width: "2",
+				height: "10",
+				rx: "1",
+				"fill-opacity": "0.3"
+			}, null, -1)
+		])]);
 	}
-	var RepeatX_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$19, [["render", _sfc_render$19]]);
+	var RepeatX_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$24, [["render", _sfc_render$24]]);
 	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/icons/background-repeat/RepeatY.vue
-	var _sfc_main$18 = {};
-	var _hoisted_1$21 = {
+	var _sfc_main$23 = {};
+	var _hoisted_1$26 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
-	function _sfc_render$18(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$21, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", {
-			d: "M170.666667 227.555556v227.555555h682.666666V227.555556H170.666667z m625.777777 56.888888v113.777778H227.555556V284.444444h568.888888zM170.666667 568.888889v227.555555h682.666666v-227.555555H170.666667z m625.777777 56.888889v113.777778H227.555556v-113.777778h568.888888zM56.888889 56.888889h910.222222v56.888889H56.888889zM56.888889 910.222222h910.222222v56.888889H56.888889z",
-			fill: "#333333"
-		}, null, -1)])]);
+	function _sfc_render$23(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$26, [..._cache[0] || (_cache[0] = [
+			(0, vue.createElementVNode)("rect", {
+				x: "13",
+				y: "3",
+				width: "2",
+				height: "10",
+				rx: "1",
+				transform: "rotate(90 13 3)"
+			}, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "13",
+				y: "7",
+				width: "2",
+				height: "10",
+				rx: "1",
+				transform: "rotate(90 13 7)"
+			}, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "13",
+				y: "11",
+				width: "2",
+				height: "10",
+				rx: "1",
+				transform: "rotate(90 13 11)",
+				"fill-opacity": "0.3"
+			}, null, -1)
+		])]);
 	}
-	var RepeatY_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$18, [["render", _sfc_render$18]]);
+	var RepeatY_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$23, [["render", _sfc_render$23]]);
 	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/icons/background-repeat/NoRepeat.vue
-	var _sfc_main$17 = {};
-	var _hoisted_1$20 = {
+	var _sfc_main$22 = {};
+	var _hoisted_1$25 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "10",
+		height: "10",
+		viewBox: "0 0 10 10",
+		fill: "currentColor"
 	};
-	function _sfc_render$17(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$20, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", {
-			d: "M912.526651 867.741144 555.540144 510.712681l356.986507-357.000833c11.171434-11.18576 11.171434-29.257348 0-40.443108-11.20111-11.18576-29.272697-11.18576-40.444131 0L515.096013 470.267527 158.096203 113.267716c-11.187807-11.159154-29.258371-11.159154-40.444131 0-11.186783 11.186783-11.186783 29.286 0 40.47176L474.623229 510.712681 117.623419 867.741144c-11.159154 11.172457-11.159154 29.216415 0 40.443108 11.18576 11.17348 29.284977 11.17348 40.47176 0l357.000833-357.027439 356.985484 357.027439c11.171434 11.17348 29.243021 11.17348 40.444131 0C923.698085 896.957559 923.725714 878.913601 912.526651 867.741144z",
-			fill: "#5D5D5D"
-		}, null, -1)])]);
+	function _sfc_render$22(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$25, [..._cache[0] || (_cache[0] = [(0, vue.createStaticVNode)("<path d=\"M0 0.625C0 0.279822 0.248731 0 0.555556 0H9.44444C9.75127 0 10 0.279822 10 0.625C10 0.970178 9.75127 1.25 9.44444 1.25H0.555556C0.248731 1.25 0 0.970178 0 0.625Z\" fill-opacity=\"0.3\"></path><path d=\"M0 9.375C0 9.02982 0.248731 8.75 0.555556 8.75H9.44444C9.75127 8.75 10 9.02982 10 9.375C10 9.72018 9.75127 10 9.44444 10H0.555556C0.248731 10 0 9.72018 0 9.375Z\" fill-opacity=\"0.3\"></path><path d=\"M0.555556 4.375C0.248731 4.375 0 4.65482 0 5C0 5.34518 0.248731 5.625 0.555556 5.625H2.87307L3.42868 4.99994L2.87318 4.375H0.555556Z\" fill-opacity=\"0.3\"></path><path d=\"M9.44444 5.625H7.12699L6.57138 4.99994L7.12688 4.375H9.44444C9.75127 4.375 10 4.65482 10 5C10 5.34518 9.75127 5.625 9.44444 5.625Z\" fill-opacity=\"0.3\"></path><path transform=\"translate(0 2.6072)\" d=\"M3.30542 0.183058C3.52237 -0.0610194 3.87413 -0.0610194 4.09109 0.183058C4.30805 0.427136 4.30805 0.822864 4.09109 1.06694L2.91256 2.39279L4.0911 3.71865C4.30806 3.96273 4.30806 4.35846 4.0911 4.60253C3.87414 4.84661 3.52239 4.84661 3.30543 4.60253L2.12688 3.27667L0.948393 4.60248C0.731435 4.84655 0.379676 4.84655 0.162719 4.60248C-0.0542395 4.3584 -0.0542395 3.96267 0.162719 3.71859L1.34121 2.39279L0.162731 1.067C-0.0542269 0.822922 -0.0542268 0.427194 0.162731 0.183116C0.379689 -0.0609612 0.731447 -0.0609612 0.948405 0.183116L2.12688 1.50891L3.30542 0.183058Z\"></path>", 5)])]);
 	}
-	var NoRepeat_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$17, [["render", _sfc_render$17]]);
+	var NoRepeat_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$22, [["render", _sfc_render$22]]);
 	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/pro/Background.vue?vue&type=script&setup=true&lang.ts
 	var Background_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
@@ -22319,7 +22734,8 @@
 			lastValues: {},
 			isCompare: { type: Boolean },
 			disabled: { type: Boolean },
-			size: {}
+			size: {},
+			theme: {}
 		},
 		emits: ["change", "addDiffCount"],
 		setup(__props, { emit: __emit }) {
@@ -22343,7 +22759,7 @@
 					name: "backgroundSize",
 					text: "背景尺寸",
 					type: "radioGroup",
-					childType: "button",
+					childType: "default",
 					labelWidth: "68px",
 					options: [
 						{
@@ -22373,22 +22789,26 @@
 						{
 							value: "repeat",
 							icon: (0, vue.markRaw)(Repeat_default),
-							tooltip: "垂直和水平方向重复 repeat"
+							tooltip: "垂直和水平方向重复 repeat",
+							text: "垂直与水平重复"
 						},
 						{
 							value: "repeat-x",
 							icon: (0, vue.markRaw)(RepeatX_default),
-							tooltip: "水平方向重复 repeat-x"
+							tooltip: "水平方向重复 repeat-x",
+							text: "水平方向重复"
 						},
 						{
 							value: "repeat-y",
 							icon: (0, vue.markRaw)(RepeatY_default),
-							tooltip: "垂直方向重复 repeat-y"
+							tooltip: "垂直方向重复 repeat-y",
+							text: "垂直方向重复"
 						},
 						{
 							value: "no-repeat",
 							icon: (0, vue.markRaw)(NoRepeat_default),
-							tooltip: "不重复 no-repeat"
+							tooltip: "不重复 no-repeat",
+							text: "不重复"
 						}
 					]
 				},
@@ -22430,37 +22850,37 @@
 	var Background_default = Background_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/icons/text-align/Left.vue
-	var _sfc_main$16 = {};
-	var _hoisted_1$19 = {
+	var _sfc_main$21 = {};
+	var _hoisted_1$24 = {
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 1024 1024"
 	};
-	function _sfc_render$16(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$19, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M128 810.666667h768v85.333333H128z m0-170.666667h512v85.333333H128z m0-170.666667h768v85.333334H128z m0-341.333333h768v85.333333H128z m0 170.666667h512v85.333333H128z" }, null, -1)])]);
+	function _sfc_render$21(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$24, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M128 810.666667h768v85.333333H128z m0-170.666667h512v85.333333H128z m0-170.666667h768v85.333334H128z m0-341.333333h768v85.333333H128z m0 170.666667h512v85.333333H128z" }, null, -1)])]);
 	}
-	var Left_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$16, [["render", _sfc_render$16]]);
+	var Left_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$21, [["render", _sfc_render$21]]);
 	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/icons/text-align/Center.vue
-	var _sfc_main$15 = {};
-	var _hoisted_1$18 = {
+	var _sfc_main$20 = {};
+	var _hoisted_1$23 = {
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 1024 1024"
 	};
-	function _sfc_render$15(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$18, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M128 810.666667h768v85.333333H128z m128-170.666667h512v85.333333H256z m-128-170.666667h768v85.333334H128z m0-341.333333h768v85.333333H128z m128 170.666667h512v85.333333H256z" }, null, -1)])]);
+	function _sfc_render$20(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$23, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M128 810.666667h768v85.333333H128z m128-170.666667h512v85.333333H256z m-128-170.666667h768v85.333334H128z m0-341.333333h768v85.333333H128z m128 170.666667h512v85.333333H256z" }, null, -1)])]);
 	}
-	var Center_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$15, [["render", _sfc_render$15]]);
+	var Center_default$2 = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$20, [["render", _sfc_render$20]]);
 	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/icons/text-align/Right.vue
-	var _sfc_main$14 = {};
-	var _hoisted_1$17 = {
+	var _sfc_main$19 = {};
+	var _hoisted_1$22 = {
 		xmlns: "http://www.w3.org/2000/svg",
 		viewBox: "0 0 1024 1024"
 	};
-	function _sfc_render$14(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$17, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M128 128h768v85.333333H128z m0 682.666667h768v85.333333H128z m213.333333-170.666667h554.666667v85.333333H341.333333z m-213.333333-170.666667h768v85.333334H128z m213.333333-170.666666h554.666667v85.333333H341.333333z" }, null, -1)])]);
+	function _sfc_render$19(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$22, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M128 128h768v85.333333H128z m0 682.666667h768v85.333333H128z m213.333333-170.666667h554.666667v85.333333H341.333333z m-213.333333-170.666667h768v85.333334H128z m213.333333-170.666666h554.666667v85.333333H341.333333z" }, null, -1)])]);
 	}
-	var Right_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$14, [["render", _sfc_render$14]]);
+	var Right_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$19, [["render", _sfc_render$19]]);
 	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/pro/Font.vue?vue&type=script&setup=true&lang.ts
 	var Font_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
@@ -22522,17 +22942,20 @@
 						{
 							value: "left",
 							icon: (0, vue.markRaw)(Left_default),
-							tooltip: "左对齐 row"
+							tooltip: "左对齐 row",
+							text: "左对齐"
 						},
 						{
 							value: "center",
-							icon: (0, vue.markRaw)(Center_default$1),
-							tooltip: "居中对齐 center"
+							icon: (0, vue.markRaw)(Center_default$2),
+							tooltip: "居中对齐 center",
+							text: "居中对齐"
 						},
 						{
 							value: "right",
 							icon: (0, vue.markRaw)(Right_default),
-							tooltip: "右对齐 right"
+							tooltip: "右对齐 right",
+							text: "右对齐"
 						}
 					]
 				}
@@ -22567,7 +22990,7 @@
 	var Font_default = Font_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/components/Box.vue?vue&type=script&setup=true&lang.ts
-	var _hoisted_1$16 = { class: "layout-box-container" };
+	var _hoisted_1$21 = { class: "layout-box-container" };
 	var _hoisted_2$1 = {
 		key: 0,
 		class: "help-txt"
@@ -22631,7 +23054,7 @@
 				emit("change", event.target.value, { modifyKey: name });
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$16, [((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(list, (item, index) => {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$21, [((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(list, (item, index) => {
 					return (0, vue.createElementVNode)("div", {
 						key: index,
 						class: (0, vue.normalizeClass)(item.class)
@@ -22650,6 +23073,184 @@
 	//#region packages/editor/src/fields/StyleSetter/components/Box.vue
 	var Box_default = Box_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
+	//#region packages/editor/src/fields/StyleSetter/icons/align-items/Center.vue
+	var _sfc_main$18 = {};
+	var _hoisted_1$20 = {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
+	};
+	function _sfc_render$18(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$20, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M12 4C12.5523 4 13 4.44772 13 5V11C13 11.5523 12.5523 12 12 12H4C3.44772 12 3 11.5523 3 11V5C3 4.44772 3.44772 4 4 4H12ZM4.5 5C4.22386 5 4 5.22386 4 5.5V10.5C4 10.7761 4.22386 11 4.5 11H11.5C11.7761 11 12 10.7761 12 10.5V5.5C12 5.22386 11.7761 5 11.5 5H4.5Z" }, null, -1), (0, vue.createElementVNode)("rect", {
+			x: "13.75",
+			y: "7.75",
+			width: "0.5",
+			height: "11.5",
+			rx: "0.25",
+			transform: "rotate(90 13.75 7.75)",
+			stroke: "black",
+			"stroke-opacity": "0.3",
+			style: {
+				"stroke": "black",
+				"stroke-opacity": "0.3"
+			},
+			"stroke-width": "0.5"
+		}, null, -1)])]);
+	}
+	var Center_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$18, [["render", _sfc_render$18]]);
+	//#endregion
+	//#region packages/editor/src/fields/StyleSetter/icons/align-items/FlexEnd.vue
+	var _sfc_main$17 = {};
+	var _hoisted_1$19 = {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
+	};
+	function _sfc_render$17(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$19, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M12 3C12.5523 3 13 3.44772 13 4V10C13 10.5523 12.5523 11 12 11H4C3.44772 11 3 10.5523 3 10V4C3 3.44772 3.44772 3 4 3H12ZM4.5 4C4.22386 4 4 4.22386 4 4.5V9.5C4 9.77614 4.22386 10 4.5 10H11.5C11.7761 10 12 9.77614 12 9.5V4.5C12 4.22386 11.7761 4 11.5 4H4.5Z" }, null, -1), (0, vue.createElementVNode)("rect", {
+			x: "13.75",
+			y: "12.25",
+			width: "0.5",
+			height: "11.5",
+			rx: "0.25",
+			transform: "rotate(90 13.75 12.25)",
+			stroke: "black",
+			"stroke-opacity": "0.3",
+			style: {
+				"stroke": "black",
+				"stroke-opacity": "0.3"
+			},
+			"stroke-width": "0.5"
+		}, null, -1)])]);
+	}
+	var FlexEnd_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$17, [["render", _sfc_render$17]]);
+	//#endregion
+	//#region packages/editor/src/fields/StyleSetter/icons/align-items/FlexStart.vue
+	var _sfc_main$16 = {};
+	var _hoisted_1$18 = {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
+	};
+	function _sfc_render$16(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$18, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M12 5C12.5523 5 13 5.44772 13 6V12C13 12.5523 12.5523 13 12 13H4C3.44772 13 3 12.5523 3 12V6C3 5.44772 3.44772 5 4 5H12ZM4.5 6C4.22386 6 4 6.22386 4 6.5V11.5C4 11.7761 4.22386 12 4.5 12H11.5C11.7761 12 12 11.7761 12 11.5V6.5C12 6.22386 11.7761 6 11.5 6H4.5Z" }, null, -1), (0, vue.createElementVNode)("rect", {
+			x: "13.75",
+			y: "3.25",
+			width: "0.5",
+			height: "11.5",
+			rx: "0.25",
+			transform: "rotate(90 13.75 3.25)",
+			stroke: "white",
+			"stroke-opacity": "0.3",
+			style: {
+				"stroke": "white",
+				"stroke-opacity": "0.3"
+			},
+			"stroke-width": "0.5"
+		}, null, -1)])]);
+	}
+	var FlexStart_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$16, [["render", _sfc_render$16]]);
+	//#endregion
+	//#region packages/editor/src/fields/StyleSetter/icons/align-items/SpaceAround.vue
+	var _sfc_main$15 = {};
+	var _hoisted_1$17 = {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
+	};
+	function _sfc_render$15(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$17, [..._cache[0] || (_cache[0] = [
+			(0, vue.createElementVNode)("path", { d: "M12 8C12.5523 8 13 8.44772 13 9V12C13 12.5523 12.5523 13 12 13H4C3.44772 13 3 12.5523 3 12V9C3 8.44772 3.44772 8 4 8H12ZM4.5 9C4.22386 9 4 9.22386 4 9.5V11.5C4 11.7761 4.22386 12 4.5 12H11.5C11.7761 12 12 11.7761 12 11.5V9.5C12 9.22386 11.7761 9 11.5 9H4.5Z" }, null, -1),
+			(0, vue.createElementVNode)("path", { d: "M12 2C12.5523 2 13 2.44772 13 3V6C13 6.55228 12.5523 7 12 7H4C3.44772 7 3 6.55228 3 6V3C3 2.44772 3.44772 2 4 2H12ZM4.5 3C4.22386 3 4 3.22386 4 3.5V5.5C4 5.77614 4.22386 6 4.5 6H11.5C11.7761 6 12 5.77614 12 5.5V3.5C12 3.22386 11.7761 3 11.5 3H4.5Z" }, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "13.75",
+				y: "10.25",
+				width: "0.5",
+				height: "11.5",
+				rx: "0.25",
+				transform: "rotate(90 13.75 10.25)",
+				stroke: "black",
+				"stroke-opacity": "0.3",
+				style: {
+					"stroke": "black",
+					"stroke-opacity": "0.3"
+				},
+				"stroke-width": "0.5"
+			}, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "13.75",
+				y: "4.25",
+				width: "0.5",
+				height: "11.5",
+				rx: "0.25",
+				transform: "rotate(90 13.75 4.25)",
+				stroke: "black",
+				"stroke-opacity": "0.3",
+				style: {
+					"stroke": "black",
+					"stroke-opacity": "0.3"
+				},
+				"stroke-width": "0.5"
+			}, null, -1)
+		])]);
+	}
+	var SpaceAround_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$15, [["render", _sfc_render$15]]);
+	//#endregion
+	//#region packages/editor/src/fields/StyleSetter/icons/align-items/SpaceBetween.vue
+	var _sfc_main$14 = {};
+	var _hoisted_1$16 = {
+		xmlns: "http://www.w3.org/2000/svg",
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
+	};
+	function _sfc_render$14(_ctx, _cache) {
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$16, [..._cache[0] || (_cache[0] = [
+			(0, vue.createElementVNode)("path", { d: "M12 9C12.5523 9 13 9.44772 13 10V12C13 12.5523 12.5523 13 12 13H4C3.44772 13 3 12.5523 3 12V10C3 9.44772 3.44772 9 4 9H12ZM4.5 10C4.22386 10 4 10.2239 4 10.5V11.5C4 11.7761 4.22386 12 4.5 12H11.5C11.7761 12 12 11.7761 12 11.5V10.5C12 10.2239 11.7761 10 11.5 10H4.5Z" }, null, -1),
+			(0, vue.createElementVNode)("path", { d: "M12 3C12.5523 3 13 3.44772 13 4V6C13 6.55228 12.5523 7 12 7H4C3.44772 7 3 6.55228 3 6V4C3 3.44772 3.44772 3 4 3H12ZM4.5 4C4.22386 4 4 4.22386 4 4.5V5.5C4 5.77614 4.22386 6 4.5 6H11.5C11.7761 6 12 5.77614 12 5.5V4.5C12 4.22386 11.7761 4 11.5 4H4.5Z" }, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "13.75",
+				y: "14.25",
+				width: "0.5",
+				height: "11.5",
+				rx: "0.25",
+				transform: "rotate(90 13.75 14.25)",
+				stroke: "black",
+				"stroke-opacity": "0.3",
+				style: {
+					"stroke": "black",
+					"stroke-opacity": "0.3"
+				},
+				"stroke-width": "0.5"
+			}, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "13.75",
+				y: "1.25",
+				width: "0.5",
+				height: "11.5",
+				rx: "0.25",
+				transform: "rotate(90 13.75 1.25)",
+				stroke: "black",
+				"stroke-opacity": "0.3",
+				style: {
+					"stroke": "black",
+					"stroke-opacity": "0.3"
+				},
+				"stroke-width": "0.5"
+			}, null, -1)
+		])]);
+	}
+	var SpaceBetween_default$1 = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$14, [["render", _sfc_render$14]]);
+	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/icons/display/Block.vue
 	var _sfc_main$13 = {};
 	var _hoisted_1$15 = {
@@ -22709,10 +23310,18 @@
 	var _sfc_main$8 = {};
 	var _hoisted_1$10 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
 	function _sfc_render$8(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$10, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M896 320H128V0h768v320z m0 320H128v-256h768v256z m-128 192l-256 192-256-192 192-0.032V704h128v128h192z" }, null, -1)])]);
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$10, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M12 3C12.5523 3 13 3.44772 13 4V10C13 10.5523 12.5523 11 12 11H4C3.44772 11 3 10.5523 3 10V4C3 3.44772 3.44772 3 4 3H12ZM4.5 4C4.22386 4 4 4.22386 4 4.5V9.5C4 9.77614 4.22386 10 4.5 10H11.5C11.7761 10 12 9.77614 12 9.5V4.5C12 4.22386 11.7761 4 11.5 4H4.5Z" }, null, -1), (0, vue.createElementVNode)("path", {
+			"fill-rule": "evenodd",
+			"clip-rule": "evenodd",
+			d: "M11 12L8 15L5 12L11 12Z",
+			"fill-opacity": "0.3"
+		}, null, -1)])]);
 	}
 	var Column_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$8, [["render", _sfc_render$8]]);
 	//#endregion
@@ -22720,10 +23329,18 @@
 	var _sfc_main$7 = {};
 	var _hoisted_1$9 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
 	function _sfc_render$7(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$9, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M896 704H128v320h768V704z m0-320H128v256h768v-256z m-128-192l-256-192-256 192 192 0.032V320h128V192h192z" }, null, -1)])]);
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$9, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M12 5C12.5523 5 13 5.44772 13 6V12C13 12.5523 12.5523 13 12 13H4C3.44772 13 3 12.5523 3 12V6C3 5.44772 3.44772 5 4 5H12ZM4.5 6C4.22386 6 4 6.22386 4 6.5V11.5C4 11.7761 4.22386 12 4.5 12H11.5C11.7761 12 12 11.7761 12 11.5V6.5C12 6.22386 11.7761 6 11.5 6H4.5Z" }, null, -1), (0, vue.createElementVNode)("path", {
+			"fill-rule": "evenodd",
+			"clip-rule": "evenodd",
+			d: "M5 4L8 1L11 4L5 4Z",
+			"fill-opacity": "0.3"
+		}, null, -1)])]);
 	}
 	var ColumnReverse_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$7, [["render", _sfc_render$7]]);
 	//#endregion
@@ -22731,10 +23348,18 @@
 	var _sfc_main$6 = {};
 	var _hoisted_1$8 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
 	function _sfc_render$6(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$8, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M320 128v768H0V128h320z m320 0v768h-256V128h256z m192 128l192 256-192 256-0.032-192H704v-128h128V256z" }, null, -1)])]);
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$8, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M10 4C10.5523 4 11 4.44772 11 5V11C11 11.5523 10.5523 12 10 12H2C1.44772 12 1 11.5523 1 11V5C1 4.44772 1.44772 4 2 4H10ZM2.5 5C2.22386 5 2 5.22386 2 5.5V10.5C2 10.7761 2.22386 11 2.5 11H9.5C9.77614 11 10 10.7761 10 10.5V5.5C10 5.22386 9.77614 5 9.5 5H2.5Z" }, null, -1), (0, vue.createElementVNode)("path", {
+			"fill-rule": "evenodd",
+			"clip-rule": "evenodd",
+			d: "M12 5L15 8L12 11L12 5Z",
+			"fill-opacity": "0.3"
+		}, null, -1)])]);
 	}
 	var Row_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$6, [["render", _sfc_render$6]]);
 	//#endregion
@@ -22742,10 +23367,18 @@
 	var _sfc_main$5 = {};
 	var _hoisted_1$7 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
 	function _sfc_render$5(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$7, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M704 128v768h320V128H704zM384 128v768h256V128h-256zM192 256l-192 256 192 256 0.032-192H320v-128H192V256z" }, null, -1)])]);
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$7, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M14 4C14.5523 4 15 4.44772 15 5V11C15 11.5523 14.5523 12 14 12H6C5.44772 12 5 11.5523 5 11V5C5 4.44772 5.44772 4 6 4H14ZM6.5 5C6.22386 5 6 5.22386 6 5.5V10.5C6 10.7761 6.22386 11 6.5 11H13.5C13.7761 11 14 10.7761 14 10.5V5.5C14 5.22386 13.7761 5 13.5 5H6.5Z" }, null, -1), (0, vue.createElementVNode)("path", {
+			"fill-rule": "evenodd",
+			"clip-rule": "evenodd",
+			d: "M4 11L1 8L4 5L4 11Z",
+			"fill-opacity": "0.3"
+		}, null, -1)])]);
 	}
 	var RowReverse_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$5, [["render", _sfc_render$5]]);
 	//#endregion
@@ -22753,10 +23386,24 @@
 	var _sfc_main$4 = {};
 	var _hoisted_1$6 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
 	function _sfc_render$4(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$6, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M480 1024V0h64v1024h-64z m128-64V64h320v896H608zM96 960V64h320v896H96z" }, null, -1)])]);
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$6, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M13 4C13.5523 4 14 4.44772 14 5V11C14 11.5523 13.5523 12 13 12H3C2.44772 12 2 11.5523 2 11V5C2 4.44772 2.44772 4 3 4H13ZM3.59082 5C3.31472 5.00005 3.09082 5.22389 3.09082 5.5V10.5C3.09082 10.7761 3.31472 11 3.59082 11H12.4092C12.6853 11 12.9092 10.7761 12.9092 10.5V5.5C12.9092 5.22389 12.6853 5.00005 12.4092 5H3.59082Z" }, null, -1), (0, vue.createElementVNode)("rect", {
+			x: "7.5",
+			y: "2",
+			width: "1",
+			height: "12",
+			rx: "0.5",
+			"fill-opacity": "0.3",
+			style: {
+				"fill": "black",
+				"fill-opacity": "0.3"
+			}
+		}, null, -1)])]);
 	}
 	var Center_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$4, [["render", _sfc_render$4]]);
 	//#endregion
@@ -22764,10 +23411,26 @@
 	var _sfc_main$3 = {};
 	var _hoisted_1$5 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
 	function _sfc_render$3(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$5, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M416 160H96v704h320V160z m384 0H480v704h320V160z m128-160h-64v1024h64V0z" }, null, -1)])]);
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$5, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M11 4C11.5523 4 12 4.44772 12 5V11C12 11.5523 11.5523 12 11 12H2C1.44772 12 1 11.5523 1 11V5C1 4.44772 1.44772 4 2 4H11ZM2.5 5C2.22386 5 2 5.22386 2 5.5V10.5C2 10.7761 2.22386 11 2.5 11H10.5C10.7761 11 11 10.7761 11 10.5V5.5C11 5.22386 10.7761 5 10.5 5H2.5Z" }, null, -1), (0, vue.createElementVNode)("rect", {
+			x: "14.25",
+			y: "2.25",
+			width: "0.5",
+			height: "11.5",
+			rx: "0.25",
+			stroke: "black",
+			"stroke-opacity": "0.3",
+			style: {
+				"stroke": "black",
+				"stroke-opacity": "0.3"
+			},
+			"stroke-width": "0.5"
+		}, null, -1)])]);
 	}
 	var FlexEnd_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$3, [["render", _sfc_render$3]]);
 	//#endregion
@@ -22775,10 +23438,26 @@
 	var _sfc_main$2 = {};
 	var _hoisted_1$4 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
 	function _sfc_render$2(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$4, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M608 160h320v704H608V160zM224 160h320v704H224V160zM96 0h64v1024H96V0z" }, null, -1)])]);
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$4, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M14 4C14.5523 4 15 4.44772 15 5V11C15 11.5523 14.5523 12 14 12H5C4.44772 12 4 11.5523 4 11V5C4 4.44772 4.44772 4 5 4H14ZM5.5 5C5.22386 5 5 5.22386 5 5.5V10.5C5 10.7761 5.22386 11 5.5 11H13.5C13.7761 11 14 10.7761 14 10.5V5.5C14 5.22386 13.7761 5 13.5 5H5.5Z" }, null, -1), (0, vue.createElementVNode)("rect", {
+			x: "1.25",
+			y: "2.25",
+			width: "0.5",
+			height: "11.5",
+			rx: "0.25",
+			stroke: "white",
+			"stroke-opacity": "0.3",
+			style: {
+				"stroke": "white",
+				"stroke-opacity": "0.3"
+			},
+			"stroke-width": "0.5"
+		}, null, -1)])]);
 	}
 	var FlexStart_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$2, [["render", _sfc_render$2]]);
 	//#endregion
@@ -22786,10 +23465,44 @@
 	var _sfc_main$1 = {};
 	var _hoisted_1$3 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
 	function _sfc_render$1(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$3, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M320 864H192v160H128v-160H0V160h128V0h64v160h128v704z m704 0h-128v160h-64v-160h-128V160h128V0h64v160h128v704z" }, null, -1)])]);
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$3, [..._cache[0] || (_cache[0] = [
+			(0, vue.createElementVNode)("path", { d: "M6 4C6.55228 4 7 4.44772 7 5V11C7 11.5523 6.55228 12 6 12H3C2.44772 12 2 11.5523 2 11V5C2 4.44772 2.44772 4 3 4H6ZM3.5 5C3.22386 5 3 5.22386 3 5.5V10.5C3 10.7761 3.22386 11 3.5 11H5.5C5.77614 11 6 10.7761 6 10.5V5.5C6 5.22386 5.77614 5 5.5 5H3.5Z" }, null, -1),
+			(0, vue.createElementVNode)("path", { d: "M13 4C13.5523 4 14 4.44772 14 5V11C14 11.5523 13.5523 12 13 12H10C9.44772 12 9 11.5523 9 11V5C9 4.44772 9.44772 4 10 4H13ZM10.5 5C10.2239 5 10 5.22386 10 5.5V10.5C10 10.7761 10.2239 11 10.5 11H12.5C12.7761 11 13 10.7761 13 10.5V5.5C13 5.22386 12.7761 5 12.5 5H10.5Z" }, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "11.25",
+				y: "2.25",
+				width: "0.5",
+				height: "11.5",
+				rx: "0.25",
+				stroke: "black",
+				"stroke-opacity": "0.3",
+				style: {
+					"stroke": "black",
+					"stroke-opacity": "0.3"
+				},
+				"stroke-width": "0.5"
+			}, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "4.25",
+				y: "2.25",
+				width: "0.5",
+				height: "11.5",
+				rx: "0.25",
+				stroke: "black",
+				"stroke-opacity": "0.3",
+				style: {
+					"stroke": "black",
+					"stroke-opacity": "0.3"
+				},
+				"stroke-width": "0.5"
+			}, null, -1)
+		])]);
 	}
 	var SpaceAround_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main$1, [["render", _sfc_render$1]]);
 	//#endregion
@@ -22797,10 +23510,40 @@
 	var _sfc_main = {};
 	var _hoisted_1$2 = {
 		xmlns: "http://www.w3.org/2000/svg",
-		viewBox: "0 0 1024 1024"
+		width: "16",
+		height: "16",
+		viewBox: "0 0 16 16",
+		fill: "currentColor"
 	};
 	function _sfc_render(_ctx, _cache) {
-		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$2, [..._cache[0] || (_cache[0] = [(0, vue.createElementVNode)("path", { d: "M64 1024H0V0h64v1024z m384-160H128V160h320v704z m448 0H576V160h320v704z m128 160h-64V0h64v1024z" }, null, -1)])]);
+		return (0, vue.openBlock)(), (0, vue.createElementBlock)("svg", _hoisted_1$2, [..._cache[0] || (_cache[0] = [
+			(0, vue.createElementVNode)("path", { d: "M6 4C6.55228 4 7 4.44772 7 5V11C7 11.5523 6.55228 12 6 12H4C3.44772 12 3 11.5523 3 11V5C3 4.44772 3.44772 4 4 4H6ZM4.5 5C4.22386 5 4 5.22386 4 5.5V10.5C4 10.7761 4.22386 11 4.5 11H5.5C5.77614 11 6 10.7761 6 10.5V5.5C6 5.22386 5.77614 5 5.5 5H4.5Z" }, null, -1),
+			(0, vue.createElementVNode)("path", { d: "M12 4C12.5523 4 13 4.44772 13 5V11C13 11.5523 12.5523 12 12 12H10C9.44772 12 9 11.5523 9 11V5C9 4.44772 9.44772 4 10 4H12ZM10.5 5C10.2239 5 10 5.22386 10 5.5V10.5C10 10.7761 10.2239 11 10.5 11H11.5C11.7761 11 12 10.7761 12 10.5V5.5C12 5.22386 11.7761 5 11.5 5H10.5Z" }, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "14.25",
+				y: "2.25",
+				width: "0.5",
+				height: "11.5",
+				rx: "0.25",
+				stroke: "black",
+				"stroke-opacity": "0.3",
+				"stroke-width": "0.5"
+			}, null, -1),
+			(0, vue.createElementVNode)("rect", {
+				x: "1.25",
+				y: "2.25",
+				width: "0.5",
+				height: "11.5",
+				rx: "0.25",
+				stroke: "black",
+				"stroke-opacity": "0.3",
+				style: {
+					"stroke": "black",
+					"stroke-opacity": "0.3"
+				},
+				"stroke-width": "0.5"
+			}, null, -1)
+		])]);
 	}
 	var SpaceBetween_default = /* @__PURE__ */ _plugin_vue_export_helper_default(_sfc_main, [["render", _sfc_render]]);
 	//#endregion
@@ -22812,43 +23555,51 @@
 			lastValues: {},
 			isCompare: { type: Boolean },
 			disabled: { type: Boolean },
-			size: {}
+			size: {},
+			theme: {}
 		},
 		emits: ["change", "addDiffCount"],
 		setup(__props, { emit: __emit }) {
+			const props = __props;
 			const emit = __emit;
+			const displayTheme = (0, _tmagic_design.useTheme)(props);
 			const config = (0, _tmagic_form.defineFormItem)({ items: [
 				{
 					name: "display",
 					text: "模式",
 					type: "radioGroup",
-					childType: "button",
+					childType: displayTheme.value !== "magic-admin" ? "button" : "default",
 					labelWidth: "68px",
 					options: [
 						{
 							value: "inline",
-							icon: (0, vue.markRaw)(Inline_default),
-							tooltip: "内联布局 inline"
+							icon: displayTheme.value !== "magic-admin" ? (0, vue.markRaw)(Inline_default) : void 0,
+							tooltip: "内联布局 inline",
+							text: "内联布局\n inline"
 						},
 						{
 							value: "flex",
-							icon: (0, vue.markRaw)(Flex_default),
-							tooltip: "弹性布局 flex"
+							icon: displayTheme.value !== "magic-admin" ? (0, vue.markRaw)(Flex_default) : void 0,
+							tooltip: "弹性布局 flex",
+							text: "弹性布局\n flex"
 						},
 						{
 							value: "block",
-							icon: (0, vue.markRaw)(Block_default),
-							tooltip: "块级布局 block"
+							icon: displayTheme.value !== "magic-admin" ? (0, vue.markRaw)(Block_default) : void 0,
+							tooltip: "块级布局 block",
+							text: "块级布局\n block"
 						},
 						{
 							value: "inline-block",
-							icon: (0, vue.markRaw)(InlineBlock_default),
-							tooltip: "内联块布局 inline-block"
+							icon: displayTheme.value !== "magic-admin" ? (0, vue.markRaw)(InlineBlock_default) : void 0,
+							tooltip: "内联块布局 inline-block",
+							text: "内联块布局\n inline-block"
 						},
 						{
 							value: "none",
-							icon: (0, vue.markRaw)(None_default),
-							tooltip: "隐藏 none"
+							icon: displayTheme.value !== "magic-admin" ? (0, vue.markRaw)(None_default) : void 0,
+							tooltip: "隐藏 none",
+							text: "隐藏\n none"
 						}
 					]
 				},
@@ -22862,22 +23613,26 @@
 						{
 							value: "row",
 							icon: (0, vue.markRaw)(Row_default),
-							tooltip: "水平方向 起点在左侧 row"
+							tooltip: "水平方向 起点在左侧 row",
+							text: "左起点"
 						},
 						{
 							value: "row-reverse",
 							icon: (0, vue.markRaw)(RowReverse_default),
-							tooltip: "水平方向 起点在右侧 row-reverse"
+							tooltip: "水平方向 起点在右侧 row-reverse",
+							text: "右起点"
 						},
 						{
 							value: "column",
 							icon: (0, vue.markRaw)(Column_default),
-							tooltip: "垂直方向 起点在上沿 column"
+							tooltip: "垂直方向 起点在上沿 column",
+							text: "顶部起点"
 						},
 						{
 							value: "column-reverse",
 							icon: (0, vue.markRaw)(ColumnReverse_default),
-							tooltip: "垂直方向 起点在下沿 column-reverse"
+							tooltip: "垂直方向 起点在下沿 column-reverse",
+							text: "底部起点"
 						}
 					],
 					display: (_mForm, { model }) => model.display === "flex"
@@ -22892,27 +23647,32 @@
 						{
 							value: "flex-start",
 							icon: (0, vue.markRaw)(FlexStart_default),
-							tooltip: "左对齐 flex-start"
+							tooltip: "左对齐 flex-start",
+							text: "左对齐"
 						},
 						{
 							value: "flex-end",
 							icon: (0, vue.markRaw)(FlexEnd_default),
-							tooltip: "右对齐 flex-end"
+							tooltip: "右对齐 flex-end",
+							text: "右对齐"
 						},
 						{
 							value: "center",
 							icon: (0, vue.markRaw)(Center_default),
-							tooltip: "居中 center"
+							tooltip: "居中 center",
+							text: "居中"
 						},
 						{
 							value: "space-between",
 							icon: (0, vue.markRaw)(SpaceBetween_default),
-							tooltip: "两端对齐 space-between"
+							tooltip: "两端对齐 space-between",
+							text: "左右对齐"
 						},
 						{
 							value: "space-around",
 							icon: (0, vue.markRaw)(SpaceAround_default),
-							tooltip: "横向平分 space-around"
+							tooltip: "横向平分 space-around",
+							text: "横向等分"
 						}
 					],
 					display: (_mForm, { model }) => model.display === "flex"
@@ -22926,28 +23686,33 @@
 					options: [
 						{
 							value: "flex-start",
-							icon: (0, vue.markRaw)(FlexStart_default),
-							tooltip: "左对齐 flex-start"
+							icon: (0, vue.markRaw)(FlexStart_default$1),
+							tooltip: "左对齐 flex-start",
+							text: "上对齐"
 						},
 						{
 							value: "flex-end",
-							icon: (0, vue.markRaw)(FlexEnd_default),
-							tooltip: "右对齐 flex-end"
+							icon: (0, vue.markRaw)(FlexEnd_default$1),
+							tooltip: "右对齐 flex-end",
+							text: "下对齐"
 						},
 						{
 							value: "center",
-							icon: (0, vue.markRaw)(Center_default),
-							tooltip: "居中 center"
+							icon: (0, vue.markRaw)(Center_default$1),
+							tooltip: "居中 center",
+							text: "居中"
 						},
 						{
 							value: "space-between",
-							icon: (0, vue.markRaw)(SpaceBetween_default),
-							tooltip: "两端对齐 space-between"
+							icon: (0, vue.markRaw)(SpaceBetween_default$1),
+							tooltip: "两端对齐 space-between",
+							text: "上下对齐"
 						},
 						{
 							value: "space-around",
-							icon: (0, vue.markRaw)(SpaceAround_default),
-							tooltip: "横向平分 space-around"
+							icon: (0, vue.markRaw)(SpaceAround_default$1),
+							tooltip: "横向平分 space-around",
+							text: "纵向等分"
 						}
 					],
 					display: (_mForm, { model }) => model.display === "flex"
@@ -22956,7 +23721,7 @@
 					name: "flexWrap",
 					text: "换行",
 					type: "radioGroup",
-					childType: "button",
+					childType: displayTheme.value !== "magic-admin" ? "button" : "default",
 					labelWidth: "68px",
 					options: [
 						{
@@ -22981,14 +23746,18 @@
 					type: "row",
 					items: [{
 						name: "width",
-						text: "宽度",
-						labelWidth: "68px",
+						text: "宽度（px）",
+						labelWidth: "90px",
 						type: "data-source-field-select",
 						fieldConfig: { type: "text" }
-					}, {
+					}]
+				},
+				{
+					type: "row",
+					items: [{
 						name: "height",
-						text: "高度",
-						labelWidth: "68px",
+						text: "高度（px）",
+						labelWidth: "90px",
 						type: "data-source-field-select",
 						fieldConfig: { type: "text" }
 					}]
@@ -22999,7 +23768,7 @@
 						type: "data-source-field-select",
 						text: "overflow",
 						name: "overflow",
-						labelWidth: "68px",
+						labelWidth: "90px",
 						checkStrictly: false,
 						dataSourceFieldType: ["string"],
 						fieldConfig: {
@@ -23037,11 +23806,15 @@
 								}
 							]
 						}
-					}, {
+					}]
+				},
+				{
+					type: "row",
+					items: [{
 						type: "data-source-field-select",
-						text: "透明度",
+						text: "透明度（%）",
 						name: "opacity",
-						labelWidth: "68px",
+						labelWidth: "90px",
 						dataSourceFieldType: ["string", "number"],
 						fieldConfig: { type: "text" }
 					}]
@@ -23278,7 +24051,7 @@
 							onClick: _cache[1] || (_cache[1] = ($event) => selectDirection("Left"))
 						}, null, 2),
 						(0, vue.createElementVNode)("div", {
-							class: (0, vue.normalizeClass)(["border-icon", {
+							class: (0, vue.normalizeClass)(["border-icon center", {
 								active: direction.value === "",
 								configured: isConfigured("")
 							}]),
@@ -23449,7 +24222,6 @@
 	var Transform_default = Transform_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/fields/StyleSetter/Index.vue?vue&type=script&setup=true&lang.ts
-	init_Icon();
 	var Index_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		name: "MFieldsStyleSetter",
 		__name: "Index",
@@ -23463,7 +24235,10 @@
 			disabled: { type: Boolean },
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change", "addDiffCount"],
 		setup(__props, { emit: __emit }) {
@@ -23516,7 +24291,7 @@
 							key: index,
 							name: `${index}`
 						}, {
-							title: (0, vue.withCtx)(() => [(0, vue.createVNode)(Icon_default, { icon: (0, vue.unref)(_element_plus_icons_vue.Grid) }, null, 8, ["icon"]), (0, vue.createTextVNode)((0, vue.toDisplayString)(item.title), 1)]),
+							title: (0, vue.withCtx)(() => [(0, vue.createTextVNode)((0, vue.toDisplayString)(item.title), 1)]),
 							default: (0, vue.withCtx)(() => [item.component ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(item.component), {
 								key: 0,
 								values: __props.model[__props.name],
@@ -23563,7 +24338,10 @@
 			},
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -23632,7 +24410,10 @@
 			disabled: { type: Boolean },
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -23704,7 +24485,10 @@
 			disabled: { type: Boolean },
 			size: {},
 			lastValues: {},
-			isCompare: { type: Boolean }
+			isCompare: { type: Boolean },
+			text: {},
+			labelWidth: {},
+			labelPosition: {}
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
@@ -23993,9 +24777,9 @@
 			return _tmagic_design.default;
 		}
 	});
+	exports.detectPageTargetId = detectPageTargetId;
+	exports.detectPageTargetName = detectPageTargetName;
 	exports.detectStackOpType = detectStackOpType;
-	exports.detectTargetId = detectTargetId;
-	exports.detectTargetName = detectTargetName;
 	exports.displayTabConfig = displayTabConfig;
 	exports.editorNodeMergeCustomizer = editorNodeMergeCustomizer;
 	exports.editorService = editor_default;
@@ -24043,7 +24827,8 @@
 	exports.loadMonaco = monaco_editor_default;
 	exports.log = log;
 	exports.markStackSaved = markStackSaved;
-	exports.mergeSteps = mergeSteps;
+	exports.mergePageSteps = mergePageSteps;
+	exports.mergeStackSteps = mergeStackSteps;
 	exports.moveItemsInContainer = moveItemsInContainer;
 	exports.numberOptions = numberOptions;
 	exports.openIndexedDB = openIndexedDB;