@tmagic/editor 1.8.0-beta.14 → 1.8.0-beta.16

package/dist/tmagic-editor.umd.cjs

@@ -5182,7 +5182,7 @@
 	}));
 	//#endregion
 	//#region packages/editor/src/utils/props.ts
-	var arrayOptions, eqOptions, numberOptions, booleanOptions, getCondOpOptionsByFieldType, styleTabConfig, eventTabConfig, advancedTabConfig, displayTabConfig, fillConfig, removeStyleDisplayConfig, validatePropsForm;
+	var arrayOptions, eqOptions, numberOptions, booleanOptions, getCondOpOptionsByFieldType, styleTabConfig, eventTabConfig, advancedTabConfig, displayTabConfig, fillConfig, removeStyleDisplayConfig;
 	var init_props = __esmMin((() => {
 		arrayOptions = [{
 			text: "包含",
@@ -5479,21 +5479,6 @@
 				})
 			};
 		});
-		validatePropsForm = ({ config, values, appContext = null, services, stage, extendState, debug, typeMatchValid }) => (0, _tmagic_form.validateForm)({
-			config,
-			debug,
-			typeMatchValid,
-			initValues: values,
-			appContext: appContext ? {
-				...appContext,
-				provides: { services }
-			} : null,
-			extendState: async (state) => ({
-				...await extendState?.(state) || {},
-				stage,
-				services
-			})
-		});
 	}));
 	//#endregion
 	//#region packages/editor/src/hooks/use-compare-form.ts
