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

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.8.0-beta.24",
+  "version": "1.8.0-beta.26",
   "name": "@tmagic/editor",
   "type": "module",
   "sideEffects": [
@@ -17,6 +17,11 @@
       "import": "./dist/es/index.js",
       "require": "./dist/tmagic-editor.umd.cjs"
     },
+    "./headless": {
+      "types": "./types/headless.d.ts",
+      "import": "./dist/es/headless.js",
+      "require": "./dist/tmagic-editor-headless.umd.cjs"
+    },
     "./dist/style.css": {
       "import": "./dist/style.css",
       "require": "./dist/style.css"
@@ -58,11 +63,11 @@
     "moveable": "^0.53.0",
     "serialize-javascript": "^7.0.7",
     "sortablejs": "^1.15.7",
-    "@tmagic/design": "1.8.0-beta.24",
-    "@tmagic/form": "1.8.0-beta.24",
-    "@tmagic/utils": "1.8.0-beta.24",
-    "@tmagic/stage": "1.8.0-beta.24",
-    "@tmagic/table": "1.8.0-beta.24"
+    "@tmagic/design": "1.8.0-beta.26",
+    "@tmagic/form": "1.8.0-beta.26",
+    "@tmagic/stage": "1.8.0-beta.26",
+    "@tmagic/table": "1.8.0-beta.26",
+    "@tmagic/utils": "1.8.0-beta.26"
   },
   "devDependencies": {
     "@types/events": "^3.0.3",
@@ -76,7 +81,7 @@
     "type-fest": "^5.2.0",
     "typescript": "^6.0.3",
     "vue": "^3.5.41",
-    "@tmagic/core": "1.8.0-beta.24"
+    "@tmagic/core": "1.8.0-beta.26"
   },
   "peerDependenciesMeta": {
     "typescript": {

package/src/Editor.vue

@@ -101,7 +101,6 @@
     <template #props-panel>
       <slot name="props-panel">
         <PropsPanel
-          :extend-state="extendFormState"
           :disabled-show-src="disabledShowSrc"
           @mounted="propsPanelMountedHandler"
           @unmounted="propsPanelUnmountedHandler"
@@ -136,11 +135,13 @@
 <script lang="ts" setup>
 import { EventEmitter } from 'events';
 
-import { computed, provide, ref } from 'vue';
+import { computed, provide } from 'vue';
 
 import type { MApp } from '@tmagic/core';
 import { M_THEME_KEY } from '@tmagic/design';
+import { FORM_CONTEXT_KEY } from '@tmagic/form';
 
+import { useEditorFormContext } from './hooks/use-form-context';
 import Framework from './layouts/Framework.vue';
 import TMagicNavMenu from './layouts/NavMenu.vue';
 import FormPanel from './layouts/props-panel/FormPanel.vue';
@@ -230,8 +231,6 @@ const stageOptions: StageOptions = {
 
 stageOverlayService.set('stageOptions', stageOptions);
 
-const propsPanelRef = ref<InstanceType<typeof FormPanel> | null>(null);
-
 provide('services', services);
 
 provide('codeOptions', props.codeOptions);
@@ -239,11 +238,16 @@ provide('stageOptions', stageOptions);
 /** 是否启用「属性配置表单校验」联动能力，供 PropsPanel / FormPanel 判断校验失败时是否仍更新节点并记录错误 */
 provide(ENABLE_PROPS_FORM_VALIDATE, props.enablePropsFormValidate ?? false);
 /**
- * 把顶层 `extendFormState` 提供给非 PropsPanel 链路上的组件使用（例如历史差异对话框 HistoryDiffDialog
- * 内部的 CompareForm）。这样所有依赖业务上下文的表单 filterFunction 都能拿到一致的扩展状态，
- * 与 PropsPanel 通过 `:extend-state` 显式传入的方式保持等价。
+ * 编辑器注入给整棵表单树的业务上下文（`services` / `stage`），属性面板、对比表单、
+ * 侧边栏里的嵌套 MForm 都通过 inject 自动继承。
+ *
+ * 业务方要追加自己的字段，在 `<MEditor>` 外层再 `provide(FORM_CONTEXT_KEY, computed(...))`
+ * 即可，配置回调统一通过 `mForm.xxx` 读取。
  */
-provide('extendFormState', props.extendFormState);
+provide(
+  FORM_CONTEXT_KEY,
+  useEditorFormContext(() => services),
+);
 
 // 用 computed 包一层再 provide，否则传下去的是 provide 那一刻的值快照，
 // props.isLargeStageContainer 后续变化不会同步到子孙（如 @tmagic/design/ColorPicker）。
@@ -253,12 +257,6 @@ provide(
   'isLargeStageContainer',
   computed(() => props.isLargeStageContainer),
 );
-/**
- * 提供 PropsPanel 主属性表单的 formState getter，供历史差异弹窗复用，
- * 让 CompareForm 与 PropsPanel 的 filterFunction 上下文保持一致。
- */
-provide('getPropsPanelFormState', () => propsPanelRef.value?.configForm?.formState);
-
 /**
  * 把历史记录面板的自定义扩展 tab 提供给深层的 HistoryListPanel（它挂在 NavMenu 中，
  * 以 markRaw component 形式渲染，无法直接通过 props 透传）。业务方可借此在历史记录
@@ -279,11 +277,9 @@ provide(
 );
 
 const propsPanelMountedHandler = (e: InstanceType<typeof FormPanel>) => {
-  propsPanelRef.value = e;
   emit('props-panel-mounted', e);
 };
 const propsPanelUnmountedHandler = () => {
-  propsPanelRef.value = null;
   emit('props-panel-unmounted');
 };
 

package/src/components/CodeParams.vue

@@ -15,7 +15,13 @@
 <script lang="ts" setup>
 import { computed, useTemplateRef } from 'vue';
 
-import { type ContainerChangeEventData, type FormItemConfig, type FormValue, MForm } from '@tmagic/form';
+import {
+  type ContainerChangeEventData,
+  defineFormItem,
+  type FormItemConfig,
+  type FormValue,
+  MForm,
+} from '@tmagic/form';
 
 import type { CodeParamStatement } from '@editor/type';
 import { error } from '@editor/utils';
@@ -41,13 +47,13 @@ const emit = defineEmits(['change']);
 const formRef = useTemplateRef<InstanceType<typeof MForm>>('form');
 
 const getFormConfig = (items: FormItemConfig[] = []) => [
-  {
+  defineFormItem({
     type: 'fieldset',
     items,
     legend: '参数',
-    labelWidth: '120px',
+    labelPosition: 'top',
     name: props.name,
-  },
+  }),
 ];
 
 const codeParamsConfig = computed(() =>

package/src/components/CompareForm.vue

@@ -10,7 +10,7 @@
       :is-compare="true"
       :disabled="true"
       :label-width="labelWidth"
-      :extend-state="mergedExtendState"
+      :context="formContext"
       :show-diff="showDiff"
       :self-diff-field-types="selfDiffFieldTypes"
       :size="size"
@@ -47,7 +47,7 @@ const props = withDefaults(
   },
 );
 
-const { config, currentValues, wrapperStyle, mergedExtendState, loadConfig, formRef, normalizeCodeBlockValue } =
+const { config, currentValues, wrapperStyle, formContext, loadConfig, formRef, normalizeCodeBlockValue } =
   useCompareForm(props);
 
 const lastValuesProcessed = computed<FormValue>(() => {
@@ -60,9 +60,8 @@ const lastValuesProcessed = computed<FormValue>(() => {
 /**
  * `code-select` 字段在历史数据中存在两种"语义为空"的形态：
  * - 字符串 `''`（旧数据 / 用户从未配置过钩子）；
- * - `{ hookType: HookType.CODE, hookData: [] }`（CodeSelect.vue 在挂载时
- *   写入的默认结构，参见 packages/editor/src/fields/CodeSelect.vue 中
- *   `props.model[props.name] = { hookType: HookType.CODE, hookData: [] }`）。
+ * - `{ hookType: HookType.CODE, hookData: [] }`（`normalizeCodeSelectValue`
+ *   写入的默认结构）。
  *
  * 直接 `isEqual` 会把两者判为不等，从而在历史对比里对每个未配置过钩子的组件
  * 都展示一份"差异"，体验很糟糕。这里把它们视为相等，跳过对比。

package/src/components/ViewForm.vue

@@ -8,7 +8,7 @@
       :init-values="currentValues"
       :disabled="disabled"
       :label-width="labelWidth"
-      :extend-state="mergedExtendState"
+      :context="formContext"
       :size="size"
     ></MForm>
   </div>
@@ -37,11 +37,10 @@ const props = withDefaults(
     category: 'node',
     labelWidth: '120px',
     disabled: true,
-    // extendState 的默认值由 useCompareForm 内部兜底（props.extendState ?? ...），此处无需重复提供
   },
 );
 
-const { config, currentValues, wrapperStyle, mergedExtendState, loadConfig, formRef } = useCompareForm(props);
+const { config, currentValues, wrapperStyle, formContext, loadConfig, formRef } = useCompareForm(props);
 
 defineExpose<{
   form: ShallowRef<InstanceType<typeof MForm> | null>;

package/src/editorProps.ts

@@ -1,7 +1,7 @@
 import type { InjectionKey } from 'vue';
 
 import type { DataSourceSchema, EventOption, Id, MApp, MNode, MPage, MPageFragment } from '@tmagic/core';
-import type { FormConfig, FormState } from '@tmagic/form';
+import type { FormConfig } from '@tmagic/form';
 import StageCore, {
   CONTAINER_HIGHLIGHT_CLASS_NAME,
   ContainerHighlightType,
@@ -149,7 +149,6 @@ export interface EditorProps {
   beforeDblclick?: (event: MouseEvent) => Promise<boolean | void> | boolean | void;
   /** 组件树节点双击前的钩子函数，返回 false 则阻止默认的双击行为 */
   beforeLayerNodeDblclick?: (event: MouseEvent, data: TreeNodeData) => Promise<boolean | void> | boolean | void;
-  extendFormState?: (state: FormState) => Record<string, any> | Promise<Record<string, any>>;
   /** 历史记录面板的自定义扩展 tab，追加在内置的页面/数据源/代码块 tab 之后 */
   historyListExtraTabs?: HistoryListExtraTab[];
   /** 页面顺序拖拽配置参数 */

package/src/fields/Code.vue

@@ -1,6 +1,5 @@
 <template>
   <MagicCodeEditor
-    v-if="!silentMode"
     :height="config.height"
     :type="diffMode ? 'diff' : undefined"
     :init-values="diffMode ? (lastValues || {})[name] : model[name]"
@@ -18,9 +17,9 @@
 </template>
 
 <script lang="ts" setup>
-import { computed, inject } from 'vue';
+import { computed } from 'vue';
 
-import { type CodeConfig, type FieldProps, FORM_SILENT_MODE_KEY } from '@tmagic/form';
+import { type CodeConfig, type FieldProps } from '@tmagic/form';
 
 import MagicCodeEditor from '@editor/layouts/CodeEditor.vue';
 
@@ -28,13 +27,6 @@ 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/fields/CodeSelect.vue

@@ -1,36 +1,29 @@
 <template>
   <div class="m-fields-code-select" :class="config.className">
-    <TMagicCard :flat="config.flat">
-      <MContainer
-        :config="codeConfig"
-        :size="size"
-        class="code-select-content"
-        :prop="prop"
-        :disabled="disabled"
-        :is-compare="isCompareMode"
-        :last-values="lastValues?.[name]"
-        :model="model[name]"
-        @change="changeHandler"
-      >
-      </MContainer>
-      <TMagicButton class="create-button fullWidth" :icon="Plus" :size="size" :disabled="disabled" @click="newHandler()"
-        >添加{{ config.text }}</TMagicButton
-      >
-    </TMagicCard>
+    <MContainer
+      :config="codeConfig"
+      :size="size"
+      class="code-select-content"
+      :prop="prop"
+      :disabled="disabled"
+      :is-compare="isCompareMode"
+      :last-values="lastValues?.[name]"
+      :model="model[name]"
+      :label-position="config.labelPosition"
+      :label-width="config.labelWidth"
+      @change="changeHandler"
+    >
+    </MContainer>
   </div>
 </template>
 
 <script lang="ts" setup>
 import { computed, watch } from 'vue';
-import { Plus } from '@element-plus/icons-vue';
-import { isEmpty } from 'lodash-es';
 
-import { HookCodeType, HookType } from '@tmagic/core';
-import { TMagicButton, TMagicCard } from '@tmagic/design';
-import type { CodeSelectConfig, ContainerChangeEventData, FieldProps, GroupListConfig } from '@tmagic/form';
+import type { CodeSelectConfig, ContainerChangeEventData, FieldProps } from '@tmagic/form';
 import { MContainer } from '@tmagic/form';
 
-import { useServices } from '@editor/hooks/use-services';
+import { createCodeSelectConfig, normalizeCodeSelectValue } from '@editor/fields/configs/codeSelect';
 
 defineOptions({
   name: 'MFieldsCodeSelect',
@@ -40,8 +33,6 @@ const emit = defineEmits<{
   change: [v: any, eventData: ContainerChangeEventData];
 }>();
 
-const { dataSourceService, codeBlockService } = useServices();
-
 const props = withDefaults(defineProps<FieldProps<CodeSelectConfig>>(), {});
 
 /**
@@ -58,101 +49,14 @@ const props = withDefaults(defineProps<FieldProps<CodeSelectConfig>>(), {});
  * 仅当存在历史值时才启用对比，避免 lastValues 缺失时退化为「全部新增」的空对比。
  */
 const isCompareMode = computed(() => Boolean(props.isCompare && props.lastValues));
-const newHandler = () => {
-  const defaultCode = {
-    codeType: HookCodeType.CODE,
-    codeId: '',
-  };
-  const name = props.config.name || '';
-  const hookData = props.model[name]?.hookData || [];
-  emit('change', defaultCode, {
-    modifyKey: `hookData.${hookData.length}`,
-  });
-};
-const codeConfig = computed<GroupListConfig>(() => ({
-  type: 'group-list',
-  name: 'hookData',
-  enableToggleMode: false,
-  expandAll: true,
-  addable: () => false,
-  title: (mForm, { model, index }: any) => {
-    if (model.codeType === HookCodeType.DATA_SOURCE_METHOD) {
-      if (Array.isArray(model.codeId)) {
-        if (model.codeId.length < 2) {
-          return index;
-        }
-
-        const ds = dataSourceService.getDataSourceById(model.codeId[0]);
-        return `${ds?.title} / ${model.codeId[1]}`;
-      }
-
-      return Array.isArray(model.codeId) ? model.codeId.join('/') : index;
-    }
-
-    const codeContent = codeBlockService.getCodeContentById(model.codeId);
 
-    if (codeContent) {
-      return codeContent.name;
-    }
-
-    return model.codeId || index;
-  },
-  titlePrefix: props.config.name === undefined ? undefined : String(props.config.name),
-  items: [
-    {
-      text: '代码类型',
-      type: 'select',
-      name: 'codeType',
-      labelPosition: 'right',
-      rules: [{ typeMatch: true, trigger: 'change' }],
-      options: [
-        { value: HookCodeType.CODE, text: '代码块' },
-        { value: HookCodeType.DATA_SOURCE_METHOD, text: '数据源方法' },
-      ],
-      defaultValue: HookCodeType.CODE,
-      onChange: (_mForm, v: HookCodeType, { setModel }) => {
-        if (v === HookCodeType.DATA_SOURCE_METHOD) {
-          setModel('codeId', []);
-        } else {
-          setModel('codeId', '');
-        }
-        return v;
-      },
-    },
-    {
-      type: 'code-select-col',
-      name: 'codeId',
-      text: '代码块',
-      rules: [{ typeMatch: true, trigger: 'change' }],
-
-      display: (_mForm, { model }) => model.codeType !== HookCodeType.DATA_SOURCE_METHOD,
-      notEditable: () => !codeBlockService.getEditStatus(),
-    },
-    {
-      type: 'data-source-method-select',
-      name: 'codeId',
-      text: '数据源字段',
-      rules: [{ typeMatch: true, trigger: 'change' }],
-      display: (_mForm, { model }) => model.codeType === HookCodeType.DATA_SOURCE_METHOD,
-      notEditable: () => !dataSourceService.get('editable'),
-    },
-  ],
-}));
+const codeConfig = computed(() => createCodeSelectConfig(props.config));
 
+// 挂载时的归一化由 applyMountValueEffects → code-select 的 effect 完成，这里只兜运行期被置空
 watch(
   () => props.model[props.name],
-  (value) => {
-    // 兼容旧的数据结构
-    if (isEmpty(value)) {
-      // 空值或者空数组
-      props.model[props.name] = {
-        hookType: HookType.CODE,
-        hookData: [],
-      };
-    }
-  },
-  {
-    immediate: true,
+  () => {
+    normalizeCodeSelectValue(props.model, props.name);
   },
 );
 

package/src/fields/CodeSelectCol.vue

@@ -15,7 +15,7 @@
         :prop="prop"
       ></MFormContainer>
       <MSelect
-        v-else-if="!silentMode"
+        v-else
         class="select"
         :config="selectConfig"
         :name="name"
@@ -27,7 +27,7 @@
 
       <!-- 查看/编辑按钮：对比模式为只读，不展示 -->
       <TMagicButton
-        v-if="!isCompareMode && !silentMode && model[name] && hasCodeBlockSidePanel"
+        v-if="!isCompareMode && model[name] && hasCodeBlockSidePanel"
         class="m-fields-select-action-button"
         :size="size"
         @click="editCode(model[name])"
@@ -65,7 +65,6 @@ import {
   createValues,
   type FieldProps,
   filterFunction,
-  FORM_SILENT_MODE_KEY,
   type FormItemConfig,
   type FormState,
   MContainer as MFormContainer,
@@ -84,9 +83,8 @@ defineOptions({
 });
 
 const mForm = inject<FormState | undefined>('mForm');
-const silentMode = inject(FORM_SILENT_MODE_KEY, false);
 const { codeBlockService, uiService } = useServices();
-const eventBus = inject<EventBus>('eventBus');
+const eventBus = inject<EventBus | null>('eventBus', null);
 const emit = defineEmits<{
   change: [v: any, eventData: ContainerChangeEventData];
 }>();

package/src/fields/CondOpSelect.vue

@@ -31,6 +31,7 @@ import { computed } from 'vue';
 
 import { getDesignConfig, TMagicSelect } from '@tmagic/design';
 import type { CondOpSelectConfig, FieldProps } from '@tmagic/form';
+import { removeDataSourceFieldPrefix } from '@tmagic/utils';
 
 import { useServices } from '@editor/hooks/use-services';
 import { getCondOpOptionsByFieldType, getFieldType } from '@editor/utils';
@@ -50,8 +51,8 @@ const props = defineProps<FieldProps<CondOpSelectConfig>>();
 const optionComponent = getDesignConfig('components')?.option;
 
 const options = computed(() => {
-  const [id, ...fieldNames] = [...(props.config.parentFields || []), ...props.model.field];
-  const ds = dataSourceService.getDataSourceById(id);
+  const [id, ...fieldNames] = [...(props.config.parentFields || []), ...(props.model.field || [])];
+  const ds = id ? dataSourceService.getDataSourceById(removeDataSourceFieldPrefix(id)) : undefined;
   const type = getFieldType(ds, fieldNames);
   return getCondOpOptionsByFieldType(type);
 });

package/src/fields/DataSourceFieldSelect/FieldSelect.vue

@@ -124,7 +124,7 @@ const optionComponent = getDesignConfig('components')?.option;
 
 const { dataSourceService, uiService } = useServices();
 const mForm = inject<FormState | undefined>('mForm');
-const eventBus = inject<EventBus>('eventBus');
+const eventBus = inject<EventBus | null>('eventBus', null);
 
 const allDataSources = computed(() => dataSourceService.get('dataSources') || []);
 

package/src/fields/DataSourceFieldSelect/Index.vue

@@ -6,7 +6,7 @@
     }"
   >
     <FieldSelect
-      v-if="isSelectValid && !silentMode"
+      v-if="isSelectValid"
       :model-value="model[name]"
       :disabled="disabled"
       :size="size"
@@ -18,7 +18,7 @@
     ></FieldSelect>
 
     <component
-      v-else-if="!silentMode"
+      v-else
       :is="tagName"
       :config="config.fieldConfig"
       :model="model"
@@ -33,7 +33,7 @@
     ></component>
 
     <TMagicTooltip
-      v-if="!silentMode && config.fieldConfig && !disabledDataSource && !mForm?.isCompare"
+      v-if="config.fieldConfig && !disabledDataSource && !mForm?.isCompare"
       :disabled="showDataSourceFieldSelect"
       content="选择数据源"
     >
@@ -57,7 +57,6 @@ import {
   type ContainerChangeEventData,
   type DataSourceFieldSelectConfig,
   type FieldProps,
-  FORM_SILENT_MODE_KEY,
   type FormState,
   getFormField,
 } from '@tmagic/form';
@@ -105,7 +104,6 @@ watch(
 
 const { dataSourceService, propsService } = useServices();
 const mForm = inject<FormState | undefined>('mForm');
-const silentMode = inject(FORM_SILENT_MODE_KEY, false);
 
 const dataSources = computed(() => dataSourceService.get('dataSources') || []);
 const disabledDataSource = computed(() => propsService.getDisabledDataSource());
@@ -143,7 +141,10 @@ const checkStrictly = computed(() => {
   if (typeof props.config.checkStrictly !== 'function') {
     value = props.config.checkStrictly;
   } else {
-    const dsId = removeDataSourceFieldPrefix(props.model[0]);
+    const fieldValue = props.model[props.name];
+    // 指定了 dataSourceId 时取值里只有字段名，数据源 id 只能取自 config
+    const rawDsId = props.config.dataSourceId ?? (Array.isArray(fieldValue) ? fieldValue[0] : fieldValue);
+    const dsId = removeDataSourceFieldPrefix(`${rawDsId}`);
     const dataSource = dataSources.value.find((ds) => ds.id === dsId);
 
     value = props.config.checkStrictly(mForm, {

package/src/fields/DataSourceFields.vue

@@ -8,7 +8,6 @@
     </div>
 
     <FloatingBox
-      v-if="!silentMode"
       :body-style="{ padding: '0 16px' }"
       v-model:visible="addDialogVisible"
       v-model:width="width"
@@ -31,7 +30,6 @@
     </FloatingBox>
 
     <FloatingBox
-      v-if="!silentMode"
       :body-style="{ padding: '0 16px' }"
       v-model:visible="addFromJsonDialogVisible"
       v-model:width="width"
@@ -62,7 +60,6 @@ import {
   type ContainerChangeEventData,
   type DataSourceFieldsConfig,
   type FieldProps,
-  FORM_SILENT_MODE_KEY,
   type FormConfig,
   type FormState,
   MFormBox,
@@ -92,8 +89,6 @@ const emit = defineEmits<{
 
 const { uiService } = useServices();
 const mForm = inject<FormState | undefined>('mForm');
-const silentMode = inject(FORM_SILENT_MODE_KEY, false);
-
 /** 对比模式下隐藏新增/编辑/删除等操作按钮，仅保留只读展示。 */
 const isCompare = computed(() => Boolean(mForm?.isCompare));
 
@@ -383,8 +378,6 @@ provide(
 );
 
 onMounted(() => {
-  if (silentMode) return;
-
   const path = editingFieldPath.value;
   if (!path.length) return;
 

package/src/fields/DataSourceMethodSelect.vue

@@ -2,7 +2,6 @@
   <div class="m-fields-data-source-method-select">
     <div class="data-source-method-select-container">
       <MCascader
-        v-if="!silentMode"
         class="select"
         :config="cascaderConfig"
         :model="model"
@@ -14,7 +13,7 @@
       ></MCascader>
 
       <TMagicTooltip
-        v-if="!silentMode && model[name] && isCustomMethod && dataSourceSidePanel && !isCompare"
+        v-if="model[name] && isCustomMethod && dataSourceSidePanel && !isCompare"
         :content="notEditable ? '查看' : '编辑'"
       >
         <TMagicButton class="m-fields-select-action-button" :size="size" @click="editCodeHandler">
@@ -49,7 +48,6 @@ import {
   type DataSourceMethodSelectConfig,
   type FieldProps,
   filterFunction,
-  FORM_SILENT_MODE_KEY,
   type FormItemConfig,
   type FormState,
   MCascader,
@@ -69,8 +67,7 @@ defineOptions({
 
 const { dataSourceService, uiService } = useServices();
 const mForm = inject<FormState | undefined>('mForm');
-const silentMode = inject(FORM_SILENT_MODE_KEY, false);
-const eventBus = inject<EventBus>('eventBus');
+const eventBus = inject<EventBus | null>('eventBus', null);
 
 const emit = defineEmits(['change']);
 

package/src/fields/DataSourceMethods.vue

@@ -9,7 +9,7 @@
     </div>
 
     <CodeBlockEditor
-      v-if="codeConfig && !silentMode"
+      v-if="codeConfig"
       ref="codeBlockEditor"
       :disabled="disabled"
       :content="codeConfig"
@@ -30,7 +30,6 @@ import {
   type ContainerChangeEventData,
   type DataSourceMethodsConfig,
   type FieldProps,
-  FORM_SILENT_MODE_KEY,
   type FormState,
 } from '@tmagic/form';
 import { type ColumnConfig, MagicTable } from '@tmagic/table';
@@ -49,8 +48,6 @@ const props = withDefaults(defineProps<FieldProps<DataSourceMethodsConfig>>(), {
 const emit = defineEmits(['change']);
 
 const mForm = inject<FormState | undefined>('mForm');
-const silentMode = inject(FORM_SILENT_MODE_KEY, false);
-
 /** 对比模式下隐藏新增/编辑/删除等操作按钮，仅保留只读展示。 */
 const isCompare = computed(() => Boolean(mForm?.isCompare));
 
@@ -177,8 +174,6 @@ const editingMethodName = inject<ComputedRef<string | undefined>>(
 );
 
 onMounted(() => {
-  if (silentMode) return;
-
   const methodName = editingMethodName.value;
   if (!methodName) return;