@tmagic/editor 1.8.0-beta.23 → 1.8.0-beta.24

package/dist/tmagic-editor.umd.cjs

@@ -5181,311 +5181,10 @@
 		};
 	}));
 	//#endregion
-	//#region packages/editor/src/utils/props.ts
-	var arrayOptions, eqOptions, numberOptions, booleanOptions, getCondOpOptionsByFieldType, styleTabConfig, eventTabConfig, advancedTabConfig, displayTabConfig, fillConfig, removeStyleDisplayConfig;
-	var init_props = __esmMin((() => {
-		arrayOptions = [{
-			text: "包含",
-			value: "include"
-		}, {
-			text: "不包含",
-			value: "not_include"
-		}];
-		eqOptions = [{
-			text: "等于",
-			value: "="
-		}, {
-			text: "不等于",
-			value: "!="
-		}];
-		numberOptions = [
-			{
-				text: "大于",
-				value: ">"
-			},
-			{
-				text: "大于等于",
-				value: ">="
-			},
-			{
-				text: "小于",
-				value: "<"
-			},
-			{
-				text: "小于等于",
-				value: "<="
-			},
-			{
-				text: "在范围内",
-				value: "between"
-			},
-			{
-				text: "不在范围内",
-				value: "not_between"
-			}
-		];
-		booleanOptions = [{
-			text: "是",
-			value: "is"
-		}, {
-			text: "不是",
-			value: "not"
-		}];
-		getCondOpOptionsByFieldType = (type) => {
-			if (type === "array") return arrayOptions;
-			if (type === "boolean" || type === "null") return booleanOptions;
-			if (type === "number") return [...eqOptions, ...numberOptions];
-			if (type === "string") return [...arrayOptions, ...eqOptions];
-			return [
-				...arrayOptions,
-				...eqOptions,
-				...numberOptions
-			];
-		};
-		styleTabConfig = {
-			title: "样式",
-			lazy: true,
-			display: ({ services }) => !(services?.uiService?.get("showStylePanel") ?? true),
-			items: [{
-				name: "style",
-				labelWidth: "100px",
-				type: "style-setter",
-				items: [{ names: [
-					"display",
-					"flexDirection",
-					"justifyContent",
-					"alignItems",
-					"flexWrap",
-					"marginTop",
-					"marginRight",
-					"marginBottom",
-					"marginLeft",
-					"paddingTop",
-					"paddingRight",
-					"paddingBottom",
-					"paddingLeft",
-					"width",
-					"height",
-					"overflow",
-					"fontSize",
-					"lineHeight",
-					"fontWeight",
-					"color",
-					"textAlign",
-					"backgroundColor",
-					"backgroundImage",
-					"backgroundSize",
-					"backgroundPosition",
-					"backgroundRepeat",
-					"position",
-					"zIndex",
-					"top",
-					"right",
-					"bottom",
-					"left",
-					"borderRadius",
-					"borderTopWidth",
-					"borderTopStyle",
-					"borderTopColor",
-					"borderRightColor",
-					"borderRightWidth",
-					"borderRightStyle",
-					"borderRightColor",
-					"borderBottomWidth",
-					"borderBottomStyle",
-					"borderBottomColor",
-					"borderLeftStyle",
-					"borderLeftWidth",
-					"borderLeftColor",
-					"borderWidth",
-					"borderStyle",
-					"borderColor",
-					"opacity"
-				] }, {
-					name: "transform",
-					defaultValue: () => ({})
-				}]
-			}]
-		};
-		eventTabConfig = {
-			title: "事件",
-			lazy: true,
-			items: [{
-				name: "events",
-				src: "component",
-				labelWidth: "100px",
-				type: "event-select",
-				rules: [{ typeMatch: true }]
-			}]
-		};
-		advancedTabConfig = {
-			title: "高级",
-			lazy: true,
-			items: [
-				{
-					name: _tmagic_core.NODE_DISABLE_CODE_BLOCK_KEY,
-					text: "禁用代码块",
-					type: "switch",
-					labelPosition: "left",
-					defaultValue: false,
-					extra: "开启后，配置的代码块将不会被执行"
-				},
-				{
-					name: _tmagic_core.NODE_DISABLE_DATA_SOURCE_KEY,
-					text: "禁用数据源",
-					type: "switch",
-					labelPosition: "left",
-					defaultValue: false,
-					extra: "开启后，组件内配置的数据源相关配置将不会被编译，显隐条件将失效"
-				},
-				{
-					name: "created",
-					text: "Created",
-					labelPosition: "top",
-					type: "code-select",
-					titleExtra: "组件初始化时执行",
-					rules: [{
-						typeMatch: true,
-						trigger: "change"
-					}, { validator: ({ value, callback }) => {
-						if (value && value.hookType !== _tmagic_core.HookType.CODE) return callback("hookType 必须是 code");
-						callback();
-					} }]
-				},
-				{
-					name: "mounted",
-					text: "Mounted",
-					labelPosition: "top",
-					type: "code-select",
-					titleExtra: "组件挂载到dom时执行",
-					rules: [{
-						typeMatch: true,
-						trigger: "change"
-					}, { validator: ({ value, callback }) => {
-						if (value && value.hookType !== _tmagic_core.HookType.CODE) return callback("hookType 必须是 code");
-						callback();
-					} }]
-				},
-				{
-					name: "display",
-					text: "Display",
-					titleExtra: "控制组件是否渲染，关系的代码块返回值为false时不渲染",
-					labelPosition: "top",
-					type: "code-select",
-					rules: [{
-						typeMatch: true,
-						trigger: "change"
-					}, { validator: ({ value, callback }) => {
-						if (value && value.hookType !== _tmagic_core.HookType.CODE) return callback("hookType 必须是 code");
-						callback();
-					} }]
-				}
-			]
-		};
-		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 />条件为空时表示成立；`
-				},
-				{
-					text: "条件组配置",
-					static: true,
-					className: "display-conds-title"
-				},
-				{
-					type: "display-conds",
-					name: _tmagic_core.NODE_CONDS_KEY,
-					titlePrefix: "条件组",
-					fixed: "right",
-					operateColWidth: 112,
-					defaultValue: [],
-					rules: [{ typeMatch: true }]
-				}
-			]
-		};
-		fillConfig = (config = [], { labelWidth = "80px", disabledDataSource = false, disabledCodeBlock = false } = {}) => {
-			const propsConfig = [];
-			if (!config.find((item) => "name" in item && item.name === "type")) propsConfig.push({
-				text: "type",
-				name: "type",
-				type: "hidden"
-			});
-			if (!config.find((item) => "name" in item && item.name === "id")) propsConfig.push({
-				name: "id",
-				text: "ID",
-				type: "text",
-				static: true,
-				append: {
-					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("已复制");
-						}).catch(() => {
-							_tmagic_design.tMagicMessage.error("复制失败");
-						});
-					}
-				}
-			});
-			if (!config.find((item) => "name" in item && item.name === "name")) propsConfig.push({
-				name: "name",
-				text: "组件名称"
-			});
-			const noCodeAdvancedTabItems = advancedTabConfig.items.filter((item) => "type" in item && item.type !== "code-select");
-			if (noCodeAdvancedTabItems.length > 0 && disabledCodeBlock) advancedTabConfig.items = noCodeAdvancedTabItems;
-			const tabConfig = {
-				type: "tab",
-				labelWidth,
-				className: "magic-right-panel-tabs-top",
-				items: [
-					{
-						title: "属性",
-						items: [...propsConfig, ...config]
-					},
-					{ ...styleTabConfig },
-					{ ...eventTabConfig }
-				]
-			};
-			if (!disabledCodeBlock) tabConfig.items.push({ ...advancedTabConfig });
-			else if (noCodeAdvancedTabItems.length > 0) tabConfig.items.push({ ...advancedTabConfig });
-			if (!disabledDataSource) tabConfig.items.push({ ...displayTabConfig });
-			return [tabConfig];
-		};
-		removeStyleDisplayConfig = (formConfig) => formConfig.map((item) => {
-			if (!("type" in item)) return item;
-			if (item?.type !== "tab" || !Array.isArray(item.items)) return item;
-			return {
-				...item,
-				items: item.items.map((tabPane) => {
-					if (tabPane?.title !== "样式" || !Array.isArray(tabPane.items)) return tabPane;
-					return {
-						...tabPane,
-						display: true
-					};
-				})
-			};
-		});
-	}));
-	//#endregion
 	//#region packages/editor/src/hooks/use-compare-form.ts
 	var useCompareForm;
 	var init_use_compare_form = __esmMin((() => {
 		init_code_block();
-		init_props();
 		useCompareForm = (props) => {
 			(0, vue.provide)("services", props.services);
 			const config = (0, vue.ref)([]);
@@ -5529,7 +5228,7 @@
 				switch (props.category) {
 					case "node":
 						if (!props.type) return [];
-						return removeStyleDisplayConfig(await props.services.propsService.getPropsConfig(props.type, { node: props.value }));
+						return props.services.propsService.getPropsConfig(props.type, { node: props.value });
 					case "data-source": return props.services.dataSourceService.getFormConfig(props.type || "base").map((item) => "type" in item && item.type === "tab" ? {
 						...item,
 						active: "fields"
@@ -5701,9 +5400,294 @@
 		}
 	};
 	//#endregion
+	//#region packages/editor/src/utils/props.ts
+	var arrayOptions = [{
+		text: "包含",
+		value: "include"
+	}, {
+		text: "不包含",
+		value: "not_include"
+	}];
+	var eqOptions = [{
+		text: "等于",
+		value: "="
+	}, {
+		text: "不等于",
+		value: "!="
+	}];
+	var numberOptions = [
+		{
+			text: "大于",
+			value: ">"
+		},
+		{
+			text: "大于等于",
+			value: ">="
+		},
+		{
+			text: "小于",
+			value: "<"
+		},
+		{
+			text: "小于等于",
+			value: "<="
+		},
+		{
+			text: "在范围内",
+			value: "between"
+		},
+		{
+			text: "不在范围内",
+			value: "not_between"
+		}
+	];
+	var booleanOptions = [{
+		text: "是",
+		value: "is"
+	}, {
+		text: "不是",
+		value: "not"
+	}];
+	/** 按字段类型返回条件运算符选项（UI 与 typeMatch 校验共用） */
+	var getCondOpOptionsByFieldType = (type) => {
+		if (type === "array") return arrayOptions;
+		if (type === "boolean" || type === "null") return booleanOptions;
+		if (type === "number") return [...eqOptions, ...numberOptions];
+		if (type === "string") return [...arrayOptions, ...eqOptions];
+		return [
+			...arrayOptions,
+			...eqOptions,
+			...numberOptions
+		];
+	};
+	var styleTabConfig = {
+		title: "样式",
+		display: ({ services }) => !(services?.uiService?.get("showStylePanel") ?? true),
+		items: [{
+			name: "style",
+			labelWidth: "100px",
+			type: "style-setter",
+			items: [{ names: [
+				"display",
+				"flexDirection",
+				"justifyContent",
+				"alignItems",
+				"flexWrap",
+				"marginTop",
+				"marginRight",
+				"marginBottom",
+				"marginLeft",
+				"paddingTop",
+				"paddingRight",
+				"paddingBottom",
+				"paddingLeft",
+				"width",
+				"height",
+				"overflow",
+				"fontSize",
+				"lineHeight",
+				"fontWeight",
+				"color",
+				"textAlign",
+				"backgroundColor",
+				"backgroundImage",
+				"backgroundSize",
+				"backgroundPosition",
+				"backgroundRepeat",
+				"position",
+				"zIndex",
+				"top",
+				"right",
+				"bottom",
+				"left",
+				"borderRadius",
+				"borderTopWidth",
+				"borderTopStyle",
+				"borderTopColor",
+				"borderRightColor",
+				"borderRightWidth",
+				"borderRightStyle",
+				"borderRightColor",
+				"borderBottomWidth",
+				"borderBottomStyle",
+				"borderBottomColor",
+				"borderLeftStyle",
+				"borderLeftWidth",
+				"borderLeftColor",
+				"borderWidth",
+				"borderStyle",
+				"borderColor",
+				"opacity"
+			] }, {
+				name: "transform",
+				defaultValue: () => ({})
+			}]
+		}]
+	};
+	var eventTabConfig = {
+		title: "事件",
+		items: [{
+			name: "events",
+			src: "component",
+			labelWidth: "100px",
+			type: "event-select",
+			rules: [{ typeMatch: true }]
+		}]
+	};
+	var advancedTabConfig = {
+		title: "高级",
+		items: [
+			{
+				name: _tmagic_core.NODE_DISABLE_CODE_BLOCK_KEY,
+				text: "禁用代码块",
+				type: "switch",
+				labelPosition: "left",
+				defaultValue: false,
+				extra: "开启后，配置的代码块将不会被执行"
+			},
+			{
+				name: _tmagic_core.NODE_DISABLE_DATA_SOURCE_KEY,
+				text: "禁用数据源",
+				type: "switch",
+				labelPosition: "left",
+				defaultValue: false,
+				extra: "开启后，组件内配置的数据源相关配置将不会被编译，显隐条件将失效"
+			},
+			{
+				name: "created",
+				text: "Created",
+				labelPosition: "top",
+				type: "code-select",
+				titleExtra: "组件初始化时执行",
+				rules: [{
+					typeMatch: true,
+					trigger: "change"
+				}, { validator: ({ value, callback }) => {
+					if (value && value.hookType !== _tmagic_core.HookType.CODE) return callback("hookType 必须是 code");
+					callback();
+				} }]
+			},
+			{
+				name: "mounted",
+				text: "Mounted",
+				labelPosition: "top",
+				type: "code-select",
+				titleExtra: "组件挂载到dom时执行",
+				rules: [{
+					typeMatch: true,
+					trigger: "change"
+				}, { validator: ({ value, callback }) => {
+					if (value && value.hookType !== _tmagic_core.HookType.CODE) return callback("hookType 必须是 code");
+					callback();
+				} }]
+			},
+			{
+				name: "display",
+				text: "Display",
+				titleExtra: "控制组件是否渲染，关系的代码块返回值为false时不渲染",
+				labelPosition: "top",
+				type: "code-select",
+				rules: [{
+					typeMatch: true,
+					trigger: "change"
+				}, { validator: ({ value, callback }) => {
+					if (value && value.hookType !== _tmagic_core.HookType.CODE) return callback("hookType 必须是 code");
+					callback();
+				} }]
+			}
+		]
+	};
+	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 />条件为空时表示成立；`
+			},
+			{
+				text: "条件组配置",
+				static: true,
+				className: "display-conds-title"
+			},
+			{
+				type: "display-conds",
+				name: _tmagic_core.NODE_CONDS_KEY,
+				titlePrefix: "条件组",
+				fixed: "right",
+				operateColWidth: 112,
+				defaultValue: [],
+				rules: [{ typeMatch: true }]
+			}
+		]
+	};
+	/**
+	* 统一为组件属性表单加上事件、高级、样式配置
+	* @param config 组件属性配置
+	* @returns Object
+	*/
+	var fillConfig = (config = [], { labelWidth = "80px", disabledDataSource = false, disabledCodeBlock = false } = {}) => {
+		const propsConfig = [];
+		if (!config.find((item) => "name" in item && item.name === "type")) propsConfig.push({
+			text: "type",
+			name: "type",
+			type: "hidden"
+		});
+		if (!config.find((item) => "name" in item && item.name === "id")) propsConfig.push({
+			name: "id",
+			text: "ID",
+			type: "text",
+			static: true,
+			append: {
+				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("已复制");
+					}).catch(() => {
+						_tmagic_design.tMagicMessage.error("复制失败");
+					});
+				}
+			}
+		});
+		if (!config.find((item) => "name" in item && item.name === "name")) propsConfig.push({
+			name: "name",
+			text: "组件名称"
+		});
+		const noCodeAdvancedTabItems = advancedTabConfig.items.filter((item) => "type" in item && item.type !== "code-select");
+		if (noCodeAdvancedTabItems.length > 0 && disabledCodeBlock) advancedTabConfig.items = noCodeAdvancedTabItems;
+		const tabConfig = {
+			type: "tab",
+			labelWidth,
+			className: "magic-right-panel-tabs-top",
+			items: [
+				{
+					title: "属性",
+					items: [...propsConfig, ...config]
+				},
+				{ ...styleTabConfig },
+				{ ...eventTabConfig }
+			]
+		};
+		if (!disabledCodeBlock) tabConfig.items.push({ ...advancedTabConfig });
+		else if (noCodeAdvancedTabItems.length > 0) tabConfig.items.push({ ...advancedTabConfig });
+		if (!disabledDataSource) tabConfig.items.push({ ...displayTabConfig });
+		return [tabConfig];
+	};
+	//#endregion
 	//#region packages/editor/src/services/props.ts
 	init_lodash();
