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

package/dist/es/hooks/use-compare-form.js

@@ -1,12 +1,13 @@
+import { useEditorFormContext } from "./use-form-context.js";
 import { getCodeBlockFormConfig } from "../utils/code-block.js";
-import { computed, inject, provide, ref, useTemplateRef, watch, watchEffect } from "vue";
+import { computed, inject, provide, ref, useTemplateRef, watch } from "vue";
 //#region packages/editor/src/hooks/use-compare-form.ts
 /**
 * CompareForm / ViewForm 共用逻辑：
 * - 按 `category`(node / data-source / code-block) 加载 FormConfig（支持自定义 `loadConfig`）；
 * - 代码块 `content` 归一化为字符串；
 * - 外层容器固定高度 + 内部滚动的 `wrapperStyle`；
-* - 将 services / stage 注入 MForm.formState，保证 filterFunction 上下文一致。
+* - 将 services / stage 作为 form context 传给 MForm，保证 filterFunction 上下文一致。
 *
 * 两个组件的差异仅在于是否做新旧值对比，这部分逻辑保留在各自组件中。
 */
@@ -41,9 +42,7 @@ var useCompareForm = (props) => {
 			overflow: "auto"
 		};
 	});
-	const mergedExtendState = (state) => {
-		return (props.extendState ?? ((s) => s))(props.baseFormState || state);
-	};
+	const formContext = useEditorFormContext(() => props.services);
 	/**
 	* 内置的默认 FormConfig 加载逻辑：按 `category` 从对应 service / 工具取配置。
 	* 作为 ctx.defaultLoadConfig 透传给自定义 `loadConfig`，方便复用与二次加工。
@@ -88,29 +87,13 @@ var useCompareForm = (props) => {
 	], () => {
 		loadConfig();
 	}, { immediate: true });
-	const formRef = useTemplateRef("form");
-	/**
-	* 把 services / stage 注入 MForm 的 formState，避免 propsService 注入的表单配置中
-	* 形如 `display: ({ services }) => services.uiService.get(...)` 的 filterFunction
-	* 在执行时拿不到 `formState.services` 而报错。
-	*
-	* 与 props-panel/FormPanel.vue 中的注入方式保持一致：
-	* - services：整个 useServices() 返回的服务集合；
-	* - stage：当前 editorService.get('stage') 的最新值。
-	*/
-	watchEffect(() => {
-		if (formRef.value && props.services) {
-			formRef.value.formState.stage = props.services.editorService.get("stage");
-			formRef.value.formState.services = props.services;
-		}
-	});
 	return {
 		config,
 		currentValues,
 		wrapperStyle,
-		mergedExtendState,
+		formContext,
 		loadConfig,
-		formRef,
+		formRef: useTemplateRef("form"),
 		normalizeCodeBlockValue
 	};
 };

package/dist/es/hooks/use-form-context.js

@@ -0,0 +1,19 @@
+import { computed } from "vue";
+//#region packages/editor/src/hooks/use-form-context.ts
+/**
+* 编辑器注入给表单的业务上下文：`services` 与当前画布 `stage`。
+*
+* 由 `Editor.vue`（provide `FORM_CONTEXT_KEY`）、`FormPanel.vue` 与 `useCompareForm`
+* 共用。`stage` 走 computed 而非快照，保证切换画布后配置回调读到的是最新实例。
+*
+* 字段类型见 `@editor/type` 里对 `@tmagic/form-schema` 的 `FormContext` 模块增强。
+*/
+var useEditorFormContext = (getServices) => computed(() => {
+	const services = getServices();
+	return {
+		services,
+		stage: services?.editorService.get("stage")
+	};
+});
+//#endregion
+export { useEditorFormContext };

package/dist/es/index.js

@@ -31,7 +31,7 @@ import { IdleTask } from "./utils/dep/idle-task.js";
 import { ScrollViewer } from "./utils/scroll-viewer.js";
 import codeBlock_default from "./services/codeBlock.js";
 import dataSource_default from "./services/dataSource.js";
-import { ALL_COND_OPS, editorTypeMatchRules, validateDataSourceFieldSelectValue } from "./utils/type-match-rules.js";
+import { ALL_COND_OPS, editorTypeMatchRules, validateDataSourceFieldSelect } from "./utils/type-match-rules.js";
 import events_default from "./services/events.js";
 import { EVENT_NAME_VALUE_SEPARATOR, collectEventNameOptionValues, getCompActionAllowedValues, getCompActionOptions, getEventNameAllowedValues, getEventNameOptions, isEventNameCheckStrictly, normalizeCompActionValue } from "./utils/event.js";
 import monaco_editor_default from "./utils/monaco-editor.js";
@@ -81,6 +81,7 @@ import PageFragmentSelect_default from "./fields/PageFragmentSelect.js";
 import DisplayConds_default from "./fields/DisplayConds.js";
 import CondOpSelect_default from "./fields/CondOpSelect.js";
 import Index_default$1 from "./fields/StyleSetter/Index.js";