@@ -6605,6 +6590,22 @@
 			});
 		}
 		/**
+		* 派发「页面 / 页面片结构变更」事件（`page-structure-change`）。
+		*
+		* 常规 `editorService.add` / `remove` 页面节点不会写入 `page` 历史栈（见 editor.add / remove 中
+		* 对 isPage / isPageFragment 的分支），因此不会产生任何 historyService 事件。该方法用于在这些
+		* 场景（以及 setRoot 整体替换 DSL 增删页面）下，向外统一通知页面结构的增删变化，供业务方感知。
+		*
+		* 一次操作涉及多个页面时，调用方应把本次增删的页面**合并为一个 change 一次性传入**，
+		* 使一次操作只派发一个事件；`add` / `remove` 分别为本次新增与删除的页面列表（其一可为空数组）。
+		*
+		* @param change 本次结构变更：{ add: 新增的页面列表, remove: 删除的页面列表 }
+		*/
+		notifyPageStructureChange(change) {
+			if (!change.add.length && !change.remove.length) return;
+			this.emit("page-structure-change", change);
+		}
+		/**
 		* 把当前内存中的全部历史栈（页面 / 代码块 / 数据源 / 扩展类型）序列化后写入本地 IndexedDB。
 		*
 		* - 每个 UndoRedo 栈连同其游标、容量一并保存，恢复后可继续 undo/redo；
@@ -7701,6 +7702,11 @@
 				historySource,
 				doNotPushHistory
 			});
+			const addedPages = newNodes.filter((node) => (0, _tmagic_utils.isPage)(node) || (0, _tmagic_utils.isPageFragment)(node));
+			if (addedPages.length) history_default.notifyPageStructureChange({
+				add: addedPages,
+				remove: []
+			});
 			return Array.isArray(addNode) ? newNodes : newNodes[0];
 		}
 		async doRemove(node, { doNotSelect = false, doNotSwitchPage = false } = {}) {
@@ -7804,6 +7810,11 @@
 				historySource,
 				doNotPushHistory
 			});
+			const removedPages = nodes.filter((node) => (0, _tmagic_utils.isPage)(node) || (0, _tmagic_utils.isPageFragment)(node));
+			if (removedPages.length) history_default.notifyPageStructureChange({
+				add: [],
+				remove: removedPages
+			});
 		}
 		async doUpdate(config, { changeRecords = [], historySource } = {}) {
 			if (!this.get("root")) throw new Error("root为空");
@@ -8588,24 +8599,35 @@
 			const prevMap = new Map(prevPages.map((p) => [`${p.id}`, p]));
 			const nextMap = new Map(nextPages.map((p) => [`${p.id}`, p]));
 			const indexInItems = (root, id) => (root.items ?? []).findIndex((item) => `${item.id}` === `${id}`);
+			const addedPages = [];
+			const removedPages = [];
 			nextPages.forEach((nextPage) => {
 				const prevPage = prevMap.get(`${nextPage.id}`);
-				if (!prevPage) this.pushPageDiffStep("add", nextPage, {
-					newSchema: cloneDeep$1((0, vue.toRaw)(nextPage)),
-					parentId: nextRoot.id,
-					index: indexInItems(nextRoot, nextPage.id)
-				}, source);
-				else if (!isEqual((0, vue.toRaw)(prevPage), (0, vue.toRaw)(nextPage))) this.pushPageDiffStep("update", nextPage, {
+				if (!prevPage) {
+					this.pushPageDiffStep("add", nextPage, {
+						newSchema: cloneDeep$1((0, vue.toRaw)(nextPage)),
+						parentId: nextRoot.id,
+						index: indexInItems(nextRoot, nextPage.id)
+					}, source);
+					addedPages.push(nextPage);
+				} else if (!isEqual((0, vue.toRaw)(prevPage), (0, vue.toRaw)(nextPage))) this.pushPageDiffStep("update", nextPage, {
 					oldSchema: cloneDeep$1((0, vue.toRaw)(prevPage)),
 					newSchema: cloneDeep$1((0, vue.toRaw)(nextPage))
 				}, source);
 			});
 			prevPages.forEach((prevPage) => {
-				if (!nextMap.has(`${prevPage.id}`)) this.pushPageDiffStep("remove", prevPage, {
-					oldSchema: cloneDeep$1((0, vue.toRaw)(prevPage)),
-					parentId: preRoot.id,
-					index: indexInItems(preRoot, prevPage.id)
-				}, source);
+				if (!nextMap.has(`${prevPage.id}`)) {
+					this.pushPageDiffStep("remove", prevPage, {
+						oldSchema: cloneDeep$1((0, vue.toRaw)(prevPage)),
+						parentId: preRoot.id,
+						index: indexInItems(preRoot, prevPage.id)
+					}, source);
+					removedPages.push(prevPage);
+				}
+			});
+			if (addedPages.length || removedPages.length) history_default.notifyPageStructureChange({
+				add: addedPages,
+				remove: removedPages
 			});
 		}
 		/**
@@ -9598,12 +9620,14 @@
 			if (options.skipNumberIndices && (0, _tmagic_utils.isNumber)(name)) continue;
 			if (!currentFields.length) return {
 				ok: false,
-				fields: currentFields
+				fields: currentFields,
+				failedName: name
 			};
 			field = currentFields.find((item) => item.name === name);
 			if (!field) return {
 				ok: false,
-				fields: currentFields
+				fields: currentFields,
+				failedName: name
 			};
 			currentFields = field.fields || [];
 		}
@@ -10768,7 +10792,7 @@
 		}
 		return String(value);
 	};
-	var MAX_SUGGESTION_OPTIONS = 5;
+	var MAX_SUGGESTION_OPTIONS = 20;
 	/**
 	* 生成「请使用以下某一个值：xxx；xxx」形式的参考建议；无可选值时返回空字符串（不追加建议）。
 	*/
@@ -10929,10 +10953,10 @@
 			fieldNames = path.slice(1);
 		}
 		const ds = findDataSource(`${dsId}`);
-		if (!ds) return defaultMessage(options.message, "值不在可选项中", dataSourceIdSuggestion());
+		if (!ds) return defaultMessage(options.message, `数据源(${dsId})不存在`, dataSourceIdSuggestion());
 		if (!fieldNames.length) return;
-		const { field, ok } = resolveFieldByPath(ds.fields, fieldNames);
-		if (!ok) return defaultMessage(options.message, "值不在可选项中", dataSourceIdSuggestion());
+		const { field, ok, fields, failedName } = resolveFieldByPath(ds.fields, fieldNames);
+		if (!ok) return defaultMessage(options.message, `数据源字段(${failedName})不存在`, listSuggestion(fields.map((item) => item.name)));
 		const allowedTypes = options.dataSourceFieldType || ["any"];
 		if (!allowedTypes.length || allowedTypes.includes("any")) return;
 		const leafType = field?.type || "any";
@@ -11015,9 +11039,15 @@
 		if (config.value === "key") return true;
 		return `${value[0]}`.startsWith(_tmagic_utils.DATA_SOURCE_FIELDS_SELECT_VALUE_PREFIX);
 	};