-	init_props();
 	var canUsePluginMethods$8 = {
 		async: [
 			"setPropsConfig",
@@ -7363,6 +7347,8 @@
 	init_lodash();
 	init_type();
 	init_editor();
+	/** 历史插回时把记录的下标收敛到 [0, length]，越界（含未记录）一律追加到末尾 */
+	var clampIndex = (index, length) => typeof index === "number" && index >= 0 && index <= length ? index : length;
 	/**
 	* 把「变更前后节点快照」列表归一成 update 类型的 {@link StepDiffItem} 列表，供 {@link StepValue.diff} 使用。
 	* `changeRecords` 来自 form 端的 propPath/value 列表，撤销/重做时只对这些 propPath 做局部更新；
@@ -7402,6 +7388,11 @@
 		* 普通操作不会读取它，调用前由 *AndGetHistoryId 重置为 null。
 		*/
 		lastPushedHistoryId = null;
+		/**
+		* 上一次 doAdd 的插入记忆：nodeId 为插入的节点，selectedId 为当时的选中节点。
+		* 仅在选中节点未变化时复用（连续 add / doNotSelect / 批量粘贴），选中变化后自动失效，无需手动清理。
+		*/
+		lastAdded = null;
 		constructor() {
 			super(canUsePluginMethods.async.map((methodName) => ({
 				name: methodName,
@@ -7597,24 +7588,29 @@
 			this.set("stage", null);
 			this.set("highlightNode", null);
 		}
-		async doAdd(node, parent) {
+		async doAdd(node, parent, _options = {}) {
 			const root = this.get("root");
 			if (!root) throw new Error("root为空");
 			const curNode = this.get("node");
 			const stage = this.get("stage");
 			if (!curNode) throw new Error("当前选中节点为空");
 			if ((parent.type === _tmagic_core.NodeType.ROOT || curNode?.type === _tmagic_core.NodeType.ROOT) && !(0, _tmagic_utils.isPageOrFragment)(node)) throw new Error("app下不能添加组件");
-			if (parent.id !== curNode.id && !(0, _tmagic_utils.isPageOrFragment)(node)) {
-				const index = parent.items.indexOf(curNode);
-				parent.items?.splice(index + 1, 0, node);
-			} else parent.items?.push(node);
+			const anchorId = this.lastAdded?.selectedId === curNode.id ? this.lastAdded.nodeId : curNode.id;
+			const anchorIndex = (0, _tmagic_utils.isPageOrFragment)(node) ? -1 : Math.max(getNodeIndex(anchorId, parent), getNodeIndex(curNode.id, parent));
+			const insertIndex = anchorIndex < 0 ? parent.items.length : anchorIndex + 1;
+			parent.items.splice(insertIndex, 0, node);
+			this.lastAdded = {
+				selectedId: curNode.id,
+				nodeId: node.id
+			};
 			const layout = await this.getLayout((0, vue.toRaw)(parent), node);
 			node.style = getInitPositionStyle(node.style, layout);
 			await stage?.add({
 				config: cloneDeep$1(node),
 				parent: cloneDeep$1(parent),
 				parentId: parent.id,
-				root: cloneDeep$1(root)
+				root: cloneDeep$1(root),
+				index: insertIndex
 			});
 			const newStyle = fixNodePosition(node, parent, stage);
 			if (newStyle && (newStyle.top !== node.style.top || newStyle.left !== node.style.left)) {
@@ -7632,14 +7628,12 @@
 		* 向指点容器添加组件节点
 		* @param addConfig 将要添加的组件节点配置
 		* @param parent 要添加到的容器组件节点配置，如果不设置，默认为当前选中的组件的父节点
-		* @param options 可选配置
-		* @param options.doNotSelect 添加后是否不更新当前选中节点（默认 false，添加后会选中新增的节点）
-		* @param options.doNotSwitchPage 添加后是否不切换当前页面（默认 false；新增页面 / 跨页新增时为 true 会跳过会引发页面切换的选中操作）
-		* @param options.doNotPushHistory 是否不写入历史记录（默认 false）
+		* @param options 可选配置，见 {@link DslOpOptions}
 		* @returns 添加后的节点
 		*/
-		async add(addNode, parent, { doNotSelect = false, doNotSwitchPage = false, doNotPushHistory = false, historyDescription, historySource } = {}) {
+		async add(addNode, parent, options = {}) {
 			this.captureSelectionBeforeOp();
+			const { doNotSelect = false, doNotSwitchPage = false, doNotPushHistory = false, historyDescription, historySource } = options;
 			const stage = this.get("stage");
 			const addNodes = [];
 			if (!Array.isArray(addNode)) {
@@ -7647,13 +7641,13 @@
 				if (!type) throw new Error("组件类型不能为空");
 				addNodes.push({ ...(0, vue.toRaw)(await props_default.getPropsValue(type, config)) });
 			} else addNodes.push(...addNode);
-			const newNodes = await Promise.all(addNodes.map((node) => {
+			const newNodes = [];
+			for (const node of addNodes) {
 				const root = this.get("root");
-				if ((0, _tmagic_utils.isPageOrFragment)(node) && root) return this.doAdd(node, root);
-				const parentNode = parent ?? getAddParent(node);
+				const parentNode = (0, _tmagic_utils.isPageOrFragment)(node) && root ? root : parent ?? getAddParent(node);
 				if (!parentNode) throw new Error("未找到父元素");
-				return this.doAdd(node, parentNode);
-			}));
+				newNodes.push(await this.doAdd(node, parentNode, options));
+			}
 			if (newNodes.length > 1) {
 				const wouldSwitchPage = newNodes.some((n) => this.isOnDifferentPage(n));
 				if (!doNotSelect && !(doNotSwitchPage && wouldSwitchPage)) {
@@ -7769,7 +7763,8 @@
 		* @param options.doNotSwitchPage 删除后是否不切换当前页面（默认 false；删除页面 / 页面片段时为 true 会跳过自动切换到首个剩余页面）
 		* @param options.doNotPushHistory 是否不写入历史记录（默认 false）
 		*/
-		async remove(nodeOrNodeList, { doNotSelect = false, doNotSwitchPage = false, doNotPushHistory = false, historyDescription, historySource } = {}) {
+		async remove(nodeOrNodeList, options = {}) {
+			const { doNotPushHistory = false, historyDescription, historySource } = options;
 			this.captureSelectionBeforeOp();
 			const nodes = Array.isArray(nodeOrNodeList) ? nodeOrNodeList : [nodeOrNodeList];
 			const changeItems = nodes.map((node) => ({
@@ -7793,10 +7788,7 @@
 					});
 				}
 			}
-			await Promise.all(nodes.map((node) => this.doRemove(node, {
-				doNotSelect,
-				doNotSwitchPage
-			})));
+			await Promise.all(nodes.map((node) => this.doRemove(node, options)));
 			this.removeInvalidNodesBySubtree(nodes);
 			if (removedItems.length > 0 && pageForOp) if (!doNotPushHistory) this.pushOpHistory("remove", {
 				diff: removedItems,
@@ -7818,7 +7810,8 @@
 				remove: removedPages
 			});
 		}
-		async doUpdate(config, { changeRecords = [], historySource, replace = false } = {}) {
+		async doUpdate(config, data = {}) {
+			const { changeRecords = [], historySource, replace = false } = data;
 			if (!this.get("root")) throw new Error("root为空");
 			if (!config?.id) throw new Error("没有配置或者配置缺少id值");
 			const info = this.getNodeInfo(config.id, false);
@@ -7867,24 +7860,18 @@
 		* 更新节点
 		* update后会触发依赖收集，收集完后会掉stage.update方法
 		* @param config 新的节点配置，配置中需要有id信息
-		* @param data 额外数据
-		* @param data.changeRecords 单节点 form 端变更记录（多节点场景下被忽略，使用 changeRecordList）
-		* @param data.changeRecordList 多节点 form 端变更记录列表，按 config 数组同序对应每个节点；优先级高于 changeRecords
-		* @param data.doNotPushHistory 是否不写入历史记录（默认 false）
-		* @param data.historyDescription 入栈时附带的人类可读描述，用于历史面板展示（不影响 undo/redo 行为）
-		* @param data.replace 是否整节点替换：为 true 时跳过 mergeWith / toggleFixedPosition / setChildrenLayout，直接用传入配置覆盖（默认 false）
+		* @param data 额外数据，见 {@link UpdateOptions}
 		* @returns 更新后的节点配置
 		*/
 		async update(config, data = {}) {
 			this.captureSelectionBeforeOp();
-			const { doNotPushHistory = false, changeRecordList, changeRecords, historyDescription, historySource, replace = false, invalidInfo } = data;
+			const { doNotPushHistory = false, changeRecordList, changeRecords, historyDescription, historySource, invalidInfo } = data;
 			const nodes = Array.isArray(config) ? config : [config];
 			const updateData = await Promise.all(nodes.map((node, index) => {
 				const recordsForNode = changeRecordList ? changeRecordList[index] ?? [] : changeRecords ?? [];
 				return this.doUpdate(node, {
-					changeRecords: recordsForNode,
-					historySource,
-					replace
+					...data,
+					changeRecords: recordsForNode
 				});
 			}));
 			this.applyInvalidInfo(config, invalidInfo);
@@ -8727,14 +8714,15 @@
 							const parent = this.getNodeById(parentId, false);
 							if (parent?.items) {
 								const addedNode = cloneDeep$1(newSchema);
-								if (typeof index === "number" && index >= 0 && index < parent.items.length) parent.items.splice(index, 0, addedNode);
-								else parent.items.push(addedNode);
+								const insertIndex = clampIndex(index, parent.items.length);
+								parent.items.splice(insertIndex, 0, addedNode);
 								addedNodes.push(addedNode);
 								await stage?.add({
 									config: cloneDeep$1(newSchema),
 									parent: cloneDeep$1(parent),
 									parentId: parent.id,
-									root: cloneDeep$1(root)
+									root: cloneDeep$1(root),
+									index: insertIndex
 								});
 							}
 						}
@@ -8752,13 +8740,15 @@
 							const parent = this.getNodeById(parentId, false);
 							if (parent?.items) {
 								const addedNode = cloneDeep$1(oldSchema);
-								parent.items.splice(index ?? parent.items.length, 0, addedNode);
+								const insertIndex = clampIndex(index, parent.items.length);
+								parent.items.splice(insertIndex, 0, addedNode);
 								addedNodes.push(addedNode);
 								await stage?.add({
 									config: cloneDeep$1(oldSchema),
 									parent: cloneDeep$1(parent),
 									parentId,
-									root: cloneDeep$1(root)
+									root: cloneDeep$1(root),
+									index: insertIndex
 								});
 							}
 						}
@@ -10833,7 +10823,6 @@
 	//#endregion
 	//#region packages/editor/src/utils/type-match-rules.ts
 	init_use_compare_form();
-	init_props();
 	/** 复用 form 的可选项建议文案；额外过滤 null / 空串，避免业务侧无效枚举污染提示。 */
 	var listSuggestion = (values) => (0, _tmagic_form.optionSuggestion)(values.filter((item) => item !== null && item !== ""));
 	/**
@@ -11253,7 +11242,7 @@
 	var getEventNameOptions = (src, formValue = {}) => {
 		if (!formValue.type) return [];
 		if (src === "component") {
-			const sourceNode = editor_default.getNodeById(formValue.id);
+			const sourceNode = editor_default.getNodeById(formValue.id) || formValue;
 			let events = events_default.getEvent(formValue.type, { node: sourceNode }) || [];
 			if (formValue.type === "page-fragment-container" && formValue.pageFragmentId) {
 				const pageFragment = editor_default.get("root")?.items?.find((page) => page.id === formValue.pageFragmentId);
@@ -15083,7 +15072,6 @@
 	//#endregion
 	//#region packages/editor/src/layouts/props-panel/PropsPanel.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
-	init_props();
 	var _hoisted_1$58 = {
 		ref: "propsPanel",
 		class: "m-editor-props-panel"
@@ -20997,6 +20985,7 @@
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
 			const mForm = (0, vue.inject)("mForm");
+			const silentMode = (0, vue.inject)(_tmagic_form.FORM_SILENT_MODE_KEY, false);
 			const { codeBlockService, uiService } = useServices();
 			const eventBus = (0, vue.inject)("eventBus");
 			const emit = __emit;
@@ -21093,7 +21082,7 @@
 							"last-values",
 							"size",
 							"prop"
-						])) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_form.MSelect), {
+						])) : !(0, vue.unref)(silentMode) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_form.MSelect), {
 							key: 1,
 							class: "select",
 							config: selectConfig,
@@ -21107,9 +21096,9 @@
 							"model",
 							"size",
 							"prop"
-						])),
+						])) : (0, vue.createCommentVNode)("v-if", true),
 						(0, vue.createCommentVNode)(" 查看/编辑按钮：对比模式为只读，不展示 "),
-						!isCompareMode.value && __props.model[__props.name] && hasCodeBlockSidePanel.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
+						!isCompareMode.value && !(0, vue.unref)(silentMode) && __props.model[__props.name] && hasCodeBlockSidePanel.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
 							key: 2,
 							class: "m-fields-select-action-button",
 							size: __props.size,
@@ -21196,6 +21185,7 @@
 			const emit = __emit;
 			const { uiService } = useServices();
 			const mForm = (0, vue.inject)("mForm");
+			const silentMode = (0, vue.inject)(_tmagic_form.FORM_SILENT_MODE_KEY, false);
 			/** 对比模式下隐藏新增/编辑/删除等操作按钮，仅保留只读展示。 */
 			const isCompare = (0, vue.computed)(() => Boolean(mForm?.isCompare));
 			const fieldValues = (0, vue.ref)({});
@@ -21462,6 +21452,7 @@
 			const editingFieldPath = (0, vue.inject)("editingDataSourceFieldPath", (0, vue.computed)(() => []));
 			(0, vue.provide)("editingDataSourceFieldPath", (0, vue.computed)(() => editingFieldPath.value.slice(1)));
 			(0, vue.onMounted)(() => {
+				if (silentMode) return;
 				const path = editingFieldPath.value;
 				if (!path.length) return;
 				const fields = props.model[props.name] || [];
@@ -21494,7 +21485,8 @@
 						default: (0, vue.withCtx)(() => [..._cache[9] || (_cache[9] = [(0, vue.createTextVNode)("添加", -1)])]),
 						_: 1
 					}, 8, ["disabled"])])) : (0, vue.createCommentVNode)("v-if", true),
-					(0, vue.createVNode)(FloatingBox_default, {
+					!(0, vue.unref)(silentMode) ? ((0, vue.openBlock)(), (0, vue.createBlock)(FloatingBox_default, {
+						key: 1,
 						"body-style": { padding: "0 16px" },
 						visible: addDialogVisible.value,
 						"onUpdate:visible": _cache[2] || (_cache[2] = ($event) => addDialogVisible.value = $event),
@@ -21528,8 +21520,9 @@
 						"title",
 						"framework-width",
 						"position"
-					]),
-					(0, vue.createVNode)(FloatingBox_default, {
+					])) : (0, vue.createCommentVNode)("v-if", true),
+					!(0, vue.unref)(silentMode) ? ((0, vue.openBlock)(), (0, vue.createBlock)(FloatingBox_default, {
+						key: 2,
 						"body-style": { padding: "0 16px" },
 						visible: addFromJsonDialogVisible.value,
 						"onUpdate:visible": _cache[5] || (_cache[5] = ($event) => addFromJsonDialogVisible.value = $event),
@@ -21554,7 +21547,7 @@
 						"height",
 						"framework-width",
 						"position"
-					])
+					])) : (0, vue.createCommentVNode)("v-if", true)
 				]);
 			};
 		}
@@ -21605,6 +21598,7 @@
 			const emit = __emit;
 			const { uiService } = useServices();
 			const mForm = (0, vue.inject)("mForm");
+			const silentMode = (0, vue.inject)(_tmagic_form.FORM_SILENT_MODE_KEY, false);
 			/** 对比模式下隐藏新增/编辑/删除等操作按钮，仅保留只读展示。 */
 			const isCompare = (0, vue.computed)(() => Boolean(mForm?.isCompare));
 			const width = (0, vue.useModel)(__props, "width");
@@ -21789,7 +21783,8 @@
 						default: (0, vue.withCtx)(() => [..._cache[4] || (_cache[4] = [(0, vue.createTextVNode)("添加", -1)])]),
 						_: 1
 					}, 8, ["disabled"])])) : (0, vue.createCommentVNode)("v-if", true),
-					(0, vue.createVNode)(FloatingBox_default, {
+					!(0, vue.unref)(silentMode) ? ((0, vue.openBlock)(), (0, vue.createBlock)(FloatingBox_default, {
+						key: 1,
 						"body-style": { padding: "0 16px" },
 						visible: addDialogVisible.value,
 						"onUpdate:visible": _cache[1] || (_cache[1] = ($event) => addDialogVisible.value = $event),
@@ -21821,7 +21816,7 @@
 						"title",
 						"framework-width",
 						"position"
-					])
+					])) : (0, vue.createCommentVNode)("v-if", true)
 				]);
 			};
 		}