+import { editorFields } from "./fields/headless-validation.js";
 import plugin_default from "./plugin.js";
 import formPlugin from "@tmagic/form";
 import tablePlugin from "@tmagic/table";
@@ -92,4 +93,4 @@ export * from "@tmagic/table";
 export * from "@tmagic/stage";
 export * from "@tmagic/design";
 export * from "@tmagic/utils";
-export { ALL_COND_OPS, CODE_DRAFT_STORAGE_KEY, COPY_CODE_STORAGE_KEY, COPY_DS_STORAGE_KEY, COPY_STORAGE_KEY, CodeBlockEditor_default as CodeBlockEditor, CodeBlockList_default as CodeBlockList, CodeBlockListPanel_default as CodeBlockListPanel, CodeDeleteErrorType, CodeSelect_default as CodeSelect, CodeSelectCol_default as CodeSelectCol, ColumnLayout, CompareForm_default as CompareForm, ComponentListPanel_default as ComponentListPanel, CondOpSelect_default as CondOpSelect, ContentMenu_default as ContentMenu, DEFAULT_LEFT_COLUMN_WIDTH, DEFAULT_RIGHT_COLUMN_WIDTH, DataSourceAddButton_default as DataSourceAddButton, DataSourceConfigPanel_default as DataSourceConfigPanel, Index_default as DataSourceFieldSelect, DataSourceFields_default as DataSourceFields, DataSourceInput_default as DataSourceInput, DataSourceMethodSelect_default as DataSourceMethodSelect, DataSourceMethods_default as DataSourceMethods, DataSourceMocks_default as DataSourceMocks, DataSourceSelect_default as DataSourceSelect, DepTargetType, DisplayConds_default as DisplayConds, DragType, EVENT_NAME_VALUE_SEPARATOR, EventSelect_default as EventSelect, Fixed2Other, FloatingBox_default as FloatingBox, H_GUIDE_LINE_STORAGE_KEY, HistoryDiffDialog_default as HistoryDiffDialog, Bucket_default as HistoryListBucket, BucketTab_default as HistoryListBucketTab, Icon_default as Icon, IdleTask, KeyBindingCommand, KeyValue_default as KeyValue, Keys, LEFT_COLUMN_WIDTH_STORAGE_KEY, LayerNodeContent_default as LayerNodeContent, LayerOffset, LayerPanel_default as LayerPanel, Layout, SplitView_default as LayoutContainer, MIN_CENTER_COLUMN_WIDTH, MIN_LEFT_COLUMN_WIDTH, MIN_RIGHT_COLUMN_WIDTH, PROPS_PANEL_WIDTH_STORAGE_KEY, PageFragmentSelect_default as PageFragmentSelect, FormPanel_default as PropsFormPanel, PropsPanel_default as PropsPanel, RIGHT_COLUMN_WIDTH_STORAGE_KEY, Resizer_default as Resizer, ScrollViewer, SideItemKey, SplitView_default as SplitView, StageCore, Index_default$1 as StyleSetter, CodeEditor_default as TMagicCodeEditor, Editor_default as TMagicEditor, ToolButton_default as ToolButton, Tree_default as Tree, TreeNode_default as TreeNode, UI_SELECT_MODE_EVENT_NAME, UndoRedo, V_GUIDE_LINE_STORAGE_KEY, ViewForm_default as ViewForm, advancedTabConfig, arrayOptions, beforePaste, booleanOptions, buildChangeRecords, calcAlignCenterStyle, calcLayerTargetIndex, calcMoveStyle, canUsePluginMethods, change2Fixed, classifyDragSources, codeBlock_default as codeBlockService, collectEventNameOptionValues, collectRelatedNodes, componentList_default as componentListService, confirmHistoryAction, createStackStep, dataSource_default as dataSourceService, debug, plugin_default as default, defaultIsExpandable, dep_default as depService, describeRevertStep, describeStepForRevert, deserializeStacks, designPlugin, detectStackOpType, detectTargetId, detectTargetName, displayTabConfig, editorNodeMergeCustomizer, editor_default as editorService, editorTypeMatchRules, eqOptions, error, eventTabConfig, events_default as eventsService, fillConfig, fixNodeLeft, fixNodePosition, formPlugin, generatePageName, generatePageNameByApp, getAddParent, getCascaderOptionsFromFields, getCodeBlockFormConfig, getCompActionAllowedValues, getCompActionOptions, getCondOpOptionsByFieldType, getDefaultConfig, getDisplayField, getEditorConfig, getEventNameAllowedValues, getEventNameOptions, getFieldType, getFormConfig, getFormValue, getGuideLineFromCache, getInitPositionStyle, getLastPushedHistoryIds, getNodeIndex, getOrCreateStack, getPageFragmentList, getPageList, getPageNameList, getPositionInContainer, getRelativeStyle, history_default as historyService, idbDelete, idbGet, idbSet, info, isEventNameCheckStrictly, isGlobalFlat, isIncludeDataSource, isIndexedDBSupported, keybinding_default as keybindingService, monaco_editor_default as loadMonaco, log, markStackSaved, mergeSteps, moveItemsInContainer, normalizeCompActionValue, numberOptions, openIndexedDB, props_default as propsService, resolveFieldByPath, resolveSelectedNode, serializeConfig, serializeStacks, setChildrenLayout, setEditorConfig, setLayout, stageOverlay_default as stageOverlayService, storage_default as storageService, styleTabConfig, tablePlugin, toggleFixedPosition, ui_default as uiService, undoFloor, updateStatus, useCodeBlockEdit, useCompareForm, useEditorContentHeight, useFilter, useFloatBox, useGetSo, useHistoryRevert, useNextFloatBoxPosition, useNodeStatus, useServices, useStage, useWindowRect, validateDataSourceFieldSelectValue, warn };
+export { ALL_COND_OPS, CODE_DRAFT_STORAGE_KEY, COPY_CODE_STORAGE_KEY, COPY_DS_STORAGE_KEY, COPY_STORAGE_KEY, CodeBlockEditor_default as CodeBlockEditor, CodeBlockList_default as CodeBlockList, CodeBlockListPanel_default as CodeBlockListPanel, CodeDeleteErrorType, CodeSelect_default as CodeSelect, CodeSelectCol_default as CodeSelectCol, ColumnLayout, CompareForm_default as CompareForm, ComponentListPanel_default as ComponentListPanel, CondOpSelect_default as CondOpSelect, ContentMenu_default as ContentMenu, DEFAULT_LEFT_COLUMN_WIDTH, DEFAULT_RIGHT_COLUMN_WIDTH, DataSourceAddButton_default as DataSourceAddButton, DataSourceConfigPanel_default as DataSourceConfigPanel, Index_default as DataSourceFieldSelect, DataSourceFields_default as DataSourceFields, DataSourceInput_default as DataSourceInput, DataSourceMethodSelect_default as DataSourceMethodSelect, DataSourceMethods_default as DataSourceMethods, DataSourceMocks_default as DataSourceMocks, DataSourceSelect_default as DataSourceSelect, DepTargetType, DisplayConds_default as DisplayConds, DragType, EVENT_NAME_VALUE_SEPARATOR, EventSelect_default as EventSelect, Fixed2Other, FloatingBox_default as FloatingBox, H_GUIDE_LINE_STORAGE_KEY, HistoryDiffDialog_default as HistoryDiffDialog, Bucket_default as HistoryListBucket, BucketTab_default as HistoryListBucketTab, Icon_default as Icon, IdleTask, KeyBindingCommand, KeyValue_default as KeyValue, Keys, LEFT_COLUMN_WIDTH_STORAGE_KEY, LayerNodeContent_default as LayerNodeContent, LayerOffset, LayerPanel_default as LayerPanel, Layout, SplitView_default as LayoutContainer, MIN_CENTER_COLUMN_WIDTH, MIN_LEFT_COLUMN_WIDTH, MIN_RIGHT_COLUMN_WIDTH, PROPS_PANEL_WIDTH_STORAGE_KEY, PageFragmentSelect_default as PageFragmentSelect, FormPanel_default as PropsFormPanel, PropsPanel_default as PropsPanel, RIGHT_COLUMN_WIDTH_STORAGE_KEY, Resizer_default as Resizer, ScrollViewer, SideItemKey, SplitView_default as SplitView, StageCore, Index_default$1 as StyleSetter, CodeEditor_default as TMagicCodeEditor, Editor_default as TMagicEditor, ToolButton_default as ToolButton, Tree_default as Tree, TreeNode_default as TreeNode, UI_SELECT_MODE_EVENT_NAME, UndoRedo, V_GUIDE_LINE_STORAGE_KEY, ViewForm_default as ViewForm, advancedTabConfig, arrayOptions, beforePaste, booleanOptions, buildChangeRecords, calcAlignCenterStyle, calcLayerTargetIndex, calcMoveStyle, canUsePluginMethods, change2Fixed, classifyDragSources, codeBlock_default as codeBlockService, collectEventNameOptionValues, collectRelatedNodes, componentList_default as componentListService, confirmHistoryAction, createStackStep, dataSource_default as dataSourceService, debug, plugin_default as default, defaultIsExpandable, dep_default as depService, describeRevertStep, describeStepForRevert, deserializeStacks, designPlugin, detectStackOpType, detectTargetId, detectTargetName, displayTabConfig, editorFields, editorNodeMergeCustomizer, editor_default as editorService, editorTypeMatchRules, eqOptions, error, eventTabConfig, events_default as eventsService, fillConfig, fixNodeLeft, fixNodePosition, formPlugin, generatePageName, generatePageNameByApp, getAddParent, getCascaderOptionsFromFields, getCodeBlockFormConfig, getCompActionAllowedValues, getCompActionOptions, getCondOpOptionsByFieldType, getDefaultConfig, getDisplayField, getEditorConfig, getEventNameAllowedValues, getEventNameOptions, getFieldType, getFormConfig, getFormValue, getGuideLineFromCache, getInitPositionStyle, getLastPushedHistoryIds, getNodeIndex, getOrCreateStack, getPageFragmentList, getPageList, getPageNameList, getPositionInContainer, getRelativeStyle, history_default as historyService, idbDelete, idbGet, idbSet, info, isEventNameCheckStrictly, isGlobalFlat, isIncludeDataSource, isIndexedDBSupported, keybinding_default as keybindingService, monaco_editor_default as loadMonaco, log, markStackSaved, mergeSteps, moveItemsInContainer, normalizeCompActionValue, numberOptions, openIndexedDB, props_default as propsService, resolveFieldByPath, resolveSelectedNode, serializeConfig, serializeStacks, setChildrenLayout, setEditorConfig, setLayout, stageOverlay_default as stageOverlayService, storage_default as storageService, styleTabConfig, tablePlugin, toggleFixedPosition, ui_default as uiService, undoFloor, updateStatus, useCodeBlockEdit, useCompareForm, useEditorContentHeight, useFilter, useFloatBox, useGetSo, useHistoryRevert, useNextFloatBoxPosition, useNodeStatus, useServices, useStage, useWindowRect, validateDataSourceFieldSelect, warn };