-	var validateDataSourceFieldSelect = (value, { message, props }) => {
+	var validateDataSourceFieldSelect = (value, { mForm, message, props }) => {
 		const config = props.config || {};
-		if (config.fieldConfig && !isDataSourceFieldPathValue(value, config)) return;
+		if (config.fieldConfig && !isDataSourceFieldPathValue(value, config)) return (0, _tmagic_form.validateTypeMatch)(value, mForm, {
+			...props,
+			config: {
+				name: config.name,
+				...config.fieldConfig
+			}
+		}, message);
 		if (!Array.isArray(value) || value.some((item) => typeof item !== "string")) return defaultMessage(message, `${value}类型应为字符串数组`, dataSourceFieldPathSuggestion());
 		return validateDataSourceFieldPath(value, {
 			dataSourceId: config.dataSourceId,
@@ -14795,7 +14825,6 @@
 	//#endregion
 	//#region packages/editor/src/layouts/props-panel/FormPanel.vue?vue&type=script&setup=true&lang.ts
 	init_Icon();
-	init_props();
 	init_CodeEditor();
 	var _hoisted_1$59 = { class: "m-editor-props-form-panel" };
 	var FormPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ (0, vue.defineComponent)({
@@ -14869,14 +14898,18 @@
 					return;
 				}
 				try {
-					const error = await validatePropsForm({
+					const error = await (0, _tmagic_form.validateForm)({
 						config: props.config,
-						values: newValues,
-						appContext: internalInstance?.appContext ?? null,
-						services,
-						stage: stage.value,
 						typeMatchValid: true,
-						extendState: props.extendState
+						initValues: newValues,
+						appContext: internalInstance?.appContext ? {
+							...internalInstance?.appContext,
+							provides: { services }
+						} : null,
+						extendState: (state) => {
+							if (configFormRef.value?.formState) return { ...configFormRef.value?.formState || {} };
+							return props.extendState?.(state) || {};
+						}
 					});
 					if (error) (0, _tmagic_design.tMagicMessage)({
 						type: "error",
@@ -15055,14 +15088,14 @@
 						...v,
 						style: {}
 					};
-					if (v.style) {
+					if (v.style) if (eventData) {
 						Object.entries(v.style).forEach(([key, value]) => {
 							if (value !== "" && newValue.style) newValue.style[key] = value;
 						});
-						eventData?.changeRecords?.forEach((record) => {
+						eventData.changeRecords?.forEach((record) => {
 							if (record.propPath?.startsWith("style") && record.value === "") (0, _tmagic_utils.setValueByKeyPath)(record.propPath, record.value, newValue);
 						});
-					}
+					} else newValue.style = { ...v.style };
 					const historySource = eventData ? "props" : "code";
 					editorService.update(newValue, {
 						changeRecords: eventData?.changeRecords,
@@ -15700,15 +15733,29 @@
 				if (contains(target)) return;
 				hide();
 			};
+			const fixPosition = () => {
+				const menu = menuEl.value;
+				if (!menu || !visible.value) return;
+				const menuHeight = menu.clientHeight;
+				const menuWidth = menu.clientWidth;
+				let { top, left } = menuPosition.value;
+				if (top + menuHeight > document.body.clientHeight) top = Math.max(0, document.body.clientHeight - menuHeight);
+				if (left + menuWidth > document.body.clientWidth) left = Math.max(0, document.body.clientWidth - menuWidth);
+				if (top !== menuPosition.value.top || left !== menuPosition.value.left) menuPosition.value = {
+					top,
+					left
+				};
+			};
 			const setPosition = (e) => {
-				const menuHeight = menuEl.value?.clientHeight || 0;
-				let top = e.clientY;
-				if (menuHeight + e.clientY > document.body.clientHeight) top = document.body.clientHeight - menuHeight;
 				menuPosition.value = {
-					top,
+					top: e.clientY,
 					left: e.clientX
 				};
+				fixPosition();
 			};
+			const resizeObserver = new ResizeObserver(() => {
+				fixPosition();
+			});
 			const show = (e) => {
 				visible.value = true;
 				(0, vue.nextTick)(() => {
@@ -15737,10 +15784,12 @@
 				emit("mouseenter");
 			};
 			(0, vue.onMounted)(() => {
+				if (menuEl.value) resizeObserver.observe(menuEl.value);
 				if (props.isSubMenu) return;
 				globalThis.addEventListener("mousedown", outsideClickHideHandler, true);
 			});
 			(0, vue.onBeforeUnmount)(() => {
+				resizeObserver.disconnect();
 				if (props.isSubMenu) return;
 				globalThis.removeEventListener("mousedown", outsideClickHideHandler, true);
 			});
@@ -25323,6 +25372,12 @@
 		},
 		emits: ["change"],
 		setup(__props, { emit: __emit }) {
+			/**
+			* 静默模式（submitForm/validateForm 隐藏挂载）下跳过 monaco 渲染：
+			* 校验由 FormItem 针对 model 中的值完成，与编辑器实例无关；本组件挂载无值副作用
+			* （save 仅由用户操作/编辑器内容变更触发），跳过可省去 monaco worker/model 的无谓实例化。
+			*/
+			const silentMode = (0, vue.inject)(_tmagic_form.FORM_SILENT_MODE_KEY, false);
 			const emit = __emit;
 			const props = __props;
 			/**
@@ -25340,7 +25395,8 @@
 				emit("change", v);
 			};
 			return (_ctx, _cache) => {
-				return (0, vue.openBlock)(), (0, vue.createBlock)(CodeEditor_default, {
+				return !(0, vue.unref)(silentMode) ? ((0, vue.openBlock)(), (0, vue.createBlock)(CodeEditor_default, {
+					key: 0,
 					height: __props.config.height,
 					type: diffMode.value ? "diff" : void 0,
 					"init-values": diffMode.value ? (__props.lastValues || {})[__props.name] : __props.model[__props.name],
@@ -25364,7 +25420,7 @@
 					"autosize",
 					"parse",
 					"editor-custom-type"
-				]);
+				])) : (0, vue.createCommentVNode)("v-if", true);
 			};
 		}
 	});
@@ -25862,7 +25918,6 @@
 	exports.useServices = useServices;
 	exports.useStage = useStage;
 	exports.useWindowRect = useWindowRect;
-	exports.validatePropsForm = validatePropsForm;
 	exports.warn = warn;
 	Object.keys(_tmagic_form).forEach(function(k) {
 		if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.8.0-beta.14",
+  "version": "1.8.0-beta.16",
   "name": "@tmagic/editor",
   "type": "module",
   "sideEffects": [
@@ -58,11 +58,11 @@
     "moveable": "^0.53.0",
     "serialize-javascript": "^7.0.0",
     "sortablejs": "^1.15.6",
-    "@tmagic/design": "1.8.0-beta.14",
-    "@tmagic/form": "1.8.0-beta.14",
-    "@tmagic/stage": "1.8.0-beta.14",
-    "@tmagic/table": "1.8.0-beta.14",
-    "@tmagic/utils": "1.8.0-beta.14"
+    "@tmagic/design": "1.8.0-beta.16",
+    "@tmagic/stage": "1.8.0-beta.16",
+    "@tmagic/form": "1.8.0-beta.16",
+    "@tmagic/utils": "1.8.0-beta.16",
+    "@tmagic/table": "1.8.0-beta.16"
   },
   "devDependencies": {
     "@types/events": "^3.0.3",
@@ -76,7 +76,7 @@
     "type-fest": "^5.2.0",
     "typescript": "^6.0.3",
     "vue": "^3.5.40",
-    "@tmagic/core": "1.8.0-beta.14"
+    "@tmagic/core": "1.8.0-beta.16"
   },
   "peerDependenciesMeta": {
     "typescript": {

package/src/components/ContentMenu.vue

@@ -128,20 +128,42 @@ const outsideClickHideHandler = (e: MouseEvent) => {
   hide();
 };
 
-const setPosition = (e: { clientY: number; clientX: number }) => {
-  const menuHeight = menuEl.value?.clientHeight || 0;
+// 根据菜单实际尺寸修正位置，避免超出可视范围
+const fixPosition = () => {
+  const menu = menuEl.value;
+  if (!menu || !visible.value) return;
+
+  const menuHeight = menu.clientHeight;
+  const menuWidth = menu.clientWidth;
+
+  let { top, left } = menuPosition.value;
+
+  if (top + menuHeight > document.body.clientHeight) {
+    top = Math.max(0, document.body.clientHeight - menuHeight);
+  }
+
+  if (left + menuWidth > document.body.clientWidth) {
+    left = Math.max(0, document.body.clientWidth - menuWidth);
+  }
 
-  let top = e.clientY;
-  if (menuHeight + e.clientY > document.body.clientHeight) {
-    top = document.body.clientHeight - menuHeight;
+  if (top !== menuPosition.value.top || left !== menuPosition.value.left) {
+    menuPosition.value = { top, left };
   }
+};
 
+const setPosition = (e: { clientY: number; clientX: number }) => {
   menuPosition.value = {
-    top,
+    top: e.clientY,
     left: e.clientX,
   };
+  fixPosition();
 };
 
+// 菜单大小动态变化（如菜单项更新）后重新修正位置
+const resizeObserver = new ResizeObserver(() => {
+  fixPosition();
+});
+
 const show = (e?: { clientY: number; clientX: number }) => {
   visible.value = true;
 
@@ -186,12 +208,18 @@ const mouseenterHandler = () => {
 };
 
 onMounted(() => {
+  if (menuEl.value) {
+    resizeObserver.observe(menuEl.value);
+  }
+
   if (props.isSubMenu) return;
 
   globalThis.addEventListener('mousedown', outsideClickHideHandler, true);
 });
 
 onBeforeUnmount(() => {
+  resizeObserver.disconnect();
+
   if (props.isSubMenu) return;
 
   globalThis.removeEventListener('mousedown', outsideClickHideHandler, true);

package/src/fields/Code.vue

@@ -1,5 +1,6 @@
 <template>
   <MagicCodeEditor
+    v-if="!silentMode"
     :height="config.height"
     :type="diffMode ? 'diff' : undefined"
     :init-values="diffMode ? (lastValues || {})[name] : model[name]"
@@ -17,9 +18,9 @@
 </template>
 
 <script lang="ts" setup>
-import { computed } from 'vue';
+import { computed, inject } from 'vue';
 
-import type { CodeConfig, FieldProps } from '@tmagic/form';
+import { type CodeConfig, type FieldProps, FORM_SILENT_MODE_KEY } from '@tmagic/form';
 
 import MagicCodeEditor from '@editor/layouts/CodeEditor.vue';
 
@@ -27,6 +28,13 @@ defineOptions({
   name: 'MFieldsVsCode',
 });
 
+/**
+ * 静默模式（submitForm/validateForm 隐藏挂载）下跳过 monaco 渲染：
+ * 校验由 FormItem 针对 model 中的值完成，与编辑器实例无关；本组件挂载无值副作用
+ * （save 仅由用户操作/编辑器内容变更触发），跳过可省去 monaco worker/model 的无谓实例化。
+ */
+const silentMode = inject(FORM_SILENT_MODE_KEY, false);
+
 const emit = defineEmits<{
   change: [value: string | any];
 }>();

package/src/layouts/props-panel/FormPanel.vue

@@ -49,14 +49,13 @@ import { Document as DocumentIcon } from '@element-plus/icons-vue';
 
 import { TMagicButton, tMagicMessage, TMagicScrollbar } from '@tmagic/design';
 import type { ContainerChangeEventData, FormConfig, FormState, FormValue } from '@tmagic/form';
-import { MForm } from '@tmagic/form';
+import { MForm, validateForm } from '@tmagic/form';
 import { filterXSS } from '@tmagic/utils';
 
 import MIcon from '@editor/components/Icon.vue';
 import { ENABLE_PROPS_FORM_VALIDATE } from '@editor/editorProps';
 import { useEditorContentHeight } from '@editor/hooks/use-editor-content-height';
 import { useServices } from '@editor/hooks/use-services';
-import { validatePropsForm } from '@editor/utils/props';
 
 import CodeEditor from '../CodeEditor.vue';
 
@@ -162,14 +161,19 @@ const saveCode = async (values: any) => {
   // 做一次静默校验（不复用、也不污染页面上正在展示的表单），并将校验结果（错误信息）随提交
   // 一并抛给上层记录，使源码保存的错误状态与表单编辑保持一致。
   try {
-    const error = await validatePropsForm({
+    const error = await validateForm({
       config: props.config,
-      values: newValues,
-      appContext: internalInstance?.appContext ?? null,
-      services,
-      stage: stage.value,
       typeMatchValid: true,
-      extendState: props.extendState,
+      initValues: newValues,
+      // 将当前组件实例的 provides（含 Editor 顶层的 services / codeOptions 等组件级 provide）
+      // 合入 appContext，使临时 MForm 中的编辑器字段组件（DataSourceInput 等）能正常 inject
+      appContext: internalInstance?.appContext ? { ...internalInstance?.appContext, provides: { services } } : null,
+      extendState: (state) => {
+        if (configFormRef.value?.formState) {
+          return { ...(configFormRef.value?.formState || {}) };
+        }
+        return props.extendState?.(state) || {};
+      },
     });
 
     if (error) {

package/src/layouts/props-panel/PropsPanel.vue

@@ -164,17 +164,25 @@ const submit = async (
     };
 
     if (v.style) {
-      Object.entries(v.style).forEach(([key, value]) => {
-        if (value !== '' && newValue.style) {
-          newValue.style[key] = value;
-        }
-      });
-
-      eventData?.changeRecords?.forEach((record) => {
-        if (record.propPath?.startsWith('style') && record.value === '') {
-          setValueByKeyPath(record.propPath, record.value, newValue);
-        }
-      });
+      // 空字符串样式值表示「清除该样式」，需保留才能在 doUpdate 的 mergeWith 中覆盖旧值。
+      if (eventData) {
+        // 表单编辑：先过滤掉空字符串（避免表单默认空值污染 DSL），
+        // 再按 changeRecords 恢复被主动清空的字段。
+        Object.entries(v.style).forEach(([key, value]) => {
+          if (value !== '' && newValue.style) {
+            newValue.style[key] = value;
+          }
+        });
+
+        eventData.changeRecords?.forEach((record) => {
+          if (record.propPath?.startsWith('style') && record.value === '') {
+            setValueByKeyPath(record.propPath, record.value, newValue);
+          }
+        });
+      } else {
+        // 源码编辑器保存（无 eventData）：style 原样保留，其中的空字符串视为用户主动清除该样式。
+        newValue.style = { ...v.style };
+      }
     }
 
     // 区分操作途径：表单字段编辑（MForm @change）会带上 eventData（含 changeRecords）；

package/src/services/editor.ts

@@ -554,6 +554,12 @@ class Editor extends BaseService {
       doNotPushHistory,
     });
 
+    // 页面 / 页面片新增不入历史栈（见上方 isPage / isPageFragment 分支），这里合并补发一次结构变更通知
+    const addedPages = newNodes.filter((node) => isPage(node) || isPageFragment(node)) as (MPage | MPageFragment)[];
+    if (addedPages.length) {
+      historyService.notifyPageStructureChange({ add: addedPages, remove: [] });
+    }
+
     return Array.isArray(addNode) ? newNodes : newNodes[0];
   }
 
@@ -695,6 +701,12 @@ class Editor extends BaseService {
 
     this.emit('remove', nodes);
     this.emit('change', { type: 'remove', data: changeItems, historySource, doNotPushHistory });
+
+    // 页面 / 页面片删除不入历史栈（见上方 isPage / isPageFragment 分支），这里合并补发一次结构变更通知
+    const removedPages = nodes.filter((node) => isPage(node) || isPageFragment(node)) as (MPage | MPageFragment)[];
+    if (removedPages.length) {
+      historyService.notifyPageStructureChange({ add: [], remove: removedPages });
+    }
   }
 
   public async doUpdate(
@@ -1776,6 +1788,10 @@ class Editor extends BaseService {
     const nextMap = new Map(nextPages.map((p) => [`${p.id}`, p]));
     const indexInItems = (root: MApp, id: Id) => (root.items ?? []).findIndex((item) => `${item.id}` === `${id}`);
 
+    // 收集本次整体替换中增删的页面，循环结束后合并为一次结构变更通知（避免逐页派发多个事件）
+    const addedPages: (MPage | MPageFragment)[] = [];
+    const removedPages: (MPage | MPageFragment)[] = [];
+
     nextPages.forEach((nextPage) => {
       const prevPage = prevMap.get(`${nextPage.id}`);
       if (!prevPage) {
@@ -1785,6 +1801,7 @@ class Editor extends BaseService {
           { newSchema: cloneDeep(toRaw(nextPage)), parentId: nextRoot.id, index: indexInItems(nextRoot, nextPage.id) },
           source,
         );
+        addedPages.push(nextPage);
       } else if (!isEqual(toRaw(prevPage), toRaw(nextPage))) {
         this.pushPageDiffStep(
           'update',
@@ -1803,8 +1820,13 @@ class Editor extends BaseService {
           { oldSchema: cloneDeep(toRaw(prevPage)), parentId: preRoot.id, index: indexInItems(preRoot, prevPage.id) },
           source,
         );
+        removedPages.push(prevPage);
       }
     });
+
+    if (addedPages.length || removedPages.length) {
+      historyService.notifyPageStructureChange({ add: addedPages, remove: removedPages });
+    }
   }
 
   /**

package/src/services/history.ts

@@ -19,7 +19,7 @@
 import { reactive } from 'vue';
 import type { Writable } from 'type-fest';
 
-import type { Id } from '@tmagic/core';
+import type { Id, MPage, MPageFragment } from '@tmagic/core';
 import { guid } from '@tmagic/utils';
 
 import type {
@@ -353,6 +353,27 @@ class History extends BaseService {
     this.emit('mark-saved', { kind: stepType, id });
   }
 
+  /**
+   * 派发「页面 / 页面片结构变更」事件（`page-structure-change`）。
+   *
+   * 常规 `editorService.add` / `remove` 页面节点不会写入 `page` 历史栈（见 editor.add / remove 中
+   * 对 isPage / isPageFragment 的分支），因此不会产生任何 historyService 事件。该方法用于在这些
+   * 场景（以及 setRoot 整体替换 DSL 增删页面）下，向外统一通知页面结构的增删变化，供业务方感知。
+   *
+   * 一次操作涉及多个页面时，调用方应把本次增删的页面**合并为一个 change 一次性传入**，
+   * 使一次操作只派发一个事件；`add` / `remove` 分别为本次新增与删除的页面列表（其一可为空数组）。
+   *
+   * @param change 本次结构变更：{ add: 新增的页面列表, remove: 删除的页面列表 }
+   */
+  public notifyPageStructureChange(change: {
+    add: (MPage | MPageFragment)[];
+    remove: (MPage | MPageFragment)[];
+  }): void {
+    // 增删均为空时不派发，避免无意义通知
+    if (!change.add.length && !change.remove.length) return;
+    this.emit('page-structure-change', change);
+  }
+
   /**
    * 把当前内存中的全部历史栈（页面 / 代码块 / 数据源 / 扩展类型）序列化后写入本地 IndexedDB。
    *

package/src/type.ts

@@ -1385,6 +1385,12 @@ export interface HistoryEvents {
   'mark-saved': [{ kind: HistoryStepType; id?: Id }];
   clear: [{ id: Id; stepType: HistoryStepType }];
   'marker-change': [{ id: Id; marker: StepValue; stepType: HistoryStepType }];
+  /**
+   * 页面 / 页面片结构变更（新增 / 删除）时派发，见 {@link HistoryService.notifyPageStructureChange}。
+   * 一次操作（add / remove / setRoot 整体替换）涉及多个页面时合并为**一个**事件；
+   * `add` / `remove` 分别为本次新增与删除的页面列表（其一可为空数组）。
+   */
+  'page-structure-change': [change: { add: (MPage | MPageFragment)[]; remove: (MPage | MPageFragment)[] }];
 }
 
 export const canUsePluginMethods = {

package/src/utils/data-source/index.ts

@@ -243,7 +243,7 @@ export const resolveFieldByPath = (
   fields: DataSchema[] | undefined,
   fieldNames: string[],
   options: { skipNumberIndices?: boolean } = {},
-): { ok: boolean; field?: DataSchema; fields: DataSchema[] } => {
+): { ok: boolean; field?: DataSchema; fields: DataSchema[]; failedName?: string } => {
   let currentFields = fields || [];
   let field: DataSchema | undefined;
 
@@ -252,11 +252,11 @@ export const resolveFieldByPath = (
       continue;
     }
     if (!currentFields.length) {
-      return { ok: false, fields: currentFields };
+      return { ok: false, fields: currentFields, failedName: name };
     }
     field = currentFields.find((item) => item.name === name);
     if (!field) {
-      return { ok: false, fields: currentFields };
+      return { ok: false, fields: currentFields, failedName: name };
     }
     currentFields = field.fields || [];
   }