@@ -21863,6 +21858,7 @@
 			const props = __props;
 			const emit = __emit;
 			const mForm = (0, vue.inject)("mForm");
+			const silentMode = (0, vue.inject)(_tmagic_form.FORM_SILENT_MODE_KEY, false);
 			/** 对比模式下隐藏新增/编辑/删除等操作按钮，仅保留只读展示。 */
 			const isCompare = (0, vue.computed)(() => Boolean(mForm?.isCompare));
 			const codeConfig = (0, vue.ref)();
@@ -21956,6 +21952,7 @@
 			/** 由 DataSourceConfigPanel 注入：打开数据源详情后需要直接打开的方法名 */
 			const editingMethodName = (0, vue.inject)("editingDataSourceMethodName", (0, vue.computed)(() => ""));
 			(0, vue.onMounted)(() => {
+				if (silentMode) return;
 				const methodName = editingMethodName.value;
 				if (!methodName) return;
 				const methods = props.model[props.name] || [];
@@ -21980,7 +21977,7 @@
 						default: (0, vue.withCtx)(() => [..._cache[0] || (_cache[0] = [(0, vue.createTextVNode)("添加", -1)])]),
 						_: 1
 					}, 8, ["disabled"])])) : (0, vue.createCommentVNode)("v-if", true),
-					codeConfig.value ? ((0, vue.openBlock)(), (0, vue.createBlock)(CodeBlockEditor_default, {
+					codeConfig.value && !(0, vue.unref)(silentMode) ? ((0, vue.openBlock)(), (0, vue.createBlock)(CodeBlockEditor_default, {
 						key: 1,
 						ref: "codeBlockEditor",
 						disabled: __props.disabled,
@@ -22390,6 +22387,7 @@
 		setup(__props, { emit: __emit }) {
 			const { dataSourceService, uiService } = useServices();
 			const mForm = (0, vue.inject)("mForm");
+			const silentMode = (0, vue.inject)(_tmagic_form.FORM_SILENT_MODE_KEY, false);
 			const eventBus = (0, vue.inject)("eventBus");
 			const emit = __emit;
 			const props = __props;
@@ -22488,7 +22486,8 @@
 				eventBus?.emit("edit-data-source-method", id, methodName);
 			};
 			return (_ctx, _cache) => {
-				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), {
+				return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", _hoisted_1$36, [(0, vue.createElementVNode)("div", _hoisted_2$6, [!(0, vue.unref)(silentMode) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_form.MCascader), {
+					key: 0,
 					class: "select",
 					config: cascaderConfig.value,
 					model: __props.model,
@@ -22504,8 +22503,8 @@
 					"size",
 					"disabled",
 					"prop"
-				]), __props.model[__props.name] && isCustomMethod.value && dataSourceSidePanel.value && !isCompare.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicTooltip), {
-					key: 0,
+				])) : (0, vue.createCommentVNode)("v-if", true), !(0, vue.unref)(silentMode) && __props.model[__props.name] && isCustomMethod.value && dataSourceSidePanel.value && !isCompare.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicTooltip), {
+					key: 1,
 					content: notEditable.value ? "查看" : "编辑"
 				}, {
 					default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_tmagic_design.TMagicButton), {
@@ -22785,6 +22784,7 @@
 			}, { immediate: true });
 			const { dataSourceService, propsService } = useServices();
 			const mForm = (0, vue.inject)("mForm");
+			const silentMode = (0, vue.inject)(_tmagic_form.FORM_SILENT_MODE_KEY, false);
 			const dataSources = (0, vue.computed)(() => dataSourceService.get("dataSources") || []);
 			const disabledDataSource = (0, vue.computed)(() => propsService.getDisabledDataSource());
 			const type = (0, vue.computed)(() => {
@@ -22848,7 +22848,7 @@
 				showDataSourceFieldSelect.value = !showDataSourceFieldSelect.value;
 			};
 			return (_ctx, _cache) => {
-				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, {
+				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.unref)(silentMode) ? ((0, vue.openBlock)(), (0, vue.createBlock)(FieldSelect_default, {
 					key: 0,
 					"model-value": __props.model[__props.name],
 					disabled: __props.disabled,
@@ -22866,7 +22866,7 @@
 					"checkStrictly",
 					"dataSourceFieldType",
 					"dataSourceId"
-				])) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(tagName.value), {
+				])) : !(0, vue.unref)(silentMode) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(tagName.value), {
 					key: 1,
 					config: __props.config.fieldConfig,
 					model: __props.model,
@@ -22888,7 +22888,7 @@
 					"init-values",
 					"values",
 					"prop"
-				])), __props.config.fieldConfig && !disabledDataSource.value && !(0, vue.unref)(mForm)?.isCompare ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicTooltip), {
+				])) : (0, vue.createCommentVNode)("v-if", true), !(0, vue.unref)(silentMode) && __props.config.fieldConfig && !disabledDataSource.value && !(0, vue.unref)(mForm)?.isCompare ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicTooltip), {
 					key: 2,
 					disabled: showDataSourceFieldSelect.value,
 					content: "选择数据源"
@@ -23097,8 +23097,8 @@
 						name: "method",
 						label: "动作",
 						type: compActionConfig.value.type,
-						options: (mForm, { model }) => {
-							const node = editorService.getNodeById(model.to);
+						options: (mForm, { model, formValue }) => {
+							const node = editorService.getNodeById(model.to) || formValue;
 							if (!node?.type) return [];
 							return eventsService.getMethod(node.type, {
 								targetId: model.to,
@@ -23346,6 +23346,7 @@
 			const props = __props;
 			const emit = __emit;
 			const mForm = (0, vue.inject)("mForm");
+			const silentMode = (0, vue.inject)(_tmagic_form.FORM_SILENT_MODE_KEY, false);
 			/** 对比模式下隐藏增删/代码切换等操作按钮，仅保留只读展示。 */
 			const isCompare = (0, vue.computed)(() => Boolean(mForm?.isCompare));
 			const records = (0, vue.ref)([]);
@@ -23451,7 +23452,7 @@
 						"disabled",
 						"icon"
 					])) : (0, vue.createCommentVNode)("v-if", true)])) : (0, vue.createCommentVNode)("v-if", true),
-					__props.config.advanced && showCode.value ? ((0, vue.openBlock)(), (0, vue.createBlock)(CodeEditor_default, {
+					__props.config.advanced && showCode.value && !(0, vue.unref)(silentMode) ? ((0, vue.openBlock)(), (0, vue.createBlock)(CodeEditor_default, {
 						key: 1,
 						"editor-custom-type": "m-fields-key-value",
 						language: "javascript",
@@ -23464,7 +23465,7 @@
 						parse: true,
 						onSave: save
 					}, null, 8, ["init-values", "options"])) : (0, vue.createCommentVNode)("v-if", true),
-					__props.config.advanced && !isCompare.value ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
+					__props.config.advanced && !isCompare.value && !(0, vue.unref)(silentMode) ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(_tmagic_design.TMagicButton), {
 						key: 2,
 						size: "default",
 						disabled: __props.disabled,
@@ -23808,7 +23809,6 @@
 	var DisplayConds_default = DisplayConds_vue_vue_type_script_setup_true_lang_default;
 	//#endregion
 	//#region packages/editor/src/fields/CondOpSelect.vue?vue&type=script&setup=true&lang.ts
-	init_props();
 	var CondOpSelect_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
 		name: "MFieldsCondOpSelect",
 		__name: "CondOpSelect",
@@ -23835,8 +23835,7 @@
 			const optionComponent = (0, _tmagic_design.getDesignConfig)("components")?.option;
 			const options = (0, vue.computed)(() => {
 				const [id, ...fieldNames] = [...props.config.parentFields || [], ...props.model.field];
-				const type = getFieldType(dataSourceService.getDataSourceById(id), fieldNames);
-				return getCondOpOptionsByFieldType(type);
+				return getCondOpOptionsByFieldType(getFieldType(dataSourceService.getDataSourceById(id), fieldNames));
 			});
 			const fieldChangeHandler = (v) => {
 				emit("change", v);
@@ -26084,6 +26083,14 @@
 		app.use(_tmagic_form.default, opt || {});
 		app.use(_tmagic_table.default);
 		(0, _tmagic_form.registerTypeMatchRules)(editorTypeMatchRules);
+		(0, _tmagic_form.registerSilentLeafFieldTypes)([
+			"vs-code",
+			"ui-select",
+			"cond-op-select",
+			"page-fragment-select",
+			"data-source-select",
+			"data-source-input"
+		]);
 		app.config.globalProperties.$TMAGIC_EDITOR = option;
 		setEditorConfig(option);
 		app.component(`${Editor_default.name || "MEditor"}`, Editor_default);
@@ -26116,7 +26123,6 @@
 	init_CompareForm();
 	init_type();
 	init_code_block();
-	init_props();
 	init_use_compare_form();
 	init_editor();
 	init_monaco_editor();
@@ -26299,7 +26305,6 @@
 	exports.numberOptions = numberOptions;
 	exports.openIndexedDB = openIndexedDB;
 	exports.propsService = props_default;
-	exports.removeStyleDisplayConfig = removeStyleDisplayConfig;
 	exports.resolveFieldByPath = resolveFieldByPath;
 	exports.resolveSelectedNode = resolveSelectedNode;
 	exports.serializeConfig = serializeConfig;