package/dist/es/initService.js

@@ -1,9 +1,22 @@
 import { isIncludeDataSource } from "./utils/editor.js";
+import { error } from "./utils/logger.js";
 import { getDepNodeIds, getNodes, isPage, isValueIncludeDataSource } from "@tmagic/utils";
 import { DepTargetType, NODE_CONDS_KEY, NodeType, createCodeBlockTarget, createDataSourceCondTarget, createDataSourceMethodTarget, createDataSourceTarget, updateNode } from "@tmagic/core";
 import { nextTick, onBeforeUnmount, reactive, toRaw, watch } from "vue";
 import { cloneDeep as cloneDeep$1 } from "lodash-es";
 //#region packages/editor/src/initService.ts
+/**
+* select 为异步串行执行，节点不可选中（如已从 DSL 中移除）时会抛错。
+* 在 watch 回调中调用不能把拒绝抛回调用方，否则会变成 Vue 的「Unhandled error during execution of watcher callback」，
+* 这里统一兜底成日志。
+*/
+var selectNode = async (editorService, id) => {
+	try {
+		await editorService.select(id);
+	} catch (e) {
+		error(e);
+	}
+};
 var initServiceState = (props, { editorService, historyService, componentListService, propsService, eventsService, uiService, codeBlockService, keybindingService, dataSourceService, depService }) => {
 	watch(() => props.modelValue, (modelValue) => {
 		editorService.set("root", modelValue || null, { historySource: "initial" });
@@ -46,7 +59,10 @@ var initServiceState = (props, { editorService, historyService, componentListSer
 		for (const [key, value] of Object.entries(eventsList)) dataSourceService.setFormEvent(key, value);
 		for (const [key, value] of Object.entries(methodsList)) dataSourceService.setFormMethod(key, value);
 	}, { immediate: true });
-	watch(() => props.defaultSelected, (defaultSelected) => defaultSelected && editorService.select(defaultSelected), { immediate: true });
+	watch(() => props.defaultSelected, (defaultSelected) => {
+		if (!defaultSelected || !editorService.getNodeById(defaultSelected)) return;
+		selectNode(editorService, defaultSelected);
+	}, { immediate: true });
 	watch(() => props.stageRect, (stageRect) => stageRect && uiService.set("stageRect", stageRect), { immediate: true });
 	watch(() => props.disabledCodeBlock, (disabledCodeBlock) => propsService.setDisabledCodeBlock(disabledCodeBlock ?? false), { immediate: true });
 	watch(() => props.disabledDataSource, (disabledDataSource) => propsService.setDisabledDataSource(disabledDataSource ?? false), { immediate: true });

package/dist/es/layouts/history-list/HistoryDiffDialog.vue_vue_type_script_setup_true_lang.js

@@ -25,14 +25,12 @@ var HistoryDiffDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*
 	__name: "HistoryDiffDialog",
 	props: {
 		services: {},
-		extendState: {},
 		loadConfig: {},
 		width: { default: "900px" },
 		size: {},
 		isConfirm: { type: Boolean },
 		onConfirm: {},
-		selfDiffFieldTypes: {},
-		compareFormState: {}
+		selfDiffFieldTypes: {}
 	},
 	emits: ["close"],
 	setup(__props, { expose: __expose, emit: __emit }) {
@@ -254,8 +252,6 @@ var HistoryDiffDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*
 						"data-source-type": payload.value.dataSourceType,
 						value: rightValue.value,
 						"last-value": leftValue.value,
-						"base-form-state": __props.compareFormState,
-						"extend-state": __props.extendState,
 						"load-config": __props.loadConfig,
 						"self-diff-field-types": __props.selfDiffFieldTypes,
 						services: props.services,
@@ -267,8 +263,6 @@ var HistoryDiffDialog_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*
 						"data-source-type",
 						"value",
 						"last-value",
-						"base-form-state",
-						"extend-state",
 						"load-config",
 						"self-diff-field-types",
 						"services",

package/dist/es/layouts/history-list/HistoryListPanel.vue_vue_type_script_setup_true_lang.js

@@ -62,13 +62,6 @@ var HistoryListPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 		watch([disabledDataSource, disabledCodeBlock], ([dsDisabled, cbDisabled]) => {
 			if (activeTab.value === "data-source" && dsDisabled || activeTab.value === "code-block" && cbDisabled) activeTab.value = "page";
 		});
-		/**
-		* 通过 inject 拿到 Editor 顶层注入的 `extendFormState`，转交给 HistoryDiffDialog
-		* 内部的 CompareForm，使差异对比表单的 filterFunction 能拿到完整的业务上下文。
-		* 未提供时为 undefined，CompareForm/MForm 会跳过 extendState 处理。
-		*/
-		const extendFormState = inject("extendFormState", void 0);
-		const getPropsPanelFormState = inject("getPropsPanelFormState", void 0);
 		const { expanded, toggleGroup, pageGroups, dataSourceGroups, codeBlockGroups, pageGroupsDisplay, dataSourceGroupsByTarget, codeBlockGroupsByTarget } = useHistoryList();
 		/**
 		* 当前活动页的「加载/初始」标记记录（设置 root 时生成），透传给 PageTab 的底部初始行展示。
@@ -152,10 +145,7 @@ var HistoryListPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 		* 二者均由 useHistoryRevert 内部按需动态挂载 HistoryDiffDialog，
 		* 业务方亦可直接 import useHistoryRevert(options, services) 调用，无需自行挂载任何弹窗。
 		*/
-		const { onPageRevert, onDataSourceRevert, onCodeBlockRevert, onPageDiff, onDataSourceDiff, onCodeBlockDiff } = useHistoryRevert({
-			extendState: extendFormState,
-			getPropsPanelFormState
-		}, services);
+		const { onPageRevert, onDataSourceRevert, onCodeBlockRevert, onPageDiff, onDataSourceDiff, onCodeBlockDiff } = useHistoryRevert({}, services);
 		/**
 		* 把内存中（已清空对应类别后的）历史状态重新写回 IndexedDB，
 		* 使本地持久化的那份与内存保持一致——即「连同本地保存的一并删除」。

package/dist/es/layouts/history-list/useHistoryRevert.js

@@ -43,10 +43,8 @@ var mountHistoryDiffDialog = async (options) => {
 	const app = createApp(historyDiffDialog, {
 		services: options.services,
 		isConfirm: options.isConfirm,
-		extendState: options.extendState,
 		loadConfig: options.loadConfig,
 		selfDiffFieldTypes: options.selfDiffFieldTypes,
-		compareFormState: options.compareFormState,
 		width: options.width,
 		size: options.size ?? options.services?.uiService?.get("propsPanelSize"),
 		onClose: options.onClose
@@ -127,7 +125,7 @@ var viewHistoryDiffDialog = async (payload, options) => {
 */
 var useHistoryRevert = (options = {}, services) => {
 	const appContext = options.appContext ?? getCurrentInstance()?.appContext ?? null;
-	const { extendState, getPropsPanelFormState, dialogWidth } = options;
+	const { dialogWidth } = options;
 	/** 目标数据已被删除、无法回滚时的统一提示。 */
 	const showRevertTargetMissing = () => {
 		tMagicMessage.error("回滚失败：该记录对应的数据已被删除");
@@ -146,7 +144,6 @@ var useHistoryRevert = (options = {}, services) => {
 	const runRevert = (payload, extra) => {
 		if (payload) return confirmRevertWithDiffDialog(payload, {
 			appContext,
-			extendState,
 			services,
 			...extra,
 			width: extra?.width ?? dialogWidth,
@@ -205,7 +202,7 @@ var useHistoryRevert = (options = {}, services) => {
 			showRevertTargetMissing();
 			return Promise.resolve(null);
 		}
-		return runRevert(buildPageDiffPayload(index), { compareFormState: getPropsPanelFormState?.() }).then((result) => result ? services?.editorService.revertPageStep(index) : null);
+		return runRevert(buildPageDiffPayload(index), {}).then((result) => result ? services?.editorService.revertPageStep(index) : null);
 	};
 	const onDataSourceRevert = (id, index) => {
 		if (isDataSourceRevertTargetMissing(id, index)) {
@@ -229,17 +226,14 @@ var useHistoryRevert = (options = {}, services) => {
 		const payload = buildPageDiffPayload(index);
 		if (payload) return viewHistoryDiffDialog(payload, {
 			appContext,
-			extendState,
 			services,
-			width: dialogWidth,
-			compareFormState: getPropsPanelFormState?.()
+			width: dialogWidth
 		});
 	};
 	const onDataSourceDiff = (id, index) => {
 		const payload = buildDataSourceDiffPayload(id, index);
 		if (payload) return viewHistoryDiffDialog(payload, {
 			appContext,
-			extendState,
 			services,
 			width: dialogWidth
 		});
@@ -248,7 +242,6 @@ var useHistoryRevert = (options = {}, services) => {
 		const payload = buildCodeBlockDiffPayload(id, index);
 		if (payload) return viewHistoryDiffDialog(payload, {
 			appContext,
-			extendState,
 			services,
 			width: dialogWidth
 		});
@@ -289,7 +282,6 @@ var useHistoryRevert = (options = {}, services) => {
 	const viewDiff = (payload, extra) => {
 		if (payload) return viewHistoryDiffDialog(payload, {
 			appContext,
-			extendState,
 			services,
 			...extra,
 			width: extra?.width ?? dialogWidth,

package/dist/es/layouts/props-panel/FormPanel.vue_vue_type_script_setup_true_lang.js

@@ -1,3 +1,4 @@
+import { useEditorFormContext } from "../../hooks/use-form-context.js";
 import { useServices } from "../../hooks/use-services.js";
 import { useEditorContentHeight } from "../../hooks/use-editor-content-height.js";
 import Icon_default from "../../components/Icon.js";
@@ -6,7 +7,7 @@ import { ENABLE_PROPS_FORM_VALIDATE } from "../../editorProps.js";
 import { MForm, validateForm } from "@tmagic/form";
 import { TMagicButton, TMagicScrollbar, tMagicMessage } from "@tmagic/design";
 import { filterXSS } from "@tmagic/utils";
-import { computed, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, getCurrentInstance, inject, normalizeClass, onMounted, onUnmounted, openBlock, ref, renderSlot, unref, useTemplateRef, watchEffect, withCtx } from "vue";
+import { computed, createBlock, createCommentVNode, createElementBlock, createVNode, defineComponent, getCurrentInstance, inject, normalizeClass, onMounted, onUnmounted, openBlock, ref, renderSlot, unref, useTemplateRef, withCtx } from "vue";
 import { Document } from "@element-plus/icons-vue";
 //#region packages/editor/src/layouts/props-panel/FormPanel.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "m-editor-props-form-panel" };
@@ -19,8 +20,7 @@ var FormPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 		disabledShowSrc: { type: Boolean },
 		labelWidth: {},
 		codeValueKey: {},
-		labelPosition: {},
-		extendState: { type: Function }
+		labelPosition: {}
 	},
 	emits: [
 		"submit",
@@ -34,19 +34,13 @@ var FormPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 		const emit = __emit;
 		const enablePropsFormValidate = inject(ENABLE_PROPS_FORM_VALIDATE, false);
 		const services = useServices();
-		const { editorService, uiService } = services;
+		const { uiService } = services;
 		const codeOptions = inject("codeOptions", {});
 		const showSrc = ref(false);
 		const propsPanelSize = computed(() => uiService.get("propsPanelSize") || "small");
 		const { height: editorContentHeight } = useEditorContentHeight();
-		const stage = computed(() => editorService.get("stage"));
+		const formContext = useEditorFormContext(() => services);
 		const configFormRef = useTemplateRef("configForm");
-		watchEffect(() => {
-			if (configFormRef.value) {
-				configFormRef.value.formState.stage = stage.value;
-				configFormRef.value.formState.services = services;
-			}
-		});
 		const internalInstance = getCurrentInstance();
 		onMounted(() => {
 			emit("mounted", internalInstance?.proxy);
@@ -85,14 +79,7 @@ var FormPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 					config: props.config,
 					typeMatchValid: true,
 					initValues: newValues,
-					appContext: internalInstance?.appContext ? {
-						...internalInstance?.appContext,
-						provides: { services }
-					} : null,
-					extendState: (state) => {
-						if (configFormRef.value?.formState) return { ...configFormRef.value?.formState || {} };
-						return props.extendState?.(state) || {};
-					}
+					context: formContext.value
 				});
 				if (error) tMagicMessage({
 					type: "error",
@@ -101,8 +88,8 @@ var FormPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 				});
 				emit("submit", newValues, void 0, error ? new Error(error) : void 0);
 			} catch (e) {
-				console.log("validateForm error", e);
-				emit("submit", newValues);
+				console.error("validateForm error", e);
+				emit("submit", newValues, void 0, e instanceof Error ? e : new Error(String(e)));
 			}
 		};
 		__expose({
@@ -123,7 +110,7 @@ var FormPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 						"init-values": __props.values,
 						config: __props.config,
 						"type-match-valid": true,
-						"extend-state": __props.extendState,
+						context: unref(formContext),
 						"validate-on-init": true,
 						onChange: submit,
 						onError: errorHandler
@@ -135,7 +122,7 @@ var FormPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 						"size",
 						"init-values",
 						"config",
-						"extend-state"
+						"context"
 					])]),
 					_: 1
 				}),

package/dist/es/layouts/props-panel/PropsPanel.vue_vue_type_script_setup_true_lang.js

@@ -20,10 +20,7 @@ var _hoisted_2 = { class: "m-editor-props-style-panel-title" };
 var PropsPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "MEditorPropsPanel",
 	__name: "PropsPanel",
-	props: {
-		disabledShowSrc: { type: Boolean },
-		extendState: { type: Function }
-	},
+	props: { disabledShowSrc: { type: Boolean } },
 	emits: [
 		"submit-error",
 		"form-error",
@@ -149,7 +146,6 @@ var PropsPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 					config: curFormConfig.value,
 					values: values.value,
 					disabledShowSrc: __props.disabledShowSrc,
-					extendState: __props.extendState,
 					onSubmit: _cache[0] || (_cache[0] = (v, eventData, error) => submit(v, eventData, error, "props")),
 					onSubmitError: errorHandler,
 					onFormError: errorHandler,
@@ -159,8 +155,7 @@ var PropsPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 					"class",
 					"config",
 					"values",
-					"disabledShowSrc",
-					"extendState"
+					"disabledShowSrc"
 				]),
 				unref(showStylePanel) ? (openBlock(), createBlock(Resizer_default, {
 					key: 0,
@@ -174,7 +169,6 @@ var PropsPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 					config: styleFormConfig,
 					values: values.value,
 					disabledShowSrc: __props.disabledShowSrc,
-					extendState: __props.extendState,
 					onSubmit: _cache[2] || (_cache[2] = (v, eventData, error) => submit(v, eventData, error, "style")),
 					onSubmitError: errorHandler,
 					onFormError: errorHandler
@@ -188,11 +182,7 @@ var PropsPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defin
 						_: 1
 					})])])]),
 					_: 1
-				}, 8, [
-					"values",
-					"disabledShowSrc",
-					"extendState"
-				])) : createCommentVNode("v-if", true),
+				}, 8, ["values", "disabledShowSrc"])) : createCommentVNode("v-if", true),
 				unref(showStylePanelToggleButton) && !unref(showStylePanel) ? (openBlock(), createBlock(unref(TMagicButton), {
 					key: 2,
 					class: "m-editor-props-panel-style-icon",

package/dist/es/layouts/sidebar/code-block/CodeBlockListPanel.vue_vue_type_script_setup_true_lang.js

@@ -20,7 +20,7 @@ var CodeBlockListPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE__
 	},
 	setup(__props) {
 		const props = __props;
-		const eventBus = inject("eventBus");
+		const eventBus = inject("eventBus", null);
 		const { codeBlockService } = useServices();
 		const editable = computed(() => codeBlockService.getEditStatus());
 		const { codeId, codeBlockEditor, codeConfig, editCode, deleteCode, createCodeBlock, submitCodeBlockHandler } = useCodeBlockEdit(codeBlockService);

package/dist/es/layouts/sidebar/code-block/useContentMenu.js

@@ -3,7 +3,7 @@ import { cloneDeep } from "lodash-es";
 import { CopyDocument, Delete, Edit } from "@element-plus/icons-vue";
 //#region packages/editor/src/layouts/sidebar/code-block/useContentMenu.ts
 var useContentMenu = (deleteCode) => {
-	const eventBus = inject("eventBus");
+	const eventBus = inject("eventBus", null);
 	const menuRef = useTemplateRef("menu");
 	let selectId = "";
 	let selectData = null;

package/dist/es/layouts/sidebar/data-source/DataSourceListPanel.vue_vue_type_script_setup_true_lang.js

@@ -21,7 +21,7 @@ var DataSourceListPanel_vue_vue_type_script_setup_true_lang_default = /*@__PURE_
 	},
 	setup(__props) {
 		const props = __props;
-		const eventBus = inject("eventBus");
+		const eventBus = inject("eventBus", null);
 		const { dataSourceService } = useServices();
 		const { editDialog, dataSourceValues, dialogTitle, editable, editHandler, submitDataSourceHandler } = useDataSourceEdit(dataSourceService);
 		/** 打开数据源详情时需要直接定位并打开的方法名，为空则正常展示「数据定义」tab */

package/dist/es/layouts/sidebar/data-source/useContentMenu.js

@@ -3,7 +3,7 @@ import { cloneDeep } from "lodash-es";
 import { CopyDocument, Delete, Edit } from "@element-plus/icons-vue";
 //#region packages/editor/src/layouts/sidebar/data-source/useContentMenu.ts
 var useContentMenu = () => {
-	const eventBus = inject("eventBus");
+	const eventBus = inject("eventBus", null);
 	const menuRef = useTemplateRef("menu");
 	let selectId = "";
 	let selectData = null;

package/dist/es/plugin.js

@@ -1,5 +1,4 @@
 import { setEditorConfig } from "./utils/config.js";
-import { editorTypeMatchRules } from "./utils/type-match-rules.js";
 import CodeEditor_default from "./layouts/CodeEditor.js";
 import Editor_default from "./Editor.js";
 import CodeSelect_default from "./fields/CodeSelect.js";
@@ -17,11 +16,12 @@ import PageFragmentSelect_default from "./fields/PageFragmentSelect.js";
 import DisplayConds_default from "./fields/DisplayConds.js";
 import CondOpSelect_default from "./fields/CondOpSelect.js";
 import Index_default$1 from "./fields/StyleSetter/Index.js";
+import { editorFields } from "./fields/headless-validation.js";
 import Code_default from "./fields/Code.js";
 import CodeLink_default from "./fields/CodeLink.js";
 import UISelect_default from "./fields/UISelect.js";
 /* empty css            */
-import formPlugin, { registerSilentLeafFieldTypes, registerTypeMatchRules } from "@tmagic/form";
+import formPlugin, { mergeFieldOptions } from "@tmagic/form";
 import tablePlugin from "@tmagic/table";
 import designPlugin from "@tmagic/design";
 //#region packages/editor/src/plugin.ts
@@ -31,42 +31,43 @@ var defaultInstallOpt = {
 	customCreateMonacoDiffEditor: (monaco, codeEditorEl, options) => monaco.editor.createDiffEditor(codeEditorEl, options),
 	flat: false
 };
+var editorFieldVue = {
+	"vs-code": { component: Code_default },
+	"ui-select": { component: UISelect_default },
+	"cond-op-select": { component: CondOpSelect_default },
+	"page-fragment-select": { component: PageFragmentSelect_default },
+	"data-source-select": { component: DataSourceSelect_default },
+	"data-source-input": { component: DataSourceInput_default },
+	"code-link": { component: CodeLink_default },
+	"key-value": { component: KeyValue_default },
+	"code-select-col": { component: CodeSelectCol_default },
+	"data-source-fields": { component: DataSourceFields_default },
+	"data-source-mocks": { component: DataSourceMocks_default },
+	"data-source-methods": { component: DataSourceMethods_default },
+	"data-source-method-select": { component: DataSourceMethodSelect_default },
+	"data-source-field-select": { component: Index_default },
+	"code-select": { component: CodeSelect_default },
+	"display-conds": { component: DisplayConds_default },
+	"event-select": { component: EventSelect_default },
+	"style-setter": { container: Index_default$1 }
+};
 var plugin_default = { install: (app, opt) => {
-	const option = Object.assign(defaultInstallOpt, opt || {});
-	app.use(designPlugin, opt || {});
-	app.use(formPlugin, opt || {});
+	const incoming = opt || {};
+	const option = {
+		...defaultInstallOpt,
+		...incoming
+	};
+	const formOpt = incoming;
+	app.use(designPlugin, incoming);
+	app.use(formPlugin, {
+		...formOpt,
+		fields: mergeFieldOptions(editorFields, editorFieldVue, formOpt.fields)
+	});
 	app.use(tablePlugin);
-	registerTypeMatchRules(editorTypeMatchRules);
-	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);
 	app.component("magic-code-editor", CodeEditor_default);
-	app.component("m-fields-ui-select", UISelect_default);
-	app.component("m-fields-code-link", CodeLink_default);
-	app.component("m-fields-vs-code", Code_default);
-	app.component("m-fields-code-select", CodeSelect_default);
-	app.component("m-fields-code-select-col", CodeSelectCol_default);
-	app.component("m-fields-event-select", EventSelect_default);
-	app.component("m-fields-data-source-fields", DataSourceFields_default);
-	app.component("m-fields-data-source-mocks", DataSourceMocks_default);
-	app.component("m-fields-key-value", KeyValue_default);
-	app.component("m-fields-data-source-input", DataSourceInput_default);
-	app.component("m-fields-data-source-select", DataSourceSelect_default);
-	app.component("m-fields-data-source-methods", DataSourceMethods_default);
-	app.component("m-fields-data-source-method-select", DataSourceMethodSelect_default);
-	app.component("m-fields-data-source-field-select", Index_default);
-	app.component("m-fields-page-fragment-select", PageFragmentSelect_default);
-	app.component("m-fields-display-conds", DisplayConds_default);
-	app.component("m-fields-cond-op-select", CondOpSelect_default);
-	app.component("m-form-style-setter", Index_default$1);
 } };
 //#endregion
 export { plugin_default as